:root{--ink:#f4efe6;--ink2:#f4efe6b3;--panel:#121820a8;--panel2:#1c222ceb;--line:#f4efe629;--accent:#ffc56e;--accent-ink:#1b1206;--live:#9fe0b0;--bg:#1d2532}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg);width:100%;height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;font-family:JL Sans,Apple SD Gothic Neo,Noto Sans KR,system-ui,sans-serif;overflow:hidden}body{background:radial-gradient(120% 80% at 50% 70%,#3a3a34 0%,#1d2532 55%,#0e1420 100%)}button,input{font:inherit;color:inherit}button{cursor:pointer}#app{position:fixed;inset:0}#stage{position:absolute;inset:0}#world{touch-action:none;opacity:0;width:100%;height:100%;transition:opacity .6s;display:block;position:absolute;inset:0}body.ready #world{opacity:1}#tags{pointer-events:none;position:absolute;inset:0;overflow:hidden}.top{left:16px;right:16px;top:calc(12px + env(safe-area-inset-top));pointer-events:none;justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:absolute}.brand h1{letter-spacing:-.01em;text-shadow:0 1px 6px #00000073;font-size:20px;font-weight:800;line-height:1.2}.brand small{color:var(--ink2);text-shadow:0 1px 4px #00000080;margin-top:2px;font-size:12.5px;font-weight:500;display:block}.pill{pointer-events:auto;background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;min-height:36px;padding:6px 12px;font-size:12.5px;display:inline-flex}.pill svg{width:15px;height:15px}#toast{left:50%;top:calc(64px + env(safe-area-inset-top));background:var(--panel2);border:1px solid var(--line);opacity:0;pointer-events:none;text-align:center;border-radius:12px;max-width:calc(100% - 32px);padding:10px 14px;font-size:13.5px;line-height:1.45;transition:opacity .25s,transform .25s;position:absolute;transform:translate(-50%,-8px)}#toast.on{opacity:1;transform:translate(-50%)}.bottom{left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom));flex-direction:column;gap:8px;display:flex;position:absolute}.row{align-items:center;gap:8px;display:flex}.row.wrap{flex-wrap:wrap}.sp{flex:1}.btn{background:var(--accent);min-height:50px;color:var(--accent-ink);border:0;border-radius:14px;justify-content:center;align-items:center;gap:8px;width:100%;padding:12px 18px;font-size:16px;font-weight:700;display:inline-flex}.btn svg{width:20px;height:20px}.btn:disabled{opacity:.5}.ghost{background:var(--panel);color:var(--ink);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);white-space:nowrap;border-radius:12px;justify-content:center;align-items:center;gap:6px;min-height:44px;padding:9px 12px;font-size:14px;font-weight:600;display:inline-flex}.ghost svg{flex:none;width:20px;height:20px}.ghost.ic{width:44px;padding:0;position:relative}.ghost.ic em{color:var(--ink2);font-size:10.5px;font-style:normal;font-weight:700;position:absolute;top:2px;right:3px}.ghost.sm{min-height:40px;padding:7px 11px;font-size:13px}.ghost.on{background:var(--ink);color:#141210;border-color:var(--ink)}.ghost.live{border-color:var(--live);color:var(--live);background:#1f3a2b}.chat input{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);border-radius:12px;outline:none;flex:1;min-width:0;min-height:44px;padding:10px 14px;font-size:16px}.chat input::placeholder{color:var(--ink2)}.chat input:focus{border-color:var(--accent)}.card{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);border-radius:16px;padding:10px 10px 10px 12px}.who{align-items:center;gap:10px;display:flex}.whot{flex-direction:column;flex:1;min-width:0;display:flex}.whot b{font-size:15px}.whot span{color:var(--ink2);text-overflow:ellipsis;white-space:nowrap;margin-top:1px;font-size:12.5px;overflow:hidden}.av{border-radius:50%;flex:none;width:34px;height:34px;box-shadow:inset 0 -6px #0000002e}.av.sm{width:28px;height:28px}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);border-radius:12px;align-items:baseline;gap:6px;min-height:44px;padding:8px 11px;font-size:13.5px;display:inline-flex}.chip b{font-weight:700}.chip i{color:var(--ink2);font-size:12px;font-style:normal}.chip.on{background:var(--ink);color:#141210;border-color:var(--ink)}.chip.on i{color:#5d574d}.note{color:var(--ink2);padding:2px;font-size:12.5px;line-height:1.5}#ctx:empty{display:none}#ctx .note{background:var(--panel);border:1px solid var(--line);text-align:center;border-radius:12px;padding:10px 12px}.tag{white-space:nowrap;will-change:transform;flex-direction:column;align-items:center;gap:3px;display:flex;position:absolute;top:0;left:0}.bub{color:#1c1a17;white-space:normal;word-break:keep-all;overflow-wrap:anywhere;text-align:center;background:#faf6eef2;border-radius:12px;max-width:170px;padding:6px 10px;font-size:13.5px;line-height:1.35;position:relative;box-shadow:0 4px 14px #00000040}.bub:after{content:"";background:inherit;border-radius:2px;width:9px;height:9px;position:absolute;bottom:-4px;left:50%;transform:translate(-50%)rotate(45deg)}.bub.dots{background:#faf6eeb3;gap:3px;padding:7px 9px;display:flex}.bub.dots i{background:#3a3630;border-radius:50%;width:4px;height:4px;animation:1.2s infinite dot}.bub.dots i:nth-child(2){animation-delay:.2s}.bub.dots i:nth-child(3){animation-delay:.4s}@keyframes dot{0%,60%,to{opacity:.3}30%{opacity:1}}.nm{color:var(--ink);background:#0a0e1473;border-radius:6px;align-items:center;gap:3px;padding:1px 6px;font-size:11.5px;font-weight:600;display:flex}.nm svg{width:13px;height:13px}.nm.talk{color:var(--live)}.nm.off{opacity:.55}.pin{pointer-events:auto;background:0 0;border:0;flex-direction:column;justify-content:flex-end;align-items:center;min-height:44px;padding:0;display:flex;position:absolute;top:0;left:0}.pin .lb{color:#22201b;background:#fffaf0f0;border-radius:10px;align-items:baseline;gap:6px;padding:6px 10px;font-size:13px;display:flex;box-shadow:0 6px 18px #00000040}.pin .lb b{font-weight:700}.pin .lb i{color:#6b6457;font-size:11.5px;font-style:normal;font-weight:500}.pin .st{background:#fffaf0d9;width:2px;height:14px}.pin.hot .lb{background:var(--accent);color:var(--accent-ink)}.pin.hot .lb i{color:#5a4318}.pin.here .lb{outline:2px solid var(--live)}.sheet{z-index:5;background:#06080c73;justify-content:center;align-items:flex-end;display:flex;position:absolute;inset:0}.sheet[hidden]{display:none}.sh{background:var(--panel2);border:1px solid var(--line);width:100%;max-width:460px;max-height:min(80vh,640px);padding:14px 16px calc(16px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(14px);border-radius:18px 18px 0 0;flex-direction:column;display:flex}.shh{justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;display:flex}.shh h2{font-size:17px;font-weight:800}.shb{flex-direction:column;gap:12px;display:flex;overflow:auto}.lead{font-size:15px;line-height:1.55}.plist{flex-direction:column;gap:10px;list-style:none;display:flex}.pr{border:1px solid var(--line);background:#ffffff0a;border-radius:12px;flex-direction:column;gap:8px;padding:10px;display:flex}.prh{align-items:center;gap:10px;display:flex}.prn{flex-direction:column;min-width:0;display:flex}.prn b{font-size:14.5px}.prn span{color:var(--ink2);font-size:12px}.prc{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.vol{flex:140px;align-items:center;gap:6px;min-height:40px;display:flex}.vol svg{flex:none;width:18px;height:18px}.vol input{min-width:0;accent-color:var(--accent);flex:1;height:32px}.fld{flex-direction:column;gap:6px;display:flex}.fld>span{color:var(--ink2);font-size:12.5px}.fld input{border:1px solid var(--line);background:#ffffff0f;border-radius:12px;outline:none;flex:1;min-width:0;min-height:44px;padding:10px 12px;font-size:16px}.sws{flex-wrap:wrap;gap:8px;display:flex}.sw{border:2px solid #0000;border-radius:50%;width:44px;height:44px;box-shadow:inset 0 -6px #0000002e}.sw.on{border-color:var(--ink)}@media (min-width:900px){.bottom{width:400px;bottom:24px;left:auto;right:24px}.top{top:20px;left:24px;right:24px}.brand h1{font-size:22px}.sheet{align-items:center}.sh{border-radius:18px}}@media (max-width:380px){.bub{max-width:138px;padding:5px 9px;font-size:13px}.nm{font-size:11px}.ghost.sm{padding:7px 9px}}@media (orientation:landscape) and (max-height:500px){.bottom{gap:6px;width:min(400px,55vw);bottom:10px;left:auto;right:12px}.top{top:8px}.card{display:none}.btn{min-height:44px}}@media (prefers-reduced-motion:reduce){#world{transition:none}.bub.dots i{opacity:.7;animation:none}}
