/* Five local studies. Shared site.css/nav.js/glitch.js are byte-for-byte live copies. */
html{background:#000;color-scheme:dark}
body.study{margin:0;padding:0;min-height:100svh;overflow-x:hidden;background:#000}
.study .homepage-stage{position:fixed;inset:22px 0 122px;display:grid;place-items:center;isolation:isolate}
.study .composition{--scene:min(72svh,78vw,740px);position:relative;display:flex;align-items:center;flex-direction:column}
.study .logo-scene{width:var(--scene);height:var(--scene);position:relative}
.study #logo-frame{position:relative;width:100%;height:100%;border:0;background:#000;mix-blend-mode:screen;display:block;z-index:2}
.study .study-decoration{position:absolute;inset:0;pointer-events:none;z-index:1}
.study .sound-area{position:relative;z-index:3;min-height:63px;width:max-content;max-width:calc(100vw - 32px);text-shadow:none}
.study .sound-controls{display:flex;align-items:center;justify-content:center;gap:16px;height:40px;font:11px/1.4 'Courier New',monospace;letter-spacing:.06em}
.study .sound-controls button{border:1px solid #1a5428;background:#010801;color:#84b88b;font:inherit;padding:9px 12px;display:inline-flex;align-items:center;gap:10px;min-height:34px;cursor:pointer;white-space:nowrap;transition:color .2s,border-color .2s,background .2s}
.study .sound-controls button:hover{color:#ceffc7;border-color:#52a34b;background:#061506}
.study .sound-controls button:focus-visible,.study input:focus-visible{outline:2px solid #ceffc7;outline-offset:4px}
.study .sound-controls #motion-toggle{padding:9px 2px;border-color:transparent;color:#5c8260;background:transparent}
.study .sound-controls #motion-toggle:hover{color:#c4eec1}
.study .volume-control{display:flex;align-items:center;gap:9px;color:#638b6a;font-size:10px;letter-spacing:0}
.study input[type=range]{width:56px;height:16px;margin:0;accent-color:#749c69;cursor:pointer}
.study #music-status{min-height:18px;text-align:center;color:#7da67c;font:10px/1.4 'Courier New',monospace;padding-top:5px}
.study .audio-bars{height:12px;display:flex;align-items:center;gap:2px}
.study .audio-bars i{display:block;width:2px;height:3px;background:#77bd70}
.study .audio-bars i:nth-child(2),.study .audio-bars i:nth-child(4){height:7px}
.study .audio-bars i:nth-child(3){height:11px}
.study [data-state=playing] .audio-bars i{animation:audio-level 1s ease-in-out infinite alternate}
.study [data-state=playing] .audio-bars i:nth-child(2){animation-delay:-.6s}
.study [data-state=playing] .audio-bars i:nth-child(3){animation-delay:-.3s}
.study [data-state=playing] .audio-bars i:nth-child(4){animation-delay:-.8s}
@keyframes audio-level{to{transform:scaleY(.25)}}

/* 01 - The simplest, largest, unobstructed central emblem. */
.study-void .composition{--scene:min(76svh,84vw,790px)}
.study-void .sound-controls{gap:20px}
.study-void #music-toggle{border-color:transparent;background:transparent}

/* 02 - A fine terminal frame, restrained calibration marks, and a tiled field. */
.study-chamber .composition{--scene:min(63svh,74vw,645px)}
.study-chamber .logo-scene{margin-bottom:34px}
.study-chamber .chamber-frame{position:absolute;inset:-10px;border:1px solid #164225;background:linear-gradient(180deg,#03130755,transparent 38%,transparent 60%,#04190855);box-shadow:0 0 70px #09340c25,inset 0 0 100px #071f0633}
.chamber-frame>i{position:absolute;width:22px;height:22px;border:solid #628359}
.chamber-frame>i:nth-child(1){left:-1px;top:-1px;border-width:2px 0 0 2px}
.chamber-frame>i:nth-child(2){right:-1px;top:-1px;border-width:2px 2px 0 0}
.chamber-frame>i:nth-child(3){left:-1px;bottom:-1px;border-width:0 0 2px 2px}
.chamber-frame>i:nth-child(4){right:-1px;bottom:-1px;border-width:0 2px 2px 0}
.frame-meta{position:absolute;background:#000;padding:0 12px;font:10px/1.2 'Courier New',monospace;color:#5e8060;letter-spacing:.17em;text-shadow:none}
.frame-meta.top{left:24px;top:-6px}.frame-meta.bottom{right:24px;bottom:-6px}
.frame-ticks{position:absolute;left:-15px;right:-15px;top:45%;height:10%;border-left:4px solid #437748;border-right:4px solid #437748}
.chamber-grid{position:absolute;inset:-15%;background:linear-gradient(#16331c33 1px,transparent 1px),linear-gradient(90deg,#16331c33 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse,#0008 25%,transparent 73%)}

/* 03 - Concentric orbital geometry, with the drawing left untouched. */
.study-orbit .composition{--scene:min(63svh,70vw,650px)}
.study-orbit .logo-scene{margin-bottom:38px}
.study-orbit .homepage-stage{background:radial-gradient(ellipse at 50% 48%,#052f0c45,transparent 52%)}
.orbital-field{position:absolute;inset:-7%;border:1px solid #24532a55;border-radius:50%}
.orbit-ring{position:absolute;border:1px solid #426c3988;border-radius:50%;inset:3%}
.orbit-ring.ring-b{inset:-7%;border-color:#16381e88;border-top-color:#577148;border-bottom-color:#577148;animation:orbit-turn 90s linear infinite}
.orbit-ring.ring-c{inset:11%;border-style:dashed;border-color:#24422677}
.orbit-cross{position:absolute;background:linear-gradient(90deg,transparent,#375b35,transparent);height:1px;top:50%;left:-12%;right:-12%;opacity:.5}
.orbit-cross.y{transform:rotate(90deg)}
.orbit-dot{position:absolute;width:5px;height:5px;background:#91b779;box-shadow:0 0 14px #9edf72;left:50%;top:3%;border-radius:50%}
@keyframes orbit-turn{to{transform:rotate(360deg)}}

/* 04 - A quiet gothic aperture, tall walls and an illuminated central nave. */
.study-cathedral .composition{--scene:min(60svh,76vw,620px)}
.study-cathedral .logo-scene{margin-bottom:30px}
.arch-glow{position:absolute;inset:-21% -40% -10%;background:radial-gradient(ellipse at 50% 72%,#17431742,transparent 60%)}
.arch{position:absolute;inset:-15% -3% -7%;border:1px solid #365c2c;border-radius:48% 48% 0 0;box-shadow:inset 0 0 60px #20461b0d,0 0 40px #17361411}
.arch-outer{inset:-22% -9% -7%;border-color:#233e20}
.arch-inner::before,.arch-inner::after{content:'';position:absolute;top:45%;bottom:0;width:1px;background:linear-gradient(#63804455,#1a3819);left:-11%}
.arch-inner::after{left:auto;right:-11%}
.arch-base{position:absolute;bottom:-7%;left:-16%;right:-16%;height:1px;background:linear-gradient(90deg,transparent,#61724b,transparent)}
.study-cathedral #music-toggle{border-color:#3c4c2a;color:#95a778}

/* 05 - A distant sea of code with a low perspective plane. */
.study-deep .composition{--scene:min(65svh,77vw,690px)}
.study-deep .study-decoration{position:fixed;inset:0;overflow:hidden;z-index:-1}
.study-deep .homepage-stage{overflow:hidden}
.deep-halo{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 58%,#144d1545,transparent 58%)}
.deep-horizon{position:absolute;left:5%;right:5%;top:70%;height:1px;background:linear-gradient(90deg,transparent,#3b6434bb,transparent);box-shadow:0 0 40px 9px #29582622}
.deep-floor{position:absolute;top:70%;left:-45%;right:-45%;height:80%;background-image:linear-gradient(#31623166 1px,transparent 1px),linear-gradient(90deg,#31623166 1px,transparent 1px);background-size:82px 68px;transform:perspective(330px) rotateX(56deg);transform-origin:50% 0;mask-image:linear-gradient(transparent,#0009 13%,#000 30%,transparent 73%);animation:floor-drift 30s linear infinite}
.deep-strata{position:absolute;top:70%;height:8%;left:9%;right:9%;background:repeating-linear-gradient(transparent 0 5px,#496d381a 5px 6px);mask-image:linear-gradient(90deg,transparent,#000,transparent)}
@keyframes floor-drift{to{background-position:0 68px}}

@media(max-width:980px){
 .study .homepage-stage{bottom:168px}
 .study .composition{--scene:min(59svh,78vw,650px)}
 .study-void .composition{--scene:min(65svh,87vw,700px)}
 .study-orbit .composition{--scene:min(53svh,68vw,560px)}
 .study-cathedral .composition{--scene:min(52svh,75vw,560px)}
}
@media(max-width:540px){
 .study .homepage-stage{inset:30px 0 176px}
 .study .composition{--scene:min(55svh,79vw)}
 .study-void .composition{--scene:min(57svh,94vw)}
 .study-orbit .composition{--scene:min(48svh,68vw)}
 .study-cathedral .composition{--scene:min(45svh,75vw)}
 .study .sound-controls{gap:12px;font-size:11px}
 .study .volume-control{gap:6px;font-size:10px}
 .study input[type=range]{width:42px}
 .study .sound-controls button{min-height:40px;padding:9px}
 .study .sound-area{min-height:61px}
 .frame-meta{font-size:8px;padding:0 6px;letter-spacing:.08em}
}
@media(max-height:600px) and (min-width:700px){
 .study .homepage-stage{bottom:70px}
 .study .composition{--scene:min(66svh,50vw)}
 .study-chamber .logo-scene,.study-orbit .logo-scene,.study-cathedral .logo-scene{margin-bottom:16px}
 .study .sound-controls{gap:10px}
 .study .sound-area{min-height:44px}
}
@media(prefers-reduced-motion:reduce){.study-decoration *,.study .audio-bars i{animation:none!important}}

/* Selected Void: compact music controls anchored to the page, beside the menu. */
.study-void .sound-area{position:fixed;left:max(48px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));min-height:0;width:auto;max-width:calc(100vw - 64px);z-index:998}
.study-void #logo-frame{pointer-events:none}
.study-void .sound-controls{height:44px;gap:8px;justify-content:flex-start}
.study-void .sound-controls #music-toggle{width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:0;background:transparent;justify-content:center;color:var(--green-dim)}
.study-void .audio-bars{height:18px;gap:3px;color:inherit}
.study-void .audio-bars i{width:2px;background:currentColor;height:5px;transform-origin:center;animation:none;transition:color .2s}
.study-void .audio-bars i:nth-child(2),.study-void .audio-bars i:nth-child(4){height:11px}
.study-void .audio-bars i:nth-child(3){height:17px}
.study-void .sound-controls #music-toggle[data-state=playing]{color:var(--green-body);filter:drop-shadow(0 0 3px #00cc3355)}
.study-void #music-toggle[data-state=playing] .audio-bars i{animation:void-music-pulse 1.15s ease-in-out infinite alternate}
.study-void #music-toggle[data-state=playing] .audio-bars i:nth-child(2){animation-delay:-.4s;animation-duration:.85s}
.study-void #music-toggle[data-state=playing] .audio-bars i:nth-child(3){animation-delay:-.8s;animation-duration:1.3s}
.study-void #music-toggle[data-state=playing] .audio-bars i:nth-child(4){animation-delay:-.65s;animation-duration:1s}
.study-void #music-toggle[data-state=playing] .audio-bars i:nth-child(5){animation-delay:-.25s}
.study-void #music-toggle[data-state=loading] .audio-bars{animation:void-music-loading 1.6s ease-in-out infinite alternate}
.study-void .sound-controls #music-toggle:hover,.study-void .sound-controls #music-toggle:focus-visible{color:var(--green-hot)}
.study-void .sound-controls #music-toggle:focus-visible,.study-void #music-volume:focus-visible{outline:1px solid var(--green-hot);outline-offset:2px}
.study-void #music-volume{appearance:none;-webkit-appearance:none;width:88px;height:44px;margin:0;padding:0;background:transparent;accent-color:var(--green-body);border:0;cursor:pointer}
.study-void #music-volume::-webkit-slider-runnable-track{height:2px;background:linear-gradient(to right,var(--green-mid) var(--volume,45%),var(--green-deep) var(--volume,45%))}
.study-void #music-volume::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:7px;height:12px;border:0;border-radius:0;background:var(--green-body);margin-top:-5px}
.study-void #music-volume::-moz-range-track{height:2px;background:var(--green-deep)}
.study-void #music-volume::-moz-range-progress{height:2px;background:var(--green-mid)}
.study-void #music-volume::-moz-range-thumb{width:7px;height:12px;border:0;border-radius:0;background:var(--green-body)}
.study-void #music-status{position:absolute;width:1px;height:1px;min-height:0;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.study-void #music-status.sound-error{width:max-content;max-width:calc(100vw - 32px);height:auto;bottom:48px;left:0;clip-path:none;white-space:normal;text-align:left;color:var(--green-body);background:#000}
@keyframes void-music-pulse{from{transform:scaleY(.62)}to{transform:scaleY(1)}}
@keyframes void-music-loading{from{opacity:.35}to{opacity:1}}
@media(max-width:540px){.study-void #bsq-dock,.study-void #bsq-term{bottom:calc(76px + env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){.study-void .audio-bars,.study-void .audio-bars i{animation:none!important}}