@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,500;12..96,600;12..96,700&family=IBM+Plex+Mono:wght@400;500&display=swap');
:root{--sans:'Bricolage Grotesque',Arial,sans-serif;--serif:var(--sans);--bg:#edf2f5;--ink:#203b4e;--muted:#607686;--line:#c0d0dc;--accent:#326e9a}body{background:var(--bg)}header{border-color:var(--line)}.hero{position:relative;padding:75px 0 60px}.hero:after{content:'♪';position:absolute;right:25px;top:40px;font:170px var(--sans);color:#abc8de;transform:rotate(12deg);z-index:-1}.hero-title{font-family:var(--sans);font-size:82px;font-weight:600;letter-spacing:-4px;line-height:1.05}.hero-intro p{font-family:var(--sans);color:var(--muted);font-size:21px;line-height:1.55;max-width:640px}.hero .eyebrow{font-size:10px;color:var(--accent);text-transform:none}.brand{font-family:var(--sans);font-size:23px;font-weight:600;letter-spacing:-1px}.name-dot{color:#7ca6c4}.work-head h2{font-family:var(--sans);font-size:45px;line-height:1.08;letter-spacing:-1.8px;font-weight:500}.work-head>p{font-family:var(--sans);font-size:15px;line-height:1.6}.instrument-toolbar{padding-top:25px}.mode-switch{background:#d6e2ec;border-radius:30px;padding:4px}.mode-switch button{border-radius:30px;padding:11px 22px;font-family:var(--sans);font-size:13px}.mode-switch button[aria-pressed=true]{background:#fff9ee;color:#624c38}.mode-switch button[data-mode=analysis][aria-pressed=true]{background:#284f6a;color:#f1f6fa}#sound{border-radius:30px;font-family:var(--sans)}#mode-description{font-family:var(--sans);font-size:13px;margin-bottom:35px}.marimba{gap:30px;padding:0 16px 50px;position:relative}.marimba:before{content:'';position:absolute;left:-15px;right:-15px;top:107px;bottom:0;background:#d8e5ef;border-radius:8px 8px 80px 8px;z-index:0}.bank{position:relative}.bank-title{font-family:var(--sans);font-size:19px;letter-spacing:-.4px;font-weight:500;border:none;margin-bottom:23px}.bank-title>span{color:#6e91aa}.bank-bars{height:340px;gap:16px;isolation:isolate}.bank-bars:before,.bank-bars:after{height:3px;background:#66819a;z-index:2;pointer-events:none}.bank-bars:before{top:48px}.bank-bars:after{top:177px}.bar{border-radius:5px 5px 3px 3px;height:var(--length);background:linear-gradient(90deg,#9b6947,#bc916b 45%,#ab7953);border-color:#825f46;box-shadow:0 7px #79573d,0 14px 20px #263b4d15;padding:16px 8px;overflow:visible}.bar:nth-child(2){background:linear-gradient(90deg,#a57653,#c79c75 50%,#b5845b)}.bar:after{content:'';position:absolute;top:calc(100% + 8px);left:30%;right:30%;height:45px;background:linear-gradient(90deg,#7e9cb4,#bed0dd 50%,#7795af);border:1px solid #7995aa;border-radius:0 0 12px 12px;z-index:-1}.bar[aria-pressed=true]{outline:2px solid #4f789a;outline-offset:6px}.bar-name{font:500 19px var(--sans);letter-spacing:0;writing-mode:vertical-rl;transform:rotate(180deg)}.bar-note{font-size:9px}.bar-pin{background:#574633;box-shadow:0 0 0 2px #d9ba9566}.instrument-caption{padding:25px 0 28px}.detail-heading h3{font-family:var(--sans);font-size:36px;letter-spacing:-1px;font-weight:500}.purpose{font-family:var(--sans);font-size:19px;line-height:1.45}.detail-content>p{font-family:var(--sans);font-size:17px;line-height:1.65}.detail-content{background:#e0eaf2;padding:24px 26px;border-radius:3px 3px 25px 3px}.case-link,.look-inside{font-family:var(--sans);font-size:13px}.kicker{font-size:9px}.experience-line{border-color:#b5cbdc}.signal-path li{font-size:10px}.open-question{border-color:#acc6da}.about{border-color:var(--line)}.about h2,.music h2,.contact h2{font-family:var(--sans);font-weight:500;letter-spacing:-1px;font-size:36px}.about p,.music p{font-family:var(--sans);font-size:17px;line-height:1.65}.music{background:#d8e6f0;border:none;border-radius:4px 4px 45px 4px;padding:35px;max-width:none;margin:30px 0 50px}.music>div{max-width:710px}.contact{border-color:var(--line)}footer{border-color:var(--line)}#work[data-mode=analysis] .marimba:before{background:#cadde9}#work[data-mode=analysis] .bar{background-color:#e8f0f6;background-image:repeating-linear-gradient(0deg,transparent,transparent 22px,#bfd3e3 23px);border-color:#7395ae;color:#2d5470;box-shadow:0 6px #92b0c7}#work[data-mode=analysis] .bar:after{background:linear-gradient(90deg,#80a5c0,#b6d0e2,#82a6c1)}#work[data-mode=analysis] .detail-content{background:#d6e5f0}#work[data-mode=analysis] .signal-path{font-family:var(--mono)}.resume-link{font-family:var(--sans);font-size:13px;color:var(--accent);border-bottom:1px solid;padding-bottom:4px}.experience-list{margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}.experience-list p{font-size:14px;margin-bottom:15px}.experience-list strong{display:block;font-weight:500;color:var(--ink)}.experience-list span{font-size:12px;color:var(--muted)}@media(max-width:700px){.hero{padding:45px 0 35px}.hero-title{font-size:53px;letter-spacing:-2.7px}.hero-intro p{font-size:18px}.hero:after{font-size:100px;right:0;top:20px}.work-head h2{font-size:35px}.marimba{gap:13px;padding:0 5px 45px}.marimba:before{left:-9px;right:-9px;top:100px}.bank-title{font-size:14px;line-height:1.5}.bank-bars{height:270px;gap:8px}.bank-bars:after{top:140px}.bank-bars:before{top:45px}.bar-name{font-size:14px}.bar{padding:13px 3px}.bar:after{left:25%;right:25%;height:35px}.detail-heading h3{font-size:31px}.purpose{font-size:18px}.detail-content{padding:22px 19px}.detail-content>p{font-size:16px}.mode-switch button{padding:10px 15px}.instrument-caption{font-size:8px}.about h2,.music h2,.contact h2{font-size:31px}.music{padding:27px 22px}.about p,.music p{font-size:16px}}