.desk-stage{--u:calc(100cqw/1536);--mid:.45;--wash-strength:1;--line-opacity:.9;width:100%;position:relative;container-type:inline-size}:root:not([data-theme=light]) .desk-stage{--color-paper:#fff;--color-ink:#0e1726}.desk-plate,.desk-layer{--h0:var(--h,var(--happier,1));--c:clamp(0,calc(var(--h0)*2),1);--hi:clamp(0,calc(var(--h0)*2 - 1),1);--k:calc(var(--mid) + (1 - var(--mid))*var(--hi));display:block;position:absolute}.desk-plate{inset:0}.desk-stage :is(.desk-layer,.desk-spot,.desk-drawing){position:absolute}.desk-spot{display:block}.desk-stage .desk-layer{pointer-events:none;--e0:var(--e,var(--easier,.5));--x:clamp(0,calc((var(--e0) - var(--sa,0))/(var(--sb,1) - var(--sa,0))),1);--p:clamp(0,calc((var(--e0) - var(--ta,0))/(var(--tb,1) - var(--ta,0))),1);--g:clamp(0,calc((var(--e0) - var(--fa,0))/(var(--fb,1) - var(--fa,0))),1);inset:0}.desk-drawing{pointer-events:auto;background:0 0;border:0;padding:0;display:block}.desk-layer[data-kind=paired] .desk-drawing--messy{opacity:calc(1 - var(--x))}.desk-layer[data-kind=paired] .desk-drawing--clean{opacity:var(--x);translate:calc(var(--dx)*var(--u)*(var(--p) - 1))calc(var(--dy)*var(--u)*(var(--p) - 1));scale:calc((var(--s0) + (1 - var(--s0))*var(--p))*(1 + var(--lift,0)))}.desk-layer[data-move=hop]{--out:clamp(0,calc((var(--e0) - var(--ha))/(var(--hb) - var(--ha))),1);--in:clamp(0,calc((var(--e0) - var(--hb))/(var(--hc) - var(--hb))),1);--p:clamp(0,calc((var(--e0) - var(--hb))*1000),1)}.desk-layer[data-move=hop] .desk-drawing--clean{opacity:calc(var(--x)*(1 - var(--out) + var(--in)));translate:calc(var(--dx)*var(--u)*(var(--p) - 1))calc(var(--dy)*var(--u)*(var(--p) - 1) - (var(--out) - var(--in))*10*var(--u));scale:calc((var(--s0) + (1 - var(--s0))*var(--p))*(1 + .04*(var(--out) - var(--in))))}.desk-layer[data-kind=messy] .desk-drawing{opacity:calc(1 - var(--g));translate:0 calc(var(--g)*8*var(--u));scale:calc(1 - .06*var(--g))}.desk-layer[data-kind=clean] .desk-drawing{opacity:var(--g);scale:calc(.94 + .06*var(--g))}.desk-stage[data-easier=low] .desk-drawing--clean,:root[data-easier=low] .desk-stage:not([data-easier]) .desk-drawing--clean,.desk-stage[data-easier]:not([data-easier=low]) .desk-layer[data-kind=paired] .desk-drawing--messy,:root:not([data-easier=low]) .desk-stage:not([data-easier]) .desk-layer[data-kind=paired] .desk-drawing--messy,.desk-stage[data-easier=high] .desk-layer[data-kind=messy] .desk-drawing,:root[data-easier=high] .desk-stage:not([data-easier]) .desk-layer[data-kind=messy] .desk-drawing{pointer-events:none}.desk-base,.desk-wash,.desk-lines{display:block;position:absolute;inset:0}.desk-base{background:var(--color-paper);-webkit-mask-image:var(--mask);mask-image:var(--mask);-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-image:var(--mask);-webkit-mask-size:100% 100%}.desk-wash img{-webkit-user-select:none;user-select:none}.desk-lines{background:var(--color-ink);opacity:var(--line-opacity);-webkit-mask-image:var(--src);mask-image:var(--src);-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-image:var(--src);-webkit-mask-size:100% 100%}[data-reveal=fade] .desk-wash{opacity:calc(var(--c)*var(--k)*var(--wash-strength))}[data-reveal=brush] .desk-wash{opacity:calc(var(--k)*var(--wash-strength));-webkit-mask-image:url(/desk/brush.webp);mask-image:url(/desk/brush.webp);-webkit-mask-size:300% 100%;mask-size:300% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:calc((1 - var(--c))*100%)0;mask-position:calc((1 - var(--c))*100%)0;-webkit-mask-image:url(/desk/brush.webp);-webkit-mask-size:300% 100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:calc((1 - var(--c))*100%)0}[data-reveal=bloom] .desk-wash{opacity:calc(var(--k)*var(--wash-strength));-webkit-mask-image:url(/desk/bloom.webp);mask-image:url(/desk/bloom.webp);-webkit-mask-position:50%;mask-position:50%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:calc(var(--c)*290%)calc(var(--c)*290%);mask-size:calc(var(--c)*290%)calc(var(--c)*290%);-webkit-mask-image:url(/desk/bloom.webp);-webkit-mask-position:50%;-webkit-mask-repeat:no-repeat;-webkit-mask-size:calc(var(--c)*290%)calc(var(--c)*290%)}[data-mid=desat] .desk-wash{--k:calc(.85 + .15*var(--hi));filter:saturate(calc(.2 + .8*var(--hi)))}[data-mid=some] :is(.desk-layer,.desk-plate){--k:1}[data-mid=some] :is(.desk-layer[data-group=b],.desk-plate){--c:var(--hi)}.desk-stage[data-rm] .desk-drawing,.desk-stage[data-rm] .desk-wash{transition:opacity .3s}.desk-frame{transition:opacity .4s var(--ease-out)}.desk-frame:not([data-ready]){opacity:0;animation:0s 2.5s forwards desk-show}@keyframes desk-show{to{opacity:1}}@media (prefers-reduced-motion:reduce){.desk-frame{transition:none}}.desk-frame[data-framing=soft]{--soft:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 200' preserveAspectRatio='none'%3E%3Cfilter id='b' x='-10%25' y='-10%25' width='120%25' height='120%25'%3E%3CfeGaussianBlur stdDeviation='6'/%3E%3C/filter%3E%3Crect x='12' y='10' width='276' height='180' rx='30' filter='url(%23b)'/%3E%3C/svg%3E");-webkit-mask-image:var(--soft);mask-image:var(--soft);-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-image:var(--soft);-webkit-mask-size:100% 100%}.desk-frame[data-framing=full]{-webkit-mask-composite:source-in;-webkit-mask-image:linear-gradient(90deg,#0000,#000 7% 93%,#0000),linear-gradient(#0000,#000 5% 88%,#0000);mask-image:linear-gradient(90deg,#0000,#000 7% 93%,#0000),linear-gradient(#0000,#000 5% 88%,#0000);-webkit-mask-composite:source-in;mask-composite:intersect}.desk-frame[data-framing=crop]{aspect-ratio:1536/560;-webkit-mask-composite:source-in;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 7% 93%,#0000),linear-gradient(#0000,#000 32% 82%,#0000);mask-image:linear-gradient(90deg,#0000,#000 7% 93%,#0000),linear-gradient(#0000,#000 32% 82%,#0000);-webkit-mask-composite:source-in;mask-composite:intersect}.desk-frame[data-framing=crop] .desk-stage{margin-top:-25.3333%}.desk-frame[data-framing^=circle]{aspect-ratio:1;clip-path:circle(50%);overflow:hidden}.desk-frame[data-framing^=circle] .desk-stage{width:calc(1536/var(--cd)*100%);margin-left:calc((var(--cd)/2 - var(--cx))/var(--cd)*100%);margin-top:calc((var(--cd)/2 - var(--cy))/var(--cd)*100%)}.desk-frame[data-framing=circle]{--cd:1100;--cx:768;--cy:525;-webkit-mask-image:radial-gradient(closest-side,#000 66%,#0000 100%);mask-image:radial-gradient(closest-side,#000 66%,#0000 100%)}.desk-frame[data-framing=circle-crisp]{--cd:1000;--cx:768;--cy:520}@media (max-width:639px){.desk-frame[data-framing=soft]{aspect-ratio:1024/750;overflow:hidden}.desk-frame[data-framing=soft] .desk-stage{width:150%;margin-top:-24.4141%;margin-left:-25%}}.desk [data-hud-label]:focus-visible{outline:none}.desk-hud{z-index:10;border-width:1px}.desk-hud[data-on]{opacity:1}.desk-hud[data-strong]{border-width:2px;border-color:var(--color-hud-strong)}.desk-hud[data-strong] .hud-tag{background:var(--color-hud-strong)}.desk-hud .hud-tag{translate:var(--tag-dx,0px)0;animation:desk-tag-in .26s var(--ease-out);align-items:center;gap:4px;display:inline-flex;left:-1px}@keyframes desk-tag-in{0%{translate:var(--tag-dx,0px)4px}}.desk-tag-icon{opacity:.75;flex:none;width:10px;height:10px}.desk-hud[data-tag=below] .hud-tag{border-radius:0 3px 3px;margin:-1px 0 0;animation-name:desk-tag-in-below;top:100%;bottom:auto}@keyframes desk-tag-in-below{0%{translate:var(--tag-dx,0px)-4px}}.desk-hud[data-tag=inside] .hud-tag{border-radius:0 0 3px;margin:0;top:0;bottom:auto;left:0}.desk-hud .hud-tag[data-shifted]{border-radius:3px}.desk-hud[data-type=component]{--color-component:#9747ff;border-color:var(--color-component)}.desk-hud[data-type=component] .hud-tag{background:var(--color-component);color:#fff}@media (prefers-reduced-motion:reduce){.desk-hud .hud-tag{animation:none}}@media (hover:none){.desk-hud:not([data-strong]){display:none}}:root:not([data-theme=light]) .desk-plate{background:var(--color-paper)}.desk-night,.desk-moon,.desk-sun-patch,.desk-sun-clip{pointer-events:none;display:block;position:absolute}.desk-night{opacity:0;background-repeat:no-repeat;background-size:100% 100%;inset:0}.desk-night-sky{mix-blend-mode:multiply;background-image:url(/desk/night-sky.webp)}.desk-night-glints{mix-blend-mode:screen;background-image:url(/desk/night-glints.webp)}.desk-night-dusk{mix-blend-mode:multiply;background-image:url(/desk/night-dusk.webp)}.desk-night-lamp{mix-blend-mode:color-dodge;background-image:url(/desk/night-lamp.webp)}.desk-night-glow{--lx:calc(1452*var(--u));--ly:calc(571*var(--u));background:radial-gradient(calc(30*var(--u))calc(16*var(--u))at var(--lx)var(--ly),#ffe2aaf2,#ffce8c00 100%),radial-gradient(calc(150*var(--u))calc(120*var(--u))at var(--lx)var(--ly),#ffc4786b,#ffba6e00 100%),radial-gradient(calc(420*var(--u))calc(300*var(--u))at var(--lx)calc(var(--ly) + 60*var(--u)),#ffbe6e24,#ffb46400 100%);mix-blend-mode:screen}.desk-moon{opacity:0;translate:0 calc(10*var(--u));fill:#fbefc6;stroke:#0e1726;stroke-width:1.1px;stroke-opacity:.55;filter:drop-shadow(0 0 calc(5*var(--u))#ffecb48c);overflow:visible}.desk-sun-patch{background:var(--color-paper);-webkit-mask-image:url(/desk/sun-patch-mask.webp);mask-image:url(/desk/sun-patch-mask.webp);-webkit-mask-size:100% 100%;mask-size:100% 100%}.desk-sun-clip{overflow:hidden}.desk-sun{display:block;position:absolute}.desk-sun-wash{opacity:calc(var(--c)*var(--k)*var(--wash-strength));background-size:100% 100%;display:block;position:absolute;inset:0}.desk-night-lamp,.desk-night-glow{transition:opacity .26s ease-out}.desk-night-glints,.desk-moon{transition:opacity .4s ease-out,translate .4s ease-out}.desk-night-dusk{transition:opacity 1.2s cubic-bezier(.4,0,.3,1) .2s}.desk-night-sky{transition:opacity 1.2s cubic-bezier(.4,0,.3,1) .3s}.desk-sun{transition:translate 1.3s cubic-bezier(.25,.6,.3,1) .25s}:root:not([data-theme=light]) :is(.desk-night,.desk-moon){opacity:1}:root:not([data-theme=light]) .desk-moon{transition:opacity 1s ease-out 1.5s,translate 1.4s var(--ease-out)1.5s;translate:0}:root:not([data-theme=light]) .desk-sun{translate:0 calc(46*var(--u));transition:translate 1.5s cubic-bezier(.45,0,.6,1)}:root:not([data-theme=light]) .desk-night-sky{transition:opacity 1.5s cubic-bezier(.4,0,.5,1) .1s}:root:not([data-theme=light]) .desk-night-dusk{transition:opacity 1.4s cubic-bezier(.15,.55,.35,1)}:root:not([data-theme=light]) :is(.desk-night-lamp,.desk-night-glow){transition:opacity .6s linear(0,.85 10%,.2 22%,.75 34%,.45 46%,1 60%,1)1.15s}:root:not([data-theme=light]) .desk-night-glints{transition:opacity 1.1s ease-out 1.45s}:root:not([data-theme=light]) .desk-spot[data-when=day],:root[data-theme=light] .desk-spot[data-when=night]{pointer-events:none;visibility:hidden}@media (prefers-reduced-motion:reduce){.desk-night,.desk-moon,.desk-sun{transition:none!important}}