:root{
  --navy:#0a1830;--navy2:#111c2e;--navy3:#1a2540;--navy4:#243050;
  --blue:#3b82f6;--blue-dark:#2563eb;--blue-light:#60a5fa;
  --border:#1e2d45;--border2:#2a3a55;
  --text:#e2e8f0;--muted:#8899b4;--muted2:#6b7fa0;
  --high:#ef4444;--high-bg:#2d1010;--medium:#f59e0b;--medium-bg:#2d1f06;
  --low:#3b82f6;--low-bg:#0d1f3a;--good:#22c55e;--good-bg:#0d2318;
  --amber:#f59e0b;--amber-bg:#1e1500;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,sans-serif;background:var(--navy);color:var(--text);font-size:15px;line-height:1.6}

/* ── Disclaimer banner ───────────────────────── */
.disclaimer-banner{background:#1a1000;border-bottom:2px solid var(--amber);padding:0}
.disclaimer-inner{max-width:1300px;margin:auto;padding:12px 24px;display:flex;align-items:flex-start;gap:12px}
.disclaimer-icon{font-size:1.2rem;flex-shrink:0;margin-top:2px;color:var(--amber)}
.disclaimer-text{flex:1;font-size:.88rem;color:#d4a017;line-height:1.6}
.disclaimer-text code{background:#2d1f06;padding:2px 6px;border-radius:4px;font-size:.82rem;color:var(--amber)}
.disclaimer-close{background:none;border:none;font-size:1.1rem;color:#b07a00;cursor:pointer;padding:4px 8px;border-radius:6px;flex-shrink:0;line-height:1}
.disclaimer-close:hover{background:#2d1f06}

/* ── Hero ────────────────────────────────────── */
.hero{background:linear-gradient(135deg,#060e1c 0%,#0a1830 55%,#0f2650 100%);color:white;padding:52px max(24px,calc((100% - 1300px)/2));border-bottom:1px solid var(--border)}
.hero-inner{max-width:860px}
.hero-badge{display:inline-block;padding:4px 14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);border-radius:20px;font-size:.75rem;font-weight:700;letter-spacing:.1em;color:#84caff;margin-bottom:18px}
.hero-title-row{display:flex;justify-content:center;margin-bottom:24px}
.hero-logo{height:160px;width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 4px 18px rgba(59,130,246,.4))}
.hero h1{font-size:clamp(2rem,5vw,3.2rem);font-weight:800;line-height:1.1;margin-bottom:0}
.hero h1 .accent{color:#60a5fa}
.hero p{font-size:1.05rem;color:rgba(255,255,255,.75);max-width:720px;margin-top:12px}
.hero p code{background:rgba(255,255,255,.1);padding:2px 6px;border-radius:4px;font-size:.88em;color:#93c5fd}
.hero-actions{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px}
.hero-detail{margin-top:12px!important;color:#bfdbfe!important;font-size:.95rem!important}
.hero-link{display:inline-block;padding:11px 20px;border-radius:10px;background:rgba(59,130,246,.15);border:1px solid rgba(59,130,246,.4);color:#93c5fd;text-decoration:none;font-weight:700;font-size:.95rem;transition:all .2s}
.hero-link:hover{background:rgba(59,130,246,.28);border-color:var(--blue)}

/* ── Main ────────────────────────────────────── */
main{max-width:1300px;margin:32px auto;padding:0 24px 60px}
.panel{background:var(--navy2);border:1px solid var(--border);border-radius:16px;padding:28px;margin-bottom:24px}
h2{font-size:1.4rem;color:var(--text);margin-bottom:20px}
h3{font-size:1.1rem;color:var(--text);margin-bottom:12px}

/* ── Scan form ───────────────────────────────── */
.scan-form{display:flex;flex-direction:column;gap:16px}
.url-row{display:flex;gap:12px;align-items:stretch}
.url-input-wrap{flex:1;display:flex;align-items:center;border:2px solid var(--border2);border-radius:10px;background:var(--navy3);transition:border-color .2s}
.url-input-wrap:focus-within{border-color:var(--blue)}
.url-icon{padding:0 13px;font-size:1.1rem}
.url-input-wrap input{flex:1;border:0;background:transparent;padding:14px 14px 14px 0;font:inherit;font-size:1rem;color:var(--text);outline:none}
.url-input-wrap input::placeholder{color:var(--muted2)}
#scanButton{padding:14px 28px;background:var(--blue);color:white;border:0;border-radius:10px;font:inherit;font-size:1rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:background .2s;min-width:150px}
#scanButton:hover{background:var(--blue-dark)}
#scanButton:disabled{opacity:.5;cursor:wait}

/* ── Scan mode buttons ───────────────────────── */
.scan-modes{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.scan-mode-btn{background:var(--navy3);border:2px solid var(--border2);border-radius:12px;padding:14px 18px;cursor:pointer;text-align:left;font:inherit;color:var(--muted);transition:all .2s;display:flex;flex-direction:column;gap:3px}
.scan-mode-btn:hover{border-color:var(--blue);color:var(--text)}
.scan-mode-btn.active{border-color:var(--blue);background:rgba(59,130,246,.1);color:var(--text);box-shadow:0 0 0 3px rgba(59,130,246,.15)}
.mode-label{font-size:1rem;font-weight:700}
.mode-sub{font-size:.8rem;color:var(--muted2)}
.scan-mode-btn.active .mode-sub{color:var(--muted)}

/* ── Status bar ──────────────────────────────── */
.status-bar{margin-top:14px;padding:13px 18px;border-radius:10px;font-weight:600;display:flex;align-items:center;gap:10px}
.status-bar.working{background:var(--low-bg);color:var(--blue-light);border:1px solid rgba(59,130,246,.3)}
.status-bar.success{background:var(--good-bg);color:var(--good);border:1px solid rgba(34,197,94,.3)}
.status-bar.error{background:var(--high-bg);color:var(--high);border:1px solid rgba(239,68,68,.3)}

/* ── How it works ────────────────────────────── */
.how-it-works{margin-top:28px;padding-top:24px;border-top:1px solid var(--border)}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.step{display:flex;gap:14px;align-items:flex-start}
.step-num{width:34px;height:34px;background:var(--blue);color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1rem;flex-shrink:0}
.step strong{color:var(--text);font-size:.95rem}
.step p{color:var(--muted);font-size:.85rem;margin-top:4px}

/* ── Sponsor section ─────────────────────────── */
.sponsor-section{background:var(--navy2)}
.sponsor-header{text-align:center;margin-bottom:20px}
.sponsor-header h2{font-size:1.5rem;margin-bottom:6px}
.sponsor-header p{color:var(--muted);font-size:.9rem;max-width:580px;margin:0 auto}
.sponsor-badge{display:inline-block;padding:3px 10px;background:rgba(59,130,246,.12);border:1px solid rgba(59,130,246,.3);border-radius:20px;font-size:.7rem;font-weight:800;letter-spacing:.08em;color:var(--blue-light)}
.sponsor-cards{display:flex;flex-direction:column;gap:10px}
.sponsor-card{display:flex;align-items:stretch;background:var(--navy3);border:1px solid var(--border2);border-radius:10px;overflow:hidden;position:relative;max-height:175px}
.sponsor-video-wrap{flex-shrink:0;width:145px;background:#000;overflow:hidden}
.sponsor-video-wrap video{width:145px;height:100%;object-fit:cover;display:block}
.sponsor-content{padding:14px 16px;flex:1;display:flex;flex-direction:column;gap:3px;overflow:hidden}
.sponsor-content .sponsor-badge{position:absolute;top:10px;right:12px}
.sponsor-content h3{font-size:.97rem;font-weight:700;color:var(--text);margin:0;padding-right:90px}
.sponsor-content p:first-of-type{color:var(--blue-light);font-size:.8rem;font-weight:600;margin:0}
.sponsor-content p{color:var(--muted);font-size:.8rem;line-height:1.5;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sponsor-btn{display:inline-block;margin-top:auto;padding:7px 14px;background:var(--blue);color:#fff;border-radius:7px;text-decoration:none;font-weight:700;font-size:.8rem;transition:background .2s;align-self:flex-start;flex-shrink:0}
.sponsor-btn:hover{background:var(--blue-dark)}
.sponsor-disclosure{text-align:center;margin-top:12px;color:var(--muted2);font-size:.78rem}

/* ── Results ─────────────────────────────────── */
.results-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px}
.scan-meta{color:var(--muted);font-size:.88rem;margin-top:4px}
.report-btn{padding:12px 22px;background:var(--navy4);color:white;border:1px solid var(--border2);border-radius:10px;font:inherit;font-weight:700;cursor:pointer;white-space:nowrap;transition:all .2s}
.report-btn:hover{background:var(--navy3);border-color:var(--blue)}
.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin-bottom:24px}
.summary-card{background:var(--navy3);border:1px solid var(--border2);border-radius:12px;padding:18px;text-align:center}
.summary-card strong{display:block;font-size:2rem;font-weight:800;line-height:1.1;margin-bottom:4px;color:var(--text)}
.summary-card span{color:var(--muted);font-size:.82rem}
.summary-card.danger strong{color:var(--high)}
.summary-card.warn strong{color:var(--medium)}
.summary-card.info strong{color:var(--blue-light)}
.summary-card.good strong{color:var(--good)}
.legend{background:var(--navy2);border:1px solid var(--border);border-radius:14px;padding:20px 26px;margin-bottom:24px}
.legend-grid{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.legend-item{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--muted)}
.badge{display:inline-block;padding:3px 9px;border-radius:20px;font-size:.73rem;font-weight:700;white-space:nowrap}
.badge-session{background:#0d2338;color:#60a5fa;border:1px solid #1e3a5f}
.badge-persistent{background:#0d2318;color:#4ade80;border:1px solid #14532d}
.badge-first{background:#0d2318;color:#4ade80;border:1px solid #14532d}
.badge-third{background:#221a00;color:#fbbf24;border:1px solid #3d2e00}
.badge-secure{background:#0d2318;color:#4ade80;border:1px solid #14532d}
.badge-insecure{background:var(--high-bg);color:#f87171;border:1px solid #4d1010}
.badge-httponly{background:#1a0d38;color:#c4b5fd;border:1px solid #3b2d6b}
.badge-samesite{background:#0d2338;color:#60a5fa;border:1px solid #1e3a5f}
.badge-zombie{background:#221500;color:#fcd34d;border:1px solid #3d2a00}
.table-controls{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.filters{display:flex;gap:10px;flex-wrap:wrap}
.filters select,.filters input{padding:8px 12px;border:1px solid var(--border2);border-radius:8px;font:inherit;font-size:.86rem;background:var(--navy3);color:var(--text)}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.88rem}
th{background:var(--navy4);padding:10px 13px;text-align:left;font-weight:700;border:1px solid var(--border);color:var(--muted);white-space:nowrap}
td{padding:11px 13px;border:1px solid var(--border);vertical-align:top;color:var(--text)}
tr:hover td{background:var(--navy3)}
code{font-family:'Courier New',monospace;font-size:.86em;word-break:break-all;background:var(--navy4);padding:2px 5px;border-radius:4px;color:#93c5fd}
.expires{font-size:.76rem;color:var(--muted);margin-top:4px}
.domain-cell{font-size:.86rem;color:var(--muted)}
.cell-empty{text-align:center;padding:24px;color:var(--muted)}
.finding{padding:9px 12px;margin:5px 0;border-left:4px solid;border-radius:0 7px 7px 0;cursor:pointer}
.finding.high{background:var(--high-bg);border-color:var(--high)}
.finding.medium{background:var(--medium-bg);border-color:var(--medium)}
.finding.low{background:var(--low-bg);border-color:var(--blue)}
.finding .f-title{font-weight:700;font-size:.83rem;margin-bottom:3px}
.finding.high .f-title{color:var(--high)}
.finding.medium .f-title{color:var(--medium)}
.finding.low .f-title{color:var(--blue-light)}
.finding p{font-size:.83rem;margin:3px 0;color:var(--muted)}
.no-findings{color:var(--good);font-size:.86rem;font-weight:600}
.notice{background:#1a1000;border:1px solid #3d2e00;border-left:4px solid var(--amber);border-radius:10px;padding:14px 18px;font-size:.88rem;color:#d4a017;margin-top:8px}

/* ── Storage section ─────────────────────────── */
#storageSection table{margin-top:10px}

/* ── Consent banner builder ──────────────────── */
.consent-builder{background:var(--navy2)}
.builder-header{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;margin-bottom:24px}
.builder-header h2{font-size:1.5rem;margin:5px 0 7px}
.builder-header p{color:var(--muted);max-width:760px;font-size:.92rem}
.feature-label{color:var(--blue-light);font-size:.72rem;font-weight:800;letter-spacing:.1em}
.builder-status{padding:6px 11px;border:1px solid #14532d;background:#0d2318;color:#4ade80;border-radius:6px;font-size:.75rem;font-weight:700;white-space:nowrap}
.builder-layout{display:grid;grid-template-columns:minmax(250px,.75fr) minmax(0,1.25fr);gap:20px}
.builder-settings,.builder-code-wrap{min-width:0;background:var(--navy3);border:1px solid var(--border2);border-radius:8px;padding:20px}
.builder-settings>label,.builder-settings legend{display:block;color:var(--text);font-size:.84rem;font-weight:700;margin-bottom:7px}
.builder-settings>input[type="url"]{width:100%;padding:11px 12px;margin-bottom:17px;border:1px solid var(--border2);border-radius:7px;background:var(--navy4);color:var(--text);font:inherit}
.color-control{display:flex;align-items:center;gap:10px;margin-bottom:17px}
.color-control input{width:48px;height:36px;padding:2px;border:1px solid var(--border2);border-radius:6px;background:var(--navy4)}
.color-control output{font-family:'Courier New',monospace;color:var(--muted)}
.builder-settings fieldset{border:1px solid var(--border);border-radius:7px;padding:12px;margin:0 0 17px}
.builder-settings legend{padding:0 6px;margin:0}
.check-row{display:flex!important;align-items:center;gap:9px;color:var(--muted)!important;font-weight:500!important;margin:7px 0!important}
.check-row input{accent-color:var(--blue)}
.builder-copy{width:100%;padding:11px 14px;border:0;border-radius:7px;background:var(--blue);color:#fff;font:inherit;font-weight:800;cursor:pointer}
.builder-copy:hover{background:var(--blue-dark)}
.builder-feedback{min-height:20px;margin-top:8px;color:var(--good);font-size:.8rem;text-align:center}
.builder-code-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;color:var(--text);font-size:.85rem}
.builder-code-head span{color:var(--muted);font-weight:400}
.builder-code{display:block;width:100%;min-height:160px;resize:vertical;background:#060e1c;color:#bfdbfe;border:1px solid var(--border);border-radius:7px;padding:14px;font-family:'Courier New',monospace;font-size:.79rem;line-height:1.6}
.builder-guide{margin-top:17px;padding-top:16px;border-top:1px solid var(--border)}
.builder-guide h3{font-size:.95rem;margin-bottom:6px}
.builder-guide p{color:var(--muted);font-size:.82rem;margin:7px 0}
.builder-guide pre{overflow:auto;padding:11px;background:#060e1c;border:1px solid var(--border);border-radius:6px;color:#93c5fd;font-size:.77rem;line-height:1.5}
.builder-notice{margin-top:18px;padding:12px 14px;border-left:3px solid var(--blue);background:rgba(59,130,246,.07);color:var(--muted);font-size:.82rem}
.managed-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:8px;overflow:hidden;margin:18px 0}
.managed-preview>div{background:var(--navy3);padding:18px}
.managed-preview strong,.managed-preview span{display:block}
.managed-preview span{color:var(--muted);font-size:.82rem;margin-top:5px}
.managed-cta{display:inline-block;margin-top:0}
.managed-actions{display:flex;flex-wrap:wrap;gap:10px}

/* ── Consent simulation ─────────────────────── */
.simulation-document{scroll-behavior:auto}
.simulation-page{--simulation-accent:#2563eb;background:#07111f}
.simulation-shell{max-width:1180px;margin:0 auto;padding:28px 24px 64px}
.simulation-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:38px}
.simulation-top img{height:58px;width:auto}
.simulation-top div{display:flex;gap:20px}
.simulation-top a{color:var(--blue-light);text-decoration:none;font-weight:700;font-size:.88rem}
.simulation-intro{max-width:850px;margin-bottom:30px}
.simulation-intro h1{font-size:clamp(2rem,5vw,3.7rem);line-height:1.02;margin:8px 0 16px;letter-spacing:0}
.simulation-intro>p{max-width:720px;color:var(--muted);font-size:1rem}
.simulation-facts{display:flex;flex-wrap:wrap;gap:24px;margin-top:22px;color:var(--muted);font-size:.82rem}
.simulation-facts span{display:flex;align-items:center;gap:7px}
.simulation-facts strong{font-size:1.25rem;color:var(--text)}
.simulation-workspace{display:grid;grid-template-columns:190px 1fr;border:1px solid var(--border2);background:var(--navy2);min-height:650px}
.simulation-steps{list-style:none;border-right:1px solid var(--border);background:#091426;padding:16px 0}
.simulation-step{width:100%;display:grid;grid-template-columns:34px 1fr;column-gap:10px;padding:16px;border:0;border-left:3px solid transparent;background:transparent;color:var(--muted);text-align:left;font:inherit;cursor:pointer}
.simulation-step>span{grid-row:1/3;width:30px;height:30px;border:1px solid var(--border2);display:grid;place-items:center;font-weight:800}
.simulation-step strong{font-size:.88rem;color:var(--text)}
.simulation-step small{font-size:.72rem;color:var(--muted2)}
.simulation-step.active{background:rgba(59,130,246,.09);border-left-color:var(--blue)}
.simulation-step.active>span{background:var(--blue);border-color:var(--blue);color:#fff}
.simulation-stage{min-width:0;padding:30px}
.simulation-view{animation:simulation-enter .25s ease both}
@keyframes simulation-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.simulation-view-head{display:flex;justify-content:space-between;gap:28px;padding-bottom:22px;border-bottom:1px solid var(--border)}
.simulation-view-head>div>span{font-size:.68rem;letter-spacing:.12em;color:var(--blue-light);font-weight:800}
.simulation-view-head h2{margin:3px 0 0}
.simulation-view-head>p{max-width:380px;color:var(--muted);font-size:.84rem}
.simulation-config-grid,.install-layout,.management-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;margin-top:24px}
.simulation-form{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.simulation-form label,.management-settings label{color:var(--muted);font-size:.78rem;font-weight:700}
.simulation-form input[type="text"],.management-settings input[type="text"]{display:block;width:100%;margin-top:5px;padding:11px;border:1px solid var(--border2);background:var(--navy3);color:var(--text);font:inherit}
.simulation-color{grid-column:1/-1;display:grid;grid-template-columns:1fr 48px 80px;align-items:center;gap:10px}
.simulation-color input{height:38px;width:48px;border:1px solid var(--border2);background:var(--navy3)}
.simulation-color output,.management-settings output{font-family:'Courier New',monospace;color:var(--muted)}
.simulation-form fieldset,.management-settings fieldset{grid-column:1/-1;border:1px solid var(--border);padding:14px}
.simulation-form legend,.management-settings legend{padding:0 6px;color:var(--text);font-size:.78rem;font-weight:700}
.simulation-form fieldset label,#managedCategories label{display:inline-flex;align-items:center;gap:6px;margin-right:16px;color:var(--muted);font-size:.8rem}
.simulation-form input[type="checkbox"],#managedCategories input,.installation-checks input{accent-color:var(--simulation-accent)}
.simulation-record,.blocking-example,.management-activity{border:1px solid var(--border);background:#091426;padding:19px}
.record-status{color:var(--good);font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.record-status span,.live-indicator{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--good);margin-right:6px;box-shadow:0 0 0 4px rgba(34,197,94,.1)}
.simulation-record dl{margin:16px 0}
.simulation-record dl div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--border)}
.simulation-record dt{color:var(--muted);font-size:.75rem}.simulation-record dd{font-size:.78rem;text-align:right;color:var(--text)}
.simulation-record p,.blocking-example p{color:var(--muted2);font-size:.75rem}
.simulation-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px;padding-top:18px;border-top:1px solid var(--border)}
.simulation-controls>span{color:var(--muted);font-size:.8rem}
.simulation-controls button:disabled{opacity:.45;cursor:not-allowed}
.simulation-code-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.simulation-code-head button,.deployment-summary button{border:1px solid var(--border2);background:var(--navy3);color:var(--text);padding:7px 10px;font:inherit;font-size:.76rem;cursor:pointer}
.simulation-code,.blocking-example pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#050c17;border:1px solid var(--border);padding:16px;color:#93c5fd;font-size:.78rem;line-height:1.6}
.installation-checks{display:grid;gap:11px;margin-top:18px}
.installation-checks label{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:.82rem}
.blocking-example h3{margin:8px 0}.blocking-example pre{margin-top:15px;font-size:.71rem}
.browser-simulation{margin-top:22px;border:1px solid #32415a;background:#dbe5eb;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.browser-toolbar{height:42px;background:#152238;display:flex;align-items:center;gap:6px;padding:0 12px}
.browser-toolbar>span{width:9px;height:9px;border-radius:50%;background:#ef6b61}.browser-toolbar>span:nth-child(2){background:#eab54d}.browser-toolbar>span:nth-child(3){background:#55b86b}
.browser-toolbar div{margin-left:8px;flex:1;max-width:440px;background:#0b1628;color:#9ba9bd;padding:5px 11px;font-size:.7rem}
.mock-site{position:relative;min-height:420px;overflow:hidden;background:#f1eee8;color:#172033}
.mock-site-nav{display:flex;justify-content:space-between;padding:18px 24px;border-bottom:1px solid #d5d2cc;font-family:Georgia,serif}.mock-site-nav span{font:12px Arial,sans-serif;color:#65707b}
.mock-site-content{min-height:350px;padding:55px 9%;background:linear-gradient(110deg,#e6ece8,#d8d4ca)}
.mock-site-content>span{font:700 10px Arial,sans-serif;letter-spacing:.13em;color:#53605a}.mock-site-content h3{font:40px/1.05 Georgia,serif;color:#1c2e27;margin:12px 0 22px}.mock-site-content button{padding:10px 15px;border:0;background:#203e33;color:#fff}
.demo-consent{position:absolute;left:16px;right:16px;bottom:16px;padding:16px;background:#fff;border:1px solid #ccd5df;box-shadow:0 12px 35px rgba(20,30,40,.22);display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;border-top:3px solid var(--simulation-accent)}
.demo-consent[hidden],.demo-preferences[hidden]{display:none}.demo-consent h3,.demo-preferences h3{font:700 16px Arial,sans-serif;color:#172033;margin:0 0 4px}.demo-consent p,.demo-preferences p{font:12px/1.45 Arial,sans-serif;color:#596777;margin:0}.demo-consent small{display:block;color:#748297;margin-top:4px}.demo-consent a{color:var(--simulation-accent)}
.demo-consent-actions{display:flex;gap:6px}.demo-consent button,.demo-preferences button,.demo-reopen{padding:8px 10px;border:1px solid #c8d1dc;background:#fff;color:#172033;font:700 11px Arial,sans-serif;cursor:pointer}.demo-consent .primary,.demo-preferences .primary{background:var(--simulation-accent);border-color:var(--simulation-accent);color:#fff}
.demo-preferences{position:absolute;inset:22px;margin:auto;width:min(430px,calc(100% - 32px));height:max-content;max-height:calc(100% - 44px);overflow:auto;background:#fff;border:1px solid #ccd5df;padding:18px;box-shadow:0 16px 40px rgba(20,30,40,.25)}
.demo-preferences>label{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid #e5eaf0;font:12px Arial,sans-serif}.demo-preferences label span,.demo-preferences label strong,.demo-preferences label small{display:block}.demo-preferences label small{color:#68778a;margin-top:2px}.demo-preferences>div{display:flex;justify-content:flex-end;gap:7px;margin-top:15px}
.demo-reopen{position:absolute;left:12px;bottom:12px}.demo-reopen[hidden]{display:none}
.simulation-runtime{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);margin-top:14px}.simulation-runtime>div{padding:12px;border-right:1px solid var(--border)}.simulation-runtime>div:last-child{border:0}.simulation-runtime strong,.simulation-runtime small{display:block;font-size:.75rem}.simulation-runtime small{color:var(--muted2);margin-left:15px}.runtime-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--high);margin-right:6px}.runtime-dot.active{background:var(--good)}
.simulation-event{display:grid;grid-template-columns:auto 1fr;gap:12px;margin-top:14px;align-items:start}.simulation-event strong{font-size:.77rem}.simulation-event code{color:#93c5fd;background:#050c17;padding:8px;overflow-wrap:anywhere;font-size:.72rem}
.management-grid{grid-template-columns:1fr .85fr}.deployment-summary{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;padding:17px;border:1px solid var(--border);background:var(--navy3)}.deployment-summary strong,.deployment-summary small{display:block}.deployment-summary small{color:var(--muted2);font-size:.72rem;margin-left:18px}.live-indicator.paused{background:var(--medium);box-shadow:0 0 0 4px rgba(245,158,11,.1)}
.management-settings{display:grid;gap:14px}.management-settings label>span{display:flex;align-items:center;gap:10px;margin-top:5px}.management-settings input[type="color"]{width:48px;height:38px;background:var(--navy3);border:1px solid var(--border2)}
.management-activity h3{font-size:.9rem}.management-activity ol{list-style:none;display:grid;gap:12px}.management-activity li{display:grid;grid-template-columns:42px 1fr;gap:8px;font-size:.76rem;color:var(--muted);padding-bottom:10px;border-bottom:1px solid var(--border)}.management-activity time{color:var(--blue-light)}
.simulation-explainer{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);margin-top:24px}.simulation-explainer>div{padding:15px;background:var(--navy3)}.simulation-explainer strong{font-size:.8rem}.simulation-explainer p{font-size:.74rem;color:var(--muted);margin-top:4px}
.simulation-account-link{display:inline-block;text-decoration:none}.simulation-how{padding:42px 0 0}.simulation-how h2{margin:5px 0 18px}.flow-line{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center;border:1px solid var(--border)}.flow-line>div{padding:17px}.flow-line strong,.flow-line span{display:block}.flow-line strong{font-size:.8rem}.flow-line span{font-size:.72rem;color:var(--muted);margin-top:3px}.flow-line>b{color:var(--blue-light)}.simulation-note{margin-top:18px;color:var(--muted);font-size:.78rem;max-width:850px}

/* ── Pricing and account ────────────────────── */
.pricing-header{max-width:720px;margin-bottom:22px}
.pricing-header h2{margin:5px 0 7px}
.pricing-header p,.annual-note{color:var(--muted)}
.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.price-card{position:relative;background:var(--navy3);border:1px solid var(--border2);border-radius:8px;padding:22px;display:flex;flex-direction:column;min-height:230px}
.price-card.featured{border-color:var(--blue)}
.price-card h3{font-size:1.05rem}
.price-card>p:not(.price){color:var(--muted);font-size:.86rem}
.price{display:flex;align-items:baseline;gap:5px;margin:5px 0 14px}
.price strong{font-size:2rem;line-height:1;color:var(--text)}
.price span{color:var(--muted);font-size:.8rem}
.plan-badge{position:absolute;right:12px;top:12px;color:var(--blue-light);font-size:.65rem;font-weight:800;letter-spacing:.08em}
.price-action{margin-top:auto;padding:9px 12px;border-radius:7px;background:var(--blue);color:#fff;text-align:center;text-decoration:none;font-weight:700;font-size:.85rem}
.price-action:hover{background:var(--blue-dark)}
.price-action.secondary{background:transparent;border:1px solid var(--border2)}
.annual-note{text-align:center;font-size:.8rem;margin-top:16px}
.account-shell{max-width:980px;margin:40px auto;padding:0 24px 60px}
.account-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.account-top img{height:60px;width:auto}
.account-top a{color:var(--blue-light);text-decoration:none}
.auth-layout{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.auth-panel h1,.dashboard-panel h1{font-size:1.55rem;margin-bottom:8px}
.auth-panel>p,.dashboard-panel>p{color:var(--muted);margin-bottom:18px}
.auth-tabs{display:flex;gap:4px;margin-bottom:18px;background:var(--navy3);padding:4px;border-radius:8px}
.auth-tab{flex:1;padding:9px;border:0;border-radius:6px;background:transparent;color:var(--muted);font:inherit;font-weight:700;cursor:pointer}
.auth-tab.active{background:var(--navy4);color:var(--text)}
.account-form{display:flex;flex-direction:column;gap:12px}
.account-form label{color:var(--muted);font-size:.82rem;font-weight:700}
.account-form input{width:100%;margin-top:5px;padding:11px 12px;border:1px solid var(--border2);border-radius:7px;background:var(--navy3);color:var(--text);font:inherit}
.account-button{padding:11px 14px;border:0;border-radius:7px;background:var(--blue);color:#fff;font:inherit;font-weight:800;cursor:pointer}
.account-button.secondary{background:var(--navy4);border:1px solid var(--border2)}
.account-status{min-height:24px;margin-top:10px;color:var(--muted);font-size:.84rem}
.account-status.error{color:var(--high)}
.account-status.success{color:var(--good)}
.account-benefits{background:var(--navy2);border-left:3px solid var(--blue);padding:24px}
.account-benefits ul{padding-left:18px;color:var(--muted);line-height:2}
.usage-track{height:9px;border-radius:5px;background:var(--navy4);overflow:hidden;margin:9px 0}
.usage-fill{height:100%;background:var(--blue)}
.dashboard-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.billing-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}
.billing-option{padding:16px;border:1px solid var(--border2);border-radius:8px;background:var(--navy3)}
.billing-option p{color:var(--muted);font-size:.82rem;margin:5px 0 12px}
.billing-toggle{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.84rem;margin-top:12px}
.deployment-manager{margin-top:28px;padding-top:24px;border-top:1px solid var(--border)}
.deployment-manager>p{color:var(--muted);font-size:.88rem}
.deployment-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.deployment-heading h2{margin:4px 0 0}
.deployment-heading>strong{color:var(--blue-light);font-size:.82rem}
.deployment-form{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end;margin:18px 0}
.deployment-form label,.deployment-fields label{color:var(--muted);font-size:.8rem;font-weight:700}
.deployment-form input,.deployment-fields input[type="text"]{display:block;width:100%;margin-top:5px;padding:10px 11px;border:1px solid var(--border2);border-radius:7px;background:var(--navy3);color:var(--text);font:inherit}
.deployment-list{display:flex;flex-direction:column;gap:12px}
.deployment-empty{padding:18px;border:1px dashed var(--border2);border-radius:7px;text-align:center}
.deployment-item{padding:18px 0;border-top:1px solid var(--border)}
.deployment-item-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.deployment-item-heading h3{margin:0}
.deployment-fields{display:grid;grid-template-columns:1fr 90px;gap:10px;margin-top:12px}
.deployment-fields input[type="color"]{display:block;width:100%;height:42px;margin-top:5px;border:1px solid var(--border2);border-radius:7px;background:var(--navy3)}
.deployment-categories{display:flex;gap:16px;flex-wrap:wrap;margin:13px 0;color:var(--muted);font-size:.82rem}
.deployment-categories label{display:flex;align-items:center;gap:6px}
.deployment-categories input{accent-color:var(--blue)}
.deployment-code{display:block;width:100%;height:62px;resize:none;padding:10px;border:1px solid var(--border2);border-radius:7px;background:#060e1c;color:#bfdbfe;font-family:'Courier New',monospace;font-size:.76rem}
.deployment-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

/* ── About section ───────────────────────────── */
.about-section{background:var(--navy2)}
.about-header{margin-bottom:22px}
.about-header h2{font-size:1.5rem}
.about-header p{color:var(--muted);font-size:.93rem;margin-top:6px}
.about-header a{color:var(--blue-light);text-decoration:none}
.about-header a:hover{text-decoration:underline}
.about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.about-card{background:var(--navy3);border:1px solid var(--border2);border-radius:12px;padding:20px}
.about-card h3{font-size:1rem;color:var(--text);margin-bottom:10px}
.about-card p{color:var(--muted);font-size:.88rem;line-height:1.7;margin-bottom:8px}
.about-card ul{padding-left:18px;color:var(--muted);font-size:.88rem;line-height:1.7}
.about-card li{margin-bottom:5px}
.about-card code{background:var(--navy4);color:#93c5fd;padding:1px 5px;border-radius:4px;font-size:.84em}
.about-card strong{color:var(--text)}

/* ── Footer ──────────────────────────────────── */
.hidden{display:none!important}
footer{text-align:center;padding:30px 24px;color:var(--muted2);font-size:.85rem;border-top:1px solid var(--border)}
footer a{color:var(--muted);text-decoration:none}
footer a:hover{color:var(--text)}
footer img{display:block;margin:12px auto 0;height:44px;opacity:.85}

/* ── Whitepaper article ──────────────────────── */
.article-shell{max-width:1100px;margin:40px auto;padding:0 24px 60px}
.article{background:var(--navy2);border:1px solid var(--border);border-radius:18px;overflow:hidden}
.article-header{padding:48px 48px 22px;background:linear-gradient(135deg,#060e1c 0%,#0f2650 55%,#1a3a80 100%);color:#fff}
.article-header .eyebrow{display:inline-block;padding:4px 12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:999px;font-size:.75rem;font-weight:700;letter-spacing:.08em;color:#93c5fd;margin-bottom:18px}
.article-header h1{font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.1;margin-bottom:12px}
.article-header p{max-width:720px;font-size:1rem;color:rgba(255,255,255,.78)}
.article-body{padding:32px 48px 48px}
.article-body h2{font-size:1.5rem;color:var(--text);margin:24px 0 12px;border-bottom:1px solid var(--border);padding-bottom:8px}
.article-body h3{font-size:1.1rem;color:var(--text);margin:18px 0 8px}
.article-body p,.article-body li{font-size:.95rem;color:var(--muted);line-height:1.8}
.article-body ul,.article-body ol{padding-left:22px;margin:10px 0 18px}
.article-body li{margin-bottom:6px}
.article-body strong{color:var(--text)}
.article-body a{color:var(--blue-light);text-decoration:none}
.article-body a:hover{text-decoration:underline}
.article-body .callout{background:rgba(59,130,246,.08);border:1px solid rgba(59,130,246,.2);border-left:4px solid var(--blue);border-radius:10px;padding:16px 18px;margin:16px 0;color:var(--text)}
.article-body .quote{background:rgba(245,158,11,.07);border:1px solid rgba(245,158,11,.2);border-left:4px solid var(--amber);border-radius:10px;padding:16px 18px;margin:18px 0;font-weight:600;color:#d4a017}
.article-body .metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin:18px 0 22px}
.metric-box{background:var(--navy3);border:1px solid var(--border2);border-radius:12px;padding:16px 12px;text-align:center}
.metric-box strong{display:block;font-size:1.8rem;line-height:1.1;margin-bottom:4px;color:var(--text)}
.metric-box span{color:var(--muted);font-size:.78rem}
.article-body .formula{background:#060e1c;color:#93c5fd;border:1px solid var(--border);border-radius:12px;padding:16px 18px;font-family:'Courier New',monospace;font-size:.88rem;line-height:1.7;overflow:auto}

/* ── Responsive ──────────────────────────────── */
@media(max-width:800px){
  .url-row,.results-header{flex-direction:column}
  #scanButton,.report-btn{width:100%}
  .hero{padding:36px 20px}
  main{padding:0 14px 40px}
  .panel{padding:18px}
  .scan-modes{grid-template-columns:1fr}
  .sponsor-card{flex-direction:column}
  .sponsor-video-wrap,.sponsor-video-wrap video{width:100%;height:180px}
  .sponsor-content{padding:16px}
  .about-grid{grid-template-columns:1fr}
  .pricing-grid,.billing-plans,.auth-layout,.deployment-form{grid-template-columns:1fr}
  .deployment-fields{grid-template-columns:1fr}
  .builder-header{flex-direction:column}
  .builder-layout{grid-template-columns:1fr}
  .managed-preview{grid-template-columns:1fr}
  .disclaimer-inner{flex-direction:column;gap:8px}
  .article-header,.article-body{padding-left:20px;padding-right:20px}
  .article-shell{padding:0 14px 40px}
  .simulation-shell{padding:18px 12px 44px}
  .simulation-top{margin-bottom:28px}.simulation-top img{height:48px}
  .simulation-workspace{grid-template-columns:1fr}
  .simulation-steps{display:grid;grid-template-columns:repeat(4,1fr);border-right:0;border-bottom:1px solid var(--border);padding:0}
  .simulation-step{display:flex;align-items:center;justify-content:center;padding:12px 5px;border-left:0;border-bottom:3px solid transparent}
  .simulation-step>span{grid-row:auto;width:27px;height:27px}.simulation-step strong{font-size:.7rem}.simulation-step small{display:none}.simulation-step.active{border-left:0;border-bottom-color:var(--blue)}
  .simulation-stage{padding:18px 14px}.simulation-view-head{flex-direction:column;gap:6px}
  .simulation-config-grid,.install-layout,.management-grid{grid-template-columns:1fr}
  .simulation-form{grid-template-columns:1fr}.simulation-color,.simulation-form fieldset{grid-column:auto}
  .simulation-controls{align-items:stretch;flex-direction:column}.simulation-controls .account-button{width:100%;text-align:center}
  .demo-consent{grid-template-columns:1fr}.demo-consent-actions{display:grid;grid-template-columns:1fr 1fr}.demo-consent-actions .primary{grid-column:1/-1}.mock-site{min-height:500px}.mock-site-content h3{font-size:31px}
  .simulation-runtime{grid-template-columns:1fr 1fr}.simulation-runtime>div:nth-child(2){border-right:0}.simulation-runtime>div{border-bottom:1px solid var(--border)}
  .simulation-event{grid-template-columns:1fr}.simulation-explainer{grid-template-columns:1fr}.flow-line{grid-template-columns:1fr}.flow-line>b{transform:rotate(90deg);text-align:center}
}
