/* living terminal — paper terminal in the poolside register, modiqo palette */
.lt-wrap{--lt-ink:#19372F;--lt-dim:rgba(25,55,47,.58);--lt-faint:rgba(25,55,47,.34);
  --lt-accent:#B47155;--lt-ok:#3E8355;--lt-bad:#B0442C;--lt-paper:#FFFCF7;--lt-strip:#F1EDE2;
  max-width:1080px;margin:0 auto;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.lt-strip{background:var(--lt-strip);background-image:radial-gradient(rgba(25,55,47,.05) 1px,transparent 1px);
  background-size:14px 14px;padding:clamp(16px,4vw,44px);border-radius:4px}
.lt-window{background:var(--lt-paper);border:1px solid rgba(25,55,47,.16);border-radius:10px;
  box-shadow:0 1px 2px rgba(25,55,47,.06),0 12px 34px rgba(25,55,47,.10);overflow:hidden}
.lt-titlebar{display:flex;align-items:center;height:36px;padding:0 14px;border-bottom:1px solid rgba(25,55,47,.09)}
.lt-dots{display:flex;gap:7px}
.lt-dots i{width:11px;height:11px;border-radius:50%}
.lt-dots i:nth-child(1){background:#E5564B}.lt-dots i:nth-child(2){background:#E8A03E}.lt-dots i:nth-child(3){background:#57B45C}
.lt-title{flex:1;text-align:center;font-size:12px;letter-spacing:.04em;color:var(--lt-dim)}
.lt-titlebar span.lt-balance{width:47px}
.lt-body{height:min(430px,56vh);overflow-y:auto;padding:16px 20px 58px;font-size:13px;line-height:1.62;color:var(--lt-ink);scrollbar-width:thin}
.lt-line{white-space:pre-wrap;word-break:break-word;min-height:1.62em}
.lt-line.dim{color:var(--lt-dim)}
.lt-line.dim::before{content:'\00b7  ';color:var(--lt-faint)}
.lt-line.say{color:var(--lt-ink);opacity:.85}
.lt-line.gap{min-height:.95em}
.lt-line.ask{color:var(--lt-accent);font-weight:700;margin:9px 0 3px}
.lt-line.ask::before{content:'\203a\00a0\00a0';font-weight:700}
.lt-line.cmd{color:var(--lt-ink);margin-top:5px}
.lt-line.cmd::before{content:'$\00a0\00a0';color:var(--lt-faint)}
.lt-line.cred{color:var(--lt-ink);padding-left:1ch}
.lt-line.cred::before{content:'\2387\00a0\00a0';color:var(--lt-accent)}
.lt-line.out{color:var(--lt-dim);padding-left:1ch}
.lt-line.out::before{content:'└ ';color:var(--lt-faint)}
.lt-line.out.ok{color:var(--lt-ok)}
.lt-line.out.save{color:var(--lt-accent)}
.lt-line.out.bad{color:var(--lt-bad)}
.lt-line.out.uri{color:var(--lt-accent);font-weight:700}
.lt-line.out.tree{color:var(--lt-dim);padding-left:3ch;letter-spacing:.02em}
.lt-line.out.tree::before{content:''}
.lt-line.work{color:var(--lt-faint);padding-left:1ch}
.lt-line.work::before{content:'└ ';color:var(--lt-faint)}
.lt-card{border:1.5px solid var(--lt-ink);border-radius:6px;padding:10px 14px;margin:8px 0 8px 2ch;max-width:46ch}
.lt-card b{display:block;font-size:12px;letter-spacing:.12em;margin-bottom:4px}
.lt-card span{display:block;color:var(--lt-dim)}
.lt-gate{display:flex;align-items:center;gap:14px;margin:10px 0 8px;flex-wrap:wrap}
.lt-gate em{font-style:normal;color:var(--lt-ink);font-weight:700}
.lt-gate em::before{content:'rote · ';color:var(--lt-accent);font-weight:700}
.lt-gate button{font:700 12px/1 ui-monospace,Menlo,monospace;letter-spacing:.08em;color:var(--lt-paper);
  background:var(--lt-accent);border:0;border-radius:5px;padding:9px 14px;cursor:pointer}
.lt-gate button:focus-visible{outline:2px solid var(--lt-ink);outline-offset:2px}
.lt-scene{display:flex;align-items:center;gap:12px;color:var(--lt-faint);margin:14px 0;font-size:12px;letter-spacing:.08em}
.lt-scene::before,.lt-scene::after{content:'';flex:1;border-top:1px solid rgba(25,55,47,.14)}
.lt-cursor{display:inline-block;width:7px;height:15px;background:var(--lt-accent);vertical-align:-2px;
  animation:lt-blink 1.05s steps(1) infinite}
.lt-promptrow{display:flex;align-items:center;gap:8px;border-top:1px solid rgba(25,55,47,.09);padding:10px 20px;font-size:13px}
.lt-promptrow .lt-caret{color:var(--lt-accent);font-weight:700}
.lt-promptrow .lt-typed{color:var(--lt-ink)}
.lt-statusbar{display:flex;justify-content:space-between;gap:12px;border-top:1px solid rgba(25,55,47,.09);
  padding:8px 20px;font-size:11px;letter-spacing:.05em;color:var(--lt-dim)}
.lt-statusbar b{font-weight:600;color:var(--lt-accent)}
.lt-narration{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:start;
  margin:14px 0 0;padding:13px 0 12px;border-top:1px solid rgba(25,55,47,.16);
  border-bottom:1px solid rgba(25,55,47,.10)}
.lt-now,.lt-subcount{padding-top:4px;font:700 10px/1 var(--mono,ui-monospace,monospace);
  letter-spacing:.14em;color:var(--lt-faint)}
.lt-now{color:var(--lt-accent)}
.lt-subs{min-height:2.9em;margin:0;max-width:66ch;text-align:left;
  font:600 15px/1.46 var(--sans,Arial,sans-serif);color:var(--lt-ink);letter-spacing:-.01em;
  opacity:1;transition:opacity .28s ease}
.lt-subs::first-letter{text-transform:none}
.lt-controls{display:flex;align-items:center;gap:14px;justify-content:flex-end;margin-top:9px}
.lt-controls button{font:600 11.5px/1 ui-monospace,Menlo,monospace;letter-spacing:.08em;color:var(--lt-dim);
  background:none;border:0;cursor:pointer;padding:6px 2px}
.lt-controls button:hover{color:var(--lt-ink)}
.lt-controls button:focus-visible{outline:2px solid var(--lt-accent);outline-offset:2px}
.lt-progress{flex:0 0 180px;height:2px;background:rgba(25,55,47,.12);border-radius:1px;overflow:hidden}
.lt-progress i{display:block;height:100%;width:0;background:var(--lt-accent)}
.lt-speed{display:flex;align-items:center;gap:7px;color:var(--lt-dim);
  font:700 9px/1 var(--mono,ui-monospace,monospace);letter-spacing:.11em}
.lt-speed-name{color:var(--lt-ink)}
.lt-speed-end{font-size:8px;color:var(--lt-faint)}
.lt-speed input{width:108px;height:2px;margin:0;accent-color:var(--lt-ink);cursor:pointer}
.lt-speed output{min-width:3.7ch;color:var(--lt-ink);letter-spacing:0}
@keyframes lt-blink{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.lt-cursor{animation:none}}
@media (max-width:640px){.lt-body{font-size:12px;padding:12px 12px 8px}.lt-promptrow,.lt-statusbar{padding-left:12px;padding-right:12px}}

/* Landing hero composition: promise, proof, then one action. The terminal owns
   the vertical space; its scrollback moves inside a fixed paper window so the
   page never jumps while the screenplay advances. */
.landing-hero-static{
  min-height:calc(100dvh - 76px);
  padding:14px clamp(22px,3.8vw,58px) 12px;
  display:flex;
  flex-direction:column;
}
.hero-fold{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  grid-template-columns:minmax(270px,.6fr) minmax(600px,1.4fr);
  gap:clamp(24px,3vw,48px);
  align-items:center;
  padding:clamp(8px,1.4vh,16px) 0;
}
.landing-hero-static .hero-message{display:block;padding:0}
.landing-hero-static .hero-h1{
  max-width:none;
  margin:0;
  font-size:clamp(36px,3.1vw,48px);
  line-height:.96;
  letter-spacing:-.038em;
  text-transform:none;
}
.landing-hero-static .hero-h1 span{display:block;white-space:nowrap}
.landing-hero-static .hero-dek{
  max-width:39ch;
  margin:clamp(17px,2.2vh,25px) 0 0;
  font-size:clamp(14px,1.05vw,17px);
  line-height:1.48;
}
.hero-terminal{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;justify-content:center}
#living-terminal{width:100%}
.hero-terminal .lt-wrap{max-width:none}
.hero-terminal .lt-strip{
  padding:clamp(12px,1.5vw,18px);
  border:1px solid color-mix(in srgb,var(--ink) 15%,transparent);
  border-radius:12px;
  background-color:color-mix(in srgb,var(--surface) 91%,var(--control));
  background-image:
    radial-gradient(color-mix(in srgb,var(--ink) 8%,transparent) .6px,transparent .8px),
    linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0));
  background-size:11px 11px,100% 100%;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -1px 1px rgba(25,55,47,.08),
    8px 9px 0 color-mix(in srgb,var(--ink) 11%,transparent);
}
.hero-terminal .lt-window{
  border:1px solid color-mix(in srgb,var(--ink) 24%,transparent);
  border-radius:7px;
  box-shadow:
    inset 1px 1px 0 rgba(255,255,255,.9),
    inset -1px -1px 0 rgba(25,55,47,.06),
    0 9px 24px rgba(25,55,47,.08);
}
.hero-terminal .lt-titlebar{height:34px}
.hero-terminal .lt-body{
  height:clamp(220px,34dvh,320px);
  padding:13px 18px 44px;
  font-size:12.5px;
  line-height:1.54;
}
.hero-terminal .lt-line{min-height:1.54em}
.hero-terminal .lt-promptrow{padding:8px 18px;font-size:12px}
.hero-terminal .lt-statusbar{padding:6px 18px}
.hero-terminal .lt-subs{
  min-height:2.9em;
  max-width:64ch;
  font-size:16px;
  line-height:1.46;
}
.hero-terminal .lt-narration{margin-top:15px}
.hero-terminal .lt-controls{margin-top:8px}
.hero-terminal-action{
  width:100%;
  margin:clamp(18px,2.4vh,27px) 0 0;
  display:flex;
  justify-content:flex-start;
  align-items:center;
}
.hero-terminal-action .btn{
  min-height:44px;
  max-width:100%;
  white-space:normal;
  text-align:left;
  background:var(--control);
  color:var(--ink);
  border-color:color-mix(in srgb,var(--ink) 28%,transparent);
  box-shadow:6px 6px 0 color-mix(in srgb,var(--ink) 14%,transparent);
}
.hero-terminal-action .btn:hover,.hero-terminal-action .btn:focus-visible{
  background:color-mix(in srgb,var(--control) 82%,#fff);
}
.hero-next-cue{
  flex:0 0 auto;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  min-height:30px;
  padding:4px clamp(12px,1.4vw,22px) 8px 0;
}

@media (min-width:961px){
  /* The opening panel is one composed screen. Its height is budgeted against
     the sticky masthead; scrollback, not the page, absorbs short viewports. */
  .landing-page{padding-top:8px}
  .landing-hero-static{
    min-height:0;
    height:calc(100svh - 61px);
    max-height:calc(100svh - 61px);
    overflow:hidden!important;
  }
  .hero-compatibility{margin-top:7px}
  .hero-compatibility-label,
  .hero-compatibility .harness-brand{min-height:52px}
  .hero-compatibility-label{gap:4px}
  .hero-compatibility .harness-brand{padding:7px 9px;gap:7px}
  .hero-compatibility .harness-mark{width:22px;height:22px}
  .hero-compatibility .harness-mark svg{width:19px;height:19px}
  .hero-compatibility .agent-letter{width:20px;height:20px;font-size:10px}
  .hero-compatibility .harness-brand b{font-size:9.5px}
}

@media (min-width:961px) and (max-height:850px){
  .landing-hero-static{padding-top:8px;padding-bottom:8px}
  .hero-fold{padding:5px 0;gap:clamp(22px,2.6vw,44px)}
  .landing-hero-static .hero-h1{font-size:clamp(34px,2.95vw,44px)}
  .landing-hero-static .hero-dek{margin-top:12px;font-size:13px;line-height:1.38}
  .hero-terminal .lt-strip{padding:7px 9px}
  .hero-terminal .lt-titlebar{height:27px}
  .hero-terminal .lt-title{font-size:10px}
  .hero-terminal .lt-dots{gap:5px}
  .hero-terminal .lt-dots i{width:8px;height:8px}
  .hero-terminal .lt-body{
    height:clamp(140px,28svh,218px);
    padding:9px 13px 28px;
    font-size:10.5px;
    line-height:1.42;
  }
  .hero-terminal .lt-line{min-height:1.42em}
  .hero-terminal .lt-promptrow{padding:5px 13px;font-size:10px}
  .hero-terminal .lt-statusbar{padding:4px 13px;font-size:8.5px}
  .hero-terminal .lt-narration{
    margin-top:5px;
    padding:6px 0 5px;
    gap:9px;
  }
  .hero-terminal .lt-now,.hero-terminal .lt-subcount{padding-top:2px;font-size:8px}
  .hero-terminal .lt-subs{min-height:2.2em;font-size:11px;line-height:1.28}
  .hero-terminal .lt-controls{margin-top:2px;gap:9px}
  .hero-terminal .lt-controls button{padding:3px 1px;font-size:9px}
  .hero-terminal .lt-progress{flex-basis:128px}
  .hero-terminal .lt-speed{gap:5px;font-size:7.5px}
  .hero-terminal .lt-speed input{width:78px}
  .hero-terminal-action{margin-top:12px}
  .hero-terminal-action .btn{min-height:35px;padding:9px 12px;font-size:9px}
}

@media (max-width:960px){
  .landing-hero-static{min-height:auto;padding:17px 16px 26px}
  .hero-fold{display:grid;grid-template-columns:1fr;gap:25px;padding:27px 0 22px}
  .landing-hero-static .hero-h1{max-width:100%;font-size:clamp(40px,11.4vw,54px)}
  .landing-hero-static .hero-h1 span{white-space:normal}
  .landing-hero-static .hero-dek{max-width:61ch;font-size:16px;line-height:1.47}
  .hero-terminal .lt-strip{padding:8px;border-radius:8px;box-shadow:5px 6px 0 color-mix(in srgb,var(--ink) 11%,transparent)}
  .hero-terminal .lt-body{height:clamp(285px,43dvh,390px);font-size:11.5px;padding:12px 11px 34px}
  .hero-terminal .lt-title{font-size:10px}
  .hero-terminal .lt-dots{gap:5px}.hero-terminal .lt-dots i{width:8px;height:8px}
  .hero-terminal .lt-promptrow,.hero-terminal .lt-statusbar{padding-left:11px;padding-right:11px}
  .hero-terminal .lt-statusbar{font-size:9px}
  .hero-terminal .lt-narration{grid-template-columns:auto minmax(0,1fr);gap:9px;margin-top:10px;padding-block:10px}
  .hero-terminal .lt-subcount{display:none}
  .hero-terminal .lt-subs{min-height:3.2em;font-size:13px}
  .hero-terminal .lt-controls{gap:9px;flex-wrap:wrap}
  .hero-terminal .lt-progress{flex:1 1 auto}
  .hero-terminal .lt-speed{order:2;margin-right:auto}
  .hero-terminal .lt-speed-end{display:none}
  .hero-terminal-action{margin-top:21px}
  .hero-terminal-action,.hero-terminal-action .runpop-host,.hero-terminal-action .btn{width:100%}
  .hero-terminal-action .btn{justify-content:center;text-align:center;white-space:normal}
  .hero-next-cue{padding:8px 10px 2px 0}
}