:root{--ink:#f7f3ec;--ink-2:#f7f3ecbd;--ink-3:#f7f3ec85;--glass:#1014268f;--glass-2:#101426d6;--line:#ffffff21;--sun:#ffb35c;--sun-2:#ff8f6b;--radius:18px;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--bar-h:64px;--font:"Pretendard Variable", Pretendard, "Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;background:#10152a;margin:0;overflow:hidden}#app{height:100dvh;position:fixed;inset:0}#stage{position:absolute;inset:0}#stage canvas{touch-action:none;width:100%;height:100%;display:block}button{font:inherit;color:inherit;cursor:pointer}.num{font-variant-numeric:tabular-nums}#labels{pointer-events:none;position:absolute;inset:0;overflow:hidden}.lbl{white-space:nowrap;color:#fff;-webkit-backdrop-filter:blur(6px);will-change:transform;background:#0e12229e;border:1px solid #ffffff1f;border-radius:999px;padding:3px 9px;font-size:12px;font-weight:600;position:absolute;top:0;left:0}.lbl small{color:var(--ink-3);margin-left:2px;font-weight:500}.lbl.mark{color:#ffffffe6;background:#0e122273;font-size:11.5px}.lbl.walker{background:#0e122280;padding:2px 8px;font-size:11px}.lbl.walker.me{color:#2a1606;background:#ffb35ce6;border-color:#fff6}.lbl.walker.me small{color:#2a160699}.lbl.say{color:#1d2233;background:#faf7f0f0;border-color:#0000000f;border-radius:14px;font-size:12.5px;font-weight:500}.lbl.say b{color:#9a5418;margin-right:2px;font-weight:700}.lbl.emote{-webkit-backdrop-filter:none;background:0 0;border:0;padding:0;font-size:30px;animation:.35s ease-out pop}.lbl.wish{color:#4a2a10;background:#fff4e2e6;border-color:#ffbe7899;border-radius:10px;align-items:center;gap:6px;padding:4px 10px;font-size:12.5px;font-weight:600;display:flex}.lbl.wish i{background:var(--sun);width:7px;height:9px;box-shadow:0 0 8px var(--sun);border-radius:2px 2px 3px 3px}.lbl.wish.mine{color:#2a1606;background:#ffb35cf2}.lbl.wish.mine i{background:#fff6e8}@keyframes pop{0%{opacity:0;transform:scale(.4)}}#top{top:calc(var(--safe-t) + 10px);left:calc(var(--safe-l) + 10px);right:calc(var(--safe-r) + 10px);pointer-events:none;z-index:5;justify-content:space-between;align-items:flex-start;gap:8px;display:flex;position:absolute}#top .right{gap:6px;display:flex}.pill{pointer-events:auto;border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(14px)saturate(1.2);min-height:44px;color:var(--ink);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:0 14px;display:inline-flex}.pill b{font-size:15px;font-weight:750}.pill small{color:var(--ink-3);font-size:11.5px}.pill i{color:var(--ink-3);font-size:11px;font-style:normal}.pill.small{gap:4px;padding:0 12px}.pill.small b{font-size:14px}#spotBtn{flex-direction:row}.dot{background:#6ff0a0;border-radius:50%;width:7px;height:7px;animation:2.4s ease-in-out infinite live;box-shadow:0 0 0 3px #6ff0a02e}@keyframes live{50%{box-shadow:0 0 0 6px #6ff0a00a}}#clock{top:calc(var(--safe-t) + 64px);z-index:4;background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);text-align:center;pointer-events:none;border-radius:22px;flex-direction:column;align-items:center;gap:1px;min-width:210px;padding:10px 22px 12px;transition:box-shadow 1.2s,background 1.2s;display:flex;position:absolute;left:50%;transform:translate(-50%)}#clock small{color:var(--ink-2);letter-spacing:.02em;font-size:12.5px;font-weight:600}#clock b{letter-spacing:-.02em;font-size:38px;font-weight:780;line-height:1.12}#clock span{color:var(--ink-3);font-size:12px}body[data-phase=dawn] #clock{box-shadow:0 0 40px #ff965a2e}body[data-phase=rise] #clock{background:#28161280;border-color:#ffd2a08c;box-shadow:0 0 60px #ffaa5a59}body[data-phase=rise] #clock small{color:#fff}#big{z-index:3;letter-spacing:-.02em;color:#fff7ea;text-shadow:0 2px 30px #ffa0508c,0 1px 3px #00000059;opacity:0;pointer-events:none;white-space:nowrap;font-size:clamp(34px,9vw,72px);font-weight:800;transition:opacity .9s,transform .9s;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)scale(.96)}#big.show{opacity:.94;transform:translate(-50%,-50%)scale(1)}#big.count{font-variant-numeric:tabular-nums;opacity:.55;font-size:clamp(64px,18vw,140px);transition:opacity .25s}#toast{left:50%;top:calc(var(--safe-t) + 152px);z-index:9;color:#1d2233;text-align:center;background:#faf7f0f2;border-radius:14px;width:max-content;max-width:min(92vw,460px);padding:10px 16px;font-size:14px;line-height:1.45;position:absolute;transform:translate(-50%);box-shadow:0 10px 30px #00000040}#bar{left:50%;bottom:calc(var(--safe-b) + 10px);z-index:6;background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(16px)saturate(1.2);border-radius:24px;gap:4px;padding:5px;display:flex;position:absolute;transform:translate(-50%)}#bar button{background:0 0;border:0;border-radius:19px;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-width:72px;min-height:54px;padding:4px 10px;display:flex}#bar button i{font-size:20px;font-style:normal;line-height:1}#bar button span{color:var(--ink-2);font-size:12px;font-weight:650}#bar button.hot{background:#ffb35c33}#bar button.hot span{color:#ffd8ac}#bar button.on{background:#ffffffeb}#bar button.on span{color:#1d2233}#bar button:focus-visible,.pill:focus-visible,.btn:focus-visible,.chip:focus-visible{outline:2px solid var(--sun);outline-offset:2px}#credit{left:calc(var(--safe-l) + 12px);bottom:calc(var(--safe-b) + 82px);z-index:2;color:#ffffff94;text-shadow:0 1px 2px #0009;max-width:60vw;font-size:10.5px;line-height:1.4;position:absolute}#credit a{color:inherit}#sheet{left:50%;bottom:calc(var(--safe-b) + 80px);z-index:7;overscroll-behavior:contain;background:var(--glass-2);border:1px solid var(--line);-webkit-backdrop-filter:blur(20px)saturate(1.2);border-radius:22px;width:min(480px,100% - 16px);max-height:min(62dvh,560px);padding:8px 16px 16px;animation:.22s ease-out up;position:absolute;overflow-y:auto;transform:translate(-50%);box-shadow:0 18px 50px #0006}@keyframes up{0%{opacity:0;transform:translate(-50%,12px)}}.grab{background:#ffffff38;border-radius:4px;width:36px;height:4px;margin:2px auto 10px}.sh-h{flex-direction:column;gap:2px;margin-bottom:12px;display:flex}.sh-h b{font-size:17px}.sh-h span{color:var(--ink-3);font-size:12.5px}.grid{gap:6px;display:grid}.grid.say{grid-template-columns:1fr 1fr}.grid.ges{grid-template-columns:repeat(3,1fr)}.grid button{border:1px solid var(--line);text-align:left;background:#ffffff0f;border-radius:14px;min-height:48px;padding:8px 10px;font-size:14px}.grid.ges button{text-align:center;color:var(--ink-2);flex-direction:column;align-items:center;gap:4px;font-size:12.5px;display:flex}.grid.ges button i{font-size:26px;font-style:normal}.grid button:active{background:#ffffff29}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{border:1px solid var(--line);min-height:44px;color:var(--ink-2);background:#ffffff0f;border-radius:999px;padding:0 13px;font-size:13.5px}.chip.on{color:#2a1606;background:#ffb35ceb;border-color:#0000;font-weight:700}.wfield{flex-direction:column;gap:6px;margin-top:14px;display:flex}.wfield span{color:var(--ink-3);font-size:12px;font-weight:600}.wfield input{border:1px solid var(--line);width:100%;min-height:46px;color:var(--ink);font:inherit;background:#00000040;border-radius:13px;outline:none;padding:0 14px;font-size:16px}.wfield input:focus{border-color:#ffb35cb3}.why{color:#ffb4a0;min-height:18px;margin:6px 2px 2px;font-size:12.5px}.colors{flex-wrap:wrap;gap:8px;margin:6px 0 12px;display:flex}.colors button{background:radial-gradient(circle at 50% 60%, #fff8 0 18%, var(--c) 46%);border:2px solid #0000;border-radius:50%;width:44px;height:44px}.colors button.on{border-color:#fff;box-shadow:0 0 0 3px #ffffff2e}.btn{border:1px solid var(--line);min-height:48px;color:var(--ink);background:#ffffff14;border-radius:14px;justify-content:center;align-items:center;padding:0 18px;font-size:15px;font-weight:700;text-decoration:none;display:inline-flex}.btn.primary{color:#2a1606;background:linear-gradient(90deg,#ffb35c,#ff8f6b);border:0}.btn:disabled{opacity:.45;cursor:default}.btn.wide{width:100%}#sheet .btn.wide{position:sticky;bottom:0;box-shadow:0 -10px 18px #101426d9}#sheet .btn.wide:not(.primary){background:#2b3150}#credit a{margin:-8px 0;padding:8px 0;display:inline-block}.row2{gap:8px;display:flex}.row2>*{flex:1}.note{color:var(--ink-3);margin:10px 2px 0;font-size:12px;line-height:1.5}.spots{flex-direction:column;gap:6px;display:flex}.spot{border:1px solid var(--line);text-align:left;background:#ffffff0d;border-radius:16px;flex-direction:column;align-items:flex-start;gap:2px;min-height:64px;padding:10px 14px;display:flex}.spot b{font-size:16px}.spot span{color:var(--ink-3);font-size:12.5px}.spot em{color:#ffd8ac;font-size:13px;font-style:normal;font-weight:600}.spot.on{background:#ffb35c1f;border-color:#ffb35c99}.people{flex-wrap:wrap;gap:6px;max-height:128px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.people li{background:#ffffff0f;border-radius:999px;align-items:center;gap:6px;padding:6px 10px;font-size:13px;display:flex}.people li i{background:var(--c,#9fb3d8);border-radius:50%;width:8px;height:8px}.people li.me{background:#ffb35c2e}.people small{color:var(--ink-3)}.wishtext{color:#fff3df;box-shadow:inset 4px 0 0 var(--c);background:linear-gradient(160deg,#ffdcaa29,#ff965a14);border:1px solid #ffc88c4d;border-radius:16px;margin:4px 0 14px;padding:16px;font-size:18px;font-weight:650;line-height:1.45}.modal-wrap{z-index:50;padding:calc(var(--safe-t) + 12px) 12px calc(var(--safe-b) + 12px);background:#0508109e;place-items:center;display:grid;position:fixed;inset:0}.modal{width:min(440px,100%);max-height:calc(100dvh - 24px - var(--safe-t) - var(--safe-b));color:#191c24;background:#f7f5f0;border-radius:20px;padding:18px 16px 16px;position:relative;overflow-y:auto;box-shadow:0 20px 60px #00000073}.modal h2{margin:0 0 10px;font-size:18px}.modal img{border-radius:12px;width:100%;margin-bottom:12px;display:block}.modal-x{background:#e9e6df;border:0;border-radius:50%;width:44px;height:44px;font-size:15px;position:absolute;top:8px;right:8px}.modal .btn{color:#191c24;background:#e9e6df;border-color:#0000001a}.modal .btn.primary{color:#2a1606;background:linear-gradient(90deg,#ffb35c,#ff8f6b)}.share-link{gap:8px;margin-top:8px;display:flex}.share-link input{min-width:0;min-height:48px;font:inherit;color:#191c24;background:#fff;border:1px solid #0000001f;border-radius:12px;flex:1;padding:0 12px;font-size:14px}#loading{z-index:20;background:linear-gradient(#0e1430 0%,#2a2a55 55%,#c9786a 100%);place-content:center;justify-items:center;gap:18px;transition:opacity .8s;display:grid;position:absolute;inset:0}#loading p{color:var(--ink-2);margin:0;font-size:15px}#loading.done{opacity:0;pointer-events:none}.ld-sun{background:linear-gradient(#ffd08a,#ff8f6b);border-radius:64px 64px 0 0;width:64px;height:32px;animation:2.4s ease-in-out infinite alternate rise;box-shadow:0 0 40px #ffaa5ab3}@keyframes rise{0%{opacity:.7;transform:translateY(10px)}to{opacity:1;transform:translateY(-6px)}}@media (min-width:760px){#clock{top:calc(var(--safe-t) + 10px)}#clock b{font-size:42px}#toast{top:auto;bottom:calc(var(--safe-b) + 92px)}#credit{max-width:34vw;bottom:12px}}@media (max-width:520px){#spotBtn small,#wishChip small,#count small{display:none}.pill{padding:0 12px}#credit .long{display:none}}@media (max-width:380px){#bar button{min-width:62px;padding:4px 6px}.pill{padding:0 11px}#spotBtn small{display:none}}@media (prefers-reduced-motion:reduce){.dot,.ld-sun,#sheet{animation:none}}#ogTitle{display:none}body.shot-og #ogTitle{z-index:30;text-shadow:0 2px 18px #140a1e8c;flex-direction:column;gap:6px;display:flex;position:absolute;bottom:58px;left:64px}#ogTitle b{letter-spacing:-.03em;color:#fff;font-size:76px;font-weight:820}#ogTitle span{color:#ffe2bd;font-size:30px;font-weight:650}body.shot #top,body.shot #clock,body.shot #bar,body.shot #credit,body.shot #toast,body.shot #big,body.shot #labels{display:none!important}
