:root{--c-bg:#213a3a;--c-bg-deep:#1a2f2f;--c-bg-ink:#a9d8cd;--c-panel:#252c45;--c-panel-solid:#252c45;--c-panel-hi:#2e3656;--c-panel-top:#3b4469;--c-panel-edge:#171c31;--c-card:#2d3552;--c-field:#1a1f34;--c-gloss:#ffffff1a;--c-well:#1e2439;--c-well-deep:#181d30;--c-line:#ffffff12;--c-line-strong:#ffffff24;--c-ink:#0d1020;--c-text:#ede6d4;--c-dim:#a6acc3;--c-faint:#7b819b;--c-on-bg:#fffaf0;--c-gold:#ffc629;--c-gold-hi:#ffe073;--c-gold-edge:#d38a00;--c-gold-text:#3a2400;--c-gold-deep:#f5c445;--c-gold-soft:#ffc62924;--c-teal:#22bdac;--c-teal-hi:#66e0d1;--c-teal-edge:#0d8174;--c-teal-text:#042d28;--c-teal-deep:#62d8c8;--c-teal-soft:#22bdac29;--c-red:#ff5a4e;--c-red-edge:#ad2a1e;--c-red-deep:#ff8f85;--c-red-soft:#ff5a4e29;--c-purple:#8b5cf6;--c-purple-deep:#b8a1ff;--c-purple-soft:#8b5cf633;--c-pink:#ff5ea8;--c-pink-deep:#ff8fc3;--c-pink-soft:#ff5ea829;--c-green:#3ccf72;--c-green-deep:#7fe3a3;--c-green-soft:#3ccf7229;--c-sky:#8fc8ff;--c-me:#3d8bff;--c-me-soft:#3d8bff2e;--c-paper:#f1e8d3;--c-paper-ink:#2a241c;--c-redpen:#d23a2a;--f-body:"Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", sans-serif;--f-display:"Black Han Sans", var(--f-body);--f-hand:"Gaegu", var(--f-body);--r-sm:10px;--r-md:14px;--r-lg:20px;--shadow-panel:0 5px 0 #04061073, 0 16px 32px #0000004d;--shadow-pop:0 4px 0 #04061073;--ease-pop:cubic-bezier(.3, 1.45, .5, 1);--ease-out:cubic-bezier(.2, .8, .2, 1);--outline:0 2px 0 var(--c-ink), 2px 0 0 var(--c-ink), -2px 0 0 var(--c-ink), 0 -2px 0 var(--c-ink), 1.5px 1.5px 0 var(--c-ink), -1.5px 1.5px 0 var(--c-ink), 1.5px -1.5px 0 var(--c-ink), -1.5px -1.5px 0 var(--c-ink);--outline-thin:0 1px 0 var(--c-ink), 1px 0 0 var(--c-ink), -1px 0 0 var(--c-ink), 0 -1px 0 var(--c-ink), 1px 1px 0 var(--c-ink), -1px 1px 0 var(--c-ink), 1px -1px 0 var(--c-ink), -1px -1px 0 var(--c-ink);--lobby-text:var(--c-text);--lobby-dim:var(--c-dim);--lobby-bg:var(--c-panel-solid);--lobby-line:var(--c-line-strong);--lobby-accent:var(--c-gold);--lobby-accent-dark:var(--c-gold-edge);--lobby-accent-text:var(--c-gold-text);--lobby-ok:var(--c-green-deep);--lobby-me:var(--c-me);--lobby-error:var(--c-red-deep);--lobby-font:var(--f-body);--font-display:var(--f-display);--font-hand:var(--f-hand);--ink:var(--c-paper-ink);--ink-dim:#6d6252;--paper:var(--c-paper);--redpen:var(--c-redpen)}.theme-dark{--c-bg:#10162c;--c-bg-deep:#0a0f20;--c-panel:#1b2240f0;--c-panel-solid:#1b2240;--c-panel-hi:#232b52;--c-panel-top:#2e3866;--c-panel-edge:#121731;--c-well:#00000047;--c-well-deep:#0006;--c-line:#ffffff12;--c-line-strong:#ffffff26;--c-ink:#080b18;--c-text:#f6f1e4;--c-dim:#a9b0cc;--c-faint:#8a91ae;--c-gold-deep:#ffc629;--c-gold-soft:#ffc62924;--c-teal-deep:#66e0d1;--c-teal-soft:#22bdac24;--c-red-deep:#ff8f86;--c-red-soft:#ff5a4e26;--c-green-deep:#7fe3a3;--c-sky:#8fd0ff;--shadow-panel:inset 0 1px 0 #ffffff14, 0 16px 40px #00000073;--lobby-error:#ff8f8f}.icon{vertical-align:-.14em;flex:none;width:1em;height:1em;display:inline-block}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}.coin-ic{box-sizing:border-box;border:2px solid var(--c-ink);color:#04261c;width:28px;height:28px;font:400 13px/1 var(--f-display);background:linear-gradient(#7ff0d0,#22bdac);border-radius:50%;flex:none;place-items:center;display:inline-grid;box-shadow:inset 0 -3px #0003}.coin-ic.sm{border-width:1.5px;width:20px;height:20px;font-size:10px;box-shadow:inset 0 -2px #0003}.btn,.lobby-btn{--btn-bg:var(--c-panel-hi);--btn-hi:var(--c-panel-top);--btn-edge:var(--c-panel-edge);--btn-text:var(--c-text);--btn-gloss:var(--c-gloss);box-sizing:border-box;border:2px solid var(--c-ink);border-radius:var(--r-md);background:linear-gradient(var(--btn-hi), var(--btn-bg) 70%);min-height:46px;color:var(--btn-text);font:400 17px/1.1 var(--f-display);letter-spacing:.2px;white-space:nowrap;box-shadow:inset 0 -5px 0 var(--btn-edge), inset 0 2px 0 var(--btn-gloss);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;justify-content:center;align-items:center;gap:8px;padding:0 18px 4px;text-decoration:none;transition:transform 80ms,filter .15s,box-shadow 80ms;display:inline-flex;position:relative}.btn:hover:not(:disabled),.lobby-btn:hover:not(:disabled){filter:brightness(1.04)saturate(1.05)}.btn:active:not(:disabled),.lobby-btn:active:not(:disabled){box-shadow:inset 0 -2px 0 var(--btn-edge), inset 0 2px 0 var(--btn-gloss);transform:translateY(3px)}.btn:disabled,.lobby-btn:disabled{cursor:default;filter:saturate(.3);opacity:.6}.btn .icon{width:1.1em;height:1.1em}.btn.gold,.lobby-btn.primary{--btn-bg:var(--c-gold);--btn-hi:var(--c-gold-hi);--btn-edge:var(--c-gold-edge);--btn-text:var(--c-gold-text);--btn-gloss:#ffffff8c}.btn.teal{--btn-bg:var(--c-teal);--btn-hi:var(--c-teal-hi);--btn-edge:var(--c-teal-edge);--btn-text:var(--c-teal-text);--btn-gloss:#ffffff8c}.btn.red,.lobby-btn.danger{--btn-bg:#f2463a;--btn-hi:#ff8a80;--btn-edge:var(--c-red-edge);--btn-text:#fff;--btn-gloss:#ffffff73}.btn.red{text-shadow:0 1px #00000040}.btn.sm,.lobby-btn.small{border-radius:var(--r-sm);min-height:36px;box-shadow:inset 0 -3px 0 var(--btn-edge), inset 0 2px 0 var(--btn-gloss);padding:0 12px 3px;font-size:14px}.btn.sm:active:not(:disabled),.lobby-btn.small:active:not(:disabled){box-shadow:inset 0 -1px 0 var(--btn-edge);transform:translateY(2px)}.btn.lg{min-height:66px;box-shadow:inset 0 -6px 0 var(--btn-edge), inset 0 3px 0 var(--btn-gloss), 0 5px 0 #04061073;border-width:3px;border-radius:18px;padding:0 26px 6px;font-size:26px}.btn.lg:active:not(:disabled){box-shadow:inset 0 -2px 0 var(--btn-edge), inset 0 3px 0 var(--btn-gloss), 0 1px 0 #04061073;transform:translateY(4px)}.btn.block,.lobby-btn.block{width:100%;display:flex}.btn.busy:before{content:"";border:3px solid;border-right-color:#0000;border-radius:50%;width:.9em;height:.9em;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(1turn)}}.link,.lobby-link{color:var(--c-dim);font:800 13px var(--f-body);text-underline-offset:3px;text-decoration:underline;-webkit-text-decoration-color:var(--c-line-strong);text-decoration-color:var(--c-line-strong);cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;padding:4px 2px;text-decoration-thickness:2px;display:inline-flex}.link:hover,.lobby-link:hover{color:var(--c-text);text-decoration-color:currentColor}.link:disabled{opacity:.5;cursor:default}.icon-btn{min-width:52px;color:var(--c-text);font:800 11.5px var(--f-body);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;justify-items:center;gap:3px;padding:0;text-decoration:none;display:grid;position:relative}.icon-btn .ib{box-sizing:border-box;border:2px solid var(--c-ink);background:linear-gradient(var(--c-panel-top), var(--c-panel-hi) 75%);width:46px;height:46px;box-shadow:inset 0 -4px 0 var(--c-panel-edge), var(--shadow-pop);color:var(--c-text);transition:transform .15s var(--ease-out);border-radius:14px;place-items:center;font-size:22px;line-height:1;display:grid;position:relative}.icon-btn .ib .icon{width:24px;height:24px}.icon-btn .ib-label{color:var(--c-text);text-shadow:0 1px #00000073}.icon-btn:hover .ib{transform:translateY(-2px)}.icon-btn:active .ib{box-shadow:inset 0 -1px 0 var(--c-panel-edge);transform:translateY(2px)}.icon-btn .dot{box-sizing:border-box;border:2px solid var(--c-ink);background:var(--c-red);color:#fff;min-width:18px;height:18px;font:400 10px/14px var(--f-display);text-align:center;border-radius:999px;padding:0 4px;position:absolute;top:-6px;right:-6px}.panel{box-sizing:border-box;border:2.5px solid var(--c-ink);border-radius:var(--r-lg);background:var(--c-panel);min-width:0;min-height:0;box-shadow:var(--shadow-panel);color:var(--c-text);flex-direction:column;display:flex;position:relative}.panel-head{align-items:center;gap:10px;padding:14px 16px 10px;display:flex}.panel-title{font:400 21px/1.15 var(--f-display);letter-spacing:.2px;align-items:center;margin:0;display:flex}.panel-title .icon{color:var(--c-teal-deep);margin-right:7px}.well{border-radius:var(--r-md);background:var(--c-well);box-shadow:inset 0 2px #0000001f}.field,.lobby-input{box-sizing:border-box;border:2px solid var(--c-ink);border-radius:var(--r-md);background:var(--c-field);width:100%;min-height:48px;color:var(--c-text);font:700 16px var(--f-body);outline:none;padding:0 14px;transition:box-shadow .15s;box-shadow:inset 0 3px #0003}.field::placeholder,.lobby-input::placeholder{color:var(--c-faint);font-weight:600}.field:focus,.lobby-input:focus{box-shadow:inset 0 3px #0003,0 0 0 4px #ffc629bf}.field[readonly]{opacity:.7}.field-label{color:var(--c-dim);font:800 12px var(--f-body);margin:0 0 6px;display:block}.chip{border:2px solid var(--c-line-strong);background:var(--c-card);min-height:32px;color:var(--c-dim);font:800 12.5px var(--f-body);white-space:nowrap;cursor:pointer;border-radius:999px;align-items:center;gap:5px;padding:0 13px;transition:background .15s,color .15s,border-color .15s;display:inline-flex}.chip:hover:not(:disabled):not(.on){color:var(--c-text);border-color:var(--c-faint)}.chip.on{border-color:var(--c-ink);background:var(--c-gold);color:var(--c-gold-text);box-shadow:inset 0 -2px #00000024}.chip.on.t-hard{background:var(--c-red);color:#fff}.chip.on.t-rip{background:var(--c-purple);color:#fff}.chip.on.t-park{background:var(--c-pink);color:#fff}.chip:disabled{opacity:.4;cursor:default}.seg{background:var(--c-ink);border-radius:14px;gap:3px;padding:4px;display:flex}.seg>button{color:#fffaf0b8;min-height:36px;font:400 15px var(--f-display);white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:10px;flex:1;padding:0 10px;transition:background .15s,color .15s}.seg>button:hover:not(.on){color:#fff;background:#ffffff14}.seg>button.on{background:linear-gradient(var(--c-panel-top), var(--c-panel-hi));color:var(--c-text);box-shadow:inset 0 -3px 0 var(--c-panel-edge), inset 0 1px 0 var(--c-gloss)}.seg>button .count{box-sizing:border-box;background:var(--c-green);color:#06301a;min-width:18px;height:18px;font:400 11.5px/1 var(--f-display);vertical-align:1px;border-radius:999px;place-items:center;margin-left:6px;padding:0 5px;display:inline-grid}.tag{background:var(--c-gold-soft);color:var(--c-gold-deep);font:400 12px/1.6 var(--f-display);letter-spacing:.2px;white-space:nowrap;border-radius:7px;flex:none;align-items:center;gap:4px;padding:1px 8px;display:inline-flex}.tag.t-hard{background:var(--c-red-soft);color:var(--c-red-deep)}.tag.t-rip{background:var(--c-purple-soft);color:var(--c-purple-deep)}.tag.t-park{background:var(--c-pink-soft);color:var(--c-pink-deep)}.tag.t-plain{background:var(--c-well-deep);color:var(--c-dim)}.level-badge{border:1.5px solid var(--c-ink);background:var(--c-gold);color:var(--c-gold-text);font:400 12px/1.5 var(--f-display);letter-spacing:.2px;font-variant-numeric:tabular-nums;white-space:nowrap;text-shadow:none;vertical-align:1px;border-radius:6px;padding:0 6px;display:inline-block}.title-tag{background:var(--c-purple-soft);color:var(--c-purple-deep);font:800 11px/1.65 var(--f-body);white-space:nowrap;text-shadow:none;border-radius:6px;padding:0 6px;display:inline-block}.title-tag.mod-title{color:var(--c-green-deep);background:var(--c-green-soft)}.guest-tag{color:var(--c-sky);white-space:nowrap;font-weight:800}.name-tag{overflow-wrap:anywhere}.tinted{text-shadow:var(--outline-thin)}.gm-suffix{white-space:nowrap}.gm-suffix>span{color:#ff3b3b}.xp-bar{--xp:0;box-sizing:border-box;border:1.5px solid var(--c-ink);background:var(--c-well-deep);border-radius:999px;width:100%;height:9px;display:block;position:relative;overflow:hidden}.xp-fill{width:calc(var(--xp) * 100%);border-radius:inherit;background:linear-gradient(90deg, #ffae1a, var(--c-gold-hi));transition:width .6s var(--ease-out);position:absolute;inset:0 auto 0 0}.face{box-sizing:border-box;border:3px solid var(--face-ring,#fff);background:var(--face) 50% 28% / 190% auto no-repeat, radial-gradient(circle at 50% 30%, #c9f1e8, #7fd3c1 75%);width:48px;height:48px;box-shadow:0 0 0 2px var(--c-ink);border-radius:50%;flex:none;display:inline-block;position:relative}kbd,.kbd{box-sizing:border-box;border:2px solid var(--c-ink);background:linear-gradient(var(--c-panel-top), var(--c-panel-hi));min-width:26px;height:26px;box-shadow:inset 0 -3px 0 var(--c-panel-edge);color:var(--c-text);font:400 12px var(--f-display);border-radius:7px;place-items:center;padding:0 6px;display:inline-grid}.sheet-overlay{z-index:30;box-sizing:border-box;padding:max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));font-family:var(--f-body);color:var(--c-text);background:#0609149e;place-items:center;display:grid;position:fixed;inset:0}.sheet-overlay.enter{animation:.18s ease-out fade-in}.sheet-overlay.enter>.sheet{animation:sheet-pop .34s var(--ease-pop)}.sheet-overlay.leave{pointer-events:none;animation:.14s ease-in forwards fade-out}.sheet-overlay.leave>.sheet{animation:.14s ease-in forwards sheet-drop}@keyframes fade-in{0%{opacity:0}}@keyframes rise-in{0%{opacity:0;transform:translateY(10px)}}@keyframes fade-out{to{opacity:0}}@keyframes sheet-pop{0%{opacity:0;transform:translateY(18px)scale(.94)}}@keyframes sheet-drop{to{opacity:0;transform:translateY(10px)scale(.97)}}.sheet{box-sizing:border-box;border:3px solid var(--c-ink);background:var(--c-panel);border-radius:24px;flex-direction:column;width:min(560px,100%);max-height:100%;display:flex;position:relative;overflow:hidden;box-shadow:0 7px #04061080,0 30px 70px #00000080}.sheet.wide{width:min(880px,100%)}.sheet:focus{outline:none}.sheet-head{align-items:center;gap:12px;padding:16px 16px 12px 20px;display:flex}.sheet-title{min-width:0;font:400 24px/1.15 var(--f-display);letter-spacing:.2px;flex:1;align-items:center;margin:0;display:flex}.sheet-title .icon{color:var(--c-teal-deep);margin-right:8px}.sheet-sub{color:var(--c-dim);font:700 13px var(--f-body);margin:2px 0 0}.sheet-close{border:2px solid var(--c-ink);background:linear-gradient(var(--c-panel-top), var(--c-panel-hi));width:42px;height:42px;box-shadow:inset 0 -3px 0 var(--c-panel-edge);color:var(--c-text);cursor:pointer;border-radius:13px;flex:none;place-items:center;padding:0;display:grid}.sheet-close:hover{filter:brightness(1.1)}.sheet-close:active{box-shadow:inset 0 -1px 0 var(--c-panel-edge);transform:translateY(2px)}.sheet-close .icon{width:20px;height:20px}.sheet-body{overscroll-behavior:contain;flex:1;min-height:0;padding:4px 20px 18px;overflow-y:auto}.sheet-foot{border-top:2px solid var(--c-line);background:var(--c-well);justify-content:flex-end;align-items:center;gap:10px;padding:12px 20px 18px;display:flex}body.sheet-open .game-settings.docked{visibility:hidden}.toast-stack{top:calc(env(safe-area-inset-top,0px) + 14px);z-index:45;pointer-events:none;justify-items:center;gap:8px;width:max-content;max-width:calc(100vw - 24px);display:grid;position:fixed;left:50%;translate:-50%}.toast{box-sizing:border-box;border:2.5px solid var(--c-ink);color:#fffaf0;max-width:min(560px,100vw - 24px);font:800 15px/1.35 var(--f-body);text-align:left;pointer-events:auto;cursor:pointer;animation:toast-in .32s var(--ease-pop);background:#141a30;border-radius:14px;align-items:center;gap:10px;padding:10px 16px 11px 12px;display:flex;box-shadow:0 5px #0000002e,0 14px 30px #10162e59}.toast .icon{width:22px;height:22px;color:var(--c-gold)}.toast.warn{color:#ffd8d2;background:#4a2028}.toast.warn .icon{color:var(--c-red-deep)}.toast.leaving{animation:.2s ease-in forwards toast-out}@keyframes toast-in{0%{opacity:0;transform:translateY(-14px)scale(.92)}}@keyframes toast-out{to{opacity:0;transform:translateY(-10px)}}.ribbon{box-sizing:border-box;border:2.5px solid var(--c-ink);background:var(--c-gold);max-width:min(640px,100vw - 24px);min-height:40px;color:var(--c-gold-text);font:800 14px var(--f-body);pointer-events:auto;animation:toast-in .34s var(--ease-pop);border-radius:999px;align-items:center;gap:8px;padding:4px 6px 4px 14px;display:flex;box-shadow:inset 0 -3px #0000001f,0 5px #04061073}.ribbon.green{color:#08301a;background:#8eeab0}.ribbon.blue{color:#08253a;background:#a9d6ff}.ribbon-text{min-width:0;color:inherit;font:inherit;text-align:left;overflow-wrap:anywhere;cursor:pointer;background:0 0;border:0;flex:1;padding:4px 0;text-decoration:none}.ribbon-close{width:30px;height:30px;color:inherit;cursor:pointer;background:#0000001a;border:0;border-radius:50%;flex:none;place-items:center;padding:0;display:grid}.ribbon-close .icon{width:16px;height:16px}.lobby-card{box-sizing:border-box;border:2.5px solid var(--c-ink);border-radius:var(--r-lg);background:var(--c-panel-solid);box-shadow:var(--shadow-panel);color:var(--c-text);padding:20px 22px;position:relative}.lobby-card h2{font:400 23px var(--f-display);color:var(--c-text);margin:0 0 8px}.lobby-title{font:400 40px/1.1 var(--f-display);color:var(--c-gold);letter-spacing:.5px;text-shadow:var(--outline), 0 5px 0 var(--c-ink);margin:0}.lobby-sub{color:var(--c-dim);margin:6px 0 16px;font-size:14px;line-height:1.6}.lobby-row{gap:10px;display:flex}.lobby-row>*{flex:1}:where(#ui,.sheet-overlay,.game-results){scrollbar-width:thin;scrollbar-color:#ffffff38 transparent}:where(#ui,.sheet-overlay,.game-results,.install-hint,.toast-stack,.patch-page,.admin-page) :focus-visible{outline:3px solid var(--c-me);outline-offset:3px}:where(#ui,.sheet-overlay,.game-results,.install-hint) .field:focus-visible,:where(#ui,.sheet-overlay,.game-results,.install-hint) .lobby-input:focus-visible{outline:none}@media (prefers-reduced-motion:reduce){:where(#ui,.sheet-overlay,.game-results,.install-hint,.toast-stack,.patch-page,.admin-page,.settings-panel) *,:where(#ui,.sheet-overlay,.game-results,.install-hint,.toast-stack,.patch-page,.admin-page,.settings-panel) :before,:where(#ui,.sheet-overlay,.game-results,.install-hint,.toast-stack,.patch-page,.admin-page,.settings-panel) :after{transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}