:root{--paper:#eee9dd;--ink:#262a2b;--muted:#666c69;--line:rgba(43,51,50,.2);--accent:#9d7851;--panel:rgba(240,237,229,.78)}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}#scene{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}.grain,.vignette{position:fixed;inset:0;pointer-events:none}.grain{opacity:.13;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.62' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E");mix-blend-mode:multiply}.vignette{background:radial-gradient(ellipse at 50% 45%,transparent 48%,rgba(86,75,56,.09) 100%)}
.topbar{position:fixed;z-index:5;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:clamp(22px,3vw,48px) clamp(22px,4.5vw,76px);pointer-events:none}.topbar>*{pointer-events:auto}.eyebrow{font-size:10px;letter-spacing:.2em;font-weight:700;color:#65706f}.diamond{color:var(--accent);margin:0 .35em}.identity h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(36px,4vw,62px);letter-spacing:-.075em;line-height:1;margin:14px 0 8px}.identity h1 i{font-style:normal;color:var(--accent);font-weight:300;margin:0 .08em}.identity p{font-family:Georgia,'Times New Roman',serif;font-size:clamp(13px,1.2vw,16px);font-style:italic;color:#747b77;margin:0}.top-actions{display:flex;align-items:center;gap:28px}.sound-indicator{font-size:10px;font-weight:700;letter-spacing:.14em;color:#596461;display:flex;align-items:center;gap:9px;margin-top:11px}.sound-indicator span{height:5px;width:5px;border-radius:50%;background:#a17850;box-shadow:0 0 0 4px rgba(161,120,80,.12)}.sound-indicator.is-paused span{background:#89908a;box-shadow:none}.icon-button{background:none;border:0;color:var(--ink);padding:8px}.icon-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:square;stroke-linejoin:miter}
.scene-caption{position:fixed;z-index:4;left:clamp(22px,4.5vw,76px);top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:16px;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg);color:#727a76;font-size:10px;letter-spacing:.2em;text-transform:uppercase;pointer-events:none;transition:opacity .5s}.caption-rule{width:1px;height:45px;background:var(--accent)}
.detail-controls{position:fixed;z-index:7;top:50%;right:clamp(22px,4.5vw,76px);transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-end;gap:18px;opacity:0;pointer-events:none;transition:opacity .45s}.detail-controls.active{opacity:1;pointer-events:auto}.detail-controls>span{color:#6b7471;font-size:10px;letter-spacing:.17em}.detail-controls b{display:block;color:var(--ink);font-family:Georgia,serif;font-size:22px;letter-spacing:0;font-weight:400;margin-top:8px}.detail-controls button{background:none;border:0;border-bottom:1px solid #8d918b;padding:0 0 7px;color:var(--ink);font-size:11px;letter-spacing:.06em}.detail-controls button span{margin-left:16px;color:var(--accent)}
.dock{position:fixed;z-index:10;bottom:clamp(18px,3vw,46px);left:clamp(20px,4.5vw,76px);right:clamp(20px,4.5vw,76px);min-height:80px;padding:18px 24px;display:grid;grid-template-columns:minmax(150px,1fr) minmax(260px,1.8fr) minmax(210px,1fr);gap:22px;align-items:center;background:var(--panel);border:1px solid rgba(255,255,255,.45);box-shadow:0 8px 40px rgba(42,46,42,.07);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.track-meta{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:5px}.track-name{font-family:Georgia,serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:15px}.load-button{border:0;background:none;padding:2px 0;color:#65716f;font-size:10px;letter-spacing:.05em;text-decoration:underline;text-underline-offset:3px}.load-button span{color:var(--accent)}.transport{display:flex;align-items:center;gap:17px;min-width:0}.play-button{flex:none;width:42px;height:42px;background:#292e2e;color:#f3eee1;border:0;border-radius:50%;display:grid;place-items:center;transition:transform .2s,background .2s}.play-button:hover{transform:scale(1.06);background:#4d5b59}.play-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.play-button .play-icon{fill:currentColor;stroke:none;margin-left:2px}.play-button .pause-icon{display:none}.play-button.is-playing .play-icon{display:none}.play-button.is-playing .pause-icon{display:block}.time{color:#5b6663;font-size:10px;font-variant-numeric:tabular-nums;min-width:29px}.timeline{min-width:40px;flex:1;appearance:none;-webkit-appearance:none;height:14px;background:transparent;cursor:pointer}.timeline::-webkit-slider-runnable-track{height:2px;background:linear-gradient(to right,#8d745a var(--progress,0%),rgba(49,60,58,.18) var(--progress,0%))}.timeline::-moz-range-track{height:2px;background:rgba(49,60,58,.18)}.timeline::-moz-range-progress{height:2px;background:#8d745a}.timeline::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:8px;height:8px;border-radius:50%;background:#8d745a;margin-top:-3px}.timeline::-moz-range-thumb{width:8px;height:8px;border:0;border-radius:50%;background:#8d745a}.right-controls{display:flex;align-items:center;justify-content:flex-end;gap:15px}.follow-button{white-space:nowrap;border:1px solid rgba(58,65,62,.42);padding:13px 15px;background:transparent;color:var(--ink);text-transform:uppercase;font-size:10px;letter-spacing:.12em;transition:background .2s,color .2s}.follow-button:hover{background:#303837;color:#f7f1e5}.follow-button span{color:var(--accent);margin-left:10px}.volume-label{font-size:9px;letter-spacing:.13em;color:#65716f;margin-left:10px}#volume{width:57px;accent-color:#8d745a;height:2px;cursor:pointer}.status{position:fixed;z-index:15;left:50%;top:24px;transform:translateX(-50%);padding:10px 15px;background:rgba(38,42,43,.87);color:#fff;font-size:12px;letter-spacing:.02em;opacity:0;pointer-events:none;transition:opacity .3s}.status.show{opacity:1}
@media(max-width:950px){.dock{grid-template-columns:1fr 1.7fr;gap:8px 18px}.right-controls{grid-column:1/-1;justify-content:space-between;border-top:1px solid var(--line);padding-top:11px}.volume-label{margin-left:auto}.dock{padding:14px 18px}.scene-caption{display:none}}
@media(max-width:600px){.topbar{padding:22px}.identity h1{font-size:39px}.identity p{font-size:12px}.sound-indicator{display:none}.dock{left:14px;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));grid-template-columns:1fr;gap:12px;padding:13px 16px}.track-meta{display:grid;grid-template-columns:1fr auto;gap:2px 8px}.track-meta .eyebrow{grid-column:1/-1}.load-button{grid-column:2;grid-row:2}.track-name{font-size:14px}.transport{grid-row:2}.right-controls{grid-row:3}.detail-controls{top:37%;right:20px}.detail-controls>span{display:none}.follow-button{padding:10px 12px}.top-actions{gap:0}.vignette{background:radial-gradient(ellipse at 50% 42%,transparent 32%,rgba(86,75,56,.08) 100%)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}

#wash{position:fixed;inset:0;width:100%;height:100%;display:block;pointer-events:none}#scene{background:transparent}

.lyrics-button{margin-top:5px;border:1px solid rgba(43,51,50,.35);background:rgba(240,237,229,.45);color:var(--ink);padding:9px 13px;text-transform:uppercase;font-size:10px;letter-spacing:.12em}.lyrics-button:hover{background:rgba(240,237,229,.9)}
.lyric-overlay{position:fixed;z-index:8;left:50%;bottom:calc(var(--dock-clearance, 145px) + 22px);transform:translateX(-50%);width:min(78vw,900px);max-height:35vh;display:grid;place-items:center;text-align:center;pointer-events:none;opacity:0;color:#242928;font:italic clamp(24px,3.5vw,52px)/1.18 Georgia,'Times New Roman',serif;letter-spacing:-.025em;text-shadow:0 2px 10px rgba(248,245,236,.9),0 0 3px #f8f5ec,0 0 28px #f8f5ec}.lyric-overlay::before{content:"";position:absolute;z-index:-1;inset:-22px -35px;background:radial-gradient(ellipse,rgba(246,242,231,.72) 0%,rgba(246,242,231,.4) 48%,transparent 74%)}.lyric-overlay span{max-width:100%;overflow-wrap:break-word;white-space:pre-line}
.lyrics-dialog{width:min(620px,calc(100vw - 32px));max-height:min(85vh,720px);border:1px solid var(--line);padding:25px;background:#f2eee4;color:var(--ink);box-shadow:0 25px 90px rgba(28,32,30,.25)}.lyrics-dialog::backdrop{background:rgba(20,28,27,.42);backdrop-filter:blur(4px)}.lyrics-dialog form{display:flex;flex-direction:column;gap:12px}.lyrics-dialog h2{font:normal 27px Georgia,serif;margin:0}.lyrics-dialog p{font-size:13px;line-height:1.45;color:#596360;margin:0}.lyrics-dialog label{font-size:12px}.lyrics-toggle{display:flex;align-items:center;gap:7px}.lyrics-dialog textarea{display:block;width:100%;height:min(42vh,340px);resize:vertical;background:#fffdf7;color:#232928;border:1px solid #afb4ab;padding:12px;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}.lyrics-error{min-height:18px;color:#9c3330!important}.lyrics-dialog-actions{display:flex;justify-content:flex-end;gap:9px}.lyrics-dialog-actions button{border:1px solid #626b66;padding:9px 17px;background:transparent;color:var(--ink)}.lyrics-dialog-actions button[type=submit]{background:#2d3533;color:#f6f1e6}
.lyrics-dialog .lyrics-draft-note{font-weight:700;color:#725331;background:rgba(171,128,74,.13);padding:8px 10px}.lyrics-draft-note[hidden]{display:none}
@media(max-width:600px){.lyrics-button{padding:7px 9px}.lyric-overlay{bottom:calc(var(--dock-clearance, 230px) + 14px);width:calc(100vw - 42px);max-height:30vh;font-size:clamp(22px,6vw,32px)}.lyric-overlay::before{inset:-12px -16px}}
.palette-button{margin-top:5px;border:1px solid rgba(43,51,50,.35);background:rgba(240,237,229,.45);color:var(--ink);padding:9px 13px;text-transform:uppercase;font-size:10px;letter-spacing:.12em;white-space:nowrap}.palette-button:hover,.palette-button[aria-pressed="true"]{background:rgba(240,237,229,.9)}.top-actions{gap:10px}
.mouse-button{margin-top:5px;border:1px solid rgba(43,51,50,.35);background:rgba(240,237,229,.45);color:var(--ink);padding:9px 13px;text-transform:uppercase;font-size:10px;letter-spacing:.12em;white-space:nowrap}.mouse-button:hover,.mouse-button[aria-pressed="true"]{background:rgba(240,237,229,.9)}
@media(max-width:600px){.topbar{flex-wrap:wrap}.identity{width:100%}.top-actions{width:100%;justify-content:flex-end;margin-top:10px;gap:8px}.palette-button,.mouse-button{padding:7px 9px}}
.road-button{white-space:nowrap;border:1px solid rgba(58,65,62,.42);padding:13px 15px;background:transparent;color:var(--ink);text-transform:uppercase;font-size:10px;letter-spacing:.12em;transition:background .2s,color .2s}.road-button:hover{background:#303837;color:#f7f1e5}.road-button span{color:var(--accent);margin-left:10px}.road-button:disabled,.follow-button:disabled{opacity:.46;cursor:default}.road-button:disabled:hover,.follow-button:disabled:hover{background:transparent;color:var(--ink)}
.right-controls{flex-wrap:wrap;row-gap:8px}
@media(max-width:600px){.road-button{padding:10px 12px}.right-controls{justify-content:flex-start}.volume-label{margin-left:auto}}
@media(max-width:600px){.detail-controls.road-active{top:26%}}

.song-dialog{width:min(420px,calc(100vw - 32px))}.song-info-content{display:flex;flex-direction:column;gap:16px}.song-dialog .song-artist{font-size:17px}.song-youtube{color:var(--ink);border:1px solid var(--line);padding:13px 15px;text-decoration:none;line-height:1.5}.song-youtube:hover{background:rgba(40,48,45,.07)}.song-new-tab{display:block;font-size:11px;color:#596360}

.right-controls .scene-icon-button{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;padding:8px;letter-spacing:0}.scene-icon-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.scene-icon-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.right-controls{column-gap:9px}

.study-credit{display:flex;align-items:center;gap:13px;border-top:1px solid var(--line);padding-top:18px;margin-top:4px;color:var(--ink);text-decoration:none}.study-credit>span{display:flex;flex-direction:column;gap:5px;font-size:12px}.study-credit small{font-size:9px;letter-spacing:.13em;color:#65706f}.study-credit img{flex:none;width:36px;height:34px;object-fit:contain}.study-credit:hover>span{text-decoration:underline;text-underline-offset:3px}

.recording-identity{display:none}
body.recording-view .identity,body.recording-view .top-actions>*:not(#recordViewButton),body.recording-view .scene-caption{display:none}
body.recording-view .recording-identity{display:block;text-align:center;position:fixed;top:clamp(35px,7vh,100px);left:20px;right:20px;pointer-events:none}
.recording-identity h2{font:normal clamp(25px,4vw,44px) Georgia,serif;margin:0 0 9px}.recording-identity p{font-size:12px;letter-spacing:.12em;margin:0;color:#596461}
body.recording-view .top-actions{position:fixed;right:12px;top:12px}
body.recording-view #recordViewButton{opacity:.2;font-size:9px;padding:6px}body.recording-view #recordViewButton:hover,body.recording-view #recordViewButton:focus-visible{opacity:1}
body.recording-view .dock{display:flex;align-items:center;justify-content:center;gap:12px;left:50%;right:auto;bottom:18px;transform:translateX(-50%);width:max-content;min-height:0;padding:7px 10px;border:1px solid rgba(50,60,55,.12);background:rgba(242,238,228,.18);box-shadow:none;backdrop-filter:blur(4px);opacity:.22;transition:opacity .2s}
body.recording-view .dock:hover,body.recording-view .dock:focus-within{opacity:.9}
body.recording-view .track-meta,body.recording-view .time,body.recording-view .timeline,body.recording-view .volume-label,body.recording-view #volume{display:none}
body.recording-view .transport,body.recording-view .right-controls{display:flex;gap:8px;grid-row:auto;grid-column:auto;border:0;padding:0}
body.recording-view .play-button{width:32px;height:32px;background:transparent;color:var(--ink)}body.recording-view .right-controls .scene-icon-button{width:32px;height:32px;flex-basis:32px;padding:5px;border:0}
body.recording-view .detail-controls,body.recording-view .detail-controls.road-active{top:auto;bottom:78px;right:50%;transform:translateX(50%);opacity:0}body.recording-view .detail-controls.active{opacity:.35}
body.recording-view .detail-controls>span{display:none}body.recording-view .detail-controls:hover,body.recording-view .detail-controls:focus-within{opacity:1}
body.recording-view .lyric-overlay{bottom:clamp(120px,16vh,240px)}