:root { color-scheme: light; --ink:#17212b; --muted:#62707d; --line:#dbe2e8; --paper:#fff; --accent:#126b63; --accent-dark:#0b514b; --soft:#eef7f5; --warn:#a35600; --danger:#a12b32; }
* { box-sizing: border-box; }
body { margin:0; background:#f5f8fc; color:var(--ink); font:16px/1.55 Inter,Segoe UI,Arial,sans-serif; }
.shell { width:min(1040px,92vw); margin:0 auto; padding:54px 0 80px; }
header { margin-bottom:30px; }
.eyebrow { color:var(--accent); font-size:.78rem; font-weight:800; letter-spacing:.14em; }
h1 { font-family:Georgia,serif; font-size:clamp(2.25rem,6vw,4.5rem); line-height:1.02; margin:.2rem 0 1rem; max-width:800px; }
h2 { margin:0 0 1rem; font-size:1.25rem; }
.lead,.hint,.privacy { color:var(--muted); }
.brand-logo { display:block; width:min(520px,80vw); height:auto; margin:0 0 2rem; }
.site-header { height:106px; background:#fff; border-bottom:1px solid #e3e9f2; display:flex; align-items:center; }
.site-header-inner { width:min(1680px,calc(100% - 64px)); margin:0 auto; }
.header-logo { display:block; width:270px; max-height:64px; object-fit:contain; object-position:left center; }
.access-section { min-height:calc(100vh - 106px); display:grid; align-items:center; padding:70px 32px 110px; background:radial-gradient(circle at 72% 33%,#eaf2ff 0,rgba(234,242,255,0) 34%),#f8faff; }
.access-grid { width:min(1680px,100%); margin:0 auto; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(460px,.85fr); gap:90px; align-items:center; }
.access-copy { max-width:790px; }
.access-eyebrow { color:#4e83d7; font-weight:800; letter-spacing:.08em; }
.access-copy h1 { margin:30px 0 30px; max-width:none; color:#17233d; font:800 clamp(3.25rem,5.4vw,6.5rem)/1.08 Inter,Segoe UI,Arial,sans-serif; letter-spacing:-.055em; }
.access-copy h1 em { color:#5790e9; font-style:normal; }
.access-copy>p { max-width:760px; color:#718099; font-size:1.25rem; }
.feature-row { display:flex; flex-wrap:wrap; gap:20px; margin-top:46px; }
.feature-row span { min-width:175px; padding:18px 22px; background:#fff; border:1px solid #dce4ef; border-radius:14px; color:#718099; box-shadow:0 5px 16px rgba(48,75,115,.03); }
.feature-row b { color:#17233d; font-size:1.12rem; margin-right:8px; }
.access-card { position:relative; min-height:430px; padding:70px 62px; background:#fff; border:1px solid #dbe3ef; border-radius:28px; box-shadow:0 28px 80px rgba(55,85,130,.12); overflow:hidden; }
.access-card .card-mark { position:absolute; right:46px; top:22px; color:#edf2fa; font-size:6rem; font-weight:800; line-height:1; }
.access-card h2 { position:relative; margin:0 0 16px; color:#17233d; font-size:2rem; }
.access-card>p:not(.form-error) { position:relative; margin-bottom:40px; color:#7b879b; font-size:1.05rem; }
.access-card label { display:block; margin-bottom:10px; color:#17233d; }
.input-with-button { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; padding:7px; border:2px solid #d7e0ec; border-radius:15px; background:#fff; }
.input-with-button:focus-within { border-color:#76a6ed; box-shadow:0 0 0 4px rgba(87,144,233,.12); }
.input-with-button input { min-width:0; border:0; padding:14px 16px; font:inherit; }
.input-with-button input:focus { outline:0; }
.input-with-button button { border:0; border-radius:11px; padding:14px 24px; background:#5790e9; color:#fff; font:700 1rem/1 inherit; cursor:pointer; box-shadow:0 8px 20px rgba(68,126,216,.22); }
.input-with-button button:hover { background:#447fd8; }
.input-with-button button:disabled { opacity:.65; cursor:wait; }
.form-error { min-height:24px; margin:12px 0 0; color:var(--danger); font-size:.9rem; }
.wx-float { position:fixed; z-index:20; top:126px; right:18px; width:178px; padding:12px; display:grid; gap:8px; text-align:center; background:#fff; border:1px solid #dce4ee; border-radius:16px; box-shadow:0 16px 40px rgba(35,59,95,.18); }
.wx-float strong { color:#263650; font-size:.88rem; }
.wx-float img { display:block; width:100%; height:auto; border-radius:8px; }
.wx-float span { color:#6f7d91; font-size:.78rem; }
.card,.metric-card { background:var(--paper); border:1px solid var(--line); border-radius:16px; padding:26px; margin:18px 0; box-shadow:0 8px 28px rgba(23,33,43,.05); }
.tabs { display:flex; gap:8px; margin-bottom:16px; }
.tab { border:0; border-bottom:2px solid transparent; background:none; padding:8px 12px; color:var(--muted); cursor:pointer; }
.tab.active { color:var(--accent); border-color:var(--accent); font-weight:700; }
label,legend { font-weight:700; }
textarea { width:100%; margin-top:8px; padding:14px; border:1px solid var(--line); border-radius:10px; resize:vertical; font:inherit; }
textarea:focus,input:focus { outline:3px solid #bfe1dc; border-color:var(--accent); }
.drop-zone { display:grid; gap:12px; padding:26px; border:2px dashed #9ab4b0; border-radius:12px; text-align:center; background:var(--soft); }
.drop-zone small { color:var(--muted); font-weight:400; }
.file-input { display:block; width:100%; padding:10px; border:1px solid #9ab4b0; border-radius:8px; background:white; cursor:pointer; }
.build-note { color:var(--muted); font-size:.75rem; margin-bottom:0; }
fieldset { border:0; padding:0; margin:24px 0; }
.modes { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:9px; }
.modes label { display:grid; grid-template-columns:auto 1fr; gap:0 8px; padding:15px; border:1px solid var(--line); border-radius:10px; cursor:pointer; }
.modes label.selected { border-color:var(--accent); background:var(--soft); }
.modes span { grid-column:2; color:var(--muted); font-size:.82rem; font-weight:400; }
.primary,.secondary { display:inline-block; border:0; border-radius:8px; padding:12px 18px; font-weight:750; text-decoration:none; cursor:pointer; }
.primary { background:var(--accent); color:white; }
.primary:hover { background:var(--accent-dark); }
.primary:disabled { opacity:.55; cursor:wait; }
.secondary { color:var(--accent-dark); background:var(--soft); border:1px solid #b9d8d3; }
.status-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.status-heading h2 { margin:0; }
.badge { padding:4px 9px; border-radius:999px; background:var(--soft); color:var(--accent-dark); font-size:.82rem; font-weight:800; }
progress { width:100%; height:12px; margin-top:18px; accent-color:var(--accent); }
.error { color:var(--danger); background:#fff0f0; padding:12px; border-radius:8px; white-space:pre-wrap; }
.metric-card { display:flex; flex-wrap:wrap; align-items:baseline; gap:10px 22px; border-left:5px solid var(--accent); }
.metric-card strong { font:700 3rem Georgia,serif; color:var(--accent-dark); }
.metric-card small { width:100%; color:var(--muted); }
.sources { display:grid; gap:14px; }
.source { border:1px solid var(--line); border-radius:12px; padding:18px; }
.source h3 { margin:0 0 5px; }
.source-meta { color:var(--muted); font-size:.9rem; overflow-wrap:anywhere; }
.verified { color:var(--accent-dark); background:var(--soft); }
.unverified { color:var(--warn); background:#fff4e5; }
.evidence { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:13px; }
.excerpt { background:#f7f8f9; padding:12px; border-radius:8px; overflow-wrap:anywhere; }
.excerpt strong { display:block; font-size:.75rem; text-transform:uppercase; color:var(--muted); margin-bottom:5px; }
.downloads { display:flex; flex-wrap:wrap; gap:10px; }
.recalculate-options { display:flex; flex-wrap:wrap; gap:16px; margin:12px 0 18px; }
.recalculate-options input[type="number"] { width:72px; margin-left:6px; }
@media (max-width:1000px) { .access-grid { grid-template-columns:1fr; gap:50px; } .access-copy { max-width:none; } .access-card { min-height:0; } .wx-float { width:135px; } }
@media (max-width:720px) { .modes,.evidence { grid-template-columns:1fr; } .shell { padding-top:28px; } .card { padding:20px; } .site-header { height:82px; } .site-header-inner { width:calc(100% - 32px); } .header-logo { width:220px; } .access-section { min-height:calc(100vh - 82px); padding:42px 18px 90px; } .access-copy h1 { font-size:clamp(2.5rem,13vw,4rem); } .access-copy>p { font-size:1rem; } .feature-row { gap:10px; margin-top:30px; } .feature-row span { min-width:0; flex:1 1 130px; padding:13px; } .access-card { padding:55px 22px 32px; border-radius:20px; } .access-card .card-mark { right:20px; font-size:4.5rem; } .input-with-button { grid-template-columns:1fr; } .wx-float { top:auto; bottom:12px; right:12px; width:112px; } }