/* TERM1000NATOR — dark cinematic terminal (mockup) */
:root{
  --bg:#05070a; --bg-elevated:#0a0f15;
  --border:rgba(126,184,212,.16); --border-strong:rgba(126,184,212,.38);
  --text:#c8d4e0; --text-muted:#94a3b4;
  --accent:#7eb8d4; --accent-dim:rgba(126,184,212,.35);
  --glow:0 0 12px rgba(126,184,212,.35);
  --font-mono:ui-monospace,"Cascadia Code","SF Mono",Menlo,Consolas,"DejaVu Sans Mono","Liberation Mono",monospace;
  --font-sans:var(--font-mono);
  --max:44rem; --space:clamp(1rem,4vw,2rem);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:100%;-webkit-text-size-adjust:100%}
body{
  min-height:100dvh;font-family:var(--font-mono);font-size:.95rem;line-height:1.7;color:var(--text);
  background:var(--bg);
  background-image:
    radial-gradient(ellipse 80% 45% at 50% -10%,rgba(60,110,150,.28),transparent),
    radial-gradient(ellipse 60% 40% at 85% 100%,rgba(30,60,90,.30),transparent),
    linear-gradient(rgba(126,184,212,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(126,184,212,.035) 1px,transparent 1px);
  background-size:auto,auto,40px 40px,40px 40px;
  display:flex;flex-direction:column;align-items:center;padding:var(--space);position:relative;overflow-x:hidden;
}
.grain{pointer-events:none;position:fixed;inset:0;z-index:1;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.scan{pointer-events:none;position:fixed;inset:0;z-index:3;
  background:repeating-linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,0) 2px,rgba(0,0,0,.22) 3px);
  mix-blend-mode:multiply}
.scan::after{content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.55) 100%)}
.log,.hero,main,.footer{position:relative;z-index:2;width:100%;max-width:var(--max)}

/* LOG strip */
.log{margin-top:.25rem;border:1px solid var(--border-strong);background:rgba(10,15,21,.85);
  box-shadow:var(--glow),inset 0 0 24px rgba(126,184,212,.05);padding:.7rem .95rem;font-size:.78rem;line-height:1.6}
.log-head{display:flex;align-items:center;gap:.75rem;margin-bottom:.3rem}
.log-tag{color:#05070a;background:var(--accent);padding:0 .5rem;letter-spacing:.2em;font-weight:700;font-size:.7rem}
.log-state{color:var(--text-muted);text-transform:uppercase;letter-spacing:.18em;font-size:.65rem}
.log-line{color:var(--text)}
.log-line::before{content:"> ";color:var(--accent)}
.log-ts{color:var(--accent);margin-right:.5ch}
.cursor{display:inline-block;width:.6ch;height:1.05em;margin-left:.4ch;background:var(--accent);
  vertical-align:-.15em;box-shadow:var(--glow);animation:blink 1.05s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

.hero{padding:clamp(2.5rem,9vh,4.5rem) 0 clamp(2rem,6vh,3rem);text-align:center;border-bottom:1px solid var(--border)}
.eyebrow{font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--accent);opacity:.8;margin-bottom:1.25rem}
.eyebrow::before{content:"[ ";opacity:.6}.eyebrow::after{content:" ]";opacity:.6}
.title{font-size:clamp(1.45rem,7vw,2.9rem);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#eaf2f8;line-height:1.15;
  text-shadow:0 0 18px rgba(126,184,212,.55),0 0 48px rgba(126,184,212,.25);overflow-wrap:anywhere}
.tagline{margin:1.25rem auto 0;font-size:clamp(.85rem,2.5vw,1rem);color:var(--text-muted);max-width:32rem}
.dual{font-size:.85rem;line-height:1.6;color:var(--accent);opacity:.9;margin-top:1.25rem}

main{flex:1;padding:2.25rem 0 2rem;display:flex;flex-direction:column;gap:1.5rem}
.panel{border:1px solid var(--border);background:rgba(10,15,21,.6);padding:1.1rem 1.15rem;position:relative}
.panel::before{content:"";position:absolute;left:-1px;top:-1px;width:10px;height:10px;border-left:2px solid var(--accent);border-top:2px solid var(--accent);opacity:.7}
.panel h2{font-size:.7rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);opacity:.95;margin-bottom:.85rem;text-shadow:var(--glow)}
.panel h2::before{content:"// ";opacity:.55}
.panel p{color:var(--text);font-weight:400}
.panel.note{background:transparent;border-style:dashed}
.panel.note p{color:var(--text-muted);font-size:.88rem;border-left:2px solid var(--border-strong);padding-left:1rem}

.status{font-size:.8rem;margin-top:.25rem}
.status dt{color:var(--accent);text-transform:uppercase;letter-spacing:.12em;font-size:.65rem;margin-top:.85rem}
.status dt:first-child{margin-top:0}
.status dd{margin:.2rem 0 0;color:var(--text);overflow-wrap:anywhere}
a{color:var(--accent);text-decoration:none;border-bottom:1px dotted var(--accent-dim)}
a:hover,a:focus-visible{color:#eaf2f8;border-bottom-color:var(--accent);text-shadow:var(--glow);outline:none}

.links{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.links a{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.35rem 1rem;padding:.85rem 1rem;
  background:var(--bg-elevated);border:1px solid var(--border);border-radius:2px;color:inherit;
  transition:border-color .2s,background .2s,box-shadow .2s}
.links a:hover,.links a:focus-visible{border-color:var(--border-strong);background:#101822;box-shadow:var(--glow);text-shadow:none}
.links a:focus-visible{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--accent-dim)}
.link-label{font-size:.85rem;letter-spacing:.1em;color:#eaf2f8}
.link-label::before{content:"> ";color:var(--accent)}
.link-desc{font-size:.8rem;color:var(--text-muted)}

.footer{padding:1.5rem 0 .5rem;border-top:1px solid var(--border);text-align:center}
.footer p{font-size:.7rem;letter-spacing:.1em;color:var(--text-muted)}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Kindle launch */
.launch{margin:1.75rem auto 0;padding:1.1rem 1rem 1.25rem;max-width:32rem;border:1px solid var(--border-strong);background:rgba(10,15,21,.75);box-shadow:var(--glow)}
.launch-line{font-size:.85rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#eaf2f8}
.launch-sub{margin-top:.4rem;font-size:.8rem;color:var(--text-muted)}
.kindle-btn{display:inline-block;margin-top:1rem;padding:.75rem 1.6rem;background:var(--accent);color:#05070a;border:1px solid var(--accent);
  font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.85rem;box-shadow:var(--glow);transition:background .2s,color .2s}
.kindle-btn::before{content:"> "}
.kindle-btn:hover,.kindle-btn:focus-visible{background:transparent;color:#eaf2f8;border-bottom-color:var(--accent);text-shadow:var(--glow)}

@media (max-width:480px){
  body{font-size:.9rem}
  .panel{padding:1rem}
  .log{font-size:.74rem}
}
@media (prefers-reduced-motion:reduce){.cursor{animation:none}}

.tx{margin:1.1rem 0 .4rem;border:1px solid var(--border);padding:.6rem .85rem;background:rgba(10,15,21,.6)}
.tx-line{font-size:.8rem;letter-spacing:.12em}
.tx-label{color:var(--text-muted)}
.tx-num{color:var(--accent);font-weight:700;font-size:1.25rem;text-shadow:var(--glow);margin-left:.6ch}
.tx-total{color:var(--text-muted)}
.tx-bar{height:4px;background:var(--border);margin:.45rem 0 .35rem;overflow:hidden}
.tx-bar span{display:block;height:100%;background:var(--accent);box-shadow:var(--glow)}
.tx-sub{font-size:.7rem;color:var(--text-muted);letter-spacing:.08em}
.tx-def{font-size:.68rem;color:var(--text-muted);margin-top:.35rem;letter-spacing:.04em}
.log-line a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* v3 additions */
.tx-fill{width:88.2%}
.tx-next{font-size:.7rem;color:var(--accent);letter-spacing:.12em;text-transform:uppercase;margin-top:.25rem}
.book-desc{font-size:.85rem;margin-bottom:.9rem}
.panel .kindle-btn{margin-top:1.1rem}
.index-note{font-size:.75rem;color:var(--text-muted)!important;margin-bottom:.6rem}
.chapters{list-style:none;font-size:.82rem;display:flex;flex-direction:column;gap:.4rem}
.ch-id{color:var(--accent);letter-spacing:.1em;margin-right:.5ch}
.ch-meta{color:var(--text-muted);font-size:.72rem;margin-left:.5ch}
@media (max-width:480px){
  .log{margin:.5rem 0 .25rem;padding:.85rem 1rem}
  .log-line{margin-top:.35rem}
  .links a{display:grid;grid-template-columns:5.5rem 1fr;align-items:baseline;gap:.75rem}
  .link-desc{text-align:right}
}

/* observer extras */
.obs{margin:.2rem 0 .6rem;font-size:.72rem;letter-spacing:.14em;color:var(--text-muted)}
.obs-label{color:var(--accent)}
#obs-clock{font-variant-numeric:tabular-nums}
.redact{background:var(--text);color:transparent;cursor:pointer;padding:0 .2ch;transition:background .3s,color .3s;border-radius:1px}
.redact:hover,.redact:focus-visible,.redact.on{background:transparent;color:var(--accent);outline:none}
.redact-note{color:var(--text-muted);font-size:.85rem}
.hint{opacity:.18;margin-left:.6ch}
.console{position:fixed;inset:0;z-index:50;background:rgba(5,7,10,.92);display:flex;align-items:flex-start;justify-content:center;padding:var(--space)}
.console[hidden]{display:none}
.console-box{width:100%;max-width:var(--max);margin-top:8vh;border:1px solid var(--border-strong);background:var(--bg-elevated);box-shadow:var(--glow);padding:1rem;font-size:.85rem}
.console-out{white-space:pre-wrap;margin:0 0 .5rem;max-height:60vh;overflow:auto;color:var(--text);font-family:var(--font-mono)}
.console-row{display:flex;align-items:center;gap:.6ch}
.console-prompt{color:var(--accent)}
.console-in{flex:1;min-width:0;background:transparent;border:0;color:var(--text);font:inherit;font-size:16px;caret-color:transparent;outline:none}
.glitch{animation:glitch .65s steps(6) 1;text-shadow:4px 0 rgba(255,0,60,.85),-4px 0 rgba(0,220,255,.85)}
@keyframes glitch{0%{transform:translateX(0);opacity:1}15%{transform:translateX(-4px) skewX(8deg);opacity:.4}30%{transform:translateX(3px);opacity:1}45%{transform:translateX(-2px) skewX(-6deg);clip-path:inset(20% 0 30% 0)}60%{transform:translateX(4px);opacity:.6;clip-path:none}80%{transform:translateX(-1px);opacity:1}100%{transform:none}}
@media (prefers-reduced-motion:reduce){.glitch{animation:none;text-shadow:none}.redact{transition:none}.console .cursor{animation:none}}
.sigloss{position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:0;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(0deg,rgba(255,255,255,.06) 0 2px,rgba(0,0,0,.92) 2px 4px)}
.sigloss.on{animation:sigloss 1.1s steps(11) 1}
.sigloss-msg{font-family:inherit;letter-spacing:.3em;color:#9fd8ff;font-size:clamp(14px,3vw,22px);text-shadow:3px 0 rgba(255,0,60,.8),-3px 0 rgba(0,220,255,.8)}
@keyframes sigloss{0%{opacity:0}9%{opacity:1}18%{opacity:.2}27%{opacity:1}55%{opacity:1}64%{opacity:.4}73%{opacity:1}100%{opacity:0}}
body.sig-flicker main{animation:sigshake 1.1s steps(8) 1}
@keyframes sigshake{0%,100%{transform:none;filter:none}20%{transform:translateX(-6px);filter:hue-rotate(90deg) contrast(1.6)}40%{transform:translateX(5px) skewX(3deg)}60%{transform:translateX(-3px);filter:brightness(.4)}80%{transform:translateX(2px)}}
@media (prefers-reduced-motion:reduce){.sigloss{display:none}}
.footer .transmit{margin-top:.4rem}.footer .transmit a{color:var(--text-muted);text-decoration:none;border-bottom:1px dotted var(--border)}.footer .transmit a:hover{color:inherit}
.log-more{margin-top:.4rem}
.log-more>summary{cursor:pointer;color:var(--text-muted);text-transform:uppercase;letter-spacing:.18em;font-size:.65rem;list-style:none}
.log-more>summary::-webkit-details-marker{display:none}
.log-more>summary::before{content:"[+] ";color:var(--accent)}
.log-more[open]>summary::before{content:"[-] "}