/* Two complete reading environments: a score and a signal-routing system. */
html{color-scheme:light}body{transition:background-color .4s,color .4s}.global-modes{display:flex;gap:4px}.global-modes button{background:none;border:1px solid var(--line);border-radius:3px;padding:7px 10px;color:var(--muted);font:10px var(--mono);cursor:pointer}.global-modes button[aria-pressed=true]{background:var(--accent);color:var(--bg)}body:has(#work) .global-modes{display:none}
html[data-theme=acoustic]{--bg:#f1f2ec;--ink:#273e4b;--accent:#476e87;--muted:#687c86;--line:#c4cfd1}html[data-theme=acoustic] .resonance-field{background:radial-gradient(ellipse at 0 30%,#bfd4df55,transparent 60%)}html[data-theme=acoustic] .resonance-field svg{display:none}html[data-theme=acoustic] .hero{border-left:2px solid #819aaa;padding-left:28px;margin-top:40px;margin-bottom:38px;padding-top:20px;padding-bottom:30px}html[data-theme=acoustic] .hero:before{content:'01 / PRELUDE';font:9px var(--mono);color:var(--accent);display:block;margin-bottom:24px}html[data-theme=acoustic] #work{position:relative;padding-top:60px}html[data-theme=acoustic] .work-head:before{content:'';position:absolute;top:0;left:0;right:0;height:29px;background:repeating-linear-gradient(0deg,#b5c6ce,#b5c6ce 1px,transparent 1px,transparent 7px);border-left:3px solid #68879a;border-right:5px double #68879a}html[data-theme=acoustic] .work-head h2{font-weight:500;line-height:1.15}html[data-theme=acoustic] .bank-title{border-left:2px solid #8da5b4;padding-left:12px}html[data-theme=acoustic] .bank-title>span{font-size:9px}html[data-theme=acoustic] .marimba:before{background:linear-gradient(120deg,#b7cbd7,#d4e0e5,#b4c9d8)}html[data-theme=acoustic] .instrument-toolbar{background:transparent}html[data-theme=acoustic] #project-detail{border-left:3px double #9bb1bd;padding-left:25px;margin-top:12px}html[data-theme=acoustic] .detail-content{background:#e4e9e8;border-radius:0;position:relative;padding-top:28px}html[data-theme=acoustic] .detail-content:before{content:'';position:absolute;top:0;left:0;right:0;height:10px;background:repeating-linear-gradient(0deg,#c0ced1,#c0ced1 1px,transparent 1px,transparent 3px)}html[data-theme=acoustic] .about,html[data-theme=acoustic] .music,html[data-theme=acoustic] .contact{border-radius:0;border-top:4px double #a8bbc6;padding-top:38px}html[data-theme=acoustic] .about:before{content:'II';font:12px var(--mono);position:absolute;left:0;top:10px;color:var(--accent)}html[data-theme=acoustic] .music{background:#e3e9e8}html[data-theme=acoustic] .casebody section{border-top:1px solid var(--line);margin-top:20px}
html[data-theme=electronic]{color-scheme:dark;--bg:#111e2a;--ink:#e1f0f5;--muted:#99b1c2;--line:#334c60;--accent:#8ed4e8}html[data-theme=electronic] body{background-color:var(--bg);background-image:linear-gradient(#45667a12 1px,transparent 1px),linear-gradient(90deg,#45667a12 1px,transparent 1px);background-size:32px 32px}html[data-theme=electronic] .resonance-field{background:radial-gradient(ellipse at 90% 25%,#30698626,transparent 55%)}html[data-theme=electronic] .score-lines{display:none}html[data-theme=electronic] .digital-lines{stroke:#6abbd5;stroke-width:2;stroke-dasharray:none}html[data-theme=electronic] header{border-bottom:1px solid #42677f}html[data-theme=electronic] .hero{display:grid;grid-template-columns:1fr;position:relative;border:1px solid var(--line);margin-top:35px;margin-bottom:35px;padding:28px;background:#142634d9;box-shadow:inset 4px 0 var(--accent)}html[data-theme=electronic] .hero:before{content:'INPUT / HUMAN EXPRESSION';font:10px var(--mono);color:var(--accent);display:block;margin-bottom:30px}html[data-theme=electronic] .hero-title{font-weight:500;letter-spacing:-3px}html[data-theme=electronic] .hero-intro p{color:var(--muted);font-size:20px}html[data-theme=electronic] .eyebrow{font:10px var(--mono);color:#6e9bb5}html[data-theme=electronic] #work{border:1px solid var(--line);padding:28px;margin-bottom:35px;background:#122331b8;position:relative}html[data-theme=electronic] #work:before{content:'PROCESS / MUSIC · INTERACTION · SPACE';display:block;font:9px var(--mono);color:var(--accent);padding-bottom:24px;border-bottom:1px solid var(--line);margin-bottom:28px}html[data-theme=electronic] .work-head{display:grid;grid-template-columns:1.2fr 1fr;gap:30px}html[data-theme=electronic] .work-head h2{font-size:36px;font-weight:500;letter-spacing:-1px}html[data-theme=electronic] .work-head>p{max-width:none;font-family:var(--mono);font-size:11px;line-height:1.9}html[data-theme=electronic] .instrument-toolbar{border-radius:0;background:#0d1c28;border-color:var(--line);padding:15px}html[data-theme=electronic] .mode-switch{background:#1d3446;border-radius:3px}html[data-theme=electronic] .mode-switch button{border-radius:2px;font:11px var(--mono);color:#a4becd}html[data-theme=electronic] .mode-switch button[aria-pressed=true]{background:#8ed4e8;color:#14232e}html[data-theme=electronic] #sound{border-radius:2px;color:var(--accent);font:10px var(--mono)}html[data-theme=electronic] #mode-description{font:10px/1.8 var(--mono);margin:18px 0 28px}html[data-theme=electronic] .marimba{margin:0;padding:0 0 35px;gap:20px}html[data-theme=electronic] .marimba:before{background:repeating-linear-gradient(90deg,transparent,transparent 41px,#7bbfd018 42px),#192f41;border:1px solid #3a627d;border-radius:0;top:50px;box-shadow:none}html[data-theme=electronic] .bank-title{border:1px solid #365c75;background:#1b3447;padding:10px;font:12px var(--mono);display:flex;gap:12px}html[data-theme=electronic] .bank-title>span{color:#84c9e2}html[data-theme=electronic] .bank-bars{height:300px;gap:10px}html[data-theme=electronic] .bar,html[data-theme=electronic] #work[data-mode=analysis] .bar{background:linear-gradient(90deg,#19374a,#23485f,#19374a);border:1px solid #56869f;border-radius:2px;color:#cbe9f3;box-shadow:0 5px #0b1721}html[data-theme=electronic] .bar-name{font:500 15px var(--mono);color:#ccebf4}html[data-theme=electronic] .bar:before{background:#66b0cd;box-shadow:none}html[data-theme=electronic] .bar:after{border-radius:0 0 2px 2px;background:linear-gradient(90deg,#1c4056,#477b97,#214960);border:1px solid #537e96;box-shadow:none;height:32px}html[data-theme=electronic] .bar-pin{background:#9cd9e9;box-shadow:0 0 0 3px #67c1d51a}html[data-theme=electronic] .bar[aria-pressed=true]{outline:2px solid #a6e2ee;box-shadow:0 5px #0b1721,0 0 20px #74c8e52b}html[data-theme=electronic] .instrument-caption{font-size:8px;color:#7fa2b6;border-color:var(--line)}html[data-theme=electronic] #project-detail{border:1px solid var(--line);background:#152a3a;gap:25px;padding:25px;position:relative;margin-top:25px}html[data-theme=electronic] #project-detail:before{content:'';position:absolute;height:26px;width:1px;background:var(--accent);top:-26px;left:50%}html[data-theme=electronic] .detail-heading h3{font-size:29px}html[data-theme=electronic] .detail-content{background:#0f202e;border:1px solid #294a61;border-radius:2px;padding:20px}html[data-theme=electronic] .detail-content>p{font-size:14px;color:#acc4d2}html[data-theme=electronic] .purpose{font-size:16px;color:#c4dbe7}html[data-theme=electronic] .signal-path{grid-template-columns:1fr;gap:0}html[data-theme=electronic] .signal-path li{border:1px solid #3c647e;padding:10px;margin-bottom:15px;background:#173044;position:relative}html[data-theme=electronic] .signal-path li:not(:last-child):after{content:'↓';position:absolute;bottom:-16px;left:50%;color:var(--accent)}html[data-theme=electronic] .signal-path li span{display:inline;margin-right:12px}html[data-theme=electronic] .open-question{border-color:#456d86}html[data-theme=electronic] .about{border:1px solid var(--line);padding:30px;gap:35px;background:#152a3ac9}html[data-theme=electronic] .music{border:1px solid var(--line);border-radius:2px;background:#182f42;padding:30px}html[data-theme=electronic] .contact{padding:30px;border:1px solid var(--line);margin-bottom:30px;background:#142735}html[data-theme=electronic] .contact:before{content:'OUTPUT';font:10px var(--mono);color:var(--accent)}html[data-theme=electronic] .education,html[data-theme=electronic] .experience-list{border-color:var(--line)}html[data-theme=electronic] .projecthero{border-bottom:1px solid var(--line)}html[data-theme=electronic] .facts{border:1px solid var(--line);padding:20px;background:#172d3e}html[data-theme=electronic] .step{background:#1a3549}html[data-theme=electronic] .notice{background:#193247;color:var(--muted)}html[data-theme=electronic] .visual{background:#1b3544;border-color:var(--line)}html[data-theme=electronic] .visual.rust{background:#b3a68e}
@media(max-width:700px){html[data-theme=acoustic] .hero{padding-left:18px;margin-top:25px}html[data-theme=acoustic] #project-detail{padding-left:15px}html[data-theme=electronic] .hero{padding:20px;margin-top:25px}html[data-theme=electronic] .hero-title{font-size:46px}html[data-theme=electronic] .hero-intro p{font-size:17px}html[data-theme=electronic] #work{padding:18px 12px}html[data-theme=electronic] .work-head{display:block}html[data-theme=electronic] .work-head h2{font-size:29px}html[data-theme=electronic] .work-head>p{font-size:11px}html[data-theme=electronic] .marimba{gap:9px}html[data-theme=electronic] .bank-title{font-size:10px;display:block;padding:7px}html[data-theme=electronic] .bank-bars{height:255px;gap:6px}html[data-theme=electronic] .bar-name{font-size:12px}html[data-theme=electronic] .mode-switch button{padding:9px 10px;font-size:10px}html[data-theme=electronic] .instrument-toolbar{padding:10px 5px;gap:8px}html[data-theme=electronic] #sound{font-size:9px;padding:9px}html[data-theme=electronic] #project-detail{padding:18px 14px}html[data-theme=electronic] .detail-content{padding:17px 14px}html[data-theme=electronic] .about,html[data-theme=electronic] .music,html[data-theme=electronic] .contact{padding:23px 20px}.global-modes{gap:2px}.global-modes button{padding:6px;font-size:8px}body:not(:has(#work)) .navlinks{display:none}}
html[data-theme=electronic] #work[data-mode=analysis] .marimba:before{background:repeating-linear-gradient(90deg,transparent,transparent 41px,#7bbfd018 42px),#192f41;border-color:#3a627d;box-shadow:none}html[data-theme=electronic] #work[data-mode=analysis] .bar:after{background:linear-gradient(90deg,#1c4056,#477b97,#214960)}
