@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Instrument+Serif:ital@0;1&display=swap";:root{color:#ebe9e0;background:#08090b;font-family:DM Mono,Courier New,monospace}*{box-sizing:border-box}html,body{min-height:100%;margin:0;overflow:hidden}button,input{font:inherit}button{color:inherit}.experience{position:relative;isolation:isolate;min-height:100svh;overflow:hidden;background:#08090b}#field,.wash{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}#field{display:block;cursor:crosshair}.wash{pointer-events:none;background:linear-gradient(90deg,rgba(3,4,6,.6),transparent 38%,transparent 70%,rgba(3,4,6,.25)),radial-gradient(circle at 48% 44%,transparent 35%,rgba(0,0,0,.22) 100%);mix-blend-mode:multiply}.topbar,.title-block,.lab,.source-toggle,.hint,.credit{position:absolute;z-index:2}.topbar{inset:0 0 auto;display:flex;justify-content:space-between;align-items:start;padding:18px 20px;font-size:10px;letter-spacing:.07em;text-transform:uppercase}.topbar p{margin:0;color:#ebe9e08c}.back{color:#ebe9e0;text-decoration:none;transition:color .2s ease}.back:hover,.back:focus-visible{color:#a6f5df}.title-block{top:clamp(88px,13vh,152px);left:clamp(18px,6vw,94px)}.eyebrow{margin:0 0 14px;color:#a6f5df;font-size:10px;letter-spacing:.11em;text-transform:uppercase}h1{margin:0;font-family:"Instrument Serif",Georgia,serif;font-size:clamp(66px,10.6vw,160px);font-weight:400;letter-spacing:-.075em;line-height:.67}.lede{margin:30px 0 0;color:#ebe9e0b8;font-size:11px;letter-spacing:.025em;line-height:1.55}.lab{top:clamp(74px,13vh,128px);right:clamp(17px,4.5vw,68px);width:min(244px,calc(100vw - 34px));padding:12px 13px 14px;border:1px solid rgba(235,233,224,.28);background:#0a0c0e7a;box-shadow:0 10px 42px #0000002b;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.lab-heading,.palette>div,.presets{display:flex;align-items:center}.lab-heading{justify-content:space-between;margin-bottom:14px;font-size:10px;letter-spacing:.1em;text-transform:uppercase}.lab-heading p,.palette p{margin:0}.lab-heading button,.presets button{border:0;background:none;cursor:pointer}.lab-heading button{padding:0;color:#a6f5df;font-size:10px}.lab label{display:block;margin:10px 0 0}.lab label span{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.045em}output{color:#a6f5df}input[type=range]{width:100%;height:15px;margin:4px 0 0;accent-color:#a6f5df;cursor:ew-resize}.palette{display:flex;align-items:center;justify-content:space-between;margin-top:15px;padding-top:11px;border-top:1px solid rgba(235,233,224,.16);font-size:10px;letter-spacing:.08em;text-transform:uppercase}.palette>div{gap:6px}.swatch{width:17px;height:17px;padding:2px;border:1px solid transparent;background:transparent;cursor:pointer}.swatch i{display:block;width:100%;height:100%;background:#e7e5dc}.swatch[data-palette=ember] i{background:#ed713d}.swatch[data-palette=ultraviolet] i{background:#9d7cff}.swatch.active{border-color:#a6f5df}.presets{gap:8px;margin-top:14px}.presets button{flex:1;padding:7px 2px;border:1px solid rgba(235,233,224,.22);color:#ebe9e0bf;font-size:8px;letter-spacing:.045em;text-transform:uppercase;transition:all .2s ease}.presets button:hover,.presets button:focus-visible{border-color:#a6f5df;color:#a6f5df}.source-toggle{bottom:20px;right:clamp(17px,4.5vw,68px);padding:9px 10px;border:1px solid rgba(235,233,224,.38);background:#0a0c0e70;font-size:9px;letter-spacing:.075em;text-transform:uppercase;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.source-toggle span{color:#a6f5df}.source-toggle:hover,.source-toggle:focus-visible{border-color:#a6f5df}.source-panel{position:absolute;z-index:3;right:clamp(17px,4.5vw,68px);bottom:67px;width:min(430px,calc(100vw - 34px));padding:15px 16px 17px;border:1px solid rgba(166,245,223,.5);background:#090b0de6;box-shadow:0 15px 70px #00000073;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.panel-topline{display:flex;align-items:center;justify-content:space-between;color:#a6f5df;font-size:10px;letter-spacing:.105em;text-transform:uppercase}.panel-topline p{margin:0}.panel-topline button{padding:0 0 3px;border:0;background:transparent;font-size:21px;cursor:pointer}.panel-intro,.panel-note{color:#ebe9e0bf;font-size:10px;line-height:1.6}.panel-intro{margin:14px 0 12px}pre{margin:0;padding:12px;overflow-x:auto;border-left:1px solid rgba(166,245,223,.6);background:#ffffff08;color:#ebe9e0d6;font-size:10px;line-height:1.64}pre b{color:#a6f5df;font-weight:500}.panel-note{margin:12px 0}.source-panel a{color:#a6f5df;font-size:10px;text-underline-offset:3px}.hint{bottom:22px;left:clamp(18px,6vw,94px);margin:0;color:#ebe9e0a3;font-size:9px;letter-spacing:.05em;text-transform:uppercase}.dot{display:inline-block;width:6px;height:6px;margin:0 7px 1px 0;border-radius:50%;background:#a6f5df;box-shadow:0 0 14px #a6f5df}kbd{padding:1px 3px;border:1px solid rgba(235,233,224,.35);font:inherit}.credit{right:clamp(17px,4.5vw,68px);bottom:52px;margin:0;color:#ebe9e07a;font-size:8px;letter-spacing:.055em;text-transform:uppercase}@media(max-width:720px){.topbar{padding:13px;font-size:8px}.title-block{top:84px;left:17px}h1{font-size:clamp(62px,21vw,116px)}.lede{margin-top:26px;font-size:9px}.lab{top:auto;right:13px;bottom:102px;width:205px;padding:9px 10px 10px}.lab label{margin-top:7px}.lab-heading{margin-bottom:8px}.palette{margin-top:9px;padding-top:8px}.presets{margin-top:9px}.presets button{padding:5px 1px;font-size:7px}.hint{bottom:14px;left:13px;max-width:260px;font-size:7px;line-height:1.7}.credit{display:none}.source-toggle{right:13px;bottom:13px;font-size:8px}.source-panel{right:13px;bottom:56px}}@media(max-width:430px){.lab{width:187px}}