header {
  position:sticky; top:0; z-index:200;
  background:rgba(10,10,11,0.96);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border-red);
  padding:11px 22px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-shrink:0;
  box-shadow:0 1px 24px rgba(224,40,64,0.08);
}
.hdr-right { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.search-zone {
  background:linear-gradient(180deg, var(--surface) 0%, var(--bg2) 100%);
  border-bottom:1px solid var(--border-red);
  padding:18px 24px 14px;
  display:flex; flex-direction:column; gap:10px; flex-shrink:0;
}
.scan-launch-btn {
  width:100%; background:var(--surface2); color:var(--ash3);
  border:1.5px solid var(--ash3); border-radius:var(--r);
  padding:11px 24px; font-family:var(--display); font-size:.6rem;
  font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  cursor:not-allowed; min-height:44px;
  display:flex; align-items:center; justify-content:center; gap:9px;
  transition:background .2s, border-color .2s, color .2s, box-shadow .2s, transform .1s;
  position:relative; overflow:hidden; opacity:.45; pointer-events:none;
}
.scan-launch-btn::before {
  content:''; position:absolute; inset:0;
  background:repeating-linear-gradient(110deg,transparent 0%,transparent 40%,rgba(255,255,255,.02) 40%,rgba(255,255,255,.02) 60%,transparent 60%);
}
.scan-launch-btn.ready {
  background:var(--purple); border-color:var(--purple-hi); color:#fff;
  cursor:pointer; pointer-events:all; opacity:1;
  box-shadow:0 0 18px var(--purple-glow);
  animation:scan-pulse 1.8s ease-in-out infinite;
}
.scan-launch-btn.ready::before { display:none; }
.scan-launch-btn.ready:hover { background:var(--purple-hi); box-shadow:0 0 32px var(--purple-glow); animation:none; }
.scan-launch-btn.ready:active { transform:scale(.97); animation:none; }
.scan-launch-btn.running { background:var(--purple); border-color:var(--purple-hi); color:#fff; pointer-events:none; opacity:.7; animation:none; }
@keyframes scan-pulse {
  0%   { transform:scale(1);     box-shadow:0 0 14px var(--purple-glow); }
  40%  { transform:scale(1.025); box-shadow:0 0 28px var(--purple-glow), 0 0 50px rgba(124,58,237,.18); }
  100% { transform:scale(1);     box-shadow:0 0 14px var(--purple-glow); }
}

.workspace { flex:1; display:flex; min-height:0; overflow:hidden; }

/* SOURCE PANEL */
.source-panel { flex:1; min-width:0; display:flex; flex-direction:column; border-right:1px solid var(--border-red); }
.controls-bar {
  background:var(--surface); border-bottom:1px solid var(--border);
  padding:7px 16px; display:flex; align-items:center; gap:8px; flex-shrink:0; flex-wrap:wrap;
}
.view-toggle { display:flex; background:var(--bg); border:1px solid var(--border); border-radius:var(--r); overflow:hidden; flex-shrink:0; }
.vtab {
  background:transparent; border:none; border-right:1px solid var(--border);
  padding:6px 14px; font-family:var(--sans); font-size:.76rem; font-weight:500;
  color:var(--t2); cursor:pointer;
  display:flex; align-items:center; gap:5px;
  transition:background .15s, color .15s; white-space:nowrap;
}
.vtab:last-child { border-right:none; }
.vtab:hover { background:var(--surface2); color:var(--t1); }
.vtab.active { background:var(--red); color:#fff; font-weight:600; }
.vtab-dot { width:5px; height:5px; border-radius:50%; background:currentColor; opacity:.6; }
.vtab.active .vtab-dot { opacity:1; }
.panel-titlebar { background:var(--surface2); border-bottom:1px solid var(--border); padding:8px 14px; display:flex; align-items:center; gap:10px; flex-shrink:0; }
.wdots { display:flex; gap:5px; }
.wd { width:9px; height:9px; border-radius:50%; }
.wd-r { background:#c04050; } .wd-y { background:#c09020; } .wd-g { background:#28a050; }
.panel-addr {
  flex:1; min-width:0; background:var(--bg); border:1px solid var(--border); border-radius:100px;
  padding:3px 12px; font-family:var(--mono); font-size:.7rem; color:var(--t3);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; transition:color .2s;
}
.panel-addr.loaded { color:var(--ash2); }
.panel-time { font-family:var(--mono); font-size:.66rem; color:var(--t3); flex-shrink:0; white-space:nowrap; }

/* CODE VIEW */
.code-view { display:flex; flex:1; overflow:hidden; position:relative; }
.line-gutter {
  width:46px; background:var(--surface); border-right:1px solid var(--border);
  overflow:hidden; padding:16px 10px 16px 0;
  display:flex; flex-direction:column; align-items:flex-end;
  flex-shrink:0; user-select:none;
}
.ln { font-family:var(--mono); font-size:.7rem; line-height:1.65; color:var(--t3); min-height:1.15rem; white-space:nowrap; }
.code-scroll { flex:1; overflow:auto; padding:16px 20px; -webkit-overflow-scrolling:touch; }
pre { font-family:var(--mono); font-size:.84rem; line-height:1.65; color:var(--code); white-space:pre-wrap; word-break:break-all; tab-size:2; }
.t-tag     { color:#f06878; }
.t-attr    { color:#d49858; }
.t-val     { color:#88c866; }
.t-comment { color:#3c3c50; font-style:italic; }
.t-doctype { color:#5868a0; }
.t-script  { color:#d8b848; }
.t-style   { color:#b060d8; }

.scan-bar { display:none; position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:4; }
.scan-bar.on { display:block; }
.scan-bar::after {
  content:''; position:absolute; left:0; right:0; height:50px;
  background:linear-gradient(transparent,rgba(224,40,64,.07),transparent);
  animation:scan 1.5s linear infinite;
}
@keyframes scan { 0%{transform:translateY(-100%)} 100%{transform:translateY(2200px)} }

/* IDLE STATE */
.idle-state { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; padding:60px 24px; text-align:center; }
.idle-gfx { width:68px; height:68px; border-radius:16px; background:var(--surface2); border:1px solid var(--border-red); display:flex; align-items:center; justify-content:center; font-size:2rem; animation:float 5s ease-in-out infinite; flex-shrink:0; }
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
.idle-heading { font-family:var(--display); font-size:.95rem; font-weight:700; color:var(--ash2); letter-spacing:.16em; }
.idle-body { font-size:.84rem; color:var(--t3); line-height:1.7; max-width:360px; }
.idle-body strong { color:var(--ash2); font-weight:600; }
.idle-chips { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }

/* BOOT LINES */
.boot-line { font-family:var(--mono); font-size:.8rem; line-height:2; color:var(--ash2); opacity:0; animation:fi .1s forwards; display:flex; align-items:center; gap:8px; }
.boot-line::before { content:'›'; color:var(--t3); }
.boot-line.hi { color:var(--red); }
.boot-line.ok { color:var(--green); }
@keyframes fi { to { opacity:1; } }

/* ERROR CARD */
.error-card { background:rgba(224,40,64,.07); border:1px solid rgba(224,40,64,.22); border-radius:var(--r); padding:20px 22px; display:flex; flex-direction:column; gap:10px; max-width:540px; }
.error-head { font-weight:600; color:var(--red); font-size:.92rem; display:flex; align-items:center; gap:8px; }
.error-body { font-family:var(--mono); font-size:.78rem; color:var(--t2); line-height:1.7; }
.error-hint { font-size:.78rem; color:var(--t3); line-height:1.7; }
.error-hint strong { color:var(--ash2); font-weight:500; }

/* VULN PANEL */
.vuln-panel { width:320px; min-width:260px; max-width:360px; display:flex; flex-direction:column; flex-shrink:0; background:var(--bg2); }
.vuln-header { background:var(--surface); border-bottom:1px solid var(--border-red); padding:10px 16px; display:flex; align-items:center; justify-content:space-between; flex-shrink:0; gap:10px; }
.vuln-title { font-family:var(--display); font-size:.6rem; font-weight:700; letter-spacing:.2em; color:var(--red); text-transform:uppercase; display:flex; align-items:center; gap:7px; }
.vuln-title-dot { width:6px; height:6px; border-radius:50%; background:var(--red); box-shadow:0 0 7px var(--red); animation:blink .8s infinite; }
.vuln-scroll { flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:10px; }
.vuln-idle { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:40px 20px; text-align:center; flex:1; }
.vuln-idle-icon { font-size:2.5rem; opacity:.15; animation:float 5s ease-in-out infinite; }
.vuln-idle-text { font-size:.78rem; color:var(--t3); line-height:1.7; }
.vuln-idle-text strong { color:var(--ash2); font-weight:600; }
.vuln-scanning { display:flex; flex-direction:column; gap:10px; padding:4px 0; }
.scan-step { font-family:var(--mono); font-size:.72rem; line-height:1.8; color:var(--ash2); opacity:0; animation:fi .12s forwards; display:flex; align-items:center; gap:8px; }
.scan-step::before { content:'[*]'; color:var(--red); font-size:.66rem; }
.scan-step.done { color:var(--green); }
.scan-step.done::before { content:'[✓]'; color:var(--green); }

/* RISK BADGES */
.risk-badge { display:inline-flex; align-items:center; padding:1px 7px; border-radius:3px; font-family:var(--mono); font-size:.58rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; flex-shrink:0; }
.risk-critical { background:rgba(220,30,50,.22); color:#ff4466; border:1px solid rgba(220,30,50,.35); }
.risk-high     { background:rgba(200,60,20,.18); color:#e87040; border:1px solid rgba(200,60,20,.3); }
.risk-medium   { background:rgba(200,140,0,.18);  color:#d4920a; border:1px solid rgba(200,140,0,.3); }
.risk-low      { background:rgba(40,160,80,.14);  color:#3ecf6e; border:1px solid rgba(40,160,80,.25); }
.risk-info     { background:rgba(60,120,200,.14); color:#6699cc; border:1px solid rgba(60,120,200,.25); }

/* FINDING CARDS */
.finding { background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--border); border-radius:6px; overflow:hidden; transition:border-color .2s; }
.finding.critical { border-left-color:#ff4466; }
.finding.high     { border-left-color:#e87040; }
.finding.medium   { border-left-color:#d4920a; }
.finding.low      { border-left-color:#3ecf6e; }
.finding.info     { border-left-color:#6699cc; }
.finding-head { padding:9px 12px; display:flex; align-items:center; gap:8px; cursor:pointer; transition:background .15s; user-select:none; }
.finding-head:hover { background:var(--surface2); }
.finding-name { flex:1; font-size:.78rem; font-weight:600; color:var(--t1); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.finding-toggle { font-size:.68rem; color:var(--t3); flex-shrink:0; transition:transform .2s; }
.finding.open .finding-toggle { transform:rotate(180deg); }
.finding-body { display:none; padding:0 12px 12px; border-top:1px solid var(--border); }
.finding.open .finding-body { display:block; }
.finding-desc { font-size:.76rem; color:var(--ash2); line-height:1.7; margin-top:10px; }
.finding-evidence { margin-top:8px; padding:8px 10px; background:var(--bg); border:1px solid var(--border); border-radius:5px; font-family:var(--mono); font-size:.7rem; color:var(--ash2); line-height:1.6; word-break:break-all; }
.finding-evidence-label { font-size:.6rem; text-transform:uppercase; letter-spacing:.1em; color:var(--t3); margin-bottom:4px; font-weight:600; }
.finding-rec { margin-top:8px; padding:7px 10px; background:rgba(46,168,106,.07); border:1px solid rgba(46,168,106,.15); border-radius:5px; font-size:.72rem; color:var(--green); line-height:1.6; }
.finding-rec-label { font-size:.6rem; text-transform:uppercase; letter-spacing:.1em; color:rgba(46,168,106,.6); margin-bottom:3px; font-weight:600; }

/* VULN SUMMARY */
.vuln-summary { background:var(--surface); border-top:1px solid var(--border-red); padding:10px 14px; display:flex; gap:8px; align-items:center; flex-shrink:0; flex-wrap:wrap; }
.summary-label { font-size:.62rem; color:var(--t3); text-transform:uppercase; letter-spacing:.1em; font-weight:600; }
.summary-counts { display:flex; gap:6px; flex-wrap:wrap; }
.sc-badge { font-family:var(--mono); font-size:.62rem; padding:2px 8px; border-radius:3px; font-weight:700; }
.vuln-disclaimer { padding:8px 14px; font-size:.62rem; color:var(--t3); line-height:1.5; background:var(--bg); border-top:1px solid var(--border); flex-shrink:0; }
.vuln-disclaimer b { color:var(--red-deep); }

/* COPY SHEET */
.sheet-header { padding:14px 20px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--border); flex-shrink:0; }
.footer { height:28px; background:var(--surface); border-top:1px solid var(--border-red); display:flex; align-items:center; padding:0 16px; gap:14px; flex-shrink:0; overflow:hidden; }
.tick-track { display:flex; animation:tick 28s linear infinite; white-space:nowrap; }
@keyframes tick { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.tick-msg { font-family:var(--mono); font-size:.58rem; color:var(--t3); padding:0 24px; }
.tick-msg b { color:var(--red-deep); font-weight:500; }


@media (max-width:1100px) {
  .aidet-panel { width:260px; min-width:220px; }
  .vuln-panel  { width:280px; min-width:240px; }
}
@media (max-width:820px) {
  .workspace { flex-direction:column; overflow-y:auto; overflow-x:hidden; }
  .source-panel { border-right:none; border-bottom:1px solid var(--border-red); min-height:340px; flex-shrink:0; }
  .vuln-panel  { width:100%; max-width:100%; flex-shrink:0; }
  .aidet-panel { width:100%; max-width:100%; border-left:none; border-top:1px solid var(--border); flex-shrink:0; }
}