@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;1,400&display=swap');
:root{--bg:#081714;--panel:#10231e;--gold:#dfc28c;--text:#eeeade;--muted:#91a69c;--line:#d0ddcb22;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',Arial,sans-serif;font-size:14px}button,input,select{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button,a{color:inherit}button{background:none;border:0;cursor:pointer}a{text-decoration:none}button:hover,a:hover{color:var(--gold)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:5px}h1,h2{font-family:'Playfair Display',Georgia,serif;font-weight:400;letter-spacing:-.045em}em{font-weight:400;color:var(--gold)}.header{height:96px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 5%;position:relative;z-index:5}.brand{display:flex;gap:15px;align-items:center}.brand img{width:48px;height:48px;border-radius:50%;object-fit:cover}.brand>span{font-weight:700;letter-spacing:.15em;font-size:16px}.brand small{font-size:6px;letter-spacing:.24em;display:block;color:#a8b5a9;margin-top:7px;font-weight:400}nav{display:flex;align-items:center;gap:27px;font-size:11px}.outline{padding:13px 17px;border:1px solid #d5c6a34d;border-radius:4px}.hero{display:grid;grid-template-columns:36% 64%;height:660px;max-width:1800px;margin:auto}.intro{padding:50px 0 35px 14%;position:relative;z-index:2;background:radial-gradient(ellipse at 90% 80%,#162e2140,transparent 75%)}.eyebrow{font-size:9px;letter-spacing:.18em;color:var(--gold);margin:0 0 24px;display:flex;gap:11px;align-items:center}.eyebrow i,.console-footer i{display:inline-block;background:#dac98f;border-radius:50%;width:5px;height:5px}h1{font-size:clamp(46px,4.7vw,74px);line-height:1.06;margin:0 0 22px}.lead{font-size:14px;line-height:1.8;color:#b4c3b7;margin:0 0 28px}.specs{display:flex;gap:22px;margin-bottom:28px}.specs>div{padding-left:19px;border-left:1px solid #dfc58b33}.specs>div:first-child{padding-left:0;border:0}.specs b{font-size:24px;font-weight:400;letter-spacing:-.045em;white-space:nowrap}.specs b small{font-size:15px;color:var(--muted)}.specs span{font-size:7px;letter-spacing:.13em;color:#8ea396;display:block;margin-top:7px;white-space:nowrap}.neon-label{font-size:8px;letter-spacing:.14em;color:#c1cdbb;display:flex;align-items:center;gap:9px}.neon-label>span{width:30px;height:2px;background:#f0dba9;box-shadow:0 0 8px #edbb69}.finish{font-size:11px;line-height:1.7;color:var(--muted);margin-bottom:25px}.hero-play{display:flex;align-items:center;gap:13px;padding:0;text-align:left;font-size:13px}.play-disc{display:grid;place-items:center;border:1px solid var(--gold);border-radius:50%;width:45px;height:45px;color:var(--gold);padding-left:2px}.hero-play:hover .play-disc{background:var(--gold);color:var(--bg)}.hero-play small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.sound-note{font-size:9px;color:#728a7d;margin-top:15px}.stage{position:relative;min-width:0;overflow:hidden;isolation:isolate;background:#081714}.stage canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}.stage canvas:active{cursor:grabbing}.stage:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 -35px 35px -20px var(--bg),inset 30px 0 35px -25px var(--bg);z-index:1}.stage-top{position:absolute;top:29px;right:7%;display:flex;gap:15px;align-items:center;z-index:2}.chip{font-size:8px;letter-spacing:.15em;color:#a9beb1;padding:10px 12px;border:1px solid var(--line);border-radius:3px;backdrop-filter:blur(8px)}#fullscreen{font-size:25px}.scene-caption{position:absolute;top:92px;right:7%;text-align:right;z-index:2}.scene-caption strong{font-family:Georgia,serif;font-size:17px;font-weight:400;color:#e5ddc9}.scene-caption small{display:block;font-size:7px;letter-spacing:.15em;color:var(--muted);margin-top:8px}.height-mark{display:flex;align-items:center;gap:10px;position:absolute;right:4%;top:29%;height:46%;pointer-events:none}.height-mark span{font-size:9px;color:#94aa98}.height-mark i{height:100%;width:1px;background:#b6c9b738;position:relative}.height-mark i:before,.height-mark i:after{content:'';position:absolute;left:-4px;width:9px;height:1px;background:#b6c9b759}.height-mark i:after{bottom:0}.camera-tools{display:flex;position:absolute;bottom:48px;left:50%;transform:translateX(-50%);padding:4px;border:1px solid var(--line);border-radius:5px;white-space:nowrap;background:#071711c9;z-index:2;backdrop-filter:blur(8px)}.camera-tools button{font-size:9px;padding:9px 12px;border-radius:2px;color:#99b29f}.camera-tools button.active,.camera-tools button[aria-pressed=true]{background:var(--gold);color:#14241b}.drag-hint{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);font-size:8px;color:#7b9383;white-space:nowrap;z-index:2}.stage-note{position:absolute;bottom:10px;right:7%;font-size:7px;color:#637c6c;z-index:2}#countdown{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);text-align:center;z-index:3;pointer-events:none;text-shadow:0 0 35px #f4d080}#countdown[hidden]{display:none}#countdown b{display:block;font-family:Georgia,serif;font-weight:400;font-size:80px}#countdown span{font-size:8px;letter-spacing:.17em}#render-error{position:absolute;inset:35% 15%;font-size:14px;text-align:center;color:var(--gold);z-index:4}.console{margin:0 5%;padding:22px 26px 17px;background:linear-gradient(130deg,#12271f,#0e201b);border:1px solid #c5d7c527;border-radius:7px;position:relative;z-index:3}.transport{display:flex;align-items:center;gap:17px}.round{width:38px;height:38px;display:grid;place-items:center;background:var(--gold);color:#15281d;border-radius:50%;flex-shrink:0;font-size:12px}.round:hover{background:#f0d7a6;color:#0d2015}.now-playing{flex:1;min-width:0}.now-playing small{display:block;letter-spacing:.15em;font-size:7px;color:var(--muted);margin-bottom:5px}.now-playing strong{font-size:12px;font-weight:500}.time{font-size:11px;white-space:nowrap;color:#bcc9bc;font-variant-numeric:tabular-nums}.volume{display:flex;gap:8px;align-items:center;color:var(--gold)}input[type=range]{accent-color:var(--gold);cursor:pointer}.volume input{width:70px;height:3px}#loop{font-size:19px;color:var(--muted)}#loop[aria-pressed=true]{color:var(--gold)}#seek{display:block;width:100%;height:4px;margin:21px 0 0}.timeline-labels{display:flex;justify-content:space-between;margin-top:10px;font-size:7px;letter-spacing:.1em;color:#819b89}.music-intro{display:flex;justify-content:space-between;align-items:center;margin:25px 0 12px;font-size:8px;letter-spacing:.13em;color:var(--gold)}.music-intro small{font-size:8px;letter-spacing:0;color:#809d89}.tracks{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.song-card{min-width:0;border:1px solid #d2dfca22;border-radius:5px;background:#0d1f19;overflow:hidden}.song-card.selected{background:#20362a;border-color:#ddc28b88}.song-card>button{width:100%;display:flex;align-items:center;gap:12px;padding:15px 13px;text-align:left}.track-index{font-size:23px;font-family:Georgia,serif;color:#708d78}.selected .track-index{color:var(--gold)}.song-card strong{font-size:12px;font-weight:500;display:block}.song-card small{font-size:8px;display:block;color:#93aa97;margin-top:5px}.track-duration{font-size:10px;color:#99ad98;margin-left:auto}.song-card>a{display:flex;justify-content:space-between;font-size:7px;letter-spacing:.1em;padding:9px 13px;border-top:1px solid #d2dfca15;color:#95ac97}.song-card>a:hover{color:var(--gold);background:#283b2b}.cues{display:flex;gap:5px;overflow:auto;white-space:nowrap;padding:15px 0 5px;scrollbar-width:thin;scrollbar-color:#385441 transparent}.cues button{font-size:8px;display:flex;gap:7px;align-items:center;padding:7px 9px;border:1px solid #d0dfcb22;border-radius:3px;color:#91a894}.cues button span{font-size:7px;color:#698674;font-variant-numeric:tabular-nums}.cues button.active{color:var(--gold);border-color:#d9bf8a88;background:#27392a}.console-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff10;margin-top:13px;padding-top:13px;font-size:9px;color:#829e89}.console-footer i{width:4px;height:4px;background:#8dbd91;margin-right:6px}.console-footer button{font-size:9px;color:#b1c1af}.concept{display:grid;grid-template-columns:1.1fr 1fr .8fr;align-items:center;gap:45px;padding:78px 5%}.concept .eyebrow{font-size:8px;margin-bottom:16px}h2{font-size:35px;line-height:1.2;margin:0}.concept>p{font-size:12px;line-height:1.9;color:#9fb3a4}.concept-numbers{display:flex;gap:23px;justify-content:flex-end}.concept-numbers span{max-width:76px;font-size:9px;line-height:1.5;color:#8ca593}.concept-numbers b{font-size:24px;font-weight:400;display:block;color:#d8d5bf;margin-bottom:6px}.reference{display:grid;grid-template-columns:.85fr 1fr;gap:8%;margin:0 8% 80px;align-items:center;border-top:1px solid var(--line);padding-top:55px}.reference-image{position:relative;max-width:420px}.reference-image img{display:block;width:100%;height:570px;object-fit:cover;border-radius:5px}.reference-image>span{position:absolute;bottom:0;left:0;right:0;font-size:8px;letter-spacing:.15em;padding:25px 20px 20px;background:linear-gradient(transparent,#05100c);border-radius:0 0 5px 5px;color:#e5d3aa}.reference-copy .eyebrow{font-size:8px;margin-bottom:17px}.reference-copy h2{font-size:37px}.reference-copy>p{color:#9fb1a3;font-size:12px;line-height:1.9}.detail{display:flex;gap:18px;padding-top:20px;margin-top:20px;border-top:1px solid var(--line)}.detail>span{font:20px Georgia,serif;color:#aa966c}.detail strong{font-size:12px;font-weight:500}.detail p{font-size:11px;color:#8ba393;line-height:1.8;margin:6px 0 0}.text-link{padding:0;margin-top:24px;color:var(--gold);font-size:10px}footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:25px 5%;font-size:8px;letter-spacing:.08em;color:#779380}footer button{font-size:8px;color:#aebdab}dialog{background:#10251d;color:var(--text);border:1px solid #526c52;border-radius:8px;padding:30px;width:calc(100% - 30px);max-width:780px;max-height:87vh;overflow:auto}dialog::backdrop{background:#020b08d9;backdrop-filter:blur(8px)}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px}.dialog-head .eyebrow{font-size:8px;margin-bottom:10px}.dialog-head h2{font-size:34px}.close{font-size:28px;padding:0 5px;color:var(--gold)}dialog p{font-size:12px;line-height:1.85;color:#b3c3b1}dialog .quiet{font-size:10px;color:#8aa38c}dialog label{display:block;margin:25px 0;font-size:12px}dialog label input[type=range]{width:100%;display:block;margin-top:15px}dialog output{float:right;color:var(--gold)}dialog select{width:100%;padding:12px;background:#081a13;color:var(--text);border:1px solid #54735c;border-radius:4px;margin-top:10px}dialog .check{display:flex;gap:9px;align-items:center}dialog h3{font:23px Georgia,serif;color:var(--gold);font-weight:400}.project-tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);padding-bottom:9px;margin-bottom:20px}.project-tabs button{font-size:11px;padding:9px 15px;border-radius:3px;color:#a8bba7}.project-tabs button.active{background:var(--gold);color:#122319}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.project-grid>div{padding:17px;border:1px solid var(--line);border-radius:4px}.project-grid small{font-size:8px;color:#8da98d}.project-grid strong{font-size:21px;font-weight:400;display:block;color:var(--gold);margin-top:8px}.project-grid p{font-size:10px;margin-bottom:0}table{width:100%;border-collapse:collapse;font-size:11px;margin:20px 0}th,td{padding:11px 7px;text-align:left;border-bottom:1px solid var(--line)}th{font-weight:400;color:var(--muted);font-size:9px}td:last-child{text-align:right}.button{display:inline-block;border:1px solid #e0c18b66;color:var(--gold);font-size:11px;border-radius:4px;padding:11px 14px;margin:4px 8px 4px 0}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);max-width:90%;background:var(--gold);color:#13251b;padding:13px 22px;border-radius:5px;font-size:12px;z-index:20;opacity:0;pointer-events:none;transition:opacity .2s}#toast.visible{opacity:1}.stage:fullscreen{width:100vw;height:100vh}.stage:fullscreen .camera-tools{bottom:55px}
@media(min-width:1600px){.hero{height:760px}.intro{padding-top:70px}.lead{margin-bottom:34px}.specs{margin-bottom:35px}.finish{margin-bottom:35px}}
@media(max-width:1100px){.hero{grid-template-columns:38% 62%;height:640px}.intro{padding-left:13%;padding-top:45px}h1{font-size:52px}.specs{gap:14px}.specs>div{padding-left:12px}.specs span{font-size:6px}.specs b{font-size:22px}.concept{gap:25px;grid-template-columns:1fr 1fr}.concept-numbers{grid-column:1/-1;justify-content:flex-start}.concept-numbers span{max-width:none}.reference{gap:6%;margin-left:6%;margin-right:6%}.reference-copy h2{font-size:31px}.song-card>button{gap:8px;padding:13px 10px}.song-card strong{font-size:11px}.track-duration{font-size:8px}.song-card small{font-size:7px}.reference-image img{height:560px}}
@media(max-width:760px){.header{height:77px;padding:0 6%}.brand{gap:10px}.brand img{width:38px;height:38px}.brand>span{font-size:13px}.brand small{font-size:5px}nav{gap:12px;font-size:9px}nav button{font-size:9px}.outline{padding:9px 10px}.hero{display:flex;flex-direction:column;height:auto}.intro{padding:34px 6% 12px}.eyebrow{font-size:8px;margin-bottom:18px}h1{font-size:48px;margin-bottom:15px}.lead{font-size:12px;line-height:1.7;margin:0 0 20px}.specs{gap:23px;margin-bottom:21px}.specs>div{padding-left:18px}.specs b{font-size:22px}.specs span{font-size:7px}.neon-label{font-size:7px}.finish{font-size:10px;margin:10px 0 20px}.hero-play{font-size:12px}.play-disc{width:39px;height:39px}.hero-play small{font-size:9px}.sound-note{font-size:8px;margin:12px 0 0}.stage{height:470px;flex-shrink:0}.stage-top{top:14px;right:6%}.chip{font-size:7px;padding:8px 10px}.scene-caption{top:64px;right:6%}.scene-caption strong{font-size:14px}.scene-caption small{font-size:6px}.camera-tools{bottom:42px}.camera-tools button{font-size:8px;padding:8px 12px}.drag-hint{bottom:23px;font-size:7px}.stage-note{bottom:7px;font-size:6px}.height-mark{top:29%;height:44%;right:5%}.height-mark span{font-size:8px}.console{margin:0 4%;padding:17px 15px}.transport{gap:9px}.round{width:34px;height:34px}.now-playing strong{font-size:10px}.now-playing small{font-size:6px}.time{font-size:9px}.volume{gap:4px}.volume input{width:40px}.timeline-labels{font-size:6px;letter-spacing:.03em}.music-intro{display:block;margin-top:23px;font-size:7px}.music-intro small{font-size:7px;display:block;margin-top:6px}.tracks{gap:6px}.song-card>button{padding:11px 8px;gap:7px;align-items:flex-start}.track-index{font-size:18px}.song-card strong{font-size:10px;line-height:1.45}.song-card small{font-size:7px;line-height:1.5}.track-duration{display:none}.song-card>a{padding:9px 8px;font-size:6px;letter-spacing:0}.cues button{font-size:7px}.cues button span{font-size:6px}.console-footer{font-size:7px}.console-footer button{font-size:8px}.concept{padding:48px 6%;grid-template-columns:1fr;gap:16px}.concept h2{font-size:32px}.concept>p{font-size:12px;margin:0}.concept-numbers{gap:35px;margin-top:12px}.concept-numbers span{max-width:90px;font-size:9px}.concept-numbers b{font-size:23px}.reference{grid-template-columns:1fr;gap:32px;margin:0 6% 50px;padding-top:35px}.reference-image{max-width:none}.reference-image img{height:500px;object-position:50% 35%}.reference-copy h2{font-size:31px}.detail{margin-top:17px;padding-top:17px}.reference-copy>p{font-size:12px}.detail p{font-size:11px}footer{padding:22px 6%;flex-wrap:wrap;font-size:7px}footer span:nth-child(2){order:3;width:100%;font-size:7px}footer button{font-size:7px}dialog{padding:23px}.dialog-head h2{font-size:30px}.project-grid{grid-template-columns:1fr}.project-grid>div{padding:14px}.project-grid strong{font-size:22px}table{font-size:10px}.project-tabs button{font-size:10px}.volume input{max-width:36px}}
@media(max-width:390px){.header{padding:0 4%}.brand small{letter-spacing:.1em}nav{gap:5px}.outline{padding:8px}.transport{gap:7px}.volume{display:none}.song-card>button{display:block}.track-index{display:block;margin-bottom:7px}.specs{gap:20px}.stage{height:430px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}


.back-projects{color:var(--gold);font-size:11px;white-space:nowrap}.song-card>button{border-radius:inherit}@media(max-width:430px){.back-projects{font-size:9px}.header nav{gap:12px}}
