@font-face{font-family:Abar;src:url(/fonts/AbarMid-ExtraBold.woff2) format("woff2");font-weight:800;font-style:normal;font-display:swap}@font-face{font-family:Abar;src:url(/fonts/AbarMid-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}:root{--burgundy: #4d110f;--blush: #e4cabc;--stone: #dfdad4;--black: #000;--white: #fff}*{box-sizing:border-box}html,body{margin:0;background:var(--stone);color:var(--black);font-family:Abar,Tahoma,sans-serif;overflow-x:clip}#space{height:500vh}body{transition:background-color .9s ease}#view{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:1;display:block;transform-origin:60% 50%}#line,#breaks{position:fixed;z-index:3;margin:0;font-weight:800;line-height:1.15;pointer-events:none;max-width:calc(100vw - 36px)}#line{right:22px;bottom:calc(env(safe-area-inset-bottom) + 108px);font-size:clamp(2rem,9vw,4.4rem);transition:color .8s ease,opacity .45s ease}#breaks{top:0;right:0;bottom:0;left:0;display:none;font-size:clamp(4.2rem,22vw,11rem);letter-spacing:0}body.pour #line{right:auto;left:18px;top:14vh;bottom:auto;font-size:clamp(2.4rem,11vw,5.5rem);color:var(--burgundy)}body.shatter{background:var(--burgundy)}body.shatter #line{display:none}body.shatter #view{filter:none}body.fire{background:#140807}body.fire #line{left:16px;right:16px;bottom:auto;top:10vh;color:var(--white);font-size:clamp(1.7rem,7.4vw,3.6rem);max-width:11em}body.snap{background:var(--black)}body.snap #line{display:none}body.snap #breaks{display:block;color:var(--white)}#breaks{transition:transform .9s cubic-bezier(.16,1,.3,1),color .8s ease,top .8s ease,bottom .8s ease,left .8s ease,right .8s ease,font-size .8s ease}body.snap.b0 #breaks{top:8vh;right:6vw;left:auto;font-size:clamp(4.5rem,24vw,12rem)}body.snap.b1{background:var(--white)}body.snap.b1 #breaks{color:var(--burgundy);top:auto;bottom:18vh;left:4vw;right:auto;transform:rotate(-6deg)}body.snap.b2{background:var(--burgundy)}body.snap.b2 #breaks{top:34vh;right:0;left:0;text-align:center;font-size:clamp(5rem,28vw,14rem)}body.snap.b3{background:var(--blush)}body.snap.b3 #breaks{top:6vh;left:8vw;right:auto;font-size:clamp(2.2rem,10vw,4rem);color:var(--black)}body.form{background:var(--white)}body.form #line,body.form #breaks{display:none}body.form #view{opacity:0;pointer-events:none}#mute{position:fixed;z-index:8;left:calc(env(safe-area-inset-left) + 12px);top:calc(env(safe-area-inset-top) + 12px);min-width:52px;min-height:48px;border:1.5px solid var(--burgundy);background:var(--white);color:var(--burgundy);font-family:inherit;font-weight:800;font-size:1rem;border-radius:999px}body.shatter #mute,body.fire #mute,body.snap.b0 #mute,body.snap.b2 #mute{background:transparent;color:var(--white);border-color:var(--white)}#mute[aria-pressed=true]{opacity:.55}#sheet{position:fixed;z-index:5;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:flex-end;gap:14px;padding:calc(env(safe-area-inset-top) + 28px) calc(env(safe-area-inset-right) + 22px) calc(env(safe-area-inset-bottom) + 28px) calc(env(safe-area-inset-left) + 22px);background:var(--white)}#sheet[hidden]{display:none!important}#sheet label{display:flex;flex-direction:column;gap:6px;font-weight:800}#sheet span{font-size:.95rem}#sheet input{width:100%;border:0;border-bottom:2px solid var(--burgundy);background:transparent;font:800 1.35rem/1.4 Abar,Tahoma,sans-serif;padding:10px 0;border-radius:0;color:var(--black)}#send{margin-top:8px;min-height:54px;border:0;border-radius:999px;background:var(--burgundy);color:var(--blush);font:800 1.15rem Abar,Tahoma,sans-serif}#note{margin:0;color:var(--burgundy);font-weight:800}.mark{width:112px;height:auto;display:block;margin-top:6px}#ruler{position:fixed;z-index:8;left:50%;bottom:calc(env(safe-area-inset-bottom) + 14px);width:min(420px,calc(100vw - 28px));height:62px;transform:translate(-50%);pointer-events:none;color:#fff}#ruler-window{position:relative;width:100%;height:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 88%,transparent 100%)}#ruler-track{position:absolute;top:0;left:0;height:100%;will-change:transform}.tick{position:absolute;top:0;width:12px;height:100%;display:flex;flex-direction:column;align-items:center}.tick-line{width:1px;transform-origin:top center;background:#fff6}.tick.minor .tick-line{height:9px}.tick.major .tick-line{height:18px;background:#ffffffb8}.tick-label{margin-top:4px;font-size:12px;font-weight:700;letter-spacing:0;white-space:nowrap;color:#ffffff8c;transition:color .4s ease,opacity .4s ease,font-weight .4s ease}.tick-label.is-hot{font-weight:800;color:#fff}#ruler-needle{position:absolute;top:0;left:50%;width:2px;height:18px;background:#ffffffeb;transform:translate(-50%);transition:background .4s ease}#ruler.ink{color:var(--burgundy)}#ruler.ink .tick-line{background:#4d110f47}#ruler.ink .tick.major .tick-line{background:#4d110f8c}#ruler.ink .tick-label{color:#4d110f73}#ruler.ink .tick-label.is-hot{color:var(--burgundy)}#ruler.ink #ruler-needle{background:#4d110fe6}@media(min-width:900px){#line{right:8vw;bottom:12vh}#sheet{justify-content:center;padding-right:12vw;padding-left:38vw}.mark{width:140px}}@media(max-width:480px){#line{right:16px;max-width:calc(100% - 32px)}body.fire #line{font-size:clamp(1.55rem,7vw,2rem)}}