@font-face{font-family:Bai Jamjuree;src:url(/BaiJamjuree-Medium.ttf)format("truetype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Bai Jamjuree;src:url(/BaiJamjuree-SemiBold.ttf)format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Bai Jamjuree;src:url(/BaiJamjuree-Bold.ttf)format("truetype");font-weight:700;font-style:normal;font-display:block}:root{--ground:#0b141c;--surface:#161b23;--text:#f2f5f9;--muted:#8a94a6;--lime:#bff04a;--glass-blur:5px;--badge-h:52px;--badge-gap:16px}*{box-sizing:border-box}html,body{background:var(--ground);height:100%;color:var(--text);-webkit-font-smoothing:antialiased;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;margin:0;font-family:Bai Jamjuree,system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}#stage{position:fixed;inset:0;overflow:hidden}#bg{object-fit:cover;background:var(--ground);opacity:0;width:100%;height:100%;transition:opacity .9s ease-out;position:absolute;inset:0}#bg.ready{opacity:1}#shade{pointer-events:none;background:linear-gradient(#0b141cd9 0%,#0b141c00 30% 72%,#0b141ccc 100%);position:absolute;inset:0}@media (orientation:landscape){#shade{background:linear-gradient(#0b141ccc 0%,#0b141c00 26% 56%,#0b141ccc 100%)}}#glass{pointer-events:none;height:0;-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));background:#161b239e;position:absolute;top:0;left:0;right:0;overflow:hidden;box-shadow:inset 0 1px #ffffff1a,inset 0 -1px #ffffff1a}#glass:after{content:"";background:linear-gradient(#ffffff09,#fff0);position:absolute;inset:0}#sign{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}#badges{justify-content:center;align-items:center;gap:var(--badge-gap);padding:0 16px;display:flex;position:absolute;top:0;left:0;right:0}.badge{height:var(--badge-h);opacity:0;outline-offset:4px;will-change:opacity, transform;border-radius:8px;transition:filter .2s;display:block}.badge img{width:auto;height:100%;display:block}.badge:hover,.badge:focus-visible{filter:brightness(1.12)}.badge:focus-visible{outline:2px solid var(--lime)}#sound{top:max(16px, env(safe-area-inset-top));right:max(16px, env(safe-area-inset-right));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);height:44px;color:var(--text);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;opacity:0;background:#161b23b3;border:1px solid #ffffff24;border-radius:999px;align-items:center;gap:10px;padding:0 16px 0 12px;font:700 12px/1 Bai Jamjuree,system-ui,sans-serif;transition:opacity .4s,border-color .2s,background-color .2s;display:inline-flex;position:absolute}#sound.show{opacity:1}#sound{display:none}@keyframes story-ring-spin{to{transform:rotate(360deg)}}#story-ring{top:max(16px, env(safe-area-inset-top));left:max(16px, env(safe-area-inset-left));z-index:55;cursor:pointer;opacity:0;pointer-events:none;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:50%;width:54px;height:54px;padding:2.5px;transition:opacity .4s,transform .2s;position:absolute}#story-ring.show{opacity:1;pointer-events:auto}#story-ring:before{content:"";background:conic-gradient(#f09433,#e6683c,#dc2743,#cc2366,#bc1888,#f09433);border-radius:50%;animation:3s linear infinite story-ring-spin;position:absolute;inset:0}#story-ring.viewed:before{background:#ccc;animation:none}#story-ring:hover{transform:scale(1.06)}#story-ring:active{transform:scale(.96)}#story-ring:focus-visible{outline:2px solid var(--lime);outline-offset:3px}.story-ring-inner{background:var(--ground);z-index:1;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.story-ring-inner img{object-fit:cover;border-radius:50%;width:calc(100% - 4px);height:calc(100% - 4px);display:block}@media not ((hover:hover) and (pointer:fine)){#story-ring{width:58px;height:58px}}#stories{z-index:80;touch-action:none;-webkit-user-select:none;user-select:none;background:#000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#stories[hidden]{display:none}.story-viewport{background:#111;width:100%;max-width:420px;height:100%;position:relative;overflow:hidden}@media (hover:hover) and (pointer:fine){.story-viewport{border-radius:16px;height:92vh;max-height:92vh;box-shadow:0 0 80px #bff04a1f}}.story-slide{opacity:0;pointer-events:none;transition:opacity .25s;position:absolute;inset:0}.story-slide.active{opacity:1;pointer-events:auto}.story-slide img{object-fit:cover;width:100%;height:100%;display:block}.story-header{z-index:2;background:linear-gradient(#000000d9 0%,#0000 100%);flex-direction:column;gap:14px;padding:16px 16px 24px;display:flex;position:absolute;top:0;left:0;right:0}.story-bars{gap:3px;padding:0 2px;display:flex}.story-bar{background:#ffffff4d;border-radius:2px;flex:1;height:2.5px;position:relative;overflow:hidden}.story-bar i{background:#fff;border-radius:2px;width:0;position:absolute;inset:0 auto 0 0}.story-row{justify-content:space-between;align-items:center;display:flex}.story-info{align-items:center;gap:10px;display:flex}.story-profile{color:inherit;-webkit-tap-highlight-color:transparent;align-items:center;gap:10px;text-decoration:none;display:flex}.story-profile:hover .story-name{opacity:.85}.story-avatar{border-radius:50%;flex-shrink:0;width:36px;height:36px;overflow:hidden}.story-avatar img{object-fit:cover;width:100%;height:100%}.story-name{color:#fff;letter-spacing:-.01em;font-size:.85rem;font-weight:600}.story-time{color:#ffffff80;margin-left:-4px;font-size:.75rem;font-weight:400}.story-close{color:#fff;cursor:pointer;opacity:.8;-webkit-tap-highlight-color:transparent;background:0 0;border:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.story-close:hover{opacity:1}@media (max-width:640px){.story-header{padding-top:max(12px, env(safe-area-inset-top))}}#sound:hover,#sound:focus-visible{background:#1e242ec7;border-color:#bff04a99;outline:none}#sound .icon{fill:currentColor;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}#sound .icon .line{fill:none}#sound .icon-on,#sound[aria-pressed=true] .icon-off{display:none}#sound[aria-pressed=true] .icon-on{display:block}#credit{left:max(16px, env(safe-area-inset-left));right:max(16px, env(safe-area-inset-right));bottom:max(18px, calc(env(safe-area-inset-bottom) + 6px));text-align:center;letter-spacing:.02em;color:var(--muted);opacity:0;transition:opacity var(--title-fade,.6s) ease;pointer-events:none;font-size:11px;position:absolute}#credit.show{opacity:.8}#credit .dot{margin:0 6px}#credit .reg{box-sizing:border-box;vertical-align:baseline;border:1px solid;border-radius:50%;width:.74em;height:.74em;margin-left:.3em;display:inline-block;position:relative}#credit .reg:before{content:"R";justify-content:center;align-items:center;font-size:.5em;font-weight:700;line-height:1;display:flex;position:absolute;inset:0}#credit a{color:inherit;pointer-events:auto;text-decoration:none}@media (max-width:560px){#credit{font-size:10px;line-height:1.5}#credit .dot{display:none}#credit>span,#credit>a{display:block}}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}#curtain{opacity:1;transition:opacity var(--curtain-fade,1.2s) ease-in-out;animation:.6s ease-in 15s forwards curtain-give-up}#curtain.live{animation:none}#curtain.lift{opacity:0;pointer-events:none}@keyframes curtain-give-up{to{opacity:0;visibility:hidden}}.curtain-map{opacity:0;background:url(/media/enter-bg.jpg) 50%/cover no-repeat;animation:.8s ease-out .1s forwards curtain-map-in;position:absolute;inset:0}@keyframes curtain-map-in{to{opacity:.35}}.splash{opacity:0;transition:opacity .3s ease-out;position:absolute}#curtain.loading .splash.placed{opacity:1}#curtain.lift .splash{opacity:0;transition-duration:var(--logo-fade,.25s);transition-timing-function:ease-in}.splash>div{position:absolute;inset:0;-webkit-mask:url(/logo.svg) 50%/100% 100% no-repeat;mask:url(/logo.svg) 50%/100% 100% no-repeat}.splash-dim{background:var(--lime);opacity:.13;animation:1.6s ease-in-out infinite alternate splash-breathe}.splash-fill{background:var(--lime);clip-path:polygon(-20% 0, calc(var(--p,0) * 116% - 8%) 0, calc(var(--p,0) * 116% - 16%) 100%, -20% 100%)}.splash-edge{transition:opacity .35s ease-out;overflow:hidden}.splash-edge>i{top:-10%;bottom:-10%;left:calc(var(--p,0) * 116% - 12% - 9%);background:linear-gradient(90deg,#f6ffd600 0%,#f6ffd68c 70%,#fffff0f2 92%,#f6ffd600 100%);width:10%;position:absolute;transform:skew(-12.8deg)}#curtain .enter{--u:calc(min(100vw, 100vh) / 720);--enter-delay:.45s;--rim:#e9f9bc38;--glow-near:#e1f8aa4d;--glow-far:#bff04a40;width:min(calc(.46 * (100vw - 56 * var(--u))), 200px);height:calc(72 * var(--u));padding:0 0 calc(3 * var(--u));border-radius:calc(18 * var(--u));background:linear-gradient(rgba(236, 251, 201, var(--hot,0)), rgba(236, 251, 201, var(--hot,0))), linear-gradient(#c9f267 0%, #c4f158 50%, #b6e24c 75%, #a8d341 100%);box-shadow:inset 0 calc(2 * var(--u)) calc(3 * var(--u)) calc(-1 * var(--u)) #ffffff52, inset 0 0 0 calc(1.5 * var(--u)) var(--rim), 0 0 0 calc(1.5 * var(--u)) var(--rim-out,#cdf36e4d);color:var(--ground);font:700 calc(26 * var(--u)) / 1 "Bai Jamjuree", system-ui, sans-serif;cursor:pointer;-webkit-tap-highlight-color:transparent;opacity:0;border:0;transition:opacity .25s linear,transform .15s ease-out,--hot .3s cubic-bezier(.16,1,.3,1);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#curtain .enter:before{content:"";z-index:-1;border-radius:inherit;box-shadow:0 0 calc(5 * var(--u)) calc(1 * var(--u)) var(--glow-near), 0 0 calc(16 * var(--u)) var(--glow-far);transition:box-shadow .3s cubic-bezier(.16,1,.3,1);animation:2.42s ease-in-out infinite alternate enter-breathe;position:absolute;inset:0}@property --hot{syntax:"<number>";inherits:true;initial-value:0}@keyframes enter-in{0%{opacity:0;transform:translate(-50%,-50%)scale(.96)}}@property --siren-r{syntax:"<number>";inherits:false;initial-value:0}@property --siren-b{syntax:"<number>";inherits:false;initial-value:0}@keyframes enter-siren{0%{--siren-r:0;--siren-b:0}1%{--siren-r:0;--siren-b:0}5%{--siren-r:.68;--siren-b:0}9%{--siren-r:0;--siren-b:0}11%{--siren-r:0;--siren-b:0}15%{--siren-r:.48;--siren-b:0}19%{--siren-r:0;--siren-b:0}26%{--siren-r:0;--siren-b:0}30%{--siren-r:0;--siren-b:.82}34%{--siren-r:0;--siren-b:0}36%{--siren-r:0;--siren-b:0}40%{--siren-r:0;--siren-b:.58}44%{--siren-r:0;--siren-b:0}51%{--siren-r:0;--siren-b:0}55%{--siren-r:.68;--siren-b:0}59%{--siren-r:0;--siren-b:0}61%{--siren-r:0;--siren-b:0}65%{--siren-r:.48;--siren-b:0}69%{--siren-r:0;--siren-b:0}76%{--siren-r:0;--siren-b:0}80%{--siren-r:0;--siren-b:.82}84%{--siren-r:0;--siren-b:0}86%{--siren-r:0;--siren-b:0}90%{--siren-r:0;--siren-b:.58}94%{--siren-r:0;--siren-b:0}to{--siren-r:0;--siren-b:0}}#curtain .enter:after{content:"";z-index:-1;border-radius:inherit;pointer-events:none;box-shadow:calc(-16 * var(--u)) 0 calc(32 * var(--u)) calc(2 * var(--u)) rgba(255, 46, 51, var(--siren-r)), calc(16 * var(--u)) 0 calc(32 * var(--u)) calc(2 * var(--u)) rgba(51, 107, 255, var(--siren-b));position:absolute;inset:0}#curtain .enter.placed:after{animation:enter-siren 1.43s linear var(--enter-delay) both}@keyframes enter-breathe{0%{opacity:.9}to{opacity:1}}#curtain .enter.placed{opacity:1;animation:enter-in .6s cubic-bezier(.25, 1, .5, 1) var(--enter-delay) backwards;transition-duration:0s,.15s,.3s}#curtain .enter.placed:before{animation:enter-in-glow .6s ease-out var(--enter-delay) backwards, enter-breathe 2.42s ease-in-out infinite alternate .6s}@keyframes enter-in-glow{0%{opacity:0}}#curtain .enter:hover{--glow-near:#e1f8aa80;--glow-far:#bff04a91}#curtain .enter:active{--hot:.35;--rim:#f0fcd278;--glow-near:#e1f8aa66;--glow-far:#bff04a73;transition:none}#curtain .enter:active:before{transition:none}#curtain .enter:focus-visible{outline:2px solid var(--text);outline-offset:calc(6 * var(--u))}@media (hover:hover) and (pointer:fine){#curtain .enter{width:calc(.5 * clamp(300 * var(--u), 33vw, 420 * var(--u)));height:calc(46 * var(--u));padding-bottom:calc(2 * var(--u));border-radius:calc(12 * var(--u));font-size:calc(18 * var(--u))}}#curtain.entered .enter{opacity:0;pointer-events:none;transition-duration:.25s}#curtain.full .splash-edge{opacity:0}#curtain.full .splash-dim{animation:none}@keyframes splash-breathe{0%{opacity:.1}to{opacity:.2}}@media (prefers-reduced-motion:reduce){#bg{transition:none}.splash-dim{animation:none}.splash-edge{display:none}#curtain .enter.placed,#curtain .enter.placed:before,#curtain .enter.placed:after{animation:none}}#how{color:var(--muted);font-family:Bai Jamjuree,system-ui,sans-serif;font-weight:700;font-size:clamp(15px, calc(var(--badge-h) * .36), 18px);letter-spacing:.01em;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:color .2s ease, opacity var(--title-fade,0s) linear;background:0 0;border:0;border-radius:8px;padding:8px 14px;line-height:1;position:absolute;top:0;left:50%;transform:translate(-50%)}#sign,#badges{transition:opacity var(--title-fade,0s) linear}#how span{opacity:0;will-change:opacity, transform;display:block}#how:hover,#how:focus-visible{color:var(--lime)}#how:focus-visible{outline:2px solid var(--lime);outline-offset:2px}#how:active{color:var(--lime)}:root{--tu:1px;--sai-l:env(safe-area-inset-left,0px);--sai-r:env(safe-area-inset-right,0px);--sai-t:env(safe-area-inset-top,0px);--sai-b:env(safe-area-inset-bottom,0px)}#tutorial{z-index:50;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;cursor:grab;position:fixed;inset:0;overflow:hidden}#tutorial[hidden]{display:none}#sound{z-index:60}.tut-shade{background:linear-gradient(#0b141ceb 0%,#0b141c99 25% 75%,#0b141cf0 100%);position:absolute;inset:0}.tut-stack{transform-origin:50%;will-change:transform, opacity;position:absolute;top:0;left:0}.tut-card{--lift:0;--bw:1.5;--bc:#ffffff1a;gap:calc(36 * var(--tu));padding:calc(28 * var(--tu)) calc(28 * var(--tu)) calc(72 * var(--tu));border-radius:calc(36 * var(--tu));box-shadow:inset 0 0 0 calc(2 * var(--tu)) #ffffff1a;transform-origin:50%;will-change:transform;background:#161b23eb;flex-direction:column;display:flex;position:absolute;inset:0}.tut-card.glass{box-shadow:none;-webkit-backdrop-filter:blur(calc(12 * var(--tu)));backdrop-filter:blur(calc(12 * var(--tu)));background:#1f252b7a}.tut-card.glass:before{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(#ffffff0b,#fff0);position:absolute;inset:0}.tut-card.glass:after{content:"";border-radius:inherit;border:calc(var(--bw) * var(--tu)) solid var(--bc);pointer-events:none;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000,#00000059);mask-image:linear-gradient(#000,#00000059)}.tut-art{border-radius:calc(24 * var(--tu));background:var(--ground);isolation:isolate;flex:auto;min-height:0;position:relative;overflow:hidden;transform:translateZ(0)}.tut-art video{object-fit:cover;border-radius:inherit;background:var(--ground);width:100%;height:100%;position:absolute;inset:0}.tut-card:not(.glass) video{visibility:hidden}.tut-art:after{content:"";border-radius:inherit;box-shadow:inset 0 0 0 max(1px, var(--tu)) #ffffff12;pointer-events:none;position:absolute;inset:0}.tut-text{flex-direction:column;flex:none;min-width:0;display:flex}.tut-text h2{font-family:inherit;font-weight:700;font-size:calc(40 * var(--tu));line-height:calc(55 * var(--tu));color:var(--text);margin:0}.tut-text p{margin:calc(14 * var(--tu)) 0 0;font-family:inherit;font-weight:500;font-size:calc(26 * var(--tu));line-height:calc(40.8 * var(--tu));color:var(--muted)}#tutorial.wide .tut-card{padding:calc(28 * var(--tu));flex-direction:row}#tutorial.wide .tut-art{flex:1.15 1 0;min-width:0}#tutorial.wide .tut-text{flex:1 1 0;justify-content:center}.tut-dots{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute}.tut-row{align-items:center;gap:calc(10 * var(--tu));display:flex}.tut-row i{height:calc(10 * var(--tu));border-radius:calc(5 * var(--tu));background:#ffffff2e;display:block}.tut-arrow{width:calc(44 * var(--tu));height:calc(44 * var(--tu));color:#ffffff61;pointer-events:auto;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;padding:0;position:absolute;top:0}.tut-arrow svg{width:100%;height:100%;display:block;overflow:visible}.tut-arrow path{fill:none;stroke:currentColor;stroke-width:2px}.tut-arrow:active{color:#ffffffc7}.tut-arrow.left:active svg{transform:translateX(calc(-4 * var(--tu)))}.tut-arrow.right:active svg{transform:translateX(calc(4 * var(--tu)))}.tut-back{padding:0 0 calc(4 * var(--tu));border:calc(2 * var(--tu)) solid #ffffff38;border-radius:calc(22 * var(--tu));background:var(--surface);color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent;font-family:Bai Jamjuree,system-ui,sans-serif;font-weight:700;line-height:1;position:absolute}.tut-back:active{background:var(--ground);color:var(--muted)}.tut-back:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
