@font-face{font-family:DM;src:url('/sundrift/fonts/dm-sans.ttf') format('truetype');font-display:swap}@font-face{font-family:Instrument;src:url('/sundrift/fonts/instrument-serif.ttf') format('truetype');font-display:swap}
:root{color-scheme:dark;--cream:#f3dfbd;--copper:#bd8563;--ink:#211a1b;--angle:-13deg;--metal:linear-gradient(125deg,#d5aa86,#8e5a43 26%,#c48a67 49%,#774d3c 76%,#c29a78)}*{box-sizing:border-box}[hidden]{display:none!important}html{height:100%;background:#242532}body{margin:0;height:100svh;height:100dvh;overflow:hidden;font:16px/1.5 DM,system-ui,sans-serif;color:var(--cream);isolation:isolate}a{color:inherit}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation;min-height:44px;min-width:44px;-webkit-tap-highlight-color:transparent}a,button,input{outline-offset:5px}a:focus-visible,button:focus-visible,input:focus-visible,#world:focus-visible{outline:2px dotted #ffe9b6}button{border:1px solid #b38c6c;color:#f8e9d3;background:linear-gradient(135deg,#3f302b,#221f22);border-radius:7px;padding:9px 15px;box-shadow:inset 0 1px #dfb78b24,0 3px 7px #0005}button:hover{filter:brightness(1.18)}button:active{transform:translateY(1px)}button[aria-pressed=true]{border-color:#efc792;box-shadow:inset 0 0 15px #c892514d,0 0 8px #ddbb7525;color:#fff3d7}main,#world,canvas,.vignette{position:absolute;inset:0;width:100%;height:100%}#world{touch-action:none;cursor:crosshair;outline-offset:-7px}canvas{display:block}.vignette{pointer-events:none;background:linear-gradient(0deg,#100e12b0,transparent 35%,transparent 70%,#0b101439),radial-gradient(ellipse at 50% 42%,transparent 50%,#13101769);z-index:1}.skip{position:fixed;top:-100px;left:20px;z-index:30;background:#f3dfbd;color:#211a1b;padding:12px}.skip:focus{top:15px}
.title{position:absolute;z-index:2;top:34px;left:4%;pointer-events:none;text-shadow:0 2px 14px #0b1018}.studio{pointer-events:auto;display:inline-flex;gap:30px;align-items:center;min-height:44px;text-transform:uppercase;letter-spacing:.16em;font-size:10px;text-decoration:none;color:#f2d5b2}.studio span{font-size:17px}.eyebrow{font:10px/1.5 DM,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#efd8b8;margin:32px 0 10px}h1{font:normal clamp(76px,8.7vw,140px)/.97 Instrument,Georgia,serif;letter-spacing:-.028em;margin:0;color:#f4dab4}h1 span{color:#d59c6b}.place{font:10px monospace;letter-spacing:.19em;text-transform:uppercase;color:#ead4b4;margin:20px 0}.place span{margin:0 13px;color:#dfa273}.top-tools{position:absolute;top:43px;right:4%;z-index:3;display:flex;gap:10px}.top-tools button{border-radius:30px;background:#26262bd9;font-size:12px}.top-tools #guide-open{padding:7px;font:20px Instrument,serif}.top-tools #sound span{margin-right:8px;font-size:18px}
.weather-note{position:absolute;z-index:2;right:4%;top:42%;text-align:right;pointer-events:none;text-shadow:0 2px 8px #070e15,0 0 20px #070e15}.weather-note .rule{display:block;width:36px;height:1px;background:#e5b781;margin:0 0 15px auto}.weather-note p{font:25px Instrument,Georgia,serif;margin:0 0 7px}.weather-note>span:last-child{font:10px monospace;letter-spacing:.05em;color:#f0d8b9}
.instruments{position:absolute;z-index:3;bottom:max(28px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:grid;grid-template-columns:142px 1fr 145px;gap:23px;width:790px;max-width:calc(100% - 56px);align-items:center;padding:18px 23px 14px;border:1px solid #c1977699;border-top-color:#e4b78ba6;border-radius:85px 18px 18px 85px;background:radial-gradient(ellipse at 0 0,#b4816033,transparent 55%),repeating-linear-gradient(0deg,#fff1df03 0px,#fff1df03 1px,transparent 1px,transparent 3px),linear-gradient(120deg,#46352ef2,#302b2bec 55%,#252529f2);box-shadow:inset 0 1px 2px #fdd5a34d,inset 0 -3px 6px #090a0d88,0 0 0 4px #3e282342,0 15px 35px #0005;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.instruments:before,.instruments:after{content:'+';position:absolute;right:8px;color:#b99171;font:13px monospace;text-shadow:0 1px #000}.instruments:before{top:3px}.instruments:after{bottom:3px}.dial-unit{position:relative;text-align:center;align-self:stretch;display:flex;align-items:center;flex-direction:column}.dial-unit>label{font:10px monospace;text-transform:uppercase;letter-spacing:.2em;position:absolute;top:-3px;left:0;right:0}.dial{position:relative;width:116px;height:116px;margin-top:10px;border-radius:50%;background:radial-gradient(circle,#2a2929 59%,#8e644b 60%,#c29570 62%,#3a2e29 64%);box-shadow:0 5px 10px #100e1166}.ticks{position:absolute;inset:6px;border-radius:50%;background:repeating-conic-gradient(from -132deg,#dab28b 0 1deg,transparent 1deg 12deg);mask-image:radial-gradient(circle,transparent 59%,#000 60%,#000 67%,transparent 68%);-webkit-mask-image:radial-gradient(circle,transparent 59%,#000 60%,#000 67%,transparent 68%)}.knob{position:absolute;inset:25px;border:1px solid #d4ac83;border-radius:50%;background:repeating-conic-gradient(#26191933 0 3deg,transparent 3deg 12deg),radial-gradient(circle at 37% 22%,#d7ad88,#ac7253 36%,#654736 75%);box-shadow:inset 0 0 0 5px #84654f,0 5px 7px #0009;transform:rotate(var(--angle))}.knob i{position:absolute;height:16px;width:3px;background:#ffdfab;top:6px;left:calc(50% - 1px);box-shadow:0 0 5px #e8b376}.dial-low,.dial-high{position:absolute;bottom:10px;font:6px monospace;color:#f9dfb8;letter-spacing:.05em}.dial-low{left:24px}.dial-high{right:21px}.dial-unit output{position:absolute;bottom:-3px;font:10px monospace;color:#f4dab4}.dial-unit input{position:absolute;inset:21px 0 0;width:100%;height:86px;margin:0;opacity:0;cursor:ew-resize}.dial-unit:focus-within .dial{outline:2px dotted #ffe9b6;outline-offset:4px}.middle{min-width:0}.weather-actions{display:flex;gap:7px}.weather-actions button{flex:1;font-size:10px;padding:8px 5px;background:linear-gradient(140deg,#4c3c34,#29282b);display:flex;flex-direction:column;align-items:center;gap:5px;min-height:64px}.weather-actions span{font:23px/1 Instrument,serif;color:#f1c795}.time-control{display:flex;align-items:center;gap:9px;margin-top:8px}.time-control label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.time-control span{font:9px monospace;color:#ecd1ad}input[type=range]{appearance:none;-webkit-appearance:none;min-height:44px;min-width:44px;display:block;flex:1;width:100%;background:transparent;margin:0;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(90deg,#d09b70,#857d8d 60%,#414c69);box-shadow:inset 0 1px 2px #0008;border:1px solid #bc94755c}input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:25px;border:1px solid #d8b794;border-radius:3px;background:var(--metal);margin-top:-12px;box-shadow:0 3px 4px #0009,inset 0 0 0 3px #422e2944}input[type=range]::-moz-range-track{height:4px;background:#b49a8e}input[type=range]::-moz-range-thumb{width:18px;height:25px;background:var(--metal);border:1px solid #d8b794;border-radius:3px}#gesture-hint{font-size:10px;line-height:1.4;text-align:center;color:#ecd8bd;margin:0;white-space:nowrap}.small-tools{display:flex;flex-direction:column;gap:5px;border-left:1px solid #ad82614d;padding-left:18px}.small-tools button{font-size:11px;border-color:transparent;box-shadow:none;min-height:44px;padding:7px 0;background:transparent;text-align:left}.small-tools #watch{color:#f7ddba}.small-tools #watch span{margin-left:12px}.small-tools button:hover{text-decoration:underline}
.watch-tools{position:absolute;z-index:4;bottom:max(22px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:7px;padding:6px;border:1px solid #b78c6877;border-radius:14px;background:#28252ada;max-width:calc(100% - 24px)}.watch-tools button{white-space:nowrap;font-size:11px;border:0;background:none;box-shadow:none}body.watching .title,body.watching .top-tools,body.watching .weather-note,body.watching .instruments{visibility:hidden;opacity:0;pointer-events:none}.title,.top-tools,.weather-note,.instruments{transition:opacity .5s}#status:not(:empty){position:absolute;z-index:8;top:80px;right:4%;padding:12px 18px;background:#28262bed;border:1px solid #d0aa85;max-width:min(85vw,360px);font-size:13px;border-radius:8px}.recovery{position:absolute;z-index:3;top:270px;left:4%;max-width:270px;font-size:12px;color:#f3dfbd;background:#25232bd9;padding:12px;border-radius:8px}.recovery a{display:inline-block;min-height:44px;padding-top:12px}.notice{position:absolute;z-index:20;top:25%;left:50%;transform:translateX(-50%);background:#2b2729;border:1px solid #dab18b;border-radius:12px;padding:25px;max-width:90%;width:440px}.notice a{display:inline-block;min-height:44px;padding:10px 4px}
dialog{color:#f0dcc1;border:1px solid #c39871;max-width:calc(100% - 24px);width:470px;max-height:calc(100svh - 32px);border-radius:16px;padding:25px 30px;background:radial-gradient(ellipse at 0 0,#6c49363d,transparent),#2b2728;box-shadow:inset 0 0 0 5px #997b4620,0 20px 60px #0007}dialog::backdrop{background:#0d11197a;backdrop-filter:blur(5px)}.guide-top{display:flex;justify-content:space-between;align-items:center}.guide-top .eyebrow{margin:0}.guide-top button{font-size:22px;background:none;box-shadow:none;padding:4px}h2{font:40px/1.1 Instrument,Georgia,serif;margin:20px 0}dialog p,dialog dl{font-size:16px;line-height:1.65}dialog dt{color:#f8e9d0;font-weight:bold}dialog dd{margin:6px 0 20px}dialog .small{font-size:13px;color:#dfc6aa}.calm{display:flex;align-items:center;gap:10px;min-height:52px;font-size:14px}.calm input{accent-color:#c79d74;width:24px;height:24px;margin:10px}.volume-label{display:flex;justify-content:space-between;font-size:14px;margin-top:12px}.note-link{display:inline-block;padding:12px 0;min-height:44px}
@media(max-width:700px){.title{top:max(16px,env(safe-area-inset-top));left:23px}.studio{font-size:8px;letter-spacing:.12em;gap:15px}.eyebrow{font-size:8px;letter-spacing:.15em;margin:21px 0 10px}h1{font-size:75px}.place{font-size:8px;letter-spacing:.13em;margin:13px 0}.top-tools{top:23px;right:16px;gap:6px}.top-tools #sound{font-size:0;width:44px;height:44px;padding:8px}.top-tools #sound span{font-size:22px;line-height:1;margin:0}.top-tools #sound[aria-pressed=true]{background:#66513a}.weather-note{top:auto;bottom:260px;right:23px}.weather-note p{font-size:24px}.weather-note>span:last-child{font-size:9px}.weather-note .rule{margin-bottom:9px}.instruments{bottom:max(15px,env(safe-area-inset-bottom));width:calc(100% - 26px);max-width:440px;grid-template-columns:90px 1fr;gap:8px 13px;padding:16px 15px 9px;border-radius:52px 14px 14px 14px}.dial-unit{height:118px}.dial{width:88px;height:88px;margin-top:16px}.knob{inset:20px}.knob i{height:12px;top:5px;width:2px}.dial-unit>label{font-size:9px;top:0}.dial-unit output{bottom:-1px}.dial-low,.dial-high{font-size:5px;bottom:7px}.dial-low{left:17px}.dial-high{right:14px}.dial-unit input{height:80px;top:16px}.middle{align-self:start}.weather-actions{gap:4px}.weather-actions button{font-size:9px;min-width:44px;padding:6px 3px;gap:5px;min-height:60px}.weather-actions span{font-size:21px}.time-control{gap:6px;margin-top:5px}.time-control span{font-size:8px}#gesture-hint{white-space:normal;font-size:9px;position:absolute;left:20px;right:20px;bottom:60px}.small-tools{grid-column:1/-1;display:flex;flex-direction:row;gap:8px;padding:6px 0 0;margin-top:18px;justify-content:space-between;border-left:0;border-top:1px solid #aa81604f}.small-tools button{font-size:10px;min-height:44px;text-align:center;padding:4px}.small-tools #watch span{margin-left:6px}.watch-tools{gap:0;width:max-content;padding:4px}.watch-tools button{font-size:10px;padding:10px}.recovery{top:220px;max-width:220px;font-size:11px}.recovery a{display:block}#status:not(:empty){top:220px;right:20px;font-size:12px}.vignette{background:linear-gradient(0deg,#100e1299,transparent 42%,transparent 70%,#10131a55)}dialog{padding:20px 24px}.place span{margin:0 8px}}
@media(max-width:374px){.instruments{width:calc(100% - 18px);padding:16px 10px 8px;gap:8px}.weather-actions button{font-size:8px}.title{left:20px}h1{font-size:66px}.top-tools{right:10px}.studio{font-size:7px}}
@media(max-height:680px) and (max-width:700px){.title .eyebrow{margin-top:8px}h1{font-size:60px}.place{margin-top:9px}.weather-note{bottom:245px}.weather-note .rule{display:none}.weather-note p{font-size:20px}.instruments{bottom:8px}.recovery{top:170px}#status:not(:empty){top:175px}}
@media(min-width:701px) and (max-height:560px){.title{top:12px}.title .eyebrow{margin-top:7px}h1{font-size:64px}.place{margin-top:12px}.top-tools{top:20px}.instruments{bottom:10px;padding:8px 18px;gap:16px;grid-template-columns:115px 1fr 125px;width:740px;max-width:calc(100% - 32px)}.dial{width:95px;height:95px}.knob{inset:22px}.dial-unit{height:127px}.weather-note{top:30%;right:4%}.weather-note p{font-size:22px}.weather-note .rule{display:none}.small-tools{padding-left:12px}.recovery{top:100px;left:40%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}
dialog .follow{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 14px;margin-top:10px;padding-top:16px;border-top:1px solid #c3987140}.follow-label{font:10px/1.5 DM,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#efd8b8}.rbs-social{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}.rbs-social a{display:grid;place-items:center;width:44px;height:44px;border:1px solid #c3987199;border-radius:50%;background:radial-gradient(circle at 35% 25%,#6c49364d,#211a1b);color:#f0dcc1}.rbs-social a:hover{border-color:var(--cream);color:#fff}.rbs-social svg{width:17px;height:17px}