/* ============================================================================
   TARA — S44 skin: TERMINAL PRO — Phase 2 (LOGGED-IN app shell / nav).
   Derived from ../S43-login-previews/04-terminal-improved.html #app shell
   (#side aside: .brand .bt/.bs · nav.ng with .nglabel group labels + .nv rows
   with ▸ .pre + .bdg badges · .sfoot rows) + #mmain atmosphere.
   Palette/tokens mirror Phase-1 skin-terminal.css so gate + shell read as ONE.
   Every selector scoped under html[data-ui="terminal"]; #gate is NOT touched
   (Phase-1 owns it). CSS only — real DOM from app.js renderShell() untouched.
   Keyframes prefixed tsh-. Atmosphere is static gradients (weak GPU).
   ========================================================================== */

/* ---- palette (same night tokens as Phase-1, --tsh- namespace) ------------ */
html[data-ui="terminal"]{
  --tsh-acc:#22c55e;   --tsh-acc-rgb:34,197,94;
  --tsh-amber:#fbbf24; --tsh-amber-rgb:251,191,36;
  --tsh-red:#ef4444;   --tsh-red-rgb:239,68,68;
  --tsh-win:#22c55e;   --tsh-win-rgb:34,197,94;
  --tsh-bg:#010402; --tsh-bg2:#020705; --tsh-panel:#040b06; --tsh-panel2:#08130b;
  --tsh-text:color-mix(in srgb,#22c55e 30%,#eafcef 70%);
  --tsh-dim:color-mix(in srgb,#22c55e 42%,#75857a 58%);
  --tsh-faint:color-mix(in srgb,#22c55e 30%,#414f47 70%);
  --tsh-line:rgba(34,197,94,.32); --tsh-line2:rgba(34,197,94,.14);
  --tsh-glow:0 0 10px rgba(34,197,94,.45);
  --tsh-mono:ui-monospace,Menlo,Monaco,'Cascadia Mono','Courier New',monospace;
}

/* ---- page atmosphere behind the app (gate paints its own opaque bg) ------ */
html[data-ui="terminal"] body{
  background:var(--tsh-bg);
  background-attachment:scroll;   /* cheap: no fixed-attachment repaints */
}
/* replace the sapphire aurora blobs (blur+infinite anim) with a STATIC glow */
html[data-ui="terminal"] body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 75% 55% at 62% 6%,rgba(var(--tsh-acc-rgb),.075),transparent 62%),
    radial-gradient(ellipse 60% 50% at 8% 100%,rgba(var(--tsh-acc-rgb),.045),transparent 70%);
  filter:none;animation:none;transform:none;opacity:1;
}
/* replace the blue grain with static CRT scanlines + vignette */
html[data-ui="terminal"] body::after{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:1;
  background:
    repeating-linear-gradient(0deg,rgba(0,0,0,.16) 0 1px,transparent 1px 3px),
    radial-gradient(ellipse 120% 100% at 50% 45%,transparent 62%,rgba(0,0,0,.42) 100%);
  background-size:auto,auto;
}

html[data-ui="terminal"] #app{font:13.5px/1.6 var(--tsh-mono);color:var(--tsh-text)}
html[data-ui="terminal"] #app ::selection{background:rgba(var(--tsh-acc-rgb),.35);color:var(--tsh-text)}
html[data-ui="terminal"] #app :focus-visible{outline:2px solid var(--tsh-acc);outline-offset:2px}

/* ==========================================================================
   #sidebar — the truth file's #side aside
   ========================================================================== */
html[data-ui="terminal"] #sidebar{
  background:linear-gradient(180deg,var(--tsh-bg2),var(--tsh-bg));
  border-right:1px solid var(--tsh-line2);
  box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  font:13px/1.6 var(--tsh-mono);color:var(--tsh-text);
  padding:0 0 0;
  scrollbar-width:thin;scrollbar-color:rgba(var(--tsh-acc-rgb),.35) transparent;
}

/* brand — .bt/.bs style */
html[data-ui="terminal"] #sidebar .brand{
  padding:18px 16px 12px;border-bottom:1px solid var(--tsh-line2);margin:0;
}
/* 🪙 S170: terminal का logo-डिब्बा (background+border+भीतरी छाया) और svg-रंगाई हटाई —
   owner: "बस जो icon है वही दिखे", किसी skin में उस पर रंग नहीं चढ़ेगा (अब img है, svg नहीं) */
html[data-ui="terminal"] #sidebar .brand .logo{
  width:36px;height:36px;flex:0 0 36px;
}
html[data-ui="terminal"] #sidebar .brand .name{
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  color:var(--tsh-acc);-webkit-text-fill-color:var(--tsh-acc);
  font-size:20px;font-weight:800;letter-spacing:.22em;
  text-shadow:0 0 12px rgba(var(--tsh-acc-rgb),.5);
}
/* blinking block cursor after TARA (truth: .bt > .cur) */
html[data-ui="terminal"] #sidebar .brand .name::after{
  content:"";display:inline-block;width:.5em;height:.8em;margin-left:5px;
  background:var(--tsh-acc);box-shadow:var(--tsh-glow);vertical-align:-1px;
  animation:tsh-blink 1.05s steps(1) infinite;
}
@keyframes tsh-blink{50%{opacity:0}}
html[data-ui="terminal"] #sidebar .brand .sub{
  color:var(--tsh-dim);letter-spacing:.3em;font-size:10px;
}

/* nav — .nv rows: left rail, ▸ prefix, phosphor active */
html[data-ui="terminal"] #sidebar nav{padding:10px 8px 4px;margin-top:0;gap:2px}
html[data-ui="terminal"] #sidebar nav a{
  border-radius:0;border-left:2px solid transparent;
  padding:8px 10px;gap:9px;
  color:var(--tsh-dim);font-weight:400;font-size:13px;letter-spacing:.04em;
  transition:color .15s,background .15s,border-color .15s,transform .2s cubic-bezier(.34,1.4,.5,1);
}
html[data-ui="terminal"] #sidebar nav a:hover{
  color:var(--tsh-text);background:rgba(var(--tsh-acc-rgb),.07);transform:translateX(3px);
}
html[data-ui="terminal"] #sidebar nav a.active{
  color:var(--tsh-acc);
  background:rgba(var(--tsh-acc-rgb),.11);
  border:none;border-left:2px solid var(--tsh-acc);border-radius:0;
  box-shadow:none;text-shadow:0 0 8px rgba(var(--tsh-acc-rgb),.45);
  transform:translateX(2px);
}
/* active end-marker: square phosphor block instead of the sapphire pill */
html[data-ui="terminal"] #sidebar nav a.active::after{
  width:7px;height:7px;border-radius:0;
  background:var(--tsh-acc);box-shadow:0 0 8px rgba(var(--tsh-acc-rgb),.7);
}
/* emoji .ic → ▸ prompt glyph (truth: .pre); .lbl text untouched */
html[data-ui="terminal"] #sidebar nav a .ic{font-size:0;width:12px;opacity:1;line-height:1}
html[data-ui="terminal"] #sidebar nav a .ic::before{
  content:"\25B8";font-size:13px;line-height:1;color:currentColor;opacity:.6;
}
html[data-ui="terminal"] #sidebar nav a.active .ic::before{opacity:1}
/* badges — truth .bdg: hard red square counters */
html[data-ui="terminal"] #sidebar nav a .nbadge{
  background:var(--tsh-red);color:#fff;border-radius:2px;
  font-size:11px;font-weight:700;box-shadow:none;
  font-variant-numeric:tabular-nums;letter-spacing:0;
}

/* group labels (truth .nglabel) — pseudo mini-headings per contract rule 2 */
html[data-ui="terminal"] #sidebar nav a[data-path="/"],
html[data-ui="terminal"] #sidebar nav a[data-path="/signal"],
html[data-ui="terminal"] #sidebar nav a[data-path="/generate"],
html[data-ui="terminal"] #sidebar nav a[data-path="/settings"]{position:relative;margin-top:24px}
html[data-ui="terminal"] #sidebar nav a[data-path="/"]::before,
html[data-ui="terminal"] #sidebar nav a[data-path="/signal"]::before,
html[data-ui="terminal"] #sidebar nav a[data-path="/generate"]::before,
html[data-ui="terminal"] #sidebar nav a[data-path="/settings"]::before{
  position:absolute;top:-19px;left:10px;display:block;pointer-events:none;
  font-size:10px;letter-spacing:.24em;color:var(--tsh-faint);
  white-space:nowrap;text-shadow:none;
}
html[data-ui="terminal"] #sidebar nav a[data-path="/"]::before{content:"\2014 JOURNAL \2014"}
html[data-ui="terminal"] #sidebar nav a[data-path="/signal"]::before{content:"\2014 SIGNALS \2014"}
html[data-ui="terminal"] #sidebar nav a[data-path="/generate"]::before{content:"\2014 ADMIN \2014"}
html[data-ui="terminal"] #sidebar nav a[data-path="/settings"]::before{content:"\2014 SYSTEM \2014"}

/* side-foot — truth .sfoot: top rule, stacked rows */
html[data-ui="terminal"] #sidebar .side-foot{
  border-top:1px solid var(--tsh-line2);padding:12px 12px 16px;gap:8px;
}
html[data-ui="terminal"] #sidebar .theme-row{padding:2px 2px}
html[data-ui="terminal"] #sidebar .theme-row .lbl{
  font-size:10.5px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;
  color:var(--tsh-dim);
}
html[data-ui="terminal"] #sidebar .theme-switch{
  border-radius:2px;border:1px solid var(--tsh-line2);background:var(--tsh-panel);
}
html[data-ui="terminal"] #sidebar .theme-switch:hover{border-color:var(--tsh-line);box-shadow:var(--tsh-glow)}
html[data-ui="terminal"] #sidebar .theme-switch .knob{
  border-radius:2px;background:var(--tsh-acc);
  box-shadow:0 0 10px rgba(var(--tsh-acc-rgb),.55);
}
html[data-ui="terminal"] #sidebar .user-row{
  border-top:1px solid var(--tsh-line2);padding:10px 2px 2px;margin-top:2px;
}
html[data-ui="terminal"] #sidebar .user-row .uname{
  color:var(--tsh-text);font-weight:700;font-size:12.5px;letter-spacing:.04em;
}
/* OWNER / ADMIN chip — truth .obadge: amber outline tag */
html[data-ui="terminal"] #sidebar .user-row .ubadge{
  color:var(--tsh-amber);border:1px solid rgba(var(--tsh-amber-rgb),.6);
  padding:1px 6px;font-size:9.5px;font-weight:400;letter-spacing:.14em;
  align-self:flex-start;
}

/* ==========================================================================
   #navToggle burger + .navdim drawer overlay (positioning logic untouched)
   ========================================================================== */
html[data-ui="terminal"] #navToggle{
  border-radius:2px;border:1px solid var(--tsh-line);
  background:var(--tsh-bg2);backdrop-filter:none;-webkit-backdrop-filter:none;
  color:var(--tsh-acc);box-shadow:none;font-family:var(--tsh-mono);
  transition:left .3s var(--ease),color .18s,border-color .18s,box-shadow .18s;
}
html[data-ui="terminal"] #navToggle:hover{box-shadow:var(--tsh-glow);border-color:var(--tsh-acc)}
html[data-ui="terminal"] #app.nav-open ~ #navToggle{
  background:transparent;border-color:var(--tsh-line2);color:var(--tsh-dim);box-shadow:none;
}
html[data-ui="terminal"] #app.nav-open ~ #navToggle:hover{color:var(--tsh-acc);border-color:var(--tsh-line)}
html[data-ui="terminal"] .navdim{
  background:rgba(0,6,2,.62);backdrop-filter:none;-webkit-backdrop-filter:none;
}

/* ==========================================================================
   #main — base typography + atmosphere (views proper are Phase 3)
   ========================================================================== */
html[data-ui="terminal"] #main{font:13.5px/1.65 var(--tsh-mono);color:var(--tsh-text)}
html[data-ui="terminal"] #main .page-h{
  color:var(--tsh-acc);font-weight:700;font-size:clamp(19px,2.6vw,25px);
  letter-spacing:.04em;text-shadow:0 0 12px rgba(var(--tsh-acc-rgb),.4);
  font-family:inherit;
}
html[data-ui="terminal"] #main .page-h::before{content:"> ";color:var(--tsh-dim);font-weight:400}
html[data-ui="terminal"] #main .page-sub{color:var(--tsh-dim);font-size:12.5px;letter-spacing:.05em}
html[data-ui="terminal"] #main .mono,
html[data-ui="terminal"] #main .num{font-family:var(--tsh-mono);font-variant-numeric:tabular-nums}
html[data-ui="terminal"] #main .muted{color:var(--tsh-faint)}
html[data-ui="terminal"] #main .green{color:var(--tsh-win)}
html[data-ui="terminal"] #main .red{color:var(--tsh-red)}

/* ==========================================================================
   Light base pass on generic surfaces so old views sit inside the new shell.
   Deliberately subtle — Phase 3 does the real per-view work.
   ========================================================================== */
html[data-ui="terminal"] #app .card,
html[data-ui="terminal"] #app .stat{
  border-radius:2px;border:1px solid var(--tsh-line2);
  background:linear-gradient(180deg,rgba(var(--tsh-acc-rgb),.05),rgba(var(--tsh-acc-rgb),.012) 45%,transparent) var(--tsh-panel);
  box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
}
html[data-ui="terminal"] #app .card:hover,
html[data-ui="terminal"] #app .stat:hover{border-color:var(--tsh-line)}
html[data-ui="terminal"] #app .stat::before{display:none}   /* blurred corner blob off (GPU) */
html[data-ui="terminal"] #app .stat:hover{transform:none}
html[data-ui="terminal"] #app .stat .t{color:var(--tsh-dim);letter-spacing:.15em}
html[data-ui="terminal"] #app .stat .v{
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  color:var(--tsh-acc);-webkit-text-fill-color:var(--tsh-acc);
  font-family:var(--tsh-mono);text-shadow:0 0 11px rgba(var(--tsh-acc-rgb),.35);
}
html[data-ui="terminal"] #app .stat.profit .v{color:var(--tsh-win);-webkit-text-fill-color:var(--tsh-win)}
html[data-ui="terminal"] #app .stat.loss .v{color:var(--tsh-red);-webkit-text-fill-color:var(--tsh-red)}
html[data-ui="terminal"] #app .stat .s{color:var(--tsh-faint)}

/* buttons — bracket-key look (sizes/display logic untouched; .hidden still wins) */
html[data-ui="terminal"] #app .btn{
  border-radius:0;border:1px solid var(--tsh-line);
  background:transparent;color:var(--tsh-acc);
  font-family:var(--tsh-mono);font-weight:700;letter-spacing:.07em;
  box-shadow:none;
  transition:background .18s,box-shadow .18s,transform .1s,color .18s;
}
html[data-ui="terminal"] #app .btn:hover{
  background:rgba(var(--tsh-acc-rgb),.13);box-shadow:var(--tsh-glow);
  border-color:var(--tsh-line);transform:none;
}
html[data-ui="terminal"] #app .btn:active{transform:scale(.96)}
html[data-ui="terminal"] #app .btn.primary{
  background:rgba(var(--tsh-acc-rgb),.16);color:var(--tsh-acc);
  border:1px solid var(--tsh-line);
  box-shadow:inset 0 0 18px rgba(var(--tsh-acc-rgb),.12);
}
html[data-ui="terminal"] #app .btn.primary:hover{
  background:rgba(var(--tsh-acc-rgb),.22);filter:none;
  box-shadow:inset 0 0 18px rgba(var(--tsh-acc-rgb),.12),var(--tsh-glow);
}
html[data-ui="terminal"] #app .btn.primary::after{animation:none;content:none}   /* infinite shine off */
html[data-ui="terminal"] #app .btn:disabled{opacity:.45;box-shadow:none;transform:none}

/* thin phosphor scrollbars inside the app */
html[data-ui="terminal"] #app ::-webkit-scrollbar{width:9px;height:9px}
html[data-ui="terminal"] #app ::-webkit-scrollbar-track{background:transparent}
html[data-ui="terminal"] #app ::-webkit-scrollbar-thumb{
  background:rgba(var(--tsh-acc-rgb),.28);border:2px solid var(--tsh-bg);border-radius:0;
}
html[data-ui="terminal"] #app ::-webkit-scrollbar-thumb:hover{background:rgba(var(--tsh-acc-rgb),.45)}

/* ---- reduced motion ------------------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  html[data-ui="terminal"] #sidebar .brand .name::after{animation:none!important}
  html[data-ui="terminal"] #sidebar nav a,
  html[data-ui="terminal"] #sidebar nav a.active{transform:none!important;transition:none!important}
}