/* ============================================
   SCARX SHARED STYLES
   ============================================ */
:root[data-theme="dark"]{
  --bg:#0a0a0a;--bg2:#141414;--bg3:#1a1a1a;--bg4:#222;
  --border:#252525;--border2:#2e2e2e;
  --text:#e8e8e8;--text2:#aaa;--muted:#666;
  --accent:#378ADD;--green:#27ae60;--red:#e74c3c;--gold:#f0b429;
  --nav-bg:#0a0a0a;
}
:root[data-theme="light"]{
  --bg:#f5f5f0;--bg2:#ebebE6;--bg3:#fff;--bg4:#f0f0eb;
  --border:#ddd;--border2:#ccc;
  --text:#111;--text2:#444;--muted:#888;
  --accent:#1a6bbf;--green:#1e8449;--red:#c0392b;--gold:#b8860b;
  --nav-bg:#fff;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;transition:background 0.3s,color 0.3s;}
a{text-decoration:none;color:inherit;}
.x{color:var(--accent);}

/* NAV */
nav{display:flex;align-items:center;justify-content:space-between;padding:0 2rem;height:60px;border-bottom:0.5px solid var(--border);background:var(--nav-bg);position:sticky;top:0;z-index:100;transition:background 0.3s;}
.nav-left{display:flex;align-items:center;gap:16px;}
.logo{font-size:20px;font-weight:800;color:var(--text);letter-spacing:-0.5px;}
.nav-links{display:flex;gap:2rem;align-items:center;}
.nav-links a{font-size:13px;color:var(--muted);transition:color 0.15s;}
.nav-links a:hover,.nav-links a.active{color:var(--text);}
.nav-user{font-size:12px;color:var(--muted);}
.nav-signout{font-size:12px;color:var(--muted);cursor:pointer;background:none;border:none;padding:0;}
.nav-signout:hover{color:var(--text);}

/* THEME TOGGLE */
.theme-toggle{width:52px;height:28px;border-radius:14px;border:0.5px solid var(--border2);background:var(--bg4);cursor:pointer;position:relative;flex-shrink:0;}
.theme-toggle .knob{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:12px;transition:transform 0.3s;}
[data-theme="light"] .theme-toggle .knob{transform:translateX(24px);}
.theme-toggle .icon-d{position:absolute;right:6px;top:50%;transform:translateY(-50%);font-size:11px;opacity:0.5;}
.theme-toggle .icon-l{position:absolute;left:6px;top:50%;transform:translateY(-50%);font-size:11px;opacity:0.5;}

/* BUTTONS */
.btn{display:inline-block;padding:11px 24px;border-radius:9px;font-size:14px;font-weight:600;cursor:pointer;border:none;transition:opacity 0.15s;}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{opacity:0.85;}
.btn-outline{background:transparent;color:var(--text);border:0.5px solid var(--border2);}
.btn-outline:hover{background:var(--bg3);}
.btn-full{width:100%;}

/* CARDS */
.card{background:var(--bg3);border:0.5px solid var(--border);border-radius:12px;padding:1.25rem;margin-bottom:1.25rem;}

/* FORM */
.lbl{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:0.07em;margin-bottom:8px;display:block;}
input,select,textarea{width:100%;padding:10px 12px;border-radius:8px;border:0.5px solid var(--border2);background:var(--bg2);color:var(--text);font-size:14px;font-family:inherit;transition:border-color 0.15s;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);}
select option{background:var(--bg2);}
.divider{height:0.5px;background:var(--border);margin:1.25rem 0;}

/* PILLS */
.pill-row{display:flex;gap:8px;flex-wrap:wrap;}
.pill-btn{border:0.5px solid var(--border);border-radius:6px;padding:7px 15px;font-size:13px;cursor:pointer;background:var(--bg3);color:var(--text);transition:all 0.15s;user-select:none;}
.pill-btn:hover{background:var(--bg4);}
.pill-btn.sel{background:rgba(55,138,221,0.15);border-color:var(--accent);color:var(--accent);font-weight:600;}

/* ANALYSIS RESULTS */
.result-section{display:none;margin-top:1.5rem;}
#annotatedCanvas{width:100%;border-radius:10px;display:block;border:0.5px solid var(--border);}
.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;}
.si{background:var(--bg2);border-radius:8px;padding:10px 14px;}
.si-lbl{font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:4px;}
.si-val{font-size:16px;font-weight:700;}
.c-entry{color:var(--accent);}
.c-sl{color:var(--red);}
.c-tp{color:var(--green);}
.badge{display:inline-block;font-size:11px;font-weight:700;padding:4px 12px;border-radius:20px;margin-right:8px;}
.b-bull{background:#1a3a1a;color:#5db85d;}
.b-bear{background:#3a1a1a;color:#e06060;}
.b-neut{background:#222;color:#888;}
.conf-h{color:#5db85d;}.conf-m{color:var(--gold);}.conf-l{color:var(--red);}
.dots{display:flex;gap:6px;justify-content:center;padding:2rem;}
.dot{width:8px;height:8px;border-radius:50%;background:#444;animation:pu 1.2s ease-in-out infinite;}
.dot:nth-child(2){animation-delay:0.2s;}.dot:nth-child(3){animation-delay:0.4s;}
@keyframes pu{0%,80%,100%{opacity:0.2}40%{opacity:1}}
.error-msg{font-size:13px;padding:12px 16px;background:rgba(231,76,60,0.1);color:var(--red);border-radius:8px;margin-top:1rem;border:0.5px solid rgba(231,76,60,0.2);}
.success-msg{font-size:13px;padding:12px 16px;background:rgba(39,174,96,0.1);color:var(--green);border-radius:8px;margin-top:1rem;border:0.5px solid rgba(39,174,96,0.2);}
.dl-btn{display:block;width:100%;margin-top:10px;padding:10px;border-radius:8px;border:0.5px solid var(--border2);background:var(--bg4);color:var(--text2);font-size:13px;font-weight:500;cursor:pointer;text-align:center;}
.dl-btn:hover{background:var(--bg3);}
.full-text{margin-top:12px;font-size:12px;color:var(--muted);line-height:1.8;white-space:pre-wrap;border-top:0.5px solid var(--border);padding-top:12px;}
.status-txt{font-size:12px;color:var(--muted);margin-top:8px;min-height:18px;}

/* WRAP */
.wrap{max-width:780px;margin:0 auto;padding:2.5rem 1.5rem;}
.wrap-wide{max-width:1100px;margin:0 auto;padding:2.5rem 1.5rem;}

/* BREADCRUMB */
.breadcrumb{display:flex;align-items:center;gap:8px;padding:1rem 2rem;font-size:12px;color:var(--muted);border-bottom:0.5px solid var(--border);}
.bc-step{display:flex;align-items:center;gap:6px;}
.bc-num{width:20px;height:20px;border-radius:50%;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.bc-active .bc-num{background:var(--accent);color:#fff;}
.bc-done .bc-num{background:var(--green);color:#fff;}
.bc-inactive .bc-num{background:var(--border2);color:var(--muted);}
.bc-active .bc-label{color:var(--text);font-weight:600;}
.bc-done .bc-label a{color:var(--muted);text-decoration:underline;}
.bc-arrow{color:var(--border2);}
