/* ============ STUDIO MATERIALS — wood, metal, bezel, CRT, lamps, paper ============
   Ported from the AnalogPlayer console. Used on instruments only; the page stays void. */

.wood{
  background:
    repeating-linear-gradient(93deg,rgba(0,0,0,.12) 0 2px,transparent 2px 7px),
    linear-gradient(180deg,var(--wood-hi),var(--wood-lo));
}
.brushed{
  background:linear-gradient(180deg,var(--metal-1) 0%,var(--metal-2) 45%,var(--metal-3) 55%,var(--metal-4) 100%);
}
.bezel{
  border:1px solid rgba(0,0,0,.6);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -2px 6px rgba(0,0,0,.55),
    0 2px 10px rgba(0,0,0,.5);
}
.crt{
  position:relative;
  background:
    radial-gradient(ellipse at 50% 40%,rgba(74,222,128,.045),transparent 70%),
    var(--screen);
}
.crt::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:3;
  background:repeating-linear-gradient(0deg,
    rgba(0,0,0,.22) 0px,rgba(0,0,0,.22) 1px,transparent 1px,transparent 3px);
}
.crt-vignette::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:4;
  box-shadow:inset 0 0 60px rgba(0,0,0,.75);
}
.lamp{
  display:inline-block;width:.5rem;height:.5rem;border-radius:9999px;
  box-shadow:0 0 6px currentColor;background:currentColor;flex:none;
}
.lamp.sm{width:.35rem;height:.35rem}

.phosphor-glow{text-shadow:0 0 6px rgba(74,222,128,.55)}
.amber-glow{text-shadow:0 0 6px rgba(224,122,40,.5)}
.aqua-glow{text-shadow:0 0 6px rgba(103,232,249,.5)}

@keyframes flicker{
  0%,100%{opacity:1} 92%{opacity:1} 93%{opacity:.86} 94%{opacity:1} 97%{opacity:.93}
}
.flicker{animation:flicker 7s infinite}

@keyframes blinkstep{0%,100%{opacity:1}50%{opacity:.25}}
.blink{animation:blinkstep 1.4s step-end infinite}

@keyframes deck-spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* paper — light printed surfaces in the void */
.papersheet{
  background:
    repeating-linear-gradient(0deg,transparent 0 27px,rgba(120,90,40,.07) 27px 28px),
    linear-gradient(180deg,var(--paper),var(--paper-lo));
  color:var(--ink);
  box-shadow:inset 0 0 60px rgba(120,90,40,.14),0 18px 50px rgba(0,0,0,.6);
}
.papersheet ::selection{background:rgba(180,130,40,.35)}

/* double rule — the ledger divider */
.rule-2{border-top:1px solid currentColor;border-bottom:3px double currentColor;height:6px;opacity:.55}

/* wax seal */
.seal{
  width:92px;height:92px;border-radius:50%;border:2px solid var(--alert);
  color:var(--alert);display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;
  transform:rotate(-8deg);gap:.2rem;
  background:radial-gradient(circle at 35% 30%,rgba(200,69,47,.14),transparent 65%);
}
.seal .wavemark{font-size:1rem;letter-spacing:0}

/* pressed / tactile states */
.pressable{transition:transform .12s ease,box-shadow .12s ease}
.pressable:active{transform:translateY(2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),inset 0 2px 8px rgba(0,0,0,.6)!important}