:root{color:#2b2f32;--choco:#5a2815;--choco-soft:#7a3f25;--cream:#f7df9b;--red:#c92120;--red-shadow:#8f2d1c;font-synthesis:none;text-rendering:geometricprecision;background:#fbfcfd;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}button,input{font:inherit}button{appearance:none;cursor:pointer;border:0;transition:opacity .16s,transform .16s,box-shadow .16s,background .16s}button:active{transform:translateY(1px)}button:disabled{cursor:default;opacity:.45}#scene{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}.game-ui{z-index:4;pointer-events:none;position:fixed;inset:0}.game-ui button,.game-ui input{pointer-events:auto}.top-bar{top:max(10px, env(safe-area-inset-top));z-index:5;grid-template-columns:48px 1fr 76px;align-items:center;min-height:52px;display:grid;position:fixed;left:16px;right:16px}.icon-button{color:#a6adb1;background:0 0;border-radius:999px;width:42px;height:42px;font-size:44px;font-weight:300;line-height:.85}.wordmark{color:var(--choco);letter-spacing:0;text-align:center;font-size:28px;font-weight:900}.room-chip{min-width:72px;height:38px;color:var(--choco-soft);background:#fff;border:2px solid #e6e8ea;border-radius:999px;place-items:center;font-size:14px;font-weight:900;display:grid}.match-pills{top:calc(max(10px, env(safe-area-inset-top)) + 64px);z-index:5;grid-template-columns:1fr 1fr;width:min(420px,100vw - 48px);display:grid;position:fixed;left:50%;transform:translate(-50%)}.clock-pill{color:#9ca6ac;background:#ffffffeb;border:3px solid #e9ecef;justify-content:center;align-items:center;gap:8px;min-height:52px;font-size:15px;font-weight:900;display:flex}.clock-pill:first-child{border-radius:28px 0 0 28px}.clock-pill:last-child{border-left:0;border-radius:0 28px 28px 0}.clock-pill.active{color:var(--choco);background:#fff;box-shadow:0 8px 20px #1f2c3414}.piece-dot{border:4px solid;border-radius:50%;width:22px;height:22px}.dark-dot{color:#6f4033;background:#5c3329}.light-dot{color:#a8bdc8;background:#f1e1bf}.lobby-card{left:18px;right:18px;bottom:max(18px, env(safe-area-inset-bottom));z-index:5;pointer-events:auto;background:#fffffff2;border:2px solid #e5e8ea;border-radius:22px;grid-template-columns:54px 1fr;align-items:center;gap:12px;min-height:126px;padding:12px;display:grid;position:fixed;box-shadow:0 18px 42px #26353e21}.lobby-card.in-match{grid-template-columns:42px 1fr;min-height:76px;padding:10px 12px}.lobby-card.in-match .mascot{border-radius:18px 18px 16px 16px;width:40px;height:46px}.lobby-card.in-match .mascot:before,.lobby-card.in-match .mascot:after{width:13px;height:15px;top:15px}.lobby-card.in-match .mascot:before{left:7px}.lobby-card.in-match .mascot:after{right:7px}.lobby-card.in-match .mascot-face{border-bottom-width:4px;width:19px;height:11px;top:28px}.lobby-card.ready{display:none}.mascot{background:linear-gradient(90deg, var(--red) 0 50%, #a66439 50% 100%);border-radius:18px 18px 16px 16px;width:54px;height:64px;position:relative;box-shadow:inset 0 -10px #00000014}.mascot:before,.mascot:after{content:"";background:#fff;border-radius:50%;width:17px;height:21px;position:absolute;top:21px}.mascot:before{left:10px}.mascot:after{right:10px}.mascot-face{border-bottom:5px solid #fff;border-radius:0 0 28px 28px;width:26px;height:15px;position:absolute;top:39px;left:50%;transform:translate(-50%)}.mascot-face:before{content:"";background:#b55c31;border-radius:999px;width:13px;height:20px;position:absolute;top:-10px;left:50%;transform:translate(-50%)rotate(32deg)}.lobby-content{min-width:0}.status-text{color:#30363a;min-height:28px;margin:0 0 8px;font-size:15px;font-weight:900;line-height:1.32}.room-actions{grid-template-columns:1fr;gap:8px;display:grid}.primary-button,.copy-button,.join-row button,.promotion-panel button{background:var(--red);color:#fff;min-height:48px;box-shadow:0 5px 0 var(--red-shadow);border-radius:16px;font-size:15px;font-weight:900}.copy-button{background:var(--choco-soft);width:100%;margin-top:10px;box-shadow:0 5px #522916}.join-row{grid-template-columns:1fr 84px;gap:8px;display:grid}.join-row input{color:#2f3437;letter-spacing:0;text-align:center;text-transform:uppercase;background:#f8fafb;border:2px solid #e5e8ea;border-radius:16px;width:100%;min-height:48px;padding:0 14px;font-size:18px;font-weight:900}.join-row input:focus{border-color:var(--cream);background:#fff;outline:0}.join-row button{background:var(--choco-soft);box-shadow:0 5px #522916}.hidden{display:none!important}.promotion-panel{z-index:7;background:#fff;border:2px solid #e5e8ea;border-radius:22px;grid-template-columns:repeat(4,minmax(52px,1fr));gap:10px;width:min(330px,100vw - 44px);padding:14px;display:grid;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 18px 42px #26353e2e}.promotion-panel button{background:var(--red);box-shadow:0 5px 0 var(--red-shadow)}.loading{z-index:9;background:#fbfcfd;place-items:center;display:grid;position:fixed;inset:0}.loading.hidden{display:none}.loading>*{grid-area:1/1}.loading-bar{background:#e9ecef;border-radius:999px;width:min(320px,100vw - 64px);height:12px;overflow:hidden;transform:translateY(-18px)}.loading-bar span{border-radius:inherit;background:var(--red);width:0;height:100%;transition:width .18s;display:block}.loading p{color:#6c757d;font-size:15px;font-weight:900;transform:translateY(16px)}@media (width>=780px){.top-bar{left:28px;right:28px}.lobby-card{width:520px;left:50%;right:auto;transform:translate(-50%)}}@media (width<=380px){.wordmark{font-size:24px}.top-bar{grid-template-columns:42px 1fr 64px;left:12px;right:12px}.room-chip{min-width:62px}.lobby-card{grid-template-columns:48px 1fr;gap:10px;padding:12px}}