/* CrawlIQ main.css v1.0.3 — render-blocking stylesheet */
/* ── ACCESSIBILITY: fix --dark-muted contrast (was 1.98:1 — fails WCAG AA) ── */
/* Override only decorative/structural uses; upgrade text contrast where needed */
.empty-state{color:var(--muted)!important;}   /* was dark-muted (1.98:1) → muted (5.85:1) */
.opt-empty{color:var(--muted)!important;}
.ot-curr.missing{color:var(--dim)!important;}
.ot-opt.insufficient{color:var(--dim)!important;}
.fval.missing{color:var(--dim)!important;}
.ft-copy{color:var(--muted)!important;}
/* ── SECTION COMMON ── */
section{position:relative;z-index:1;padding:80px 24px;}
.sec-inner{max-width:1200px;margin:0 auto;}
.sec-hd{text-align:center;margin-bottom:56px;}
.sec-lbl{font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;margin-bottom:10px;}
.lbl-i{color:var(--primary);}
.lbl-c{color:var(--primary);}
.lbl-g{color:var(--green);}
.sec-hd h2{font-size:clamp(26px,3vw,36px);font-weight:800;color:white;letter-spacing:-1px;margin-bottom:10px;}
.sec-hd p{font-size:15px;color:var(--dim);max-width:500px;margin:0 auto;}

/* ── DASHBOARD SECTION ── */
#dash-sec{padding:60px 24px;}
#how-it-works{padding:80px 24px;}
#competitor-sec{padding:80px 24px;}
/* Steps grid base */
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1100px;margin:0 auto;}
.step-card{background:var(--surf2);border:1px solid var(--ghost);border-radius:var(--r-2xl);
  padding:24px 20px;transition:background .2s,transform .2s;}
.step-card:hover{background:var(--surf3);transform:translateY(-3px);}
.step-card--accent{border-color:rgba(99,102,241,.2);}
.step-ico{width:40px;height:40px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;flex-shrink:0;}
.step-num{font-size:11px;font-weight:700;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:6px;font-family:var(--mono);}
.step-title{font-size:15px;font-weight:800;color:white;margin-bottom:8px;font-family:var(--headline);}
.step-desc{font-size:12px;color:var(--dim);line-height:1.7;}
.dash-card{background:var(--surf);border:1px solid var(--ghost);border-radius:var(--r-2xl);
  overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,.5);}
.dash-chrome{background:var(--surf-low);border-bottom:1px solid var(--ghost);padding:12px 20px;display:flex;align-items:center;gap:8px;}
.wb{width:11px;height:11px;border-radius:50%;}
.wb-r{background:#ff5f57;}.wb-y{background:#febc2e;}.wb-g{background:#28c840;}
.dash-chrome .tab{font-size:11px;color:var(--muted);font-family:var(--mono);margin-left:6px;}

/* Metric cards — bento style, tonal stacking (DESIGN.md) */
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:20px 20px 0;}
.mc{background:var(--surf-low);border:1px solid rgba(70,69,84,.1);border-radius:24px;padding:24px;position:relative;
  transition:background .2s,border-color .2s;}
.mc:hover{background:var(--surf2);}
.mc-lbl{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:8px;font-family:var(--mono);}
.mc-val{font-size:30px;font-weight:800;line-height:1;margin-bottom:4px;font-family:var(--headline);}
.mc-sub{font-size:10px;font-family:var(--mono);}
.mc-ico{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;}

/* Status bars */
.sbar{display:none;background:var(--surf2);border:1px solid var(--ghost);border-radius:var(--r);
  padding:10px 16px;margin:8px 20px 0;align-items:center;gap:10px;font-size:11px;color:var(--dim);}
.sbar.show{display:flex;}
.sbar.c-bar{border-left:3px solid var(--cyan);}
.sbar.g-bar{border-left:3px solid var(--indigo);}
.spin{width:13px;height:13px;border:2px solid var(--border);border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0;}
.spin.g{border-top-color:var(--cyan);}
.spin.p{border-top-color:var(--indigo);}
@keyframes spin{to{transform:rotate(360deg);}}

/* Progress */
.progress-wrap{margin:8px 20px 0;display:none;}
.progress-wrap.show{display:block;}
.progress-info{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:5px;font-family:var(--mono);}
.progress-track{height:5px;background:var(--border);border-radius:3px;overflow:hidden;}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--indigo),var(--cyan));border-radius:3px;transition:width .4s ease;}

/* Summary */
.summary{display:none;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;padding:12px 20px 0;}
.card{background:var(--bg);border:1px solid var(--border);border-radius:var(--r);padding:12px;}
.card .val{font-family:var(--sans);font-size:22px;font-weight:800;color:var(--cyan);display:block;}
.card .lbl{font-size:9px;color:var(--muted);letter-spacing:1px;text-transform:uppercase;margin-top:3px;display:block;font-family:var(--mono);}
.card.warn .val{color:var(--yellow);}
.card.danger .val{color:var(--red);}

/* Issue breakdown */
.ibreak{background:var(--surf-lowest);border:1px solid var(--ghost);border-radius:var(--r-lg);padding:12px 16px;margin:8px 20px 0;display:none;}
.ibreak h3{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:6px;font-family:var(--mono);}
.igrid{display:flex;flex-wrap:wrap;gap:5px;}
.istat{display:flex;align-items:center;gap:4px;background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.2);border-radius:4px;padding:2px 8px;font-size:10px;}
.istat .n{font-weight:700;color:var(--red);}
.istat .name{color:var(--muted);}

/* Selection toolbar */
.sel-toolbar{display:none;background:var(--surf2);border:1px solid var(--ghost);border-radius:var(--r);
  padding:8px 14px;margin:8px 20px 0;align-items:center;gap:10px;font-size:11px;}
.sel-toolbar.show{display:flex;}
.sel-toolbar .sel-count{color:var(--cyan);font-weight:600;}

/* Action buttons */
.dash-actions{display:flex;gap:8px;flex-wrap:wrap;padding:12px 20px 0;}
.btn{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.4px;padding:8px 16px;
  border-radius:var(--r-lg);border:none;cursor:pointer;transition:opacity .15s,transform .1s,background .15s;white-space:nowrap;}
.btn:active{transform:scale(.97);}
.btn:disabled{opacity:.35;cursor:not-allowed;transform:none;}
.btn-green{background:linear-gradient(135deg,var(--indigo),var(--primary-container));color:white;box-shadow:0 4px 14px rgba(99,102,241,.2);}
.btn-green:hover:not(:disabled){opacity:.88;}
.btn-outline{background:transparent;border:1px solid var(--primary);color:var(--primary);}
.btn-outline:hover:not(:disabled){background:rgba(192,193,255,.08);}
.btn-cyan{background:transparent;border:1px solid var(--primary);color:var(--primary);}
.btn-cyan:hover:not(:disabled){background:rgba(192,193,255,.07);}
.btn-purple{background:transparent;border:1px solid var(--indigo);color:var(--indigo);}
.btn-purple:hover:not(:disabled){background:rgba(99,102,241,.08);}
.btn-orange{background:transparent;border:1px solid var(--tertiary);color:var(--tertiary);}
.btn-orange:hover:not(:disabled){background:rgba(255,183,131,.08);}
.btn-sm{padding:4px 10px;font-size:10px;}

/* Toolbar */
.toolbar{display:flex;justify-content:space-between;align-items:center;padding:8px 20px;flex-wrap:wrap;gap:8px;}
.filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.filters select{background:var(--surf2);border:1px solid var(--border);color:var(--text);font-family:var(--mono);font-size:11px;padding:5px 8px;border-radius:var(--r);outline:none;}
.filters label{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--dim);cursor:pointer;}
.filters input[type=checkbox]{accent-color:var(--indigo);}
.count{font-size:11px;color:var(--dim);font-family:var(--mono);}
.count span{color:var(--cyan);font-weight:600;}

/* Table */
.twrap{overflow-x:auto;border-top:1px solid var(--border);}
table{width:100%;border-collapse:separate;border-spacing:0 6px;font-size:11px;font-family:var(--mono);}
thead th{background:transparent;color:var(--muted);font-size:9px;letter-spacing:1.2px;text-transform:uppercase;padding:6px 10px;text-align:left;white-space:nowrap;cursor:pointer;user-select:none;}
thead th:hover{color:var(--text);}
thead th.active .sa{color:var(--primary);opacity:1!important;}
.sa{margin-left:3px;opacity:.3;}
tbody tr{transition:background .15s;}
tbody tr td{background:var(--surf-low);border-top:1px solid rgba(70,69,84,.08);border-bottom:1px solid rgba(70,69,84,.08);}
tbody tr td:first-child{border-left:1px solid rgba(70,69,84,.08);border-radius:12px 0 0 12px;}
tbody tr td:last-child{border-right:1px solid rgba(70,69,84,.08);border-radius:0 12px 12px 0;}
tbody tr:hover td{background:var(--surf2)!important;}
tbody tr:last-child{border-bottom:none;}
tbody tr:hover{background:rgba(255,255,255,.02);}
tbody tr.selected-row{background:rgba(99,102,241,.05);}
td{padding:7px 10px;vertical-align:top;}
td.url-cell{max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--cyan);}
td.url-cell a{color:inherit;text-decoration:none;}
td.url-cell a:hover{text-decoration:underline;}
td.wrap{white-space:normal;word-break:break-word;min-width:110px;max-width:180px;}
td.check-cell{width:28px;padding:7px 6px;}
.badge{display:inline-block;padding:2px 6px;border-radius:4px;font-size:10px;font-weight:600;}
.b-ok{background:rgba(16,185,129,.15);color:var(--green);}
.b-warn{background:rgba(245,158,11,.12);color:var(--yellow);}
.b-err{background:rgba(239,68,68,.12);color:var(--red);}
.pb{display:inline-block;padding:2px 8px;border-radius:4px;font-size:10px;font-weight:700;}
.ph{background:rgba(239,68,68,.18);color:var(--red);}
.pm{background:rgba(245,158,11,.15);color:var(--yellow);}
.pl{background:rgba(16,185,129,.12);color:var(--green);}
.itag{display:inline-block;background:rgba(239,68,68,.1);color:var(--red);border:1px solid rgba(239,68,68,.2);font-size:9px;padding:1px 5px;border-radius:3px;margin:1px;white-space:nowrap;}
.score-pill{display:inline-block;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:700;}
.score-a{background:rgba(16,185,129,.2);color:var(--green);}
.score-b{background:rgba(34,211,238,.15);color:var(--cyan);}
.score-c{background:rgba(245,158,11,.15);color:var(--yellow);}
.score-d,.score-f{background:rgba(239,68,68,.12);color:var(--red);}
.kw-tag{display:inline-block;background:rgba(99,102,241,.12);border:1px solid rgba(99,102,241,.2);color:#A5B4FC;font-size:9px;padding:1px 5px;border-radius:3px;margin:1px;}
.popup-btn{font-size:10px;padding:3px 9px;border-radius:4px;border:1px solid var(--indigo);color:var(--indigo);background:transparent;cursor:pointer;}
.popup-btn:hover{background:rgba(99,102,241,.1);}
.empty-state{text-align:center;padding:44px 20px;color:var(--dark-muted);}
.empty-state .icon{font-size:30px;margin-bottom:10px;}
.empty-state p{font-size:11px;font-family:var(--mono);}
.comp-badge{display:inline-block;padding:2px 7px;border-radius:4px;font-size:10px;font-weight:700;}
.comp-low{background:rgba(16,185,129,.15);color:var(--green);}
.comp-med{background:rgba(245,158,11,.12);color:var(--yellow);}
.comp-high{background:rgba(239,68,68,.12);color:var(--red);}
.copy-btn{font-size:9px;padding:2px 6px;margin-left:4px;border-radius:3px;border:1px solid var(--border);background:var(--surf2);color:var(--dim);cursor:pointer;}
.copy-btn:hover,.copy-btn.copied{border-color:var(--cyan);color:var(--cyan);}

/* Optimizer panel */
.opt-panel{display:none;background:var(--surf);border:1px solid var(--border);border-radius:var(--r);margin:8px 20px;overflow:hidden;}
.opt-panel.show{display:block;}
.opt-panel-head{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--surf2);border-bottom:1px solid var(--border);}
.opt-panel-head h3{font-family:var(--sans);font-size:13px;font-weight:700;color:var(--yellow);flex:1;}
.opt-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 16px;border-bottom:1px solid var(--border);background:var(--surf2);}
.opt-filters select{background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:var(--mono);font-size:11px;padding:4px 8px;border-radius:var(--r);outline:none;}
.opt-filters input{background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:var(--mono);font-size:11px;padding:4px 8px;border-radius:var(--r);outline:none;width:180px;}
.opt-filters input:focus{border-color:var(--cyan);}
.opt-count{font-size:10px;color:var(--dim);margin-left:auto;}
.opt-wrap{overflow-x:auto;max-height:420px;overflow-y:auto;}
.otable{width:100%;border-collapse:collapse;font-size:11px;font-family:var(--mono);}
.otable thead th{background:var(--surf2);color:var(--muted);font-size:9px;letter-spacing:1.2px;text-transform:uppercase;padding:9px 14px;text-align:left;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:3;white-space:nowrap;}
.otable tbody tr{border-bottom:1px solid var(--border);transition:background .1s;}
.otable tbody tr:last-child{border-bottom:none;}
.otable tbody tr:hover{background:rgba(255,255,255,.025);}
.otable td{padding:9px 14px;vertical-align:top;}
.ot-url{max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--cyan);font-size:10px;}
.ot-field{font-weight:700;color:var(--text);white-space:nowrap;width:110px;}
.ot-curr{color:var(--dim);font-size:10px;word-break:break-word;max-width:160px;}
.ot-curr.missing{color:var(--dark-muted);font-style:italic;}
.ot-opt{color:var(--cyan);font-size:11px;font-weight:600;word-break:break-word;max-width:240px;line-height:1.5;}
.ot-opt.insufficient{color:var(--dark-muted);font-weight:400;font-style:italic;}
.ot-logic{color:var(--dim);font-size:10px;line-height:1.6;max-width:220px;word-break:break-word;}
.opt-empty{text-align:center;padding:40px 20px;color:var(--dark-muted);font-size:11px;font-family:var(--mono);}

/* ── POPUP ── */
.overlay{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.82);backdrop-filter:blur(6px);align-items:center;justify-content:center;padding:20px;}
.overlay.open{display:flex;}
.popup{background:var(--surf);border:1px solid var(--border);border-radius:12px;width:960px;max-width:98vw;max-height:92vh;display:flex;flex-direction:column;animation:popIn .2s ease;overflow:hidden;}
@keyframes popIn{from{transform:scale(.95) translateY(8px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}
.popup-head{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;align-items:flex-start;gap:12px;background:var(--surf2);}
.popup-head-left{flex:1;min-width:0;}
.popup-head h2{font-family:var(--sans);font-size:14px;font-weight:700;margin-bottom:4px;}
.purl{font-size:10px;color:var(--cyan);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:500px;font-family:var(--mono);}
.popup-head-right{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.popup-close{background:none;border:none;color:var(--muted);font-size:18px;cursor:pointer;line-height:1;}
.popup-close:hover{color:var(--text);}
.rank-card{display:flex;align-items:center;gap:16px;padding:10px 20px;border-bottom:1px solid var(--border);background:var(--surf2);}
.rank-circle{width:56px;height:56px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--sans);flex-shrink:0;}
.rank-circle .rs{font-size:20px;font-weight:800;line-height:1;}
.rank-circle .rg{font-size:10px;font-weight:600;opacity:.8;}
.rank-circle.grade-A{background:rgba(16,185,129,.2);color:var(--green);}
.rank-circle.grade-B{background:rgba(34,211,238,.15);color:var(--cyan);}
.rank-circle.grade-C{background:rgba(245,158,11,.15);color:var(--yellow);}
.rank-circle.grade-D,.rank-circle.grade-F{background:rgba(239,68,68,.15);color:var(--red);}
.rank-details{flex:1;}
.rank-feedback{font-size:11px;color:var(--text);margin-bottom:6px;}
.rank-bars{display:flex;gap:6px;flex-wrap:wrap;}
.rank-bar-item{font-size:9px;color:var(--dim);font-family:var(--mono);}
.rank-bar-item span{color:var(--text);font-weight:600;}
.popup-kw{padding:8px 20px;border-bottom:1px solid var(--border);display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:var(--surf2);}
.popup-kw .lbl{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-family:var(--mono);}
.popup-meta{padding:8px 20px;border-bottom:1px solid var(--border);display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:var(--surf2);}
.popup-body{overflow-y:auto;flex:1;}
.ptable{width:100%;border-collapse:collapse;font-size:12px;}
.ptable thead th{background:var(--surf2);color:var(--muted);font-size:9px;letter-spacing:1.2px;text-transform:uppercase;padding:9px 14px;text-align:left;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:2;white-space:nowrap;font-family:var(--mono);}
.ptable tbody tr{border-bottom:1px solid var(--border);}
.ptable tbody tr:last-child{border-bottom:none;}
.ptable tbody tr:hover{background:rgba(255,255,255,.025);}
.ptable td{padding:10px 14px;vertical-align:top;}
.fname{font-weight:600;color:var(--text);white-space:nowrap;width:120px;}
.fval{color:var(--dim);word-break:break-word;max-width:180px;font-size:11px;font-family:var(--mono);}
.fval.missing{color:var(--dark-muted);font-style:italic;}
.fwhy{color:var(--dim);font-size:11px;line-height:1.6;max-width:200px;}
.ffix{color:var(--dim);font-size:11px;line-height:1.6;max-width:200px;}
.fex{color:#A5B4FC;font-size:11px;line-height:1.6;max-width:200px;}
.fopt{color:var(--cyan);font-size:11px;line-height:1.6;max-width:220px;font-weight:600;background:rgba(34,211,238,.04);border-radius:4px;padding:3px 6px;}
.impact-pill{display:inline-block;padding:2px 7px;border-radius:4px;font-size:9px;font-weight:700;}
.imp-high{background:rgba(239,68,68,.15);color:var(--red);}
.imp-med{background:rgba(245,158,11,.15);color:var(--yellow);}
.imp-low{background:rgba(16,185,129,.12);color:var(--green);}
.sstatus{display:inline-block;padding:2px 8px;border-radius:4px;font-size:10px;font-weight:700;}
.ss-ok{background:rgba(16,185,129,.15);color:var(--green);}
.ss-bad{background:rgba(239,68,68,.15);color:var(--red);}
.popup-foot{padding:12px 20px;border-top:1px solid var(--border);display:flex;align-items:center;gap:10px;background:var(--surf2);flex-wrap:wrap;}
.nav-btn{width:34px;height:34px;border-radius:var(--r);border:1px solid var(--border);background:var(--surf);color:var(--text);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .15s;}
.nav-btn:hover:not(:disabled){border-color:var(--cyan);color:var(--cyan);}
.nav-btn:disabled{opacity:.3;cursor:not-allowed;}
.nav-counter{font-size:11px;color:var(--dim);white-space:nowrap;font-family:var(--mono);}
.nav-counter strong{color:var(--text);}
.popup-foot .spacer{flex:1;}
.ai-status-row{font-size:10px;color:var(--indigo);display:flex;align-items:center;gap:5px;}

/* Export modal */
.eoverlay{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.75);backdrop-filter:blur(4px);align-items:center;justify-content:center;}
.eoverlay.open{display:flex;}
.emodal{background:var(--surf);border:1px solid var(--border);border-radius:12px;padding:32px 40px;width:400px;max-width:95vw;text-align:center;position:relative;animation:popIn .2s ease;}
.emodal h2{font-family:var(--sans);font-size:18px;font-weight:700;margin-bottom:8px;}
.emodal p{color:var(--dim);font-size:12px;line-height:1.7;margin-bottom:20px;}
.emodal .estat{display:flex;justify-content:center;gap:24px;margin-bottom:22px;}
.emodal .ev{font-family:var(--sans);font-size:24px;font-weight:800;color:var(--cyan);display:block;}
.emodal .el{font-size:9px;color:var(--dim);letter-spacing:1px;text-transform:uppercase;font-family:var(--mono);}
.eclose{position:absolute;top:12px;right:14px;background:none;border:none;color:var(--muted);font-size:18px;cursor:pointer;}

/* ── SCHEMA ── */
.schema-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start;}
.code-editor{background:#0D1117;border:1.5px solid var(--border);border-radius:16px;overflow:hidden;font-family:'Courier New',monospace;}
.code-hd{background:#161B22;padding:12px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;}
.code-hd span{font-size:11px;color:var(--muted);margin-left:6px;}
.code-body{padding:20px;font-size:12px;line-height:1.9;overflow-x:auto;}
.ck{color:#E06C75;}.cs{color:#98C379;}.cy{color:#ABB2BF;}
.code-valid{display:inline-block;background:rgba(16,185,129,.2);color:var(--green);border-radius:20px;font-size:11px;font-weight:600;padding:4px 14px;margin-top:12px;font-family:var(--sans);}
.schema-cards{display:flex;flex-direction:column;gap:16px;}
.schema-card{background:var(--surf);border:1.5px solid var(--border);border-radius:12px;padding:20px;}
.schema-card-hd{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.schema-ico{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;}
.schema-card-info h4{font-size:15px;font-weight:700;color:white;margin-bottom:4px;}
.schema-status{display:inline-block;padding:2px 10px;border-radius:10px;font-size:10px;font-weight:600;font-family:var(--mono);}
.ss-detected{background:rgba(16,185,129,.2);color:var(--green);}
.ss-incomplete{background:rgba(245,158,11,.2);color:var(--yellow);}
.ss-missing{background:rgba(239,68,68,.2);color:var(--red);}
.schema-desc{font-size:12px;color:var(--dim);line-height:1.6;margin-bottom:8px;}
.schema-fields{font-size:10px;font-family:var(--mono);}

/* ── FEATURES — tonal stacking, ghost border ── */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.feat-card{background:var(--surf-low);border:1px solid rgba(70,69,84,.1);border-radius:24px;padding:32px 28px;position:relative;overflow:hidden;transition:background .3s,border-color .3s;}
.feat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--primary),transparent);opacity:0;transition:opacity .3s;}
.feat-card:hover{background:var(--surf2);border-color:rgba(192,193,255,.12);}
.feat-card:hover::before{opacity:1;}
.feat-card.featured{border-color:rgba(192,193,255,.15);background:var(--surf-low);}
.feat-card.featured::before{opacity:1;}
.feat-shine{display:none;}
.feat-popular{position:absolute;top:14px;right:14px;background:linear-gradient(135deg,var(--primary),var(--primary-container));color:#1a1c40;font-size:10px;font-weight:700;padding:3px 10px;border-radius:20px;letter-spacing:.5px;}
.feat-ico{width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:18px;}
.feat-card h3{font-size:17px;font-weight:800;color:white;margin-bottom:10px;letter-spacing:-.3px;}
.feat-card p{font-size:13px;color:var(--dim);line-height:1.7;margin-bottom:16px;}
.feat-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px;}
.feat-tag{background:rgba(99,102,241,.1);border:1px solid rgba(99,102,241,.2);border-radius:20px;padding:3px 12px;font-size:11px;font-family:var(--mono);color:var(--primary);}
.feat-link{font-size:12px;font-weight:600;text-decoration:none;}
.feat-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:36px;}
.feat-chip{background:var(--surf2);border:1px solid var(--ghost);border-radius:20px;padding:7px 16px;font-size:12px;color:var(--dim);transition:background .15s,border-color .15s,color .15s;}
.feat-chip:hover{background:var(--surf3);border-color:rgba(99,102,241,.2);color:var(--primary);}

/* ── ABOUT ── */
.about-sec{background:var(--surf-low);}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.about-lbl{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--primary);text-transform:uppercase;margin-bottom:12px;}
.about h2{font-size:clamp(28px,3vw,36px);font-weight:800;color:white;line-height:1.15;margin-bottom:20px;}
.about h2 em{font-style:normal;background:linear-gradient(120deg,var(--indigo),var(--primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.about p{font-size:14px;color:var(--dim);line-height:1.8;margin-bottom:10px;}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px;}
.stat-card{background:var(--surf2);border:1px solid var(--ghost);border-radius:var(--r-xl);padding:18px 16px;transition:background .2s;}
.stat-card:hover{background:var(--surf3);}
.stat-card .sv{font-size:28px;font-weight:800;color:white;margin-bottom:4px;font-family:var(--headline);}
.stat-card .sl{font-size:12px;color:var(--dim);}
.stat-card .sg{font-size:11px;color:var(--green);margin-top:2px;}
.net-wrap{position:relative;}
.net-wrap svg{width:100%;height:auto;}

/* ── STATS COUNTER STRIP ── */
.stats-strip{background:var(--surf-lowest);border-top:1px solid rgba(70,69,84,.12);border-bottom:1px solid rgba(70,69,84,.12);padding:56px 24px;}
.stats-strip-inner{max-width:960px;margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:0;align-items:center;}
.stat-strip-item{text-align:center;padding:0 24px;}
.stat-strip-val{font-size:clamp(40px,5vw,64px);font-weight:800;color:white;line-height:1;margin-bottom:8px;font-family:var(--headline);letter-spacing:-.04em;}
.stat-strip-label{font-size:14px;font-weight:700;color:var(--text);margin-bottom:4px;}
.stat-strip-sub{font-size:11px;color:var(--muted);font-family:var(--mono);}
.stat-strip-divider{width:1px;height:60px;background:rgba(70,69,84,.25);flex-shrink:0;}
@media(max-width:768px){
  .stats-strip-inner{grid-template-columns:1fr 1fr;gap:32px 16px;}
  .stat-strip-divider{display:none;}
}

/* ── AI PROVIDER CARDS ── */
.ai-providers-sec{padding:56px 24px;background:var(--bg);}
.ai-providers-label{text-align:center;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--muted);margin-bottom:28px;font-family:var(--mono);}
.ai-providers-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}
.ai-prov-card{background:var(--surf-low);border:1px solid rgba(70,69,84,.15);border-radius:24px;padding:28px 32px;
  display:flex;flex-direction:column;align-items:center;gap:10px;min-width:160px;
  transition:background .25s,border-color .25s,transform .25s;}
.ai-prov-card:hover{background:var(--surf2);border-color:rgba(192,193,255,.15);transform:translateY(-4px);}
.ai-prov-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:4px;}
.ai-prov-name{font-size:15px;font-weight:800;color:white;font-family:var(--headline);letter-spacing:-.3px;}
.ai-prov-model{font-size:10px;color:var(--muted);font-family:var(--mono);text-align:center;}

/* ── FAQ — tonal stacking, ghost borders ── */
.faq-list{max-width:800px;margin:0 auto;display:flex;flex-direction:column;gap:10px;}
.faq-item{background:var(--surf2);border:1px solid var(--ghost);border-radius:var(--r-xl);overflow:hidden;transition:border-color .2s,background .2s;}
.faq-item.open{border-color:rgba(99,102,241,.2);background:var(--surf3);}
.faq-q{padding:18px 22px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:14px;font-weight:700;color:white;user-select:none;}
.faq-q:hover{background:rgba(255,255,255,.025);}
.faq-chev{flex-shrink:0;width:26px;height:26px;border-radius:50%;border:1px solid var(--ghost);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:12px;transition:transform .25s,border-color .2s,color .2s;}
.faq-item.open .faq-chev{transform:rotate(180deg);border-color:rgba(99,102,241,.35);color:var(--primary);}
.faq-a{max-height:none;overflow:visible;}
.faq-a-in{padding:0 22px 18px;font-size:13px;color:var(--dim);line-height:1.8;border-top:1px solid var(--ghost);padding-top:14px;}
/* JS adds .faq-js-init to body once it runs — then collapse non-open items */
.faq-js-init .faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease;}
.faq-js-init .faq-item.open .faq-a{max-height:500px;overflow:visible;}

/* ── CTA ── */
.cta-wrap{margin:0 24px 80px;background:linear-gradient(135deg,rgba(99,102,241,.12),rgba(128,131,255,.06));
  border:1px solid rgba(99,102,241,.2);border-radius:var(--r-2xl);padding:56px 40px;text-align:center;position:relative;z-index:1;
  box-shadow:0 20px 40px -12px rgba(0,0,0,.4);}
.cta-wrap h2{font-size:clamp(24px,3vw,32px);font-weight:800;color:white;margin-bottom:12px;letter-spacing:-.5px;}
.cta-wrap p{font-size:15px;color:var(--dim);margin-bottom:32px;}
.cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.cta-primary{background:linear-gradient(135deg,var(--indigo),var(--primary-container));color:white;
  font-family:var(--headline);font-weight:700;font-size:14px;padding:14px 32px;border-radius:var(--r-2xl);
  border:none;cursor:pointer;text-decoration:none;transition:opacity .15s,transform .1s;
  box-shadow:0 8px 24px rgba(99,102,241,.3);}
.cta-primary:hover{opacity:.88;transform:translateY(-1px);}
.cta-outline{background:transparent;color:var(--primary);font-family:var(--headline);font-weight:700;
  font-size:14px;padding:14px 32px;border-radius:var(--r-2xl);border:1px solid rgba(99,102,241,.4);
  cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s;}
.cta-outline:hover{background:rgba(99,102,241,.08);border-color:rgba(99,102,241,.6);}

/* ── FOOTER ── */
footer{background:var(--surf-lowest);border-top:1px solid rgba(70,69,84,.1);padding:80px 32px 40px;margin-top:80px;}
.ft{display:grid;grid-template-columns:200px repeat(3,1fr);gap:40px;margin-bottom:40px;}
.fb p{font-size:13px;color:var(--muted);line-height:1.7;margin:12px 0 20px;}
.fb-logo{display:flex;align-items:center;gap:8px;}
.fb-logo span{font-family:var(--headline);font-size:18px;font-weight:800;color:white;}
.fb-logo em{font-style:normal;color:var(--primary);}
.socials{display:flex;gap:8px;}
.soc{width:34px;height:34px;border-radius:var(--r-lg);background:var(--surf2);border:1px solid var(--ghost);
  display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--muted);
  text-decoration:none;transition:border-color .15s,color .15s,background .15s;}
.soc:hover{border-color:rgba(99,102,241,.3);color:var(--primary);background:rgba(99,102,241,.1);}
.fc h4{font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:14px;}
.fc a{display:block;font-size:13px;color:var(--muted);text-decoration:none;margin-bottom:10px;transition:color .15s;}
.fc a:hover{color:var(--text);}
.ft-bot{border-top:1px solid var(--border);padding-top:22px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;}
.ft-copy{font-size:12px;color:var(--dark-muted);}
.ft-badges{display:flex;gap:8px;flex-wrap:wrap;}
.ft-badge{background:var(--surf2);border:1px solid var(--ghost);border-radius:20px;padding:4px 12px;font-size:10px;color:var(--muted);font-family:var(--mono);}

/* ── SERP INTEL / MONITOR PANEL ── */
.serp-tab{background:none;border:none;border-bottom:2px solid transparent;color:var(--dim);font-family:var(--mono);font-size:11px;font-weight:600;padding:10px 18px;cursor:pointer;transition:color .15s,border-color .15s;}
.serp-tab:hover{color:var(--text);}
.serp-tab-active{color:var(--cyan);border-bottom-color:var(--cyan);}
.serp-pane{min-height:80px;}
.serp-input{background:var(--bg);border:1.5px solid var(--border);color:var(--text);font-family:var(--mono);font-size:12px;padding:8px 12px;border-radius:var(--r);outline:none;transition:border-color .15s;}
.serp-input:focus{border-color:var(--cyan);}
.serp-input::placeholder{color:var(--dim);}

/* ── TECH SEO PANEL ── */
.tseo-panel{display:none;background:var(--surf);border:1px solid var(--border);border-radius:var(--r);margin:8px 20px;overflow:hidden;}
.tseo-panel.show{display:block;}
.tseo-panel-head{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--surf2);border-bottom:1px solid var(--border);}
.tseo-panel-head h3{font-family:var(--sans);font-size:13px;font-weight:700;color:var(--green);flex:1;}
.tseo-summary-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:10px 16px;border-bottom:1px solid var(--border);background:var(--surf2);}
.tseo-mc{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px 12px;text-align:center;}
.tseo-mc .tv{font-size:22px;font-weight:800;line-height:1.1;margin-bottom:2px;}
.tseo-mc .tl{font-size:9px;font-family:var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:1px;}
.tseo-mc .ts{font-size:10px;font-family:var(--mono);margin-top:2px;}
.tseo-domain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px 16px;border-bottom:1px solid var(--border);}
.tseo-domain-card{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px 14px;display:flex;align-items:center;gap:10px;}
.tseo-domain-ico{font-size:18px;flex-shrink:0;}
.tseo-domain-info{flex:1;min-width:0;}
.tseo-domain-title{font-size:11px;font-weight:700;color:var(--text);margin-bottom:2px;}
.tseo-domain-val{font-size:10px;font-family:var(--mono);}
.tseo-domain-val.ok{color:var(--green);}
.tseo-domain-val.warn{color:var(--yellow);}
.tseo-domain-val.err{color:var(--red);}
.tseo-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 16px;border-bottom:1px solid var(--border);background:var(--surf2);}
.tseo-filters select,.tseo-filters input{background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:var(--mono);font-size:11px;padding:4px 8px;border-radius:var(--r);outline:none;}
.tseo-filters input{width:180px;}
.tseo-filters input:focus{border-color:var(--green);}
.tseo-count{font-size:10px;color:var(--dim);margin-left:auto;font-family:var(--mono);}
.tseo-wrap{overflow-x:auto;max-height:420px;overflow-y:auto;}
.tseo-table{width:100%;border-collapse:collapse;font-size:11px;font-family:var(--mono);}
.tseo-table thead th{background:var(--surf2);color:var(--muted);font-size:9px;letter-spacing:1.2px;text-transform:uppercase;padding:9px 14px;text-align:left;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:3;white-space:nowrap;}
.tseo-table tbody tr{border-bottom:1px solid var(--border);transition:background .1s;cursor:pointer;}
.tseo-table tbody tr:last-child{border-bottom:none;}
.tseo-table tbody tr:hover{background:rgba(16,185,129,.04);}
.tseo-table td{padding:8px 14px;vertical-align:middle;}
.tseo-url{max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--cyan);}
.tseo-score-cell{font-weight:700;font-size:12px;}
.idx-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:10px;font-weight:700;}
.idx-ok{background:rgba(16,185,129,.2);color:var(--green);}
.idx-likely{background:rgba(34,211,238,.15);color:var(--cyan);}
.idx-canon{background:rgba(245,158,11,.15);color:var(--yellow);}
.idx-redirect{background:rgba(245,158,11,.12);color:var(--yellow);}
.idx-error{background:rgba(239,68,68,.15);color:var(--red);}
.idx-unknown{background:rgba(107,114,128,.15);color:var(--muted);}
.tseo-grade{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;font-weight:800;font-size:12px;}
.tseo-grade-a{background:rgba(16,185,129,.2);color:var(--green);}
.tseo-grade-b{background:rgba(34,211,238,.15);color:var(--cyan);}
.tseo-grade-c{background:rgba(245,158,11,.15);color:var(--yellow);}
.tseo-grade-d,.tseo-grade-f{background:rgba(239,68,68,.15);color:var(--red);}
.tseo-issue-count{display:inline-block;background:rgba(239,68,68,.1);color:var(--red);border:1px solid rgba(239,68,68,.2);border-radius:4px;padding:2px 7px;font-size:10px;font-weight:700;}
.tseo-issue-count.zero{background:rgba(16,185,129,.1);color:var(--green);border-color:rgba(16,185,129,.2);}
.tseo-detail-btn{font-size:9px;padding:2px 8px;border-radius:4px;border:1px solid var(--green);color:var(--green);background:transparent;cursor:pointer;white-space:nowrap;}
.tseo-detail-btn:hover{background:rgba(16,185,129,.08);}

/* Tech SEO Detail Modal */
.tseo-overlay{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.82);backdrop-filter:blur(6px);align-items:center;justify-content:center;padding:20px;}
.tseo-overlay.open{display:flex;}
.tseo-modal{background:var(--surf);border:1px solid var(--border);border-radius:12px;width:900px;max-width:98vw;max-height:92vh;display:flex;flex-direction:column;animation:popIn .2s ease;overflow:hidden;}
.tseo-modal-head{padding:12px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;background:var(--surf2);}
.tseo-modal-head h2{font-family:var(--sans);font-size:14px;font-weight:700;flex:1;}
.tseo-modal-url{font-size:10px;color:var(--cyan);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:420px;font-family:var(--mono);display:block;margin-top:2px;}
.tseo-modal-score{display:flex;align-items:center;gap:10px;padding:10px 20px;border-bottom:1px solid var(--border);background:var(--surf2);}
.tseo-score-circle{width:58px;height:58px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--sans);flex-shrink:0;}
.tseo-score-circle .sc-val{font-size:20px;font-weight:800;line-height:1;}
.tseo-score-circle .sc-grade{font-size:10px;font-weight:600;opacity:.8;}
.tseo-score-circle.sc-a{background:rgba(16,185,129,.2);color:var(--green);}
.tseo-score-circle.sc-b{background:rgba(34,211,238,.15);color:var(--cyan);}
.tseo-score-circle.sc-c{background:rgba(245,158,11,.15);color:var(--yellow);}
.tseo-score-circle.sc-d,.tseo-score-circle.sc-f{background:rgba(239,68,68,.15);color:var(--red);}
.tseo-score-meta{flex:1;}
.tseo-score-meta .sm-title{font-size:12px;font-weight:700;color:var(--text);margin-bottom:4px;}
.tseo-score-meta .sm-idx{font-size:11px;color:var(--dim);}
.tseo-component-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;overflow-y:auto;flex:1;}
.tseo-component{border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:12px 16px;}
.tseo-component:nth-child(3n){border-right:none;}
.tseo-comp-head{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.tseo-comp-name{font-size:11px;font-weight:700;color:var(--text);flex:1;}
.tseo-comp-score{font-size:11px;font-weight:800;}
.tseo-comp-bar{height:3px;background:var(--border);border-radius:2px;margin-bottom:8px;overflow:hidden;}
.tseo-comp-fill{height:100%;border-radius:2px;transition:width .3s ease;}
.tseo-comp-issues{display:flex;flex-direction:column;gap:3px;}
.tseo-comp-issue{font-size:10px;color:var(--red);font-family:var(--mono);padding:2px 0;}
.tseo-comp-ok{font-size:10px;color:var(--green);font-family:var(--mono);}
.tseo-comp-val{font-size:10px;color:var(--dim);font-family:var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px;}
.tseo-modal-foot{padding:10px 20px;border-top:1px solid var(--border);display:flex;align-items:center;gap:10px;background:var(--surf2);}
.tseo-modal-nav{display:flex;align-items:center;gap:8px;}
.tseo-bar-accent{border-left:3px solid var(--green) !important;}

/* scrollbar */
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px;}

/* ── COLD-START BANNER ── */
#cold-banner{display:none;background:rgba(30,41,59,.7);border:1px solid rgba(99,102,241,.25);
  border-radius:10px;padding:14px 20px 12px;margin:0 0 20px;font-size:12px;color:rgba(203,213,225,.9);
  font-family:var(--mono);flex-direction:column;gap:9px;position:relative;z-index:1;
  backdrop-filter:blur(4px);}
#cold-banner.show{display:flex;}
.cold-banner-row{display:flex;align-items:center;gap:10px;}
.cold-banner-label{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--primary);flex-shrink:0;}
.spin-sm{width:11px;height:11px;border:2px solid rgba(99,102,241,.3);border-top-color:var(--primary);
  border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0;}
#cold-banner .cold-elapsed{color:var(--primary);margin-left:auto;font-size:11px;font-weight:700;
  min-width:32px;text-align:right;}
.cold-progress-track{height:3px;background:rgba(99,102,241,.15);border-radius:2px;overflow:hidden;width:100%;}
.cold-progress-fill{height:100%;width:40%;background:var(--primary);border-radius:2px;
  animation:coldSlide 1.8s ease-in-out infinite;}
@keyframes coldSlide{0%{transform:translateX(-110%)}100%{transform:translateX(350%)}}

/* ── SEO CHECKLIST ── */
#checklist-sec{padding:80px 60px;background:var(--bg);}
.chk-progress-bar{max-width:1100px;margin:0 auto 24px;background:var(--surf-lowest);border:1px solid var(--ghost);
  border-radius:var(--r-xl);padding:16px 22px;display:flex;align-items:center;gap:20px;}
.chk-score-big{font-size:36px;font-weight:900;color:var(--primary);line-height:1;min-width:48px;}
.chk-bar-wrap{flex:1;height:6px;background:var(--surf3);border-radius:3px;overflow:hidden;}
.chk-bar-fill{height:100%;background:linear-gradient(90deg,var(--indigo),var(--primary-container));border-radius:3px;transition:width .3s ease;}
.chk-label{font-size:12px;color:var(--dim);min-width:100px;text-align:right;font-family:var(--mono);}
.chk-reset{font-size:11px;color:var(--muted);background:none;border:1px solid var(--ghost);
  border-radius:20px;padding:5px 14px;cursor:pointer;font-family:var(--mono);white-space:nowrap;transition:border-color .15s,color .15s;}
.chk-reset:hover{border-color:rgba(255,107,107,.4);color:var(--red);}
.checklist-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:1100px;margin:0 auto;}
.chk-group{background:var(--surf2);border:1px solid var(--ghost);border-radius:var(--r-xl);padding:20px 24px;transition:background .2s;}
.chk-group:hover{background:var(--surf3);}
.chk-group-title{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:14px;font-family:var(--mono);}
.chk-item{display:flex;align-items:flex-start;gap:10px;padding:8px 0;border-bottom:1px solid var(--ghost);}
.chk-item:last-child{border-bottom:none;}
.chk-item input[type=checkbox]{margin-top:2px;accent-color:var(--indigo);width:14px;height:14px;flex-shrink:0;cursor:pointer;}
.chk-item label{font-size:12px;color:var(--dim);cursor:pointer;line-height:1.5;}
.chk-item label strong{color:var(--text);display:block;font-size:12px;margin-bottom:1px;}
.chk-item.checked label{color:var(--muted);}
.chk-item.checked label strong{color:var(--muted);text-decoration:line-through;}

/* ── META ANALYZER ── */
#analyzer-sec{padding:80px 60px;background:var(--surf-low);}
.analyzer-card{background:var(--surf);border:1px solid var(--ghost);border-radius:var(--r-2xl);
  padding:32px;max-width:900px;margin:0 auto;box-shadow:0 20px 40px -12px rgba(0,0,0,.4);}
.analyzer-form{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px;}
.af-group{display:flex;flex-direction:column;gap:6px;}
.af-label{font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--muted);font-family:var(--mono);}
/* DESIGN.md input rule: surface_container_lowest bg, no border, focus outer glow */
.af-input{background:var(--surf-lowest);border:1px solid var(--ghost);color:var(--text);
  font-size:13px;font-family:var(--mono);padding:10px 14px;border-radius:var(--r-lg);
  outline:none;resize:none;transition:border-color .2s,box-shadow .2s;}
.af-input:focus{border-color:rgba(99,102,241,.35);box-shadow:0 0 0 2px rgba(99,102,241,.15);}
.af-input::placeholder{color:rgba(144,143,160,.5);}
.af-hint{font-size:10px;color:var(--muted);}
.af-full{grid-column:1/-1;}
.analyze-btn{background:linear-gradient(135deg,var(--primary-container),var(--indigo));border:none;
  color:white;font-family:var(--headline);font-weight:700;font-size:13px;padding:12px 28px;
  border-radius:var(--r-xl);cursor:pointer;display:flex;align-items:center;gap:8px;
  box-shadow:0 8px 20px rgba(99,102,241,.25);transition:opacity .15s,transform .1s,box-shadow .15s;}
.analyze-btn:hover{opacity:.9;transform:translateY(-1px);box-shadow:0 12px 28px rgba(99,102,241,.35);}
.score-display{display:none;margin-top:24px;border-top:1px solid var(--ghost);padding-top:20px;}
.score-display.show{display:block;}
.score-header{display:flex;align-items:center;gap:20px;margin-bottom:20px;}
.big-score-num{font-size:52px;font-weight:900;line-height:1;font-family:var(--headline);}
.score-grade-lbl{font-size:24px;font-weight:800;font-family:var(--headline);}
.score-verdict{font-size:14px;color:var(--dim);margin-top:4px;}
.score-breakdown{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;}
.sb-item{background:var(--surf2);border:1px solid var(--ghost);border-radius:var(--r-lg);padding:14px;transition:background .2s;}
.sb-item:hover{background:var(--surf3);}
.sb-label{font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--muted);font-family:var(--mono);margin-bottom:6px;}
.sb-bar{height:4px;background:var(--surf3);border-radius:2px;overflow:hidden;margin-bottom:5px;}
.sb-fill{height:100%;border-radius:2px;transition:width .5s ease .1s;}
.sb-note{font-size:11px;color:var(--dim);line-height:1.5;}

/* ── BEFORE / AFTER ── */
#example-sec{padding:80px 60px;background:var(--bg);}
.ba-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:1000px;margin:0 auto;}
.ba-card{border-radius:var(--r-2xl);padding:28px;border:1px solid;}
.ba-before{background:rgba(255,107,107,.03);border-color:rgba(255,107,107,.15);}
.ba-after{background:rgba(16,185,129,.03);border-color:rgba(16,185,129,.15);}
.ba-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:18px;padding:5px 14px;border-radius:20px;font-family:var(--mono);}
.ba-before .ba-badge{background:rgba(255,107,107,.1);color:var(--red);}
.ba-after .ba-badge{background:rgba(16,185,129,.1);color:var(--green);}
.ba-item{margin-bottom:14px;}
.ba-field{font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:4px;font-family:var(--mono);}
.ba-val{font-size:12px;font-family:var(--mono);padding:10px 12px;border-radius:var(--r-lg);line-height:1.6;}
.ba-before .ba-val{background:rgba(255,107,107,.07);color:#FCA5A5;}
.ba-after .ba-val{background:rgba(16,185,129,.07);color:#6EE7B7;}
.ba-score{display:flex;align-items:center;gap:14px;margin-top:20px;padding-top:16px;border-top:1px solid var(--ghost);}
.ba-score-num{font-size:32px;font-weight:900;font-family:var(--headline);}
.ba-before .ba-score-num{color:var(--red);}
.ba-after .ba-score-num{color:var(--green);}
.ba-score-sub{font-size:12px;color:var(--muted);line-height:1.5;}

/* ── BOTTOM NAV (mobile only) — matches prototype ── */
.bottom-nav{display:flex;position:fixed;bottom:0;left:0;width:100%;justify-content:space-around;
  align-items:center;padding:10px 16px 24px;
  background:rgba(23,27,38,.8);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  z-index:100;border-top:1px solid rgba(70,69,84,.15);border-radius:24px 24px 0 0;
  box-shadow:0 -10px 40px rgba(0,0,0,.4);height:80px;}
@media(min-width:768px){.bottom-nav{display:none;}}
.bn-item{display:flex;flex-direction:column;align-items:center;gap:3px;
  text-decoration:none;padding:6px 14px;border-radius:var(--r-lg);
  color:var(--muted);transition:color .15s,background .15s;}
.bn-item.active{background:rgba(192,193,255,.1);color:var(--primary);}
.bn-item:hover{background:rgba(38,42,53,.8);color:var(--primary);}
.bn-item .material-symbols-outlined{font-size:24px;}
.bn-label{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin-top:2px;font-family:var(--sans);}

/* ══════════════════════════════════════════════
   RESPONSIVE — 4 breakpoints
   1200px → desktop (default)
   1024px → laptop
    768px → tablet
    480px → mobile
    360px → small mobile
   ══════════════════════════════════════════════ */

/* ── Laptop (≤1200px) ── */
@media(max-width:1200px){
  nav{padding:0 24px;}
  section{padding:72px 32px;}
  #dash-sec{padding:56px 32px;}
  #checklist-sec{padding:72px 32px;}
  #analyzer-sec{padding:72px 32px;}
  #example-sec{padding:72px 32px;}
  #competitor-sec{padding:72px 32px;}
  #how-it-works{padding:72px 32px!important;}
  .cta-wrap{margin:0 32px 80px;}
  .hero{padding:90px 32px 56px;}
  footer{padding:48px 32px 28px;}
  .ft{grid-template-columns:180px repeat(3,1fr);gap:32px;}
}

/* ── Tablet (≤1024px) ── */
@media(max-width:1024px){
  /* Nav: hide text labels on AI setup, tighten */
  .btn-ai-setup span.material-symbols-outlined{display:inline-block;}
  .btn-ai-setup{padding:6px 10px;font-size:0;gap:0;}
  .btn-ai-setup span.material-symbols-outlined{font-size:16px!important;margin:0;}
  /* Grids */
  .feat-grid{grid-template-columns:repeat(2,1fr);}
  .metric-grid{grid-template-columns:repeat(2,1fr);}
  .about-grid{grid-template-columns:1fr;}
  .net-wrap{display:none;}
  .stat-grid{grid-template-columns:repeat(3,1fr);}
  .schema-grid{grid-template-columns:1fr;}
  .steps-grid{grid-template-columns:repeat(2,1fr);}
  .ft{grid-template-columns:1fr 1fr;gap:28px;}
  /* Sections */
  section{padding:64px 28px;}
  #dash-sec{padding:48px 24px;}
  #checklist-sec{padding:64px 28px;}
  #analyzer-sec{padding:64px 28px;}
  #example-sec{padding:64px 28px;}
  #competitor-sec{padding:64px 28px;}
  #how-it-works{padding:64px 28px!important;}
  .hero{padding:88px 28px 52px;}
  .cta-wrap{margin:0 24px 72px;padding:44px 28px;}
}

/* ── Tablet portrait (≤768px) ── */
@media(max-width:768px){
  /* Nav: hide links + AI setup, keep logo + auth */
  .nav-links{display:none!important;}
  .btn-ai-setup{display:none;}
  .ai-pill{display:none;}
  nav{padding:0 16px;gap:12px;height:60px;}
  .nav-right{gap:8px;}
  /* Hero */
  .hero{padding:84px 20px 48px;}
  .hero h1{font-size:clamp(32px,8vw,48px);letter-spacing:-2px;}
  .hero-sub{font-size:15px;max-width:100%;}
  .hero-input-row{border-radius:var(--r-xl);padding:6px;}
  .hero-input-wrap input{font-size:14px;padding:13px 0;}
  .hero-crawl-btn{padding:13px 22px;font-size:13px;}
  /* Sections */
  section{padding:56px 20px;}
  #dash-sec{padding:40px 16px;}
  #cold-banner{margin:0 16px 14px;}
  #checklist-sec{padding:56px 20px;}
  #analyzer-sec{padding:56px 20px;}
  #example-sec{padding:56px 20px;}
  #competitor-sec{padding:56px 20px;}
  #how-it-works{padding:56px 20px!important;}
  .sec-hd h2{font-size:clamp(22px,5vw,30px);}
  /* Dashboard */
  .metric-grid{grid-template-columns:repeat(2,1fr);gap:10px;padding:12px 14px 0;}
  .dash-actions{padding:10px 14px 0;gap:6px;}
  .btn{font-size:10px;padding:7px 12px;}
  .summary{padding:8px 14px 0;}
  .ibreak{margin:6px 14px 0;}
  .progress-wrap{margin:6px 14px 0;}
  .sbar{margin:6px 14px 0;}
  .opt-panel{margin:6px 14px;}
  .tseo-panel{margin:6px 14px;}
  .sel-toolbar{margin:6px 14px 0;}
  /* Cards */
  .feat-grid{grid-template-columns:1fr;}
  .schema-grid{grid-template-columns:1fr;}
  .about-grid{grid-template-columns:1fr;}
  .net-wrap{display:none;}
  .ba-grid{grid-template-columns:1fr;}
  .checklist-grid{grid-template-columns:1fr;}
  .analyzer-form{grid-template-columns:1fr;}
  .stat-grid{grid-template-columns:repeat(3,1fr);}
  .steps-grid{grid-template-columns:1fr 1fr;}
  /* Footer */
  .ft{grid-template-columns:1fr 1fr;gap:24px;margin-bottom:28px;}
  footer{padding:40px 20px 24px;}
  /* CTA */
  .cta-wrap{margin:0 16px 60px;padding:36px 20px;}
  .cta-btns{flex-direction:column;align-items:center;}
  .cta-primary,.cta-outline{width:100%;max-width:320px;text-align:center;justify-content:center;}
  /* Competitor charts */
  .comp-charts{grid-template-columns:1fr;}
}

/* ── Mobile (≤480px) ── */
@media(max-width:480px){
  /* Nav */
  nav{height:56px;}
  .nav-logo-text{font-size:16px;}
  .btn-nav-cta{font-size:12px;padding:7px 14px;}
  .btn.btn-green.btn-sm,.btn.btn-outline.btn-sm{display:none;}/* hide Sign In / Sign Up — use auth from menu */
  /* Hero */
  .hero{padding:76px 16px 40px;}
  .hero h1{font-size:32px;letter-spacing:-1.5px;}
  .hero-sub{font-size:14px;margin-bottom:28px;}
  .hero-input-row{flex-direction:column;border-radius:var(--r-xl);padding:8px;gap:8px;}
  .hero-input-wrap{padding:0 14px;}
  .hero-input-wrap input{padding:12px 0;font-size:14px;}
  .hero-crawl-btn{border-radius:var(--r-lg);padding:14px;justify-content:center;font-size:14px;}
  .hero-badge{font-size:11px;padding:5px 12px;}
  .scroll-ind{display:none;}
  /* Sections */
  section{padding:48px 16px;}
  #dash-sec{padding:32px 12px;}
  #checklist-sec,#analyzer-sec,#example-sec,#competitor-sec{padding:48px 16px;}
  #how-it-works{padding:48px 16px!important;}
  .sec-hd{margin-bottom:36px;}
  .sec-hd h2{font-size:22px;letter-spacing:-.5px;}
  .sec-hd p{font-size:13px;}
  /* Dashboard */
  .metric-grid{grid-template-columns:1fr 1fr;gap:8px;padding:10px 12px 0;}
  .mc-val{font-size:24px;}
  .dash-chrome .tab{display:none;}
  .dash-actions{gap:5px;padding:8px 12px 0;}
  .btn{font-size:10px;padding:6px 10px;}
  /* Features */
  .feat-card{padding:20px 18px;}
  .feat-chips{gap:6px;}
  .feat-chip{padding:5px 12px;font-size:11px;}
  /* Stats */
  .stat-grid{grid-template-columns:1fr 1fr;}
  .stat-card .sv{font-size:24px;}
  /* Checklist */
  .chk-progress-bar{flex-wrap:wrap;gap:10px;}
  .chk-label{min-width:auto;}
  /* Analyzer */
  .analyzer-card{padding:20px 16px;}
  .big-score-num{font-size:40px;}
  /* Before/After */
  .ba-card{padding:20px 16px;}
  /* Steps */
  .steps-grid{grid-template-columns:1fr;}
  /* Footer */
  .ft{grid-template-columns:1fr;}
  footer{padding:32px 16px 20px;}
  .ft-bot{flex-direction:column;align-items:flex-start;gap:10px;}
  .ft-badges{flex-wrap:wrap;}
  /* CTA */
  .cta-wrap{margin:0 12px 60px;padding:28px 16px;}
  .cta-wrap h2{font-size:20px;}
}

/* ── Small mobile (≤360px) ── */
@media(max-width:360px){
  .hero h1{font-size:28px;}
  .hero-crawl-btn{font-size:13px;}
  .metric-grid{grid-template-columns:1fr;}
  .stat-grid{grid-template-columns:1fr;}
  .btn-nav-cta{padding:6px 10px;font-size:11px;}
  nav{padding:0 12px;}
}
/* ── Competitor Analysis Section ── */
#competitor-sec{background:linear-gradient(180deg,var(--bg) 0%,rgba(99,102,241,.03) 50%,var(--bg) 100%);}
.comp-input-panel{background:var(--surf);border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;margin-bottom:14px;}
.comp-input-grid{display:grid;grid-template-columns:1fr;gap:8px;margin-bottom:12px;}
.comp-url-row{display:flex;gap:8px;align-items:center;}
.comp-url-row input{flex:1;background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:var(--mono);font-size:12px;padding:8px 12px;border-radius:var(--r);outline:none;transition:border .15s;}
.comp-url-row input:focus{border-color:var(--cyan);}
.comp-url-row input::placeholder{color:var(--muted);}
.comp-url-row .comp-url-label{font-size:9px;letter-spacing:1.2px;text-transform:uppercase;color:var(--dim);white-space:nowrap;width:80px;font-family:var(--mono);}
.comp-url-row.target-row .comp-url-label{color:var(--cyan);}
.comp-sbar{display:none;background:var(--surf);border:1px solid var(--border);border-left:3px solid var(--cyan);border-radius:var(--r);padding:10px 16px;margin-bottom:10px;align-items:center;gap:10px;font-size:11px;color:var(--dim);font-family:var(--mono);}
.comp-sbar.show{display:flex;}
.comp-scores{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-bottom:16px;}
.comp-score-card{background:var(--surf);border:1px solid var(--border);border-radius:var(--r);padding:12px;text-align:center;}
.comp-score-card .cs-domain{font-size:9px;color:var(--dim);text-overflow:ellipsis;overflow:hidden;white-space:nowrap;margin-bottom:4px;font-family:var(--mono);}
.comp-score-card .cs-val{font-family:var(--sans);font-size:28px;font-weight:800;}
.comp-score-card .cs-lbl{font-size:9px;letter-spacing:1px;color:var(--dim);text-transform:uppercase;}
.comp-score-card.is-target{border-color:var(--cyan);}
.comp-score-card.is-target .cs-domain{color:var(--cyan);}
.comp-charts{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px;}
@media(max-width:900px){.comp-charts{grid-template-columns:1fr;}}
.comp-chart-box{background:var(--surf);border:1px solid var(--border);border-radius:var(--r);padding:14px;}
.comp-chart-box h4{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--dim);margin-bottom:10px;}
.comp-chart-canvas{width:100%;height:320px;}
.comp-gap-panel{background:var(--surf);border:1px solid var(--border);border-radius:var(--r);margin-bottom:16px;overflow:hidden;}
.comp-gap-head{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--surf2);border-bottom:1px solid var(--border);}
.comp-gap-head h4{font-family:var(--sans);font-size:13px;font-weight:700;color:var(--cyan);flex:1;}
.comp-gap-wrap{overflow-x:auto;max-height:320px;overflow-y:auto;}
.gtable{width:100%;border-collapse:collapse;font-size:11px;font-family:var(--mono);}
.gtable thead th{background:var(--surf2);color:var(--muted);font-size:9px;letter-spacing:1.2px;text-transform:uppercase;padding:9px 14px;text-align:left;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:2;}
.gtable tbody tr{border-bottom:1px solid var(--border);transition:background .1s;}
.gtable tbody tr:hover{background:rgba(255,255,255,.025);}
.gtable td{padding:7px 14px;vertical-align:middle;}
.gt-kw{font-weight:600;color:var(--text);}
.gt-opp{color:var(--cyan);font-weight:700;}
.gt-found{color:var(--dim);font-size:10px;}
.opp-bar{display:inline-block;height:6px;border-radius:3px;background:var(--cyan);opacity:.5;min-width:2px;}
.comp-actions-panel{background:var(--surf);border:1px solid var(--border);border-radius:var(--r);margin-bottom:16px;}
.comp-actions-head{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--surf2);border-bottom:1px solid var(--border);}
.comp-actions-head h4{font-family:var(--sans);font-size:13px;font-weight:700;color:var(--yellow);flex:1;}
.comp-action-list{padding:12px 16px;display:flex;flex-direction:column;gap:8px;}
.comp-action-item{display:flex;gap:10px;align-items:flex-start;background:var(--surf2);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;}
.comp-action-item.priority-High{border-left:3px solid var(--red);}
.comp-action-item.priority-Medium{border-left:3px solid var(--yellow);}
.comp-action-item.priority-Low{border-left:3px solid var(--green);}
.ca-dim{font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--dim);margin-bottom:2px;}
.ca-text{font-size:11px;color:var(--text);line-height:1.5;}
.ca-scores{font-size:9px;color:var(--muted);margin-top:3px;}
.comp-dim-panel{background:var(--surf);border:1px solid var(--border);border-radius:var(--r);margin-bottom:16px;overflow:hidden;}
.comp-dim-head{padding:10px 16px;background:var(--surf2);border-bottom:1px solid var(--border);}
.comp-dim-head h4{font-family:var(--sans);font-size:13px;font-weight:700;color:var(--indigo);}
.dim-table{width:100%;border-collapse:collapse;font-size:11px;font-family:var(--mono);}
.dim-table thead th{background:var(--surf2);color:var(--muted);font-size:9px;letter-spacing:1.2px;text-transform:uppercase;padding:9px 14px;text-align:left;border-bottom:1px solid var(--border);}
.dim-table tbody tr{border-bottom:1px solid var(--border);}
.dim-table tbody tr:hover{background:rgba(255,255,255,.02);}
.dim-table td{padding:8px 14px;vertical-align:middle;}
.dim-lbl{font-weight:600;color:var(--text);white-space:nowrap;}
.dim-score{font-weight:800;font-family:var(--sans);font-size:13px;}
.dim-bar-wrap{display:flex;align-items:center;gap:6px;}
.dim-bar-bg{flex:1;height:5px;background:var(--border);border-radius:3px;overflow:hidden;min-width:60px;}
.dim-bar-fill{height:100%;border-radius:3px;transition:width .5s ease;}
.dim-score-good{color:var(--green);}
.dim-score-mid{color:var(--yellow);}
.dim-score-bad{color:var(--red);}
.comp-hist-panel{background:var(--surf);border:1px solid var(--border);border-radius:var(--r);margin-bottom:16px;overflow:hidden;}
.comp-hist-head{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--surf2);border-bottom:1px solid var(--border);}
.comp-hist-head h4{font-family:var(--sans);font-size:13px;font-weight:700;color:var(--dim);flex:1;}
.htable{width:100%;border-collapse:collapse;font-size:11px;font-family:var(--mono);}
.htable thead th{background:var(--surf2);color:var(--muted);font-size:9px;letter-spacing:1.2px;text-transform:uppercase;padding:9px 14px;text-align:left;border-bottom:1px solid var(--border);}
.htable tbody tr{border-bottom:1px solid var(--border);cursor:pointer;transition:background .1s;}
.htable tbody tr:hover{background:rgba(255,255,255,.03);}
.htable td{padding:7px 14px;}
/* ── AI Setup button in nav ── */
.btn-ai-setup{font-size:12px;font-weight:600;padding:6px 14px;border-radius:20px;border:1px solid var(--indigo);color:var(--indigo);background:transparent;cursor:pointer;transition:background .15s;white-space:nowrap;}
.btn-ai-setup:hover{background:rgba(99,102,241,.12);}
/* ── AI Setup Modal ── */
.ai-overlay{display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.88);backdrop-filter:blur(10px);align-items:center;justify-content:center;padding:20px;}
.ai-overlay.open{display:flex;}
.ai-modal{background:var(--surf);border:1px solid var(--border);border-radius:14px;width:520px;max-width:96vw;animation:popIn .2s ease;overflow:hidden;}
@keyframes popIn{from{transform:scale(.94) translateY(10px);opacity:0;}to{transform:scale(1) translateY(0);opacity:1;}}
.ai-modal-head{padding:18px 22px 14px;background:var(--surf2);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;}
.ai-modal-head h2{font-size:15px;font-weight:700;background:linear-gradient(90deg,var(--indigo),var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;flex:1;}
.ai-modal-close{background:none;border:none;color:var(--dim);font-size:20px;cursor:pointer;line-height:1;padding:2px 6px;}
.ai-modal-close:hover{color:var(--text);}
.ai-modal-body{padding:22px;}
.ai-current-status{display:flex;align-items:center;gap:10px;background:var(--surf2);border:1px solid var(--border);border-radius:var(--r);padding:10px 14px;margin-bottom:20px;}
.ai-current-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;background:var(--dim);}
.ai-current-dot.active{background:#06d6a0;}.ai-current-dot.inactive{background:#ff4d6a;}
.ai-current-provider{font-size:12px;font-weight:600;color:var(--text);}
.ai-current-hint{font-size:10px;color:var(--dim);margin-top:2px;}
.ai-providers-label{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:10px;}
.ai-provider-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:20px;}
.ai-provider-card{border:1.5px solid var(--border);border-radius:var(--r);padding:10px 8px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;background:var(--bg);}
.ai-provider-card:hover{border-color:var(--indigo);background:rgba(99,102,241,.06);}
.ai-provider-card.selected{border-color:var(--indigo);background:rgba(99,102,241,.1);}
.ai-provider-card.selected .ai-pcard-name{color:var(--indigo);}
.ai-pcard-icon{font-size:18px;margin-bottom:4px;}
.ai-pcard-name{font-size:10px;font-weight:600;color:var(--text);}
.ai-pcard-desc{font-size:9px;color:var(--dim);margin-top:2px;line-height:1.4;}
.ai-key-group{margin-bottom:18px;}
.ai-key-label{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:7px;display:block;}
.ai-key-row{display:flex;gap:6px;align-items:center;}
.ai-key-input{flex:1;background:var(--bg);border:1.5px solid var(--border);color:var(--text);font-family:var(--mono);font-size:12px;padding:9px 12px;border-radius:var(--r);outline:none;transition:border-color .15s;}
.ai-key-input:focus{border-color:var(--indigo);}
.ai-key-input::placeholder{color:var(--dim);}
.ai-key-toggle{background:var(--surf2);border:1px solid var(--border);color:var(--dim);font-size:12px;padding:9px 10px;border-radius:var(--r);cursor:pointer;line-height:1;transition:color .15s;}
.ai-key-toggle:hover{color:var(--text);}
.ai-detect-badge{display:none;align-items:center;gap:6px;font-size:10px;color:var(--cyan);margin-top:6px;}
.ai-detect-badge.show{display:flex;}
.ai-no-key-notice{display:none;font-size:10px;color:var(--dim);background:rgba(34,211,238,.04);border:1px solid rgba(34,211,238,.15);border-radius:var(--r);padding:8px 12px;margin-bottom:12px;line-height:1.6;}
.ai-no-key-notice.show{display:block;}
.ai-feedback{min-height:22px;font-size:11px;margin-bottom:14px;padding:6px 10px;border-radius:var(--r);display:none;}
.ai-feedback.show{display:block;}
.ai-feedback.ok{background:rgba(6,214,160,.08);color:#06d6a0;}
.ai-feedback.err{background:rgba(255,77,106,.08);color:#ff4d6a;}
.ai-modal-foot{display:flex;gap:8px;justify-content:flex-end;padding-top:4px;}

/* ── SaaS auth & project styles ──────────────────────────── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9000;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.modal-box{background:var(--surf);border:1px solid var(--border);border-radius:12px;padding:28px 32px;width:100%;max-width:420px;box-shadow:0 24px 80px rgba(0,0,0,.6)}
.modal-box h2{font-size:18px;font-weight:800;color:var(--text);margin:0 0 6px}
.modal-box p{font-size:11px;color:var(--dim);margin:0 0 20px}
.auth-field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.auth-field label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}
.auth-field input{background:var(--surf2);border:1px solid var(--border);border-radius:6px;padding:9px 12px;font-size:13px;color:var(--text);outline:none}
.auth-field input:focus{border-color:var(--indigo)}
.auth-tabs{display:flex;gap:0;margin-bottom:20px;border-bottom:1px solid var(--border)}
.auth-tab{background:none;border:none;padding:8px 16px;font-size:12px;font-weight:700;color:var(--dim);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.auth-tab.active{color:var(--indigo);border-bottom-color:var(--indigo)}
.auth-error{color:var(--red);font-size:11px;margin-bottom:10px;display:none}
.user-chip{display:flex;align-items:center;gap:8px;cursor:pointer;position:relative}
.user-avatar{width:28px;height:28px;border-radius:50%;background:var(--indigo);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#fff}
.user-menu{position:absolute;top:36px;right:0;background:var(--surf);border:1px solid var(--border);border-radius:8px;min-width:200px;z-index:500;box-shadow:0 8px 32px rgba(0,0,0,.4);display:none}
.user-menu.open{display:block}
.user-menu-item{display:block;width:100%;padding:9px 14px;font-size:12px;color:var(--text);background:none;border:none;text-align:left;cursor:pointer;border-bottom:1px solid var(--border)}
.user-menu-item:last-child{border-bottom:none}
.user-menu-item:hover{background:var(--surf2);color:var(--indigo)}
.tier-badge{display:inline-block;padding:2px 7px;border-radius:4px;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:1px}
.tier-free{background:rgba(99,102,241,.15);color:var(--indigo)}
.tier-pro{background:rgba(16,185,129,.15);color:var(--green)}
.tier-agency{background:rgba(34,211,238,.15);color:var(--cyan)}
.proj-card{background:var(--surf2);border:1px solid var(--border);border-radius:8px;padding:12px 16px;cursor:pointer;transition:border-color .2s}
.proj-card:hover{border-color:var(--indigo)}
.proj-card .proj-name{font-size:13px;font-weight:700;color:var(--text);margin-bottom:2px}
.proj-card .proj-url{font-size:10px;color:var(--dim);font-family:var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.proj-card .proj-meta{display:flex;gap:10px;margin-top:6px;font-size:9px;color:var(--muted);font-family:var(--mono)}
.issue-status-sel{background:var(--surf2);border:1px solid var(--border);border-radius:4px;padding:2px 6px;font-size:10px;color:var(--text);cursor:pointer}
.issue-status-sel.open{border-color:var(--yellow);color:var(--yellow)}
.issue-status-sel.in_progress{border-color:var(--cyan);color:var(--cyan)}
.issue-status-sel.resolved{border-color:var(--green);color:var(--green)}
.usage-bar-wrap{background:var(--surf2);border-radius:4px;height:6px;overflow:hidden;margin-top:4px}
.usage-bar{height:100%;border-radius:4px;transition:width .3s}
.settings-section{border-bottom:1px solid var(--border);padding-bottom:16px;margin-bottom:16px}
.settings-section:last-child{border-bottom:none}
.kw-gap-box{background:var(--surf2);border:1px solid var(--border);border-radius:8px;padding:12px 14px;flex:1}
.kw-gap-box h4{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin:0 0 8px}
.kw-gap-pill{display:inline-block;padding:2px 7px;background:var(--surf);border:1px solid var(--border);border-radius:12px;font-size:10px;color:var(--text);margin:2px;font-family:var(--mono)}
.score-spark{width:100%;height:80px}

/* ── BUILDER CARD ── */
.builder-card{background:var(--surf2);border:1px solid var(--border);border-radius:var(--r-xl);
  padding:22px 24px;display:flex;align-items:flex-start;gap:16px;margin-top:28px;}
.builder-avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--indigo),var(--primary-container));
  display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:800;color:white;flex-shrink:0;}
.builder-info{flex:1;min-width:0;}
.builder-name{font-size:15px;font-weight:700;color:var(--text);margin:0 0 2px;}
.builder-title{font-size:11px;color:var(--primary);font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin:0 0 8px;}
.builder-bio{font-size:12px;color:var(--dim);line-height:1.6;margin:0 0 10px;}
.builder-links{display:flex;gap:8px;flex-wrap:wrap;}
.builder-link{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;
  padding:4px 12px;border-radius:20px;border:1px solid var(--border);color:var(--dim);
  text-decoration:none;transition:border-color .15s,color .15s;}
.builder-link:hover{border-color:var(--primary);color:var(--primary);}

/* ── SEO CONTENT SECTION ── */
#seo-content-sec{padding:60px 60px 50px;background:var(--bg);border-top:1px solid var(--border);}
.seo-content-inner{max-width:900px;margin:0 auto;}
.seo-content-inner h2{font-size:22px;font-weight:800;color:var(--text);margin:0 0 28px;letter-spacing:-.02em;}
.seo-content-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;}
.seo-para-card{background:var(--surf2);border:1px solid var(--border);border-radius:var(--r-xl);padding:20px 22px;}
.seo-para-card h3{font-size:13px;font-weight:700;color:var(--primary);text-transform:uppercase;
  letter-spacing:.06em;margin:0 0 10px;}
.seo-para-card p{font-size:13px;color:var(--dim);line-height:1.75;margin:0;}

/* ── BUILDER BADGE (fixed) ── */
#builder-badge{position:fixed;bottom:72px;right:20px;z-index:9000;
  background:rgba(15,23,42,.88);backdrop-filter:blur(8px);
  color:rgba(203,213,225,.75);font-size:10px;font-weight:600;letter-spacing:.04em;
  padding:6px 13px;border-radius:20px;text-decoration:none;
  border:1px solid rgba(99,102,241,.25);transition:color .15s,border-color .15s,background .15s;
  white-space:nowrap;display:flex;align-items:center;gap:6px;}
#builder-badge:hover{color:white;border-color:var(--primary);background:rgba(99,102,241,.25);}
#builder-badge svg{opacity:.6;}
@media(max-width:480px){#builder-badge{bottom:80px;right:12px;font-size:9px;padding:5px 10px;}}

/* ══════════════════════════════════════════════════
   APP SHELL — responsive (sidebar + topbar + panels)
   ══════════════════════════════════════════════════ */

/* ── Tablet ≤1024px: tighten panel padding ── */
@media(max-width:1024px){
  body.app-mode #dash-sec{padding-top:80px;padding-left:20px;padding-right:20px;}
  body.app-mode #competitor-sec{padding-top:80px;padding-left:20px;padding-right:20px;}
  body.app-mode #panel-schema-intel{padding-top:64px;}
  body.app-mode #panel-content-lab{padding-top:64px;}
  .si-summary-grid{grid-template-columns:repeat(2,1fr);}
}

/* ── Mobile ≤768px ── */
@media(max-width:768px){
  /* Panel padding: account for nav height */
  body.app-mode #dash-sec{padding-top:72px;padding-left:16px;padding-right:16px;}
  body.app-mode #competitor-sec{padding-top:72px;padding-left:16px;padding-right:16px;}
  body.app-mode #serp-intel-sec{padding-top:0;}
  body.app-mode #monitor-sec{padding-top:0;}
  body.app-mode #panel-schema-intel{padding-top:64px;}
  body.app-mode #panel-content-lab{padding-top:64px;}

  /* Schema & Content Lab panels: stack single column */
  .si-summary-grid{grid-template-columns:1fr !important;padding:16px 16px;}
  .si-matrix{margin:0 16px 16px;}
  .si-head{flex-direction:column;align-items:flex-start;gap:12px;padding:16px 16px 14px;}
  .si-head-btns{width:100%;justify-content:flex-end;}
  .clab-body{grid-template-columns:1fr !important;padding:16px;}
  .clab-generate-row{grid-column:1 !important;}
  .clab-result{grid-column:1 !important;}

  /* App crawl bar: full-width comfortable */
  .app-crawl-bar{border-radius:16px;padding:6px 6px 6px 14px;}
  .app-crawl-btn{padding:10px 16px;font-size:12px;border-radius:12px;}
}

/* ── Small mobile ≤480px ── */
@media(max-width:480px){
  body.app-mode #dash-sec{padding-top:64px;padding-left:12px;padding-right:12px;}
  body.app-mode #panel-schema-intel,
  body.app-mode #panel-content-lab{padding-top:56px;}
  .si-summary-grid{padding:12px 12px;}
  .si-matrix{margin:0 12px 12px;}
  .si-head{padding:14px 12px 12px;}
  .clab-body{padding:12px;}
  .app-topbar{height:56px;}
  .app-topbar-title{font-size:12px;}
  /* Hide guest auth buttons in topbar on very small screens */
  #nav-auth-guest-topbar .btn-outline{display:none;}
  /* Builder badge above bottom-nav */
  #builder-badge{bottom:76px;}
}

/* ════════════════════════════════════════════════
   SIDEBAR LAYOUT — Obsidian dark nav rail
   ════════════════════════════════════════════════ */
.sidebar{
  position:fixed;left:0;top:0;bottom:0;width:256px;
  background:#0f131d;z-index:120;overflow-y:auto;
  transform:translateX(-256px);
  transition:transform .3s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;
  border-right:1px solid rgba(70,69,84,.3);
}
.sidebar-logo{display:flex;align-items:center;gap:10px;padding:24px 20px 20px;border-bottom:1px solid rgba(70,69,84,.2);}
.sidebar-logo-icon{color:var(--primary);font-size:24px;}
.sidebar-logo-text{font-family:var(--headline);font-size:18px;font-weight:800;color:var(--text);letter-spacing:-.4px;}
.sidebar-logo-text em{font-style:normal;color:var(--primary);}
.sidebar-nav{flex:1;padding:12px 8px;}
.sn-group{margin-bottom:4px;}
.sn-item{display:flex;align-items:center;gap:12px;padding:11px 16px;border-radius:8px 0 0 8px;cursor:pointer;
  color:var(--muted);font-size:13px;font-weight:700;transition:all .2s;
  border:none;border-right:4px solid transparent;background:none;width:100%;text-align:left;margin-bottom:2px;
  font-family:var(--headline);}
.sn-item:hover{background:rgba(255,255,255,.06);color:var(--dim);}
.sn-item.active{background:rgba(192,193,255,.08);color:var(--primary);border-right-color:var(--primary);}
.sn-item .sn-icon{font-size:18px;flex-shrink:0;}
.sn-divider{height:1px;background:rgba(70,69,84,.25);margin:8px 8px;}
.sidebar-foot{padding:12px 8px 20px;border-top:1px solid rgba(70,69,84,.2);margin-top:auto;}
.sidebar-ai-pill{display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:8px;
  color:var(--muted);font-size:11px;font-weight:600;cursor:pointer;
  border:1px solid rgba(70,69,84,.35);background:none;width:100%;text-align:left;
  transition:all .15s;margin-bottom:6px;font-family:var(--mono);}
.sidebar-ai-pill:hover{background:rgba(255,255,255,.04);color:var(--dim);border-color:rgba(70,69,84,.55);}
.sidebar-back{display:flex;align-items:center;gap:8px;padding:9px 16px;border-radius:8px;
  color:var(--muted);font-size:12px;font-weight:600;cursor:pointer;
  border:none;background:none;width:100%;text-align:left;transition:all .15s;font-family:var(--sans);}
.sidebar-back:hover{background:rgba(255,255,255,.04);color:var(--dim);}

/* ── APP TOPBAR — two-row: brand+input+auth / panel tabs ── */
.app-topbar{
  display:none;position:fixed;top:0;left:0;right:0;
  flex-direction:column;
  background:rgba(15,19,29,.88);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-bottom:1px solid rgba(70,69,84,.2);
  z-index:110;
  box-shadow:0 20px 40px -12px rgba(0,0,0,.5);
}
.app-topbar-main{
  display:flex;align-items:center;padding:0 24px;gap:14px;height:64px;
}
/* Panel tab row */
.app-panel-tabs{
  display:flex;align-items:center;gap:2px;padding:0 24px 10px;
  overflow-x:auto;scrollbar-width:none;
}
.app-panel-tabs::-webkit-scrollbar{display:none;}
.apt{
  background:none;border:none;color:var(--muted);font-family:var(--mono);
  font-size:11px;font-weight:600;padding:6px 16px;border-radius:20px;cursor:pointer;
  white-space:nowrap;transition:color .15s,background .15s;letter-spacing:.02em;
}
.apt:hover{color:var(--text);background:rgba(255,255,255,.04);}
.apt.active{color:var(--primary);background:rgba(192,193,255,.1);}
.app-topbar-title{font-size:15px;font-weight:800;color:var(--text);font-family:var(--headline);letter-spacing:-.3px;}
.app-topbar-spacer{flex:1;}
.app-topbar-actions{display:flex;align-items:center;gap:10px;}
/* Hamburger — hidden on desktop, shown on mobile */
.app-hamburger{
  display:none;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:10px;border:1px solid var(--border);
  background:none;cursor:pointer;color:var(--dim);flex-shrink:0;
  transition:background .15s,color .15s;
}
.app-hamburger:hover{background:rgba(255,255,255,.06);color:var(--text);}
/* Sidebar backdrop — mobile overlay */
.sidebar-backdrop{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);
  z-index:115;opacity:0;pointer-events:none;transition:opacity .3s;
}
.sidebar-backdrop.open{opacity:1;pointer-events:auto;}

/* ── AI DRAWER ── */
#ai-drawer{
  position:fixed;inset-y:0;right:0;width:480px;max-width:96vw;
  background:var(--surf);z-index:400;
  transform:translateX(100%);
  transition:transform .3s cubic-bezier(.4,0,.2,1);
  box-shadow:-8px 0 60px rgba(0,0,0,.5);
  overflow-y:auto;display:flex;flex-direction:column;
  border-left:1px solid var(--border);
}
#ai-drawer.open{transform:translateX(0);}
#ai-drawer-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:390;
  opacity:0;pointer-events:none;transition:opacity .3s;
}
#ai-drawer-overlay.open{opacity:1;pointer-events:auto;}
.aid-head{padding:22px 24px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:flex-start;}
.aid-title{font-size:15px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:8px;font-family:var(--headline);}
.aid-url{font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:310px;font-family:var(--mono);}
.aid-close{width:32px;height:32px;border-radius:8px;border:none;background:none;cursor:pointer;color:var(--muted);font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s;flex-shrink:0;}
.aid-close:hover{background:rgba(255,255,255,.06);color:var(--text);}
.aid-body{flex:1;padding:20px 24px;overflow-y:auto;}
.aid-section-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--muted);margin-bottom:10px;font-family:var(--mono);}
.aid-pills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;}
.aid-pill{padding:6px 14px;border-radius:20px;font-size:11px;font-weight:700;border:1px solid var(--border);background:var(--surf2);color:var(--muted);cursor:pointer;transition:all .15s;}
.aid-pill.active{background:var(--primary);color:#292b5e;border-color:var(--primary);box-shadow:0 2px 8px rgba(192,193,255,.2);}
.aid-pill:hover:not(.active){border-color:var(--primary);color:var(--primary);}
.aid-key-wrap{position:relative;margin-bottom:16px;}
.aid-key-wrap input{width:100%;background:var(--surf-lowest);border:1px solid var(--border);border-radius:10px;padding:10px 14px 10px 36px;font-size:12px;font-family:var(--mono);color:var(--text);outline:none;transition:border-color .15s;}
.aid-key-wrap input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(192,193,255,.08);}
.aid-key-wrap input::placeholder{color:var(--muted);}
.aid-key-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:14px;}
.aid-card{background:var(--surf2);border:1px solid var(--border);border-radius:14px;padding:16px;border-left:4px solid var(--primary);margin-bottom:14px;}
.aid-card-field{background:rgba(192,193,255,.08);color:var(--primary);font-size:10px;font-weight:700;padding:2px 8px;border-radius:4px;border:1px solid rgba(192,193,255,.2);text-transform:uppercase;display:inline-block;}
.aid-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:10px 0;}
.aid-card-item-label{font-size:9px;font-weight:700;text-transform:uppercase;color:var(--muted);margin-bottom:2px;font-family:var(--mono);}
.aid-card-item-val{font-size:12px;font-weight:600;color:var(--text);line-height:1.4;}
.aid-optimized{background:var(--surf-lowest);border:1px solid var(--border);border-radius:10px;padding:10px 12px;margin:8px 0;}
.aid-optimized-label{font-size:9px;font-weight:700;text-transform:uppercase;color:var(--muted);margin-bottom:4px;font-family:var(--mono);}
.aid-optimized-val{font-size:12px;font-weight:700;color:var(--text);display:flex;align-items:flex-start;gap:6px;}
.aid-optimized-arrow{color:var(--green);flex-shrink:0;}
.aid-card-footer{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-top:10px;border-top:1px solid var(--border);margin-top:8px;}
.aid-foot{padding:16px 24px;border-top:1px solid var(--border);background:var(--surf-lowest);display:flex;gap:10px;flex-shrink:0;}
.aid-btn-test{flex:1;background:var(--surf2);border:1px solid var(--border);border-radius:10px;padding:10px;font-size:12px;font-weight:700;color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;transition:background .15s;font-family:var(--headline);}
.aid-btn-test:hover{background:var(--surf3);}
.aid-btn-apply{flex:1;background:var(--primary);color:#292b5e;border:none;border-radius:10px;padding:10px;font-size:12px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;transition:opacity .15s;box-shadow:0 4px 14px rgba(192,193,255,.2);font-family:var(--headline);}
.aid-btn-apply:hover{opacity:.9;}

/* ── SCHEMA INTELLIGENCE PANEL ── */
#panel-schema-intel{display:none;}
.si-head{display:flex;justify-content:space-between;align-items:flex-end;padding:24px 28px 18px;border-bottom:1px solid var(--border);}
.si-head .si-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--muted);margin-bottom:4px;font-family:var(--mono);}
.si-head h1{font-size:22px;font-weight:800;color:var(--text);font-family:var(--headline);font-style:italic;}
.si-head-btns{display:flex;gap:10px;}
.si-btn-outline{background:var(--surf2);border:1px solid var(--border);border-radius:10px;padding:8px 16px;font-size:12px;font-weight:700;color:var(--text);cursor:pointer;display:flex;align-items:center;gap:6px;transition:background .15s;font-family:var(--headline);}
.si-btn-outline:hover{background:var(--surf3);}
.si-btn-primary{background:var(--primary);color:#292b5e;border:none;border-radius:10px;padding:8px 18px;font-size:12px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:6px;box-shadow:0 4px 14px rgba(192,193,255,.2);transition:opacity .15s;font-family:var(--headline);}
.si-btn-primary:hover{opacity:.9;}
.si-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:20px 28px;}
.si-sum-card{background:var(--surf2);border:1px solid var(--border);border-radius:24px;padding:22px 18px;position:relative;overflow:hidden;}
.si-sum-card .s-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-family:var(--mono);}
.si-sum-card .s-icon{position:absolute;top:16px;right:16px;color:var(--border);font-size:16px;}
.si-sum-card .s-val{font-size:28px;font-weight:800;color:var(--text);line-height:1;margin:8px 0 4px;font-family:var(--headline);}
.si-sum-card .s-sub{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-family:var(--mono);}
.si-matrix{background:var(--surf);border:1px solid var(--border);border-radius:24px;margin:0 28px 28px;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.25);}
.si-matrix-head{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;background:rgba(15,19,29,.5);position:sticky;top:0;z-index:5;backdrop-filter:blur(12px);}
.si-matrix-head h3{font-size:13px;font-weight:700;color:var(--text);font-family:var(--headline);}
.si-matrix-filter{display:flex;align-items:center;gap:8px;background:var(--surf-lowest);border:1px solid var(--border);border-radius:10px;padding:6px 12px;}
.si-matrix-filter input{background:transparent;border:none;font-size:11px;font-weight:600;outline:none;color:var(--text);width:160px;}
.si-matrix-filter input::placeholder{color:var(--muted);}
.si-table{width:100%;border-collapse:collapse;}
.si-table thead th{background:var(--surf-low);color:var(--muted);font-size:9px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:10px 18px;text-align:left;border-bottom:1px solid var(--border);font-family:var(--mono);}
.si-table tbody tr{border-bottom:1px solid rgba(70,69,84,.2);cursor:pointer;}
.si-table tbody tr:last-child{border-bottom:none;}
.si-table tbody tr:hover{background:var(--surf2)!important;}
.si-table td{padding:13px 18px;vertical-align:middle;}
.si-url{font-size:12px;font-weight:700;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px;font-family:var(--headline);}
.si-url-sub{font-size:10px;color:var(--muted);margin-top:1px;font-family:var(--mono);}
.si-schema-id{font-size:11px;font-family:var(--mono);font-weight:700;color:var(--muted);display:flex;align-items:center;gap:6px;}
.si-type-badge{background:var(--surf3);color:var(--dim);font-size:9px;font-weight:700;padding:2px 7px;border-radius:4px;border:1px solid var(--border);display:inline-block;margin:1px;font-family:var(--mono);}
.si-status{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-family:var(--mono);}
.si-status-valid{color:var(--green);}
.si-status-warning{color:var(--yellow);}
.si-status-error{color:var(--red);}
.si-expand-btn{width:32px;height:32px;border-radius:8px;border:1px solid var(--border);background:var(--surf2);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--muted);transition:all .15s;font-size:13px;}
.si-expand-btn:hover{border-color:var(--primary);color:var(--primary);background:rgba(192,193,255,.08);}
.si-code-wrap{background:var(--surf-lowest);border-radius:14px;border:1px solid var(--border);padding:20px;margin:12px 0;overflow-x:auto;}
.si-code-wrap pre{font-family:var(--mono);font-size:12px;line-height:1.7;color:#93c5fd;margin:0;}
.si-code-actions{display:flex;gap:8px;margin-bottom:12px;}
.si-code-btn{padding:6px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:rgba(148,163,184,.8);font-size:11px;cursor:pointer;transition:all .15s;font-family:var(--mono);}
.si-code-btn:hover{background:rgba(255,255,255,.1);color:white;}
.si-fault-bar{display:flex;align-items:center;gap:12px;background:rgba(255,107,107,.08);border:1px solid rgba(255,107,107,.2);border-radius:10px;padding:12px 16px;margin-top:8px;}
.si-fault-icon{color:var(--red);font-size:18px;flex-shrink:0;}
.si-fault-body h4{font-size:11px;font-weight:700;color:var(--red);text-transform:uppercase;letter-spacing:.06em;margin-bottom:2px;font-family:var(--mono);}
.si-fault-body p{font-size:11px;color:var(--dim);margin:0;}
.si-repair-btn{margin-left:auto;background:var(--red);color:white;border:none;border-radius:8px;padding:6px 14px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;white-space:nowrap;flex-shrink:0;font-family:var(--headline);}
.si-repair-btn:hover{opacity:.9;}
.si-expanded-cell td{padding:0!important;}
.si-expanded-content{padding:16px 28px;background:var(--surf-lowest);border-bottom:1px solid var(--border);}

/* ── CONTENT LAB PANEL ── */
#panel-content-lab{display:none;}
.clab-head{padding:24px 28px 18px;border-bottom:1px solid var(--border);}
.clab-head .clab-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--muted);margin-bottom:4px;font-family:var(--mono);}
.clab-head h1{font-size:22px;font-weight:800;color:var(--text);font-family:var(--headline);font-style:italic;}
.clab-body{padding:20px 28px;display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.clab-model-row{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap;}
.clab-model-btn{padding:8px 16px;border-radius:10px;font-size:11px;font-weight:700;border:1px solid var(--border);background:var(--surf2);color:var(--muted);cursor:pointer;transition:all .15s;white-space:nowrap;font-family:var(--headline);}
.clab-model-btn.active{background:var(--surf-highest);color:var(--text);border-color:var(--border-strong);}
.clab-model-btn:hover:not(.active){border-color:var(--primary);color:var(--primary);}
.clab-panel{background:var(--surf2);border:1px solid var(--border);border-radius:24px;padding:18px 20px;}
.clab-panel h3{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:10px;font-family:var(--mono);}
.clab-textarea{width:100%;background:var(--surf-lowest);border:1px solid var(--border);border-radius:10px;padding:12px;font-size:12px;font-family:var(--mono);color:var(--text);resize:vertical;min-height:180px;outline:none;transition:border-color .15s;line-height:1.6;}
.clab-textarea::placeholder{color:var(--muted);}
.clab-textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(192,193,255,.08);}
.clab-generate-row{grid-column:1/-1;display:flex;justify-content:center;gap:12px;}
.clab-generate-btn{background:var(--primary);color:#292b5e;border:none;border-radius:14px;padding:13px 32px;font-size:13px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;box-shadow:0 4px 16px rgba(192,193,255,.2);transition:all .15s;font-family:var(--headline);}
.clab-generate-btn:hover:not(:disabled){opacity:.9;transform:translateY(-1px);}
.clab-generate-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;}
.clab-processing{grid-column:1/-1;background:var(--surf-lowest);border:1px solid var(--border);border-radius:24px;padding:32px;text-align:center;display:none;}
.clab-processing.show{display:block;}
.clab-processing p{color:var(--muted);font-size:12px;font-family:var(--mono);margin-top:12px;}
.clab-proc-bar{height:3px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden;margin:16px 0 0;}
.clab-proc-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-container),var(--primary));background-size:200%;border-radius:2px;animation:clabPulse 1.6s ease-in-out infinite;}
@keyframes clabPulse{0%{background-position:0% 50%}100%{background-position:200% 50%}}
.clab-result{grid-column:1/-1;background:var(--surf2);border:1px solid var(--border);border-radius:24px;padding:18px;display:none;}
.clab-result.show{display:block;}
.clab-result h3{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:12px;font-family:var(--mono);}
.clab-result-text{font-size:13px;color:var(--text);line-height:1.8;white-space:pre-wrap;font-family:var(--mono);background:var(--surf-lowest);border:1px solid var(--border);border-radius:10px;padding:14px;}
.clab-result-actions{display:flex;gap:8px;margin-top:12px;}
.clab-copy-btn{padding:7px 16px;border-radius:8px;border:1px solid var(--border);background:var(--surf3);color:var(--text);font-size:11px;font-weight:700;cursor:pointer;transition:background .15s;font-family:var(--headline);}
.clab-copy-btn:hover{background:var(--surf-highest);}

/* ── APP CRAWL BAR (visible only in app mode, inside #dash-sec) ── */
.app-crawl-bar{
  display:flex;
  align-items:center;gap:10px;
  background:rgba(10,14,24,.6);border:1px solid rgba(70,69,84,.3);border-radius:32px;
  padding:6px 6px 6px 16px;
  transition:border-color .25s,box-shadow .25s;
}
.app-crawl-bar:focus-within{border-color:rgba(192,193,255,.35);box-shadow:0 0 0 2px rgba(192,193,255,.1);}
.app-crawl-wrap{flex:1;display:flex;align-items:center;gap:10px;}
.app-crawl-icon{color:var(--muted);font-size:20px;flex-shrink:0;}
.app-crawl-input{flex:1;border:none;outline:none;font-size:14px;font-family:var(--sans);color:var(--text);background:transparent;padding:10px 0;}
.app-crawl-input::placeholder{color:var(--muted);}
.app-crawl-btn{
  background:var(--primary);color:#292b5e;border:none;
  border-radius:24px;padding:12px 24px;font-family:var(--headline);font-weight:700;font-size:13px;
  cursor:pointer;display:flex;align-items:center;gap:7px;white-space:nowrap;
  box-shadow:0 4px 14px rgba(192,193,255,.2);transition:opacity .15s,transform .1s;
}
.app-crawl-btn:hover{opacity:.9;transform:translateY(-1px);}
.app-crawl-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;}

/* ════════════════════════════════════════════════
   APP-MODE: dark Obsidian shell — sidebar + panels
   ════════════════════════════════════════════════ */
body.app-mode{
  background:var(--bg);
}

/* Topbar visible in app mode */
body.app-mode .app-topbar{display:flex!important;}

/* Restore app panels hidden by SEO-first initial CSS */
body.app-mode #dash-sec{display:block!important;}

/* Dashboard padding when in app mode (topbar = 64px main + ~40px tabs = 112px total) */
body.app-mode #dash-sec{padding-top:116px;}
body.app-mode #serp-intel-sec{padding-top:0;}
body.app-mode #monitor-sec{padding-top:0;}
body.app-mode #competitor-sec{padding-top:116px;}
body.app-mode #panel-schema-intel{display:block;padding-top:108px;}
body.app-mode #panel-content-lab{display:block;padding-top:108px;}

/* Hide landing sections in app mode */
body.app-mode .landing-nav,
body.app-mode .hero,
body.app-mode .stats-strip,
body.app-mode .ai-providers-sec,
body.app-mode #how-it-works,
body.app-mode #features,
body.app-mode #about,
body.app-mode #example-sec,
body.app-mode #checklist-sec,
body.app-mode #analyzer-sec,
body.app-mode #faq,
body.app-mode .cta-wrap,
body.app-mode #seo-content-sec,
body.app-mode #seo-main-content,
body.app-mode footer,
body.app-mode .bottom-nav,
body.app-mode #cold-banner-landing{display:none!important;}

/* Row hover in dark mode */
body.app-mode tbody tr:hover{background:var(--surf2)!important;}
body.app-mode .tseo-table tbody tr:hover{background:var(--surf2)!important;}

/* Panel visibility: controlled by .panel-hidden class added/removed by JS */
body.app-mode #dash-sec.panel-hidden,
body.app-mode #serp-intel-sec.panel-hidden,
body.app-mode #monitor-sec.panel-hidden,
body.app-mode #competitor-sec.panel-hidden,
body.app-mode #panel-schema-intel.panel-hidden,
body.app-mode #panel-content-lab.panel-hidden{display:none!important;}

/* ══════════════════════════════════════════════════
   ANIMATION SYSTEM — scroll reveal / entrance / glow
   ══════════════════════════════════════════════════ */

/* Keyframes */
@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes panelFade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes rowSlide{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
@keyframes mcStagger{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes glowPulse{0%,100%{opacity:.5;width:16px}50%{opacity:1;width:24px}}
@keyframes countRoll{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Scroll-reveal base — invisible until .visible added by JS */
.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .65s cubic-bezier(.22,.61,.36,1),
             transform .65s cubic-bezier(.22,.61,.36,1);
}
.reveal.visible{opacity:1;transform:none;}
.reveal-left{
  opacity:0;transform:translateX(-28px);
  transition:opacity .65s cubic-bezier(.22,.61,.36,1),
             transform .65s cubic-bezier(.22,.61,.36,1);
}
.reveal-left.visible{opacity:1;transform:none;}
.reveal-right{
  opacity:0;transform:translateX(28px);
  transition:opacity .65s cubic-bezier(.22,.61,.36,1),
             transform .65s cubic-bezier(.22,.61,.36,1);
}
.reveal-right.visible{opacity:1;transform:none;}

/* Panel switch entrance */
.panel-enter{animation:panelFade .28s cubic-bezier(.22,.61,.36,1) both;}

/* Metric card stagger (applied per-card via inline animation-delay) */
.mc.mc-animate{animation:mcStagger .4s cubic-bezier(.22,.61,.36,1) both;}

/* Progress bar trailing glow */
.progress-fill{position:relative;overflow:visible;}
.progress-fill::after{
  content:'';position:absolute;top:-2px;right:-2px;
  width:16px;height:calc(100% + 4px);
  background:rgba(255,255,255,.55);
  filter:blur(6px);border-radius:4px;
  animation:glowPulse 1.5s ease-in-out infinite;
  pointer-events:none;
}
/* Hide glow when bar is at 0 or 100% */
.progress-fill[style*="width:0%"]::after,
.progress-fill[style*="width: 0%"]::after{display:none;}

/* Results row entrance (applied inline per row) */
.row-anim{animation:rowSlide .3s cubic-bezier(.22,.61,.36,1) both;}

/* Number roll flash on update */
.num-updated{animation:countRoll .35s cubic-bezier(.22,.61,.36,1);}