/* ————————————————————————————————————————————————
   ZHILA · sound lies as relief
   palette sampled from the reference: resin, ember, blood, bone, ash
   one surface: no cards, no radii, no shadows — black pools and hairlines
   ———————————————————————————————————————————————— */

:root{
  --resin:#0c0908;
  --soot:#060404;
  --ember:#e8432a;
  --blood:#a8271a;
  --bone:#efe4d4;
  --ash:#9b8579;
  --ash-2:#6d5b52;
  --line:rgba(232,64,42,.20);
  --line-soft:rgba(232,64,42,.12);
  --hair:rgba(239,228,212,.10);
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,monospace;
  --serif:"Cormorant",Georgia,"Times New Roman",serif;
  --rail-l:240px;
  --rail-r:216px;
  --pad:20px;
}

*,*::before,*::after{box-sizing:border-box;}
html,body{height:100%;}

body{
  margin:0;
  background:var(--resin);
  color:var(--bone);
  font-family:var(--mono);
  font-weight:300;
  font-size:11px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow:hidden;
}

::selection{background:var(--ember);color:#0a0706;}

button,input{font:inherit;color:inherit;}
button{background:none;border:0;padding:0;cursor:pointer;}
h1,h2,h3,p,ol,ul,pre{margin:0;padding:0;}
ol,ul{list-style:none;}
pre{font-family:inherit;}
svg{display:block;}

:focus-visible{outline:1px solid rgba(239,228,212,.75);outline-offset:3px;}

.sr{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* ————— surface ————— */

#terrain{
  position:fixed;inset:0;
  width:100%;height:100%;
  z-index:0;
  opacity:0;
  transform:scale(1.015);
  transition:opacity 1.5s ease, transform 2.6s cubic-bezier(.2,.6,.2,1);
  pointer-events:none;
}
body.is-ready #terrain{opacity:1;transform:scale(1);}

#breath{
  position:fixed;inset:0;
  width:100%;height:100%;
  z-index:1;
  pointer-events:none;
  transition:opacity .8s ease;
}
body[data-view="quarry"] #breath{opacity:0;}
.quarry-dim{
  position:fixed;inset:0;z-index:2;pointer-events:none;
  opacity:0;transition:opacity .8s ease;
  background:
    radial-gradient(56% 38% at 50% 12%, rgba(232,64,42,.08), transparent 72%),
    radial-gradient(120% 100% at 50% 45%, rgba(5,3,3,.5), rgba(3,2,2,.82));
}
body[data-view="quarry"] .quarry-dim{opacity:1;}

.vignette{
  position:fixed;inset:0;z-index:2;pointer-events:none;
  background:
    radial-gradient(130% 95% at 50% 32%, rgba(0,0,0,0) 42%, rgba(0,0,0,.55) 100%),
    linear-gradient(to bottom, rgba(0,0,0,.3) 0%, rgba(0,0,0,0) 14%);
}

.grain{
  position:fixed;inset:0;z-index:3;pointer-events:none;
  opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}

.shell{
  position:relative;z-index:4;
  height:100dvh;
  display:grid;
  grid-template-rows:46px clamp(280px,33vh,366px) minmax(0,1fr) 76px;
}

/* ————— top rail ————— */

.rail--top{
  display:flex;align-items:center;gap:22px;
  padding:0 var(--pad);
  background:linear-gradient(to bottom, rgba(8,5,4,.9), rgba(8,5,4,.3));
  border-bottom:1px solid var(--line-soft);
  backdrop-filter:blur(3px);
}

.brand{
  font-family:var(--serif);
  font-weight:400;
  font-size:17px;
  line-height:1;
  letter-spacing:.3em;
  color:var(--bone);
  text-decoration:none;
  white-space:nowrap;
  position:relative;
  top:-1px;
  margin-right:-2px;
}
.brand-v{
  font-family:var(--mono);
  font-size:7px;
  letter-spacing:.08em;
  color:var(--ash-2);
  margin-left:4px;
  position:relative;top:-7px;
}

.doc{display:flex;align-items:center;gap:14px;min-width:0;}
.doc-name{font-size:10px;letter-spacing:.05em;color:rgba(239,228,212,.78);white-space:nowrap;}
.doc-rule{width:1px;height:11px;background:var(--hair);}
.doc-meta{
  display:flex;align-items:center;gap:8px;
  font-size:8.5px;letter-spacing:.05em;color:rgba(155,133,121,.8);
  white-space:nowrap;
}
.doc-dot{display:inline-block;width:1px;height:9px;background:rgba(239,228,212,.13);}

.views{
  margin-left:auto;
  display:flex;align-items:center;gap:9px;
  padding-right:18px;
  border-right:1px solid rgba(239,228,212,.09);
}
.view-btn{
  font-size:9.5px;letter-spacing:.16em;
  color:rgba(239,228,212,.4);
  padding:4px 0;position:relative;
  transition:color .35s ease;
}
.view-btn:hover{color:var(--bone);}
.view-btn.is-on{color:var(--bone);}
.view-btn.is-on::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:var(--ember);
}
.mode{
  display:flex;align-items:center;gap:11px;
  padding-left:18px;
  border-left:1px solid rgba(239,228,212,.09);
}
.mode-btn{
  font-size:10px;letter-spacing:.17em;
  color:rgba(239,228,212,.4);
  padding:4px 0;
  transition:color .35s ease;
  position:relative;
}
.mode-btn:hover{color:var(--bone);}
.mode-btn.is-on{color:var(--bone);}
.mode-btn.is-on::before{
  content:"";position:absolute;left:50%;top:-2px;
  width:3px;height:3px;background:var(--ember);
  transform:translateX(-50%);
  box-shadow:0 0 8px rgba(232,64,42,.9);
}
.mode-slash{color:rgba(109,91,82,.55);font-size:9px;}

.net{
  display:flex;align-items:center;gap:8px;
  font-size:8.5px;letter-spacing:.1em;
  color:rgba(155,133,121,.8);
  min-width:122px;
  white-space:nowrap;
}
.net-tag{color:rgba(239,228,212,.62);letter-spacing:.14em;}
.net-rule{width:1px;height:8px;background:rgba(239,228,212,.14);}
.led{
  width:3px;height:3px;background:var(--ember);flex:0 0 auto;
  box-shadow:0 0 8px rgba(232,64,42,.9);
}
body:not(.is-ready) .led{opacity:.2}
body.is-playing .led{animation:breathe 2.4s ease-in-out infinite;}
body[data-mode="hand"] .led{background:var(--ash-2);box-shadow:none;animation:none;}

@keyframes breathe{0%,100%{opacity:.3}50%{opacity:1}}

/* ————— sky ————— */

.sky{
  position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:0 24px 26px;
  min-height:0;
}
.sky-inner{
  display:flex;flex-direction:column;align-items:center;
  width:min(580px,72vw);
  position:relative;
  top:-4%;
}

.void-wrap{
  position:relative;
  width:clamp(112px,17vh,168px);
  aspect-ratio:1;
  margin-bottom:clamp(16px,2.6vh,30px);
}
#halo{
  position:absolute;inset:-88px;
  width:calc(100% + 176px);height:calc(100% + 176px);
  pointer-events:none;
}
.void{
  position:absolute;inset:0;
  width:100%;height:100%;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 43%, #000 0%, #030202 55%, #0d0706 88%, #1a0c08 100%);
  border:1px solid rgba(239,228,212,.24);
  color:var(--bone);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  transition:border-color .4s ease, box-shadow .6s ease;
}
.void::after{
  content:"";position:absolute;inset:6px;border-radius:50%;
  border:1px solid rgba(232,64,42,.13);
  pointer-events:none;
}
.void:hover,.void:focus-visible{
  border-color:rgba(232,64,42,.55);
  box-shadow:0 0 60px rgba(232,64,42,.18), inset 0 0 40px rgba(232,64,42,.06);
}
.void-word{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(21px,3vh,30px);
  line-height:1;letter-spacing:.04em;
  color:rgba(239,228,212,.92);
  margin-bottom:7px;
}
.void-label{
  font-size:7.5px;letter-spacing:.26em;color:var(--ash-2);
}
.void-hint{
  position:absolute;inset:0;border-radius:50%;
  display:grid;place-items:center;
  background:radial-gradient(circle,rgba(2,1,1,.94) 0 46%,rgba(2,1,1,.6) 100%);
  font-size:9px;letter-spacing:.24em;color:var(--ember);
  opacity:0;transition:opacity .28s ease;
}
.void:hover .void-hint,.void:focus-visible .void-hint{opacity:1;}
.void.is-pulsed{animation:void-pulse .9s cubic-bezier(.2,.7,.2,1);}
@keyframes void-pulse{
  0%{box-shadow:0 0 0 0 rgba(232,64,42,.5), inset 0 0 30px rgba(232,64,42,.2);border-color:rgba(232,64,42,.9);}
  100%{box-shadow:0 0 0 34px rgba(232,64,42,0), inset 0 0 0 rgba(232,64,42,0);border-color:rgba(239,228,212,.16);}
}

.invocation{
  display:flex;align-items:flex-end;gap:16px;
  width:100%;
  padding-bottom:7px;
  border-bottom:1px solid rgba(232,64,42,.3);
  position:relative;
  transition:border-color .4s ease;
}
.invocation::before{
  content:"";position:absolute;left:-7%;right:-7%;top:-34px;bottom:-30px;
  background:radial-gradient(ellipse at 50% 55%, rgba(6,4,3,.94) 0%, rgba(6,4,3,.72) 46%, rgba(6,4,3,0) 76%);
  z-index:-1;pointer-events:none;
}
.invocation:focus-within{border-color:rgba(232,64,42,.85);}
.invocation::after{
  content:"";position:absolute;left:50%;bottom:-1px;height:1px;width:0;
  background:var(--ember);transition:width .5s cubic-bezier(.2,.7,.2,1);
}
.invocation:focus-within::after{width:100%;left:0;}

#prompt{
  flex:1;min-width:0;
  background:none;border:0;outline:none;
  padding:2px 0 1px;
  font-family:var(--serif);font-weight:300;font-style:italic;
  font-size:clamp(20px,2.8vh,26px);
  line-height:1.25;letter-spacing:.005em;
  color:var(--bone);
  caret-color:var(--ember);
}
#prompt::placeholder{color:rgba(186,166,152,.8);font-style:italic;}
#prompt:disabled{cursor:default;}
.invoke{
  font-size:9.5px;letter-spacing:.2em;
  color:var(--ash);
  padding-bottom:4px;
  position:relative;
  transition:color .3s ease;
  white-space:nowrap;
}
.invoke::after{
  content:"";position:absolute;right:0;bottom:0;height:1px;width:100%;
  background:var(--ember);opacity:.35;transition:opacity .3s ease;
}
.invoke:hover{color:var(--bone);}
.invoke:hover::after{opacity:.9;}

.hint{
  display:flex;align-items:center;gap:9px;
  margin-top:14px;
  font-size:8px;letter-spacing:.11em;
  color:rgba(155,133,121,.85);
  white-space:nowrap;
}
.hint kbd{font:inherit;color:rgba(239,228,212,.72);}
.hint-rule{width:14px;height:1px;background:rgba(239,228,212,.16);}
.hint--hand{display:none;}
body[data-mode="hand"] .hint--choir{display:none;}
body[data-mode="hand"] .hint--hand{display:flex;}
body[data-mode="hand"] .invocation{border-color:rgba(232,64,42,.12);}
body[data-mode="hand"] .hint{opacity:.5;}

/* ————— deck ————— */

.deck{
  display:grid;
  grid-template-columns:var(--rail-l) minmax(0,1fr) var(--rail-r);
  min-height:0;
  position:relative;
}

.rail{padding:16px var(--pad) 14px;min-height:0;position:relative;}

.head{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding-bottom:8px;
  border-bottom:1px solid var(--line);
}
.title{
  font-family:var(--serif);font-weight:300;
  font-size:23px;line-height:1;letter-spacing:.04em;
  color:var(--bone);
}
.sub{
  font-size:8px;line-height:1;letter-spacing:.14em;
  color:rgba(155,133,121,.8);
  white-space:nowrap;
}
.sub--tag{
  color:rgba(232,64,42,.8);
  letter-spacing:.2em;
  font-size:7.5px;
}
.chips{display:flex;align-items:center;gap:9px;font-size:7px;letter-spacing:.13em;line-height:1;}
.chip{color:rgba(155,133,121,.7);position:relative;}
.chip + .chip{padding-left:9px;}
.chip + .chip::before{
  content:"";position:absolute;left:0;top:50%;width:1px;height:6px;
  background:rgba(239,228,212,.16);transform:translateY(-50%);
}
.chip:first-child{color:rgba(232,64,42,.85);}

.agent::after,.side::before{
  content:"";position:absolute;top:0;bottom:0;width:1px;
  background:linear-gradient(to bottom,
    rgba(232,64,42,0) 0%,
    rgba(232,64,42,.22) 16%,
    rgba(232,64,42,.22) 72%,
    rgba(232,64,42,0) 100%);
  pointer-events:none;
}
.agent::after{right:0;}
.side::before{left:0;}

/* ————— choir ————— */

.agent{display:flex;flex-direction:column;min-height:0;}

.state{
  display:flex;align-items:center;gap:7px;
  margin:9px 0 2px;
  font-size:8px;letter-spacing:.13em;
  color:var(--ash);
}
.state-meta{margin-left:auto;color:rgba(109,91,82,.9);letter-spacing:.06em;}
body[data-mode="hand"] .state{color:var(--ash-2);}
.state.is-thinking .led{animation:breathe .9s ease-in-out infinite;}

.log{
  flex:1;min-height:0;
  overflow-y:auto;overscroll-behavior:contain;
  margin:3px -8px 0 0;padding:0 8px 10px 0;
  scrollbar-width:thin;
  scrollbar-color:rgba(232,64,42,.25) transparent;
}
.log::-webkit-scrollbar{width:3px;}
.log::-webkit-scrollbar-thumb{background:rgba(232,64,42,.25);}

.call{
  padding:9px 0 8px;
  border-bottom:1px solid rgba(239,228,212,.055);
  animation:rise .45s cubic-bezier(.2,.7,.2,1) both;
}
@keyframes rise{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

.call--you{display:grid;grid-template-columns:32px minmax(0,1fr);gap:8px;align-items:baseline;}
.call--you p{
  font-family:var(--serif);font-style:italic;font-weight:300;
  font-size:15px;line-height:1.28;
  color:rgba(239,228,212,.86);
  letter-spacing:.005em;
}
.call-t{
  font-size:7px;letter-spacing:.03em;
  color:rgba(109,91,82,.9);
  font-variant-numeric:tabular-nums;
  padding-top:2px;
}
.call-head{display:flex;align-items:baseline;gap:8px;}
.call-head .call-t{flex:0 0 32px;}
.call-name{
  font-size:10px;letter-spacing:.01em;
  color:rgba(239,228,212,.9);
  flex:1;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.call-src{
  font-size:6.5px;letter-spacing:.12em;
  color:rgba(155,133,121,.6);
  text-transform:lowercase;
}
.call-src:only-of-type{color:var(--ash-2);}
.call--mcp .call-src{color:rgba(232,64,42,.8);}
.call-ms{
  font-size:6.5px;letter-spacing:.04em;
  color:rgba(109,91,82,.95);
  font-variant-numeric:tabular-nums;
}
.call-undo{
  font-size:6.5px;letter-spacing:.08em;
  color:rgba(155,133,121,.85);
  border-bottom:1px solid rgba(155,133,121,.35);
  display:none;
}
.call:hover .call-ms{display:none;}
.call:hover .call-undo{display:inline;}
.call-args{
  margin:4px 0 0 40px;
  font-size:8px;line-height:1.6;
  color:rgba(155,133,121,.95);
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  animation:fade .5s ease both;
}
@keyframes fade{from{opacity:0}to{opacity:1}}
.call-args .p{color:rgba(155,133,121,.42);}
.call--say{display:grid;grid-template-columns:32px minmax(0,1fr);gap:8px;align-items:baseline;}
.call--say p{
  font-family:var(--mono);font-size:9.5px;line-height:1.65;
  color:rgba(239,228,212,.88);
  border-left:1px solid rgba(232,64,42,.5);
  padding-left:8px;
}
.call-args--line{
  margin:3px 0 0 40px;
  font-size:8px;line-height:1.55;
  color:rgba(155,133,121,.82);
  white-space:normal;
}
.call-args--line:empty{display:none;}
.call-result{
  margin:3px 0 0 40px;
  font-size:7px;line-height:1.5;
  color:rgba(109,91,82,.95);
  white-space:pre-wrap;overflow-wrap:anywhere;
}
.chip.is-live{color:rgba(232,64,42,1);}
body.agent-offline .net .led{background:var(--ash-2);box-shadow:none;animation:none;}
.call-args .k{color:rgba(155,133,121,.95);}
.call-args .v{color:rgba(239,228,212,.72);}

.shape{
  border-top:1px solid var(--line-soft);
  padding-top:9px;
  margin-top:2px;
  flex:0 0 auto;
}
.shape-head{
  display:flex;justify-content:space-between;
  font-size:7px;letter-spacing:.15em;color:rgba(109,91,82,.95);
  margin-bottom:4px;
}
.slider{
  display:grid;grid-template-columns:58px minmax(0,1fr) 30px;
  align-items:center;gap:8px;
  padding:3px 0;
  cursor:ew-resize;
}
.slider-name{font-size:8.5px;letter-spacing:.02em;color:var(--ash);white-space:nowrap;}
.slider output{
  font-size:7px;text-align:right;color:rgba(155,133,121,.85);
  font-variant-numeric:tabular-nums;
}

input[type="range"]{
  -webkit-appearance:none;appearance:none;
  width:100%;height:14px;
  background:transparent;border:0;margin:0;padding:0;
  cursor:ew-resize;
}
input[type="range"]::-webkit-slider-runnable-track{height:1px;background:rgba(155,133,121,.3);}
input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:2px;height:11px;margin-top:-5px;
  background:var(--bone);border:0;border-radius:0;
}
input[type="range"]::-moz-range-track{height:1px;background:rgba(155,133,121,.3);}
input[type="range"]::-moz-range-thumb{width:2px;height:11px;background:var(--bone);border:0;border-radius:0;}
input[type="range"]:focus-visible{outline:1px solid rgba(239,228,212,.55);outline-offset:4px;}

/* ————— nave ————— */

.corridor{
  display:grid;grid-template-rows:auto minmax(0,1fr);
  min-height:0;min-width:0;
  padding-top:16px;
}
.corridor-head{padding:0 var(--pad) 8px;border-bottom:1px solid var(--line-soft);}
.corridor-sub{display:flex;align-items:center;gap:7px;font-variant-numeric:tabular-nums;}
.sub-rule{width:1px;height:7px;background:rgba(239,228,212,.16);}

.stage{position:relative;min-height:0;overflow:hidden;}
#spires{
  position:absolute;left:0;top:0;width:100%;height:40%;
  pointer-events:none;
  mask-image:linear-gradient(to bottom,#000 0%,#000 60%,rgba(0,0,0,.2) 92%,transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 60%,rgba(0,0,0,.2) 92%,transparent 100%);
}
#nave{
  position:absolute;inset:0;
  width:100%;height:100%;
  overflow:visible;
  cursor:crosshair;
}
.now-label{
  position:absolute;left:var(--pad);bottom:5px;
  font-size:7px;letter-spacing:.22em;color:rgba(155,133,121,.5);
  pointer-events:none;
}

.road-base,.road-floor,.gate-line{pointer-events:none;}
.road-base{fill:url(#roadFade);}
.road-floor{fill:url(#roadFloor);}
.gate-line{stroke:rgba(232,64,42,.4);stroke-width:1;shape-rendering:crispEdges;}
.now-glow{stroke:var(--ember);stroke-width:7;opacity:.16;filter:blur(4px);pointer-events:none;}
.lane-edge{stroke:rgba(232,64,42,.36);stroke-width:.85;fill:none;pointer-events:none;}
.lane-edge--outer{stroke:rgba(232,64,42,.62);}
.lane-glow{stroke:rgba(232,64,42,.55);stroke-width:3;fill:none;opacity:0;filter:blur(3px);}
.lane-hit{fill:transparent;pointer-events:all;transition:fill .35s ease;}
.lane.is-hot .lane-hit{fill:rgba(232,64,42,.035);}
.lane.is-hot .lane-glow{opacity:.55;}
.lane-name{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.07em;
  fill:rgba(155,133,121,.8);
  pointer-events:none;
  text-anchor:middle;
  transition:fill .3s ease;
}
.lane-name.is-hot{fill:var(--bone);}
.bar-line{stroke:rgba(232,64,42,.3);stroke-width:.55;pointer-events:none;}
.bar-line--major{stroke:rgba(232,64,42,.42);stroke-width:.7;}
.now-line{stroke:rgba(232,64,42,.9);stroke-width:1;pointer-events:none;shape-rendering:crispEdges;}

.clip{transition:opacity .4s ease;}
.clip-body{
  fill:rgba(5,2,2,.82);
  stroke:rgba(232,64,42,.62);
  stroke-width:.75;
  transition:fill .3s ease, stroke .3s ease;
}
.clip-strata{fill:none;stroke:rgba(232,64,42,.28);stroke-width:.6;}
.clip-face{fill:none;stroke:rgba(239,228,212,.16);stroke-width:.7;pointer-events:none;}
.clip-loop circle:first-child{fill:none;stroke:rgba(239,228,212,.4);stroke-width:.8;}
.clip-loop-dot{fill:rgba(232,64,42,.85);stroke:none;}
.clip-name{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.03em;
  fill:rgba(239,228,212,.7);
}
.clip-era{
  font-family:var(--mono);font-size:6.5px;letter-spacing:.04em;
  fill:rgba(155,133,121,.6);
  text-anchor:end;
}
.clip:hover .clip-body,.clip.is-hot .clip-body{
  fill:rgba(30,10,7,.92);
  stroke:rgba(239,228,212,.6);
}
.clip:hover .clip-name,.clip.is-hot .clip-name{fill:var(--bone);}
.clip.is-now .clip-body{stroke:rgba(232,64,42,.95);fill:rgba(30,11,8,.55);}
.clip.is-sel .clip-body{stroke:rgba(239,228,212,.95);stroke-width:1.3;fill:rgba(22,11,8,.92);}
.clip.is-sel .clip-name{fill:var(--bone);}
.clip--new .clip-body{animation:ignite 1.8s ease-out both;}
@keyframes ignite{
  0%{stroke:rgba(239,228,212,.95);fill:rgba(232,64,42,.4);}
  100%{stroke:rgba(232,64,42,.42);fill:rgba(7,4,4,.84);}
}
.clip--new .clip-name{animation:fade-name 1.8s ease-out both;}
@keyframes fade-name{0%{fill:var(--bone)}100%{fill:rgba(239,228,212,.7)}}

.playhead-line{stroke:var(--ember);stroke-width:1.4;shape-rendering:crispEdges;filter:drop-shadow(0 0 6px rgba(232,64,42,.7));}
.playhead-glow{
  stroke:var(--ember);
  stroke-width:calc(9px + var(--lv,0) * 15px);
  opacity:calc(.14 + var(--lv,0) * .16);
  filter:blur(6px);
}
.playhead-mark{fill:var(--ember);filter:drop-shadow(0 0 6px rgba(232,64,42,.9));}
.ruler-tick{stroke:rgba(155,133,121,.32);stroke-width:.75;}
.ruler-text{
  font-family:var(--mono);font-size:7px;
  fill:rgba(155,133,121,.6);
  letter-spacing:.04em;
}

/* ————— crystal + cilia ————— */

.side{
  display:grid;
  grid-template-rows:minmax(0,1.06fr) minmax(0,.94fr);
  min-height:0;
  position:relative;
}
.side .rail{padding-left:18px;padding-right:16px;}

.crystal{display:flex;flex-direction:column;min-height:0;}
.crystal-meta{
  display:flex;justify-content:space-between;gap:8px;
  padding:7px 0 5px;
  font-size:7px;letter-spacing:.06em;color:rgba(155,133,121,.7);
}
.lattice{flex:1;min-height:74px;position:relative;}
.lattice svg{width:100%;height:100%;}
.lat-grid{stroke:rgba(239,228,212,.13);stroke-width:.6;}
.lat-grid--bar{stroke:rgba(232,64,42,.28);}
.lat-key{font-family:var(--mono);font-size:6.5px;fill:rgba(155,133,121,.7);}
.lat-note{
  fill:rgba(10,6,5,.92);
  stroke:rgba(239,228,212,.95);
  stroke-width:.9;
}
.lat-note--lone{stroke:rgba(232,64,42,.9);fill:rgba(46,13,9,.5);}
.lat-playhead{stroke:rgba(232,64,42,.6);stroke-width:.75;}

.cilia{border-top:1px solid var(--line-soft);display:flex;flex-direction:column;min-height:0;}

.faders{
  flex:1;min-height:0;
  display:flex;align-items:stretch;gap:9px;
  padding:12px 2px 4px;
}
.ch{
  flex:1;min-width:0;
  display:flex;flex-direction:column;align-items:center;gap:5px;
  cursor:ns-resize;
  outline-offset:2px;
}
.ch-db{
  font-size:7px;letter-spacing:.01em;color:rgba(155,133,121,.7);
  height:9px;font-variant-numeric:tabular-nums;
}
.ch-track{flex:1;width:100%;min-height:46px;position:relative;display:flex;justify-content:center;}
.ch-track::before{
  content:"";position:absolute;top:0;bottom:0;width:1px;
  background:linear-gradient(to bottom,rgba(155,133,121,.16),rgba(155,133,121,.04));
}
.ch-fill{
  position:absolute;bottom:0;width:1px;
  background:linear-gradient(to top,rgba(239,228,212,.95),rgba(239,228,212,.32));
  pointer-events:none;
}
.ch-bead{
  position:absolute;width:3px;height:9px;
  background:var(--bone);
  box-shadow:0 0 9px rgba(239,228,212,.3);
  pointer-events:none;
  transition:background .3s ease;
}
body.is-playing .ch-bead{background:var(--ember);box-shadow:0 0 10px rgba(232,64,42,.65);}
.ch-name{
  font-size:7.5px;letter-spacing:.02em;color:rgba(155,133,121,.78);
  height:10px;white-space:nowrap;transition:color .3s ease;
  max-width:100%;overflow:hidden;text-overflow:ellipsis;
}
.ch:hover .ch-name{color:var(--bone);}
.ch.is-hot .ch-fill{background:linear-gradient(to top,rgba(239,228,212,1),rgba(239,228,212,.4));}
.ch.is-hot .ch-bead{background:var(--bone);}

/* ————— transport ————— */

.rail--transport{
  display:flex;align-items:center;gap:clamp(12px,1.8vw,28px);
  padding:0 var(--pad);
  border-top:1px solid rgba(232,64,42,.22);
  background:linear-gradient(to top, rgba(5,3,3,.95), rgba(5,3,3,.4));
  backdrop-filter:blur(3px);
  min-width:0;
}
.tp{display:flex;align-items:center;gap:9px;min-width:0;}
.tp--go{gap:4px;}

.play{
  width:38px;height:38px;flex:0 0 auto;
  border:1px solid rgba(239,228,212,.22);
  border-radius:50%;
  display:grid;place-items:center;
  color:var(--bone);
  transition:border-color .35s ease,color .35s ease,background .35s ease;
}
.play svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1;stroke-linejoin:round;stroke-linecap:round;}
.play:hover{border-color:rgba(239,228,212,.6);}
.is-playing .play{border-color:rgba(232,64,42,.9);color:var(--ember);background:rgba(232,64,42,.06);}
.i-pause{display:none;}
.is-playing .i-play{display:none;}
.is-playing .i-pause{display:block;}

.icon{
  width:30px;height:30px;display:grid;place-items:center;
  color:rgba(155,133,121,.75);
  transition:color .3s ease;
}
.icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1;}
.icon:hover{color:var(--bone);}
.icon--rec svg circle{fill:transparent;transition:fill .3s ease,stroke .3s ease;}
.icon--rec:hover{color:var(--ember);}
.icon--rec[aria-pressed="true"]{color:var(--ember);}
.icon--rec[aria-pressed="true"] svg circle{fill:var(--ember);stroke:var(--ember);}

.tp--clock{gap:12px;}
.tp-label{font-size:7px;letter-spacing:.16em;color:rgba(109,91,82,.95);white-space:nowrap;}
.tp-bars{font-size:11px;color:var(--ash);font-variant-numeric:tabular-nums;min-width:32px;}
.tp-time{
  font-family:var(--mono);font-weight:200;
  font-size:22px;line-height:1;letter-spacing:.01em;
  color:var(--bone);
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.tp-time .ms{color:rgba(155,133,121,.7);}

.tp--tempo{gap:9px;padding-left:2px;}
.tempo-stack{display:flex;flex-direction:column;align-items:flex-start;gap:2px;}
.tp-num{
  font-size:12px;letter-spacing:.02em;color:var(--bone);
  font-variant-numeric:tabular-nums;
  border-bottom:1px solid rgba(232,64,42,.3);
  padding:0 1px 1px;
  cursor:ns-resize;
}
.tp-num:hover{border-color:rgba(232,64,42,.8);}
.tp-sub{font-size:7px;letter-spacing:.07em;color:rgba(155,133,121,.7);display:flex;align-items:center;gap:6px;white-space:nowrap;}
.tp-rule{width:7px;height:1px;background:rgba(239,228,212,.16);}

.tp--knobs{gap:12px;padding-left:4px;}
.knob{width:44px;display:grid;justify-items:center;gap:3px;cursor:ns-resize;}
.knob svg{width:32px;height:32px;overflow:visible;}
.k-track{fill:none;stroke:rgba(155,133,121,.22);stroke-width:.9;}
.k-arc{fill:none;stroke:var(--ember);stroke-width:1;opacity:.9;}
.k-tick{stroke:var(--bone);stroke-width:1.1;stroke-linecap:round;}
.knob-name{font-size:6.5px;letter-spacing:.05em;color:rgba(155,133,121,.7);white-space:nowrap;}
.knob:hover .knob-name{color:var(--bone);}

.tp--in{gap:7px;padding-left:2px;}
.srcs{display:flex;align-items:center;gap:9px;}
.src{
  font-size:7.5px;letter-spacing:.05em;
  color:rgba(155,133,121,.5);
  padding:3px 0;
  position:relative;
  transition:color .3s ease;
}
.src:hover{color:var(--bone);}
.src.is-on{color:rgba(239,228,212,.9);}
.src.is-on::before{
  content:"";position:absolute;left:50%;top:-2px;width:3px;height:3px;
  background:var(--ember);transform:translateX(-50%);
  box-shadow:0 0 7px rgba(232,64,42,.9);
}
.src.is-denied{color:rgba(232,64,42,.7);}

.tp--scope{flex:1 1 160px;min-width:110px;max-width:360px;gap:9px;align-items:center;}
#scope{width:100%;height:26px;display:block;opacity:.95;}
.tp--master{flex:0 1 210px;flex-direction:column;align-items:stretch;gap:5px;min-width:120px;max-width:210px;}
.master-top{display:flex;align-items:baseline;gap:7px;}
.tp-db{font-size:7.5px;color:rgba(155,133,121,.85);margin-left:auto;font-variant-numeric:tabular-nums;}
.snd{
  font-size:7px;letter-spacing:.1em;color:rgba(155,133,121,.5);
  border-bottom:1px solid transparent;padding-bottom:1px;margin-left:6px;
}
.snd[aria-pressed="true"]{color:rgba(239,228,212,.8);border-color:rgba(232,64,42,.4);}
.snd:hover{color:var(--bone);}
.meter{position:relative;height:2px;background:rgba(155,133,121,.16);overflow:hidden;}
.meter-fill{
  position:absolute;left:0;top:0;bottom:0;width:100%;
  background:linear-gradient(to right,rgba(168,39,26,.9),var(--ember));
  transform:scaleX(0);transform-origin:left center;
}
.meter-peak{
  position:absolute;top:-2px;bottom:-2px;width:1px;
  background:rgba(239,228,212,.85);
  left:0;
}

.tp--end{margin-left:auto;gap:16px;}
.ghost{
  font-size:8px;letter-spacing:.13em;
  color:rgba(155,133,121,.85);
  padding:2px 0;
  border-bottom:1px solid rgba(155,133,121,.3);
  transition:color .3s ease,border-color .3s ease;
}
.ghost:hover{color:var(--bone);border-color:rgba(239,228,212,.6);}
.ghost--ember{color:var(--ember);border-color:rgba(232,64,42,.45);}
.ghost--ember:hover{color:var(--bone);border-color:var(--bone);}

/* ————— responsive ————— */

@media (max-width:1340px){
  :root{--rail-l:222px;--rail-r:204px;--pad:17px;}
  .tp--knobs{display:none;}
  .tp--master{max-width:190px;}
  .doc-meta{display:none;}
}

@media (max-width:1160px){
  :root{--rail-l:208px;--rail-r:192px;}
  .tp--in{display:none;}
  .mode{padding-left:14px;}
  .tp--master{max-width:190px;}
}

@media (max-width:980px){
  .sky{min-height:280px;}
  .tp--end{display:none;}
  .tp--clock{gap:9px;}
  .tp-time{font-size:20px;}
}

@media (max-width:860px){
  html,body{height:auto;min-height:100%;overflow-x:hidden;}
  body{overflow-y:auto;}
  .shell{height:auto;min-height:100dvh;grid-template-rows:46px auto auto auto auto;}
  .sky{padding:26px 20px 22px;min-height:0;}
  .sky-inner{top:0;width:min(520px,88vw);}
  .void-wrap{margin-bottom:20px;}
  .deck{grid-template-columns:minmax(0,1fr);grid-auto-rows:auto;}
  .agent{border-bottom:1px solid var(--line-soft);}
  .agent::after{display:none;}
  .agent .log{max-height:220px;}
  .corridor{min-height:420px;border-bottom:1px solid var(--line-soft);}
  .side{grid-template-columns:1fr 1fr;grid-template-rows:minmax(210px,auto);}
  .side::before{display:none;}
  .crystal{border-right:1px solid var(--line-soft);}
  .cilia{border-top:0;}
  .faders{padding-left:12px;padding-right:12px;}
  .shell{padding-bottom:66px;}
  .rail--transport{
    position:fixed;left:0;right:0;bottom:0;z-index:6;
    height:66px;
    border-top:1px solid rgba(232,64,42,.28);
    background:rgba(5,3,3,.94);
  }
  .tp--master{max-width:none;flex:1;}
}

@media (max-width:760px){
  .tp--scope{display:none;}
  .tp--master{min-width:0;flex:1;}
}

@media (max-width:600px){
  :root{--pad:14px;}
  .rail--top{gap:12px;}
  .doc{display:none;}
  .brand{font-size:16px;}
  .mode{margin-left:auto;padding-left:0;border-left:0;}
  .net{display:none;}
  .sky{padding-top:16px;}
  .void-wrap{width:104px;}
  #halo{inset:-64px;width:calc(100% + 128px);height:calc(100% + 128px);}
  #prompt{font-size:19px;}
  .hint{display:none;}
  .corridor{min-height:340px;}
  .corridor-sub .sub{font-size:7px;}
  .side{grid-template-columns:1fr;grid-template-rows:minmax(190px,auto) minmax(210px,auto);}
  .crystal{border-right:0;border-bottom:1px solid var(--line-soft);}
  .cilia{border-top:0;}
  .shell{padding-bottom:58px;}
  .rail--transport{gap:10px;height:58px;}
  .play{width:32px;height:32px;}
  .play svg{width:16px;height:16px;}
  .icon{width:24px;height:24px;}
  .tp--clock{gap:8px;}
  .tp-bars{display:none;}
  .tp-time{font-size:17px;}
  .tp--tempo{display:none;}
  .tp--master{min-width:0;}
  .snd{display:none;}
  .master-top{justify-content:space-between;}
  .tp-db{font-size:7px;}
  .now-label{display:none;}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  #terrain{transform:none;}
}

/* ————————————————————————————————————————————————
   QUARRY · below the nave
   ———————————————————————————————————————————————— */

body[data-view="quarry"] .sky,
body[data-view="quarry"] .deck{display:none;}
.quarry-tray,.quarry-deck{display:none;}
body[data-view="quarry"] .quarry-tray{display:grid;}
body[data-view="quarry"] .quarry-deck{display:grid;}

.quarry-tray{
  grid-template-rows:auto minmax(0,1fr);
  min-height:0;min-width:0;
  position:relative;
  animation:room-in .7s cubic-bezier(.2,.7,.2,1) both;
}
.quarry-deck{
  grid-template-columns:var(--rail-l) minmax(0,1fr) var(--rail-r);
  grid-template-rows:minmax(0,1fr) 58px;
  min-height:0;min-width:0;
  animation:room-in .8s cubic-bezier(.2,.7,.2,1) both;
}
@keyframes room-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.tray-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:20px;
  padding:16px 20px 8px;
  border-bottom:1px solid var(--line-soft);
}
.tray-id{display:flex;align-items:baseline;gap:14px;min-width:0;}
.tray-meta{
  display:flex;align-items:center;gap:12px;
  font-size:8px;letter-spacing:.05em;color:var(--ash);
  white-space:nowrap;
}
.tray-num{font-variant-numeric:tabular-nums;color:rgba(239,228,212,.72);}
.ghost--small{font-size:7.5px;letter-spacing:.14em;}

.seal{display:inline-flex;align-items:center;gap:6px;font-size:7.5px;letter-spacing:.11em;color:var(--ash);}
.seal i{
  width:8px;height:8px;flex:0 0 auto;border-radius:50%;
  border:1px solid rgba(232,64,42,.75);position:relative;
}
.seal i::after{
  content:"";position:absolute;inset:2px;border-radius:50%;
  background:rgba(232,64,42,.85);
}
.seal--found i::after{border-radius:0;inset:1px;background:none;border:1px solid rgba(232,64,42,.85);}
.seal--loan i::after{inset:3px 1px;border-radius:0;background:rgba(232,64,42,.85);transform:rotate(45deg);}
.seal--unknown i{border-style:dashed;border-color:rgba(155,133,121,.6);}
.seal--unknown i::after{inset:3px;background:rgba(155,133,121,.5);}
.seal--gift i::after{inset:2px;background:none;border:1px solid rgba(239,228,212,.8);}

.tray-stage{
  position:relative;min-height:0;
  background:radial-gradient(70% 100% at 50% 45%, rgba(4,2,2,.55), rgba(4,2,2,.05) 78%);
}
#tray{position:absolute;inset:0;width:100%;height:100%;}
#tray-overlay{position:absolute;inset:0;width:100%;height:100%;cursor:ew-resize;}
.tray-hint{
  position:absolute;right:20px;bottom:8px;
  font-size:7px;letter-spacing:.16em;color:rgba(155,133,121,.4);
  pointer-events:none;
}
.tray-core-title{
  font-family:var(--mono);font-size:7px;letter-spacing:.14em;
  fill:rgba(155,133,121,.6);
}
.tray-tick{stroke:rgba(155,133,121,.3);stroke-width:.7;}
.tray-tick--major{stroke:rgba(155,133,121,.5);}
.tray-tick-text{font-family:var(--mono);font-size:6.5px;fill:rgba(155,133,121,.55);}
.tray-cut{stroke:rgba(232,64,42,.55);stroke-width:.8;stroke-dasharray:1 3;}
.tray-cut-text{font-family:var(--mono);font-size:6.5px;fill:rgba(232,64,42,.8);letter-spacing:.04em;}
.tray-lens{stroke:var(--ember);stroke-width:1.25;shape-rendering:crispEdges;filter:drop-shadow(0 0 4px rgba(232,64,42,.6));}
.tray-lens-handle{fill:var(--ember);}
.tray-lens-text{font-family:var(--mono);font-size:7px;fill:rgba(239,228,212,.85);}

/* store */
.store{display:flex;flex-direction:column;min-height:0;position:relative;}
.store::after{
  content:"";position:absolute;top:0;bottom:0;right:0;width:1px;
  background:linear-gradient(to bottom,rgba(232,64,42,0),rgba(232,64,42,.2) 16%,rgba(232,64,42,.2) 72%,rgba(232,64,42,0));
  pointer-events:none;
}
.store-list{flex:1;min-height:0;overflow-y:auto;padding:8px 0 10px;scrollbar-width:thin;scrollbar-color:rgba(232,64,42,.25) transparent;}
.store-list::-webkit-scrollbar{width:3px;}
.store-list::-webkit-scrollbar-thumb{background:rgba(232,64,42,.25);}
.core-item{
  display:grid;grid-template-columns:48px minmax(0,1fr);gap:10px;align-items:center;
  width:100%;padding:7px 6px 7px 8px;text-align:left;
  border-left:1px solid transparent;position:relative;
  transition:background .3s ease,border-color .3s ease;
}
.core-item + .core-item{border-top:1px solid rgba(239,228,212,.055);}
.core-item:hover{background:rgba(232,64,42,.035);}
.core-item.is-on{border-left-color:var(--ember);background:rgba(232,64,42,.05);}
.core-thumb{display:block;width:48px;height:58px;}
.core-name{display:block;font-size:9px;line-height:1.45;color:rgba(239,228,212,.78);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.core-item.is-on .core-name{color:var(--bone);}
.core-meta{display:flex;align-items:center;gap:6px;margin-top:3px;font-size:6.8px;letter-spacing:.04em;color:rgba(155,133,121,.72);white-space:nowrap;overflow:hidden;}
.core-meta .seal{font-size:6.8px;gap:4px;}
.core-meta .seal i{width:6px;height:6px;}

.choir-call{
  display:flex;align-items:flex-end;gap:8px;
  border-top:1px solid var(--line-soft);
  padding-top:9px;
}
#choir-input{
  flex:1;min-width:0;background:none;border:0;outline:none;
  border-bottom:1px solid rgba(232,64,42,.3);
  padding:2px 0 4px;
  font-family:var(--mono);font-size:9px;font-weight:300;letter-spacing:.01em;
  color:var(--bone);
  transition:border-color .3s ease;
}
#choir-input::placeholder{color:rgba(155,133,121,.62);}
#choir-input:focus{border-color:rgba(232,64,42,.8);}
#choir-input:disabled{color:rgba(239,228,212,.35);}
.choir-call button{
  font-size:7.5px;letter-spacing:.14em;color:var(--ash);
  border-bottom:1px solid rgba(232,64,42,.4);padding-bottom:3px;
  transition:color .3s ease;
}
.choir-call button:hover{color:var(--bone);}
.choir-call.is-out button{color:rgba(232,64,42,.9);border-color:transparent;}
.extract-btn{align-self:flex-start;margin-top:9px;}

/* the face */
.faces{display:flex;flex-direction:column;min-height:0;min-width:0;padding-top:16px;}
.faces-head{padding:0 20px 8px;border-bottom:1px solid var(--line-soft);}
.face-wall{flex:1;min-height:0;position:relative;padding:12px 20px 0;}
.face-wall svg{width:100%;height:100%;display:block;overflow:visible;}
.face-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 20px 10px;}
.face-status{font-size:7.5px;letter-spacing:.05em;color:rgba(155,133,121,.85);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.place-group{display:flex;align-items:center;gap:14px;flex:0 0 auto;}
#place:disabled,#place-ring:disabled{color:rgba(109,91,82,.5);border-color:transparent;cursor:default;}

.stone{cursor:pointer;}
.stone-body{
  fill:rgba(5,3,2,.9);
  stroke:rgba(232,64,42,.36);
  stroke-width:.9;
  transition:fill .25s ease,stroke .25s ease;
}
.stone-body--a{fill:url(#stoneGradA);}
.stone-body--b{fill:url(#stoneGradB);}
.stone-body--c{fill:url(#stoneGradC);}
.stone-body--d{fill:url(#stoneGradD);}
.stone-lip{fill:none;stroke:rgba(239,228,212,.38);stroke-width:.9;stroke-linecap:round;}
.stone-foot-lip{fill:none;stroke:rgba(0,0,0,.55);stroke-width:1;}
.stone-face--inner{stroke:rgba(239,228,212,.07);}
.stone:hover .stone-body{fill:rgba(34,11,7,.94);stroke:rgba(239,228,212,.55);}
.stone.is-sel .stone-body{stroke:rgba(239,228,212,.8);fill:rgba(30,10,7,.92);}
.stone.is-struck .stone-body{fill:rgba(120,30,18,.5);stroke:var(--bone);}
.stone-face{fill:none;stroke:rgba(239,228,212,.17);stroke-width:.7;transition:stroke .25s ease;}
.stone-grain{fill:none;stroke:rgba(232,64,42,.42);stroke-width:.8;}
.stone-grain--faint{stroke:rgba(239,228,212,.14);stroke-width:.6;}
.stone-crack{fill:none;stroke:rgba(239,228,212,.18);stroke-width:.65;}
.stone-pit{fill:rgba(0,0,0,.55);stroke:rgba(232,64,42,.24);stroke-width:.5;}
.stone-strata{fill:none;stroke:rgba(239,228,212,.13);stroke-width:.6;}
.stone-num{font-family:var(--mono);font-size:7px;fill:rgba(155,133,121,.7);letter-spacing:.06em;}
.stone-seal{fill:none;stroke:rgba(155,133,121,.65);stroke-width:.7;}
.stone-seal-dot{fill:rgba(232,64,42,.8);}
.stone:hover .stone-num{fill:rgba(239,228,212,.8);}
.stone-flash{
  fill:none;stroke:rgba(232,64,42,.8);opacity:0;
  transform-box:fill-box;transform-origin:center;
}
.stone.is-struck .stone-flash{animation:chip .5s cubic-bezier(.2,.7,.2,1);}
@keyframes chip{
  0%{opacity:.8;transform:scale(.2);}
  100%{opacity:0;transform:scale(1.4);}
}

/* weather */
.weather{display:flex;flex-direction:column;min-height:0;position:relative;}
.weather::before{
  content:"";position:absolute;top:0;bottom:0;left:0;width:1px;
  background:linear-gradient(to bottom,rgba(232,64,42,0),rgba(232,64,42,.2) 16%,rgba(232,64,42,.2) 72%,rgba(232,64,42,0));
  pointer-events:none;
}
.weather-list{padding:9px 0 2px;}
.climate{font-size:7px;letter-spacing:.07em;color:rgba(109,91,82,.95);padding:3px 0 12px;}
.ring-block{
  border-top:1px solid var(--line-soft);
  padding-top:10px;
  display:flex;flex-direction:column;gap:7px;
}
.ring-head{display:flex;align-items:baseline;justify-content:space-between;}
.ring-head strong{
  font-family:var(--serif);font-weight:300;
  font-size:24px;line-height:1;color:rgba(239,228,212,.88);
  font-variant-numeric:lining-nums;
}
.ring-visual{height:74px;position:relative;}
.ring-visual svg{width:100%;height:100%;display:block;}
.ring-arc{fill:none;stroke:rgba(232,64,42,.55);stroke-width:.8;}
.ghost-toggle{
  display:flex;align-items:center;justify-content:space-between;
  border-top:1px solid var(--line-soft);
  margin-top:auto;padding-top:10px;
}
.toggle{
  font-size:8px;letter-spacing:.12em;color:var(--bone);
  border-bottom:1px solid rgba(232,64,42,.45);padding-bottom:1px;
}
.toggle[aria-pressed="false"]{color:rgba(109,91,82,.9);border-color:transparent;}

/* ledger */
.ledger{
  grid-column:1 / -1;
  display:grid;grid-template-columns:112px minmax(0,1fr);gap:18px;align-items:center;
  padding:0 20px;
  border-top:1px solid var(--line);
  background:linear-gradient(to top,rgba(5,3,3,.9),rgba(5,3,3,.25));
  min-width:0;
}
.ledger-head{display:flex;flex-direction:column;gap:1px;font-size:8px;letter-spacing:.2em;color:rgba(239,228,212,.72);}
.ledger-sub{font-size:6.5px;letter-spacing:.06em;color:rgba(109,91,82,.95);white-space:nowrap;}
.ledger-list{display:flex;gap:20px;min-width:0;overflow:hidden;height:100%;align-items:center;}
.ledger-item{
  flex:1;min-width:0;
  border-left:1px solid rgba(232,64,42,.22);
  padding-left:10px;
  display:flex;flex-direction:column;gap:2px;
  animation:rise .45s cubic-bezier(.2,.7,.2,1) both;
}
.ledger-top{display:flex;align-items:baseline;gap:7px;font-size:7.5px;min-width:0;}
.ledger-t{color:rgba(109,91,82,.95);font-variant-numeric:tabular-nums;}
.ledger-tool{color:rgba(239,228,212,.88);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ledger-by{margin-left:auto;font-size:6.5px;letter-spacing:.1em;color:rgba(155,133,121,.6);flex:0 0 auto;}
.ledger-by.is-mcp{color:rgba(232,64,42,.85);}
.ledger-detail{font-size:7px;color:rgba(155,133,121,.8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ledger-detail .seal{font-size:6.5px;gap:4px;}
.ledger-detail .seal i{width:6px;height:6px;}

/* ————— quarry responsive ————— */

@media (max-width:1340px){
  .tray-meta{gap:9px;}
  .ledger{grid-template-columns:96px minmax(0,1fr);gap:12px;padding:0 16px;}
}

@media (max-width:1160px){
  .views{padding-right:12px;gap:7px;}
  .mode{padding-left:12px;}
  .tray-meta .sub-rule:nth-of-type(3){display:none;}
}

@media (max-width:860px){
  .quarry-tray{grid-template-rows:auto minmax(0,1fr);min-height:320px;}
  .tray-stage{min-height:210px;}
  .quarry-deck{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto auto auto;
  }
  .store{min-height:300px;}
  .store::after,.weather::before{display:none;}
  .store-list{max-height:220px;}
  .faces{min-height:400px;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);}
  .weather{min-height:320px;}
  .ledger{grid-column:auto;grid-row:auto;grid-template-columns:1fr;gap:4px;padding:8px 14px;min-height:64px;}
  .ledger-list{gap:12px;}
  .ledger-item:nth-child(3){display:none;}
  .tray-head{padding:12px 14px 8px;flex-wrap:wrap;gap:4px 12px;}
  .tray-meta{flex-wrap:wrap;gap:8px;}
  .faces-head,.face-foot{padding-left:14px;padding-right:14px;}
  .face-wall{padding:10px 14px 0;}
}

@media (max-width:600px){
  .views{padding-right:8px;}
  .view-btn{font-size:8.5px;}
  .tray-meta{font-size:7px;gap:7px;}
  .tray-meta .sub-rule{display:none;}
  .quarry-tray{min-height:290px;}
  .tray-stage{min-height:190px;}
  .store{min-height:280px;}
  .faces{min-height:340px;}
  .weather{min-height:300px;}
  .ledger-head{display:none;}
  .ledger{grid-template-columns:1fr;min-height:56px;}
  .ledger-item:nth-child(2){display:none;}
  .ring-visual{height:48px;}
}