:root{font-family:SUIT Variable,Pretendard Variable,Noto Sans KR,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;color:#17222e;background:#eaf0f6}:root{--ink: #0f1a2a;--muted: #4e5f78;--line: #8ea3bf;--line-strong: #556f92;--panel: #f3f8ff;--panel-soft: #e8f0fb;--accent: #0b7f89;--accent-ink: #ffffff;--danger: #9a2036;--success: #0c6f52}*{box-sizing:border-box}.page{min-height:100vh;padding:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 28%,#6484a917,#6484a900 60%),linear-gradient(180deg,#f9fbff,#eef4fb 60%,#eaf1f9);color:var(--ink);font-family:Rajdhani,Pretendard,Noto Sans KR,sans-serif}.panel{width:min(1280px,100%);border:1px solid #cfdae6;border-radius:0;background:#f5f9ff;padding:0 0 1rem;box-shadow:none;position:relative;overflow:hidden}.panel:before{content:"";position:absolute;inset:auto;height:0}.panelMenu{max-width:100%;min-height:100vh}.title{margin:0;font-size:clamp(2rem,2.65vw,3.05rem);letter-spacing:0;text-transform:none;color:#17264b}.lead{display:none}.topBar{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:86px;padding:0 1.5rem;border-bottom:1px solid #d7e1ec;background:#fff}.brandWrap{display:inline-flex;align-items:center;gap:.9rem}.logoPixel{width:52px;height:52px;border-radius:2px;border:3px solid #17264b;background:linear-gradient(90deg,#17264b 0 15%,transparent 15% 85%,#17264b 85% 100%),linear-gradient(#17264b 0 15%,transparent 15% 85%,#17264b 85% 100%),conic-gradient(from 0deg,#f45b9a 0 25%,#fff 25% 50%,#48b6ef 50% 75%,#fff 75% 100%)}.guestIcon{display:inline-flex;align-items:center;gap:.18rem;color:#6a7f96}.topAuth{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;justify-content:flex-end}.topAuth .ghostBtn,.topAuth .primaryBtn{min-width:138px;min-height:54px;border-radius:14px;font-size:1.1rem;font-weight:900}.topAuth .ghostBtn{border:3px solid #2a7bb2;background:#f4fbff;color:#1f6ea6}.topAuth .primaryBtn{border:3px solid #2a7bb2;background:linear-gradient(180deg,#3495d4,#1d72af);color:#fff}.userChip{border:1px solid #b7c8dd;background:#eef5ff;border-radius:4px;padding:.16rem .5rem;font-size:.83rem;font-weight:700;color:#17395e}.controls,.racePanel{display:flex;flex-wrap:wrap;gap:.42rem;align-items:center}.racePanel{margin-top:.55rem}.multiLobbyShell{margin-top:.85rem;display:grid;gap:.75rem}.lobbyQuick{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.lobbyQuickBtn{min-height:42px;border:none;background:transparent;font-size:1.55rem;font-weight:900;color:#1c2b45;display:inline-flex;align-items:center;gap:.38rem}.lobbyQuickBtn:hover:enabled{color:#18487a;border:none}.lobbyActions{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:1rem}.lobbyCardBtn{min-height:150px;border:6px solid #183258;border-radius:2px;box-shadow:8px 8px #1832583b;font-size:2.05rem;font-weight:900;letter-spacing:.02em}.lobbyCardBtn.create{background:linear-gradient(130deg,#1b8bd2,#5ac2ff);color:#fff}.lobbyCardBtn.refresh{background:linear-gradient(180deg,#f8fdff,#e8f2fb);color:#183258}.lobbyCardBtn.join{background:linear-gradient(130deg,#d7388f,#ff5b86);color:#fff;padding:.6rem .9rem;display:grid;align-content:center;gap:.4rem}.lobbyJoinTitle{text-align:center;font-size:2.05rem;font-weight:900}.lobbyJoinRow{display:flex;gap:.4rem}.lobbyJoinRow input{min-height:52px;border-radius:12px;border:2px solid #d3dde8;font-size:1.65rem;font-weight:700}.lobbyJoinRow button{min-width:108px;border-radius:10px;font-size:1.2rem;font-weight:900}.lobbyTableWrap{margin-top:1rem;border:5px solid #183258;border-radius:4px;background:#fff;overflow:hidden}.lobbyTableTitle{text-align:center;padding:.8rem .5rem;font-size:3rem;font-weight:900;color:#182a48;border-bottom:1px solid #cad9ea;background:linear-gradient(180deg,#f5fbff,#e8f2fb)}.lobbyTable{width:100%;border-collapse:collapse}.lobbyTable th,.lobbyTable td{border-bottom:1px solid #cad9ea;padding:.72rem .8rem;font-size:1.35rem;text-align:left}.lobbyTable thead th{font-size:1.2rem;font-weight:900;color:#1d2f4a;background:#f8fbff}.lobbyTable td.open{color:#23844e;font-weight:800}.lobbyTable td.private{color:#1d2f4a;font-weight:800}.lobbyTable td.private span{display:inline-flex;align-items:center;gap:.3rem}.joinActionBtn{min-width:96px;min-height:42px;border:3px solid #183258;border-radius:6px;background:linear-gradient(130deg,#1b8bd2,#5ac2ff);color:#fff;font-size:1.2rem;font-weight:900}.lobbyEmpty{padding:1rem;font-size:1rem}.raceMatchLayout{margin-top:.9rem;display:grid;grid-template-columns:300px 1fr 330px;gap:.9rem;align-items:start}.raceInfoPane{border:1px solid #c4d5e8;background:#f5faff;border-radius:8px;padding:.8rem;display:grid;gap:.38rem}.raceInfoTitle{font-size:1.15rem;font-weight:900;color:#163055}.raceInfoProgress{margin-top:.55rem;font-size:2rem;font-weight:900;color:#1b2b45}.raceInfoMe{font-size:2.6rem;font-weight:900;color:#13233b;line-height:1.1}.raceBoardPane .boardWrap{margin-top:0}.raceSidePane{display:grid;gap:.55rem;align-content:start}.raceSidePlayers{border:1px solid #c4d5e8;background:#f7fbff;border-radius:8px;padding:.45rem;display:grid;gap:.35rem}.raceProgressRow{position:relative;border:2px solid #183258;border-radius:6px;background:linear-gradient(130deg,#1b8bd2,#5ac2ff);color:#fff;min-height:46px;padding:.25rem .55rem;display:flex;align-items:center;justify-content:space-between;font-size:1.05rem;font-weight:800}.raceProgressRow .nickBtn{color:#fff;margin-right:.2rem}.raceProgressRow .reactionMenu{left:auto;right:0;transform:none}.singleTopControls{margin:.75rem 0 .55rem;justify-content:center;gap:.55rem}.singleTopControls select{min-width:220px;min-height:52px;border:3px solid #2a7bb2;border-radius:14px;background:#f7fcff;font-size:1.05rem;font-weight:900}.singleActionBtn,.singleSfxBtn,.singleHomeBtn{min-height:52px;border:3px solid #2a7bb2;border-radius:14px;font-size:1.03rem;font-weight:900}.singleActionBtn{min-width:220px;background:linear-gradient(180deg,#3495d4,#1d72af);color:#fff}.singleSfxBtn{min-width:168px;background:#f7fcff;color:#264866}.singleHomeBtn{min-width:138px;background:linear-gradient(180deg,#3495d4,#1d72af);color:#fff}.modeChooser{display:flex;justify-content:center;align-items:center;gap:2rem;width:100%;z-index:2}.menuStage{position:relative;min-height:calc(100vh - 86px);display:grid;place-items:center;padding:1.5rem}.modeBtn{min-height:190px;min-width:min(36vw,530px);font-size:1.15rem;font-weight:900;display:grid;align-content:center;justify-items:center;gap:.35rem;border-radius:2px;padding:1rem 1.3rem;border:7px solid #183258;box-shadow:10px 10px #18325847;text-transform:uppercase;letter-spacing:.03em;position:relative}.modeSingle{background:linear-gradient(130deg,#1b8bd2,#5ac2ff);color:#fff}.modeMulti{background:linear-gradient(130deg,#d7388f,#ff5b86);color:#fff}.modeName{font-size:clamp(2rem,3.4vw,3.5rem);font-weight:900;text-shadow:0 3px 0 rgba(7,24,47,.24)}.modeDesc{display:none}.modeTag{position:absolute;top:10px;right:12px;border-radius:10px;padding:.18rem .6rem;font-size:.95rem;font-weight:900;color:#835b11;background:linear-gradient(180deg,#fff0c3,#ffd68f)}.menuDust{position:absolute;width:14px;height:14px;background:#b7cadc;opacity:.48}.menuDustA{top:22%;left:13%}.menuDustB{top:69%;right:15%}.menuDustC{bottom:13%;left:33%}.authBar{margin-top:.6rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.authScreen{margin-top:.6rem;border:1px solid #c0d1e4;background:var(--panel-soft);border-radius:6px;padding:.65rem}.authTabs{display:flex;gap:.42rem;flex-wrap:wrap;margin-bottom:.52rem}.authTabs .active{background:linear-gradient(180deg,#16a1ab 0%,var(--accent) 100%);color:#fff;border-color:#0b6168}.authCard{border:1px solid #c2d4e8;background:#fff;border-radius:6px;padding:.72rem;display:grid;gap:.48rem}.fieldError{border-color:#d67a8a!important;box-shadow:0 0 0 2px #d7607a33!important}.fieldErrorText{color:#8f1e34;font-size:.78rem;font-weight:700}.raceStateBox{margin-top:.55rem;border:1px solid #bbccdf;background:var(--panel-soft);border-radius:6px;padding:.5rem .62rem;font-size:.9rem;display:grid;gap:.28rem}.racePlayers{display:flex;flex-wrap:wrap;gap:.45rem}.racePlayers>.playerBadge{border:1px solid #bdd0e2;background:#fff;border-radius:999px;padding:.2rem .55rem;position:relative;display:inline-flex;align-items:center;white-space:nowrap;gap:.18rem}.playerBadge{gap:.18rem}.nameWrap{position:relative;display:inline-flex;align-items:center}.playerStateText{display:inline-block}.nickBtn{border:none;background:transparent;padding:0;margin-right:.1rem;font-weight:800;color:#173659;cursor:pointer;box-shadow:none;min-height:0;min-width:0}.nickBtn:hover{text-decoration:underline}.nickBtn:disabled{cursor:default;text-decoration:none;opacity:1}.reactionMenu{position:absolute;left:50%;transform:translate(-50%);bottom:calc(100% + 6px);display:flex;gap:.24rem;padding:.16rem;border:1px solid #c2d4e8;background:#fff;border-radius:999px;z-index:18;box-shadow:0 6px 14px #0d1d3229;white-space:nowrap}.reactionMenu button{min-width:30px;padding:.08rem .18rem;border-radius:999px}.reactionLayer{position:fixed;inset:0;pointer-events:none;z-index:50}.reactionFlight{position:fixed;left:0;top:0;font-size:1.45rem;transform:translate3d(-50%,-50%,0) scale(var(--flight-scale, 1));opacity:1;text-shadow:0 3px 10px rgba(0,0,0,.22);will-change:left,top,transform,opacity}.timerBar{margin-top:.65rem;display:inline-flex;align-items:center;border:1px solid #90afd0;background:#e8f2ff;border-radius:999px;padding:.22rem .64rem;font-weight:900;letter-spacing:.05em;color:#0f3f74}.singleBottomBar{margin-top:.75rem;display:flex;justify-content:space-between;align-items:center;gap:.8rem;flex-wrap:wrap}.singleTimer{font-size:2rem;font-weight:900;color:#1b2b45;letter-spacing:.02em}.singleTools{display:flex;gap:.55rem;align-items:center}.toolBtn{min-width:178px;min-height:64px;border-radius:10px;border:4px solid #183258;box-shadow:6px 6px #18325833;font-size:2rem;font-weight:900;color:#fff;letter-spacing:.02em}.toolUndo{background:linear-gradient(135deg,#1f8fd7,#58c2ff)}.toolRedo{background:linear-gradient(135deg,#f4f9ff,#dbe9f7);color:#6f8195}.toolClear{background:linear-gradient(135deg,#de3d8f,#ff6386)}.gameTools{margin-top:.5rem;display:flex;gap:.35rem;align-items:center}.iconBtn{width:38px;height:38px;padding:0;display:grid;place-items:center;font-size:1.08rem;font-weight:900}.iconBtn.danger{color:#8a1625;border-color:#d1aab1;background:#fff0f2}.raceActions{display:flex;gap:.42rem;flex-wrap:wrap}.raceResult{font-weight:900;color:var(--success)}.rankings{display:grid;gap:.15rem;border:1px dashed #9fb7d1;border-radius:6px;padding:.32rem .44rem;background:#f8fbff}.roomList{display:grid;gap:.34rem}.roomRow{display:flex;align-items:center;justify-content:space-between;gap:.55rem;border:1px solid #c9d9e9;background:#fff;border-radius:6px;padding:.38rem .5rem}.roomRow span{font-size:.88rem}.roomBadge{display:inline-block;font-size:.7rem;font-weight:900;letter-spacing:.04em;border-radius:999px;padding:.08rem .4rem;border:1px solid #b8c8d8;background:#eff4fa;color:#1f3447}.roomBadge.private{border-color:#cba6ae;background:#fff1f3;color:#7a1f2f}.roomBadge.public{border-color:#a7c8bf;background:#ecfaf4;color:#0d5e48}.chatBox{margin-top:.35rem;border:1px solid #c6d6e8;border-radius:6px;background:#fff;padding:.42rem;display:grid;gap:.33rem}.chatTitle{font-size:.82rem;font-weight:900;color:#2a3f5d}.chatBody{border:1px solid #d4e1ef;background:#f8fbff;border-radius:4px;min-height:112px;max-height:170px;overflow:auto;padding:.33rem .42rem;display:grid;gap:.18rem}.chatMsg{font-size:.84rem;color:#1b2e46;word-break:break-word}.chatEmpty{font-size:.82rem;color:#6a7b90}.chatInputRow{display:flex;gap:.36rem;align-items:center;position:relative}.chatInputRow input{flex:1}.chatInputRow button{min-width:62px}.emojiWrap{position:relative}.emojiWrap>button{min-width:42px;padding:.34rem .42rem}.emojiPopover{position:absolute;left:0;bottom:calc(100% + 8px);z-index:25}.modalBackdrop{position:fixed;inset:0;background:#09101885;display:grid;place-items:center;z-index:20;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.modalCard{width:min(460px,calc(100vw - 24px));background:#fff;border:1px solid #c8d8e8;border-radius:6px;padding:.9rem;display:grid;gap:.56rem;box-shadow:0 10px 26px #111e2d33}.modalCard h2{margin:0;font-size:1.12rem}.modalCard p{margin:0}.modalCard label{display:grid;gap:.2rem;font-size:.9rem;color:#2c3947}.modalError{border:1px solid #e6b7bf;background:#fff1f4;color:#821a2d;border-radius:4px;padding:.38rem .48rem;font-size:.84rem;font-weight:700}.modalActions{display:flex;justify-content:flex-end;gap:.4rem}input,select,button{border-radius:4px;border:1px solid #aebfd4;background:#fff;color:#15212d;padding:.4rem .64rem;font-size:.9rem;transition:border-color .12s ease,box-shadow .12s ease,transform 80ms ease}.controls>*,.racePanel>*{min-height:36px}input:focus,select:focus,button:focus-visible{outline:none;border-color:#5f9ad0;box-shadow:0 0 0 2px #5f9ad03d}input{width:100%}button{cursor:pointer;font-weight:700;background:#f2f7fd}button:hover:enabled{border-color:#8eabc8}button:active:enabled{transform:translateY(1px)}button:disabled{opacity:.5;cursor:not-allowed}.raceActions button:last-child,.modalActions button:last-child{background:linear-gradient(180deg,#11a5af 0%,var(--accent) 100%);color:var(--accent-ink);border-color:#0b6168}.status{margin-top:.6rem;padding:.4rem .52rem;border:1px solid #bfd0e1;background:#f2f7fc;color:#1b2a3a;border-radius:4px;font-weight:700}.boardWrap{--board-cursor: crosshair;margin-top:.72rem;overflow:auto;border:1px solid #b6c8dd;border-radius:6px;background:linear-gradient(135deg,#ffffff80,#dce8f49e),repeating-linear-gradient(-45deg,#819cb914 0 8px,#fff0 8px 16px);padding:.66rem;-webkit-user-select:none;user-select:none;display:flex;justify-content:center}.nonogram{--cell-size: 24px;--grid-gap: 0px;display:grid;gap:var(--grid-gap);grid-template-columns:calc(var(--left-depth) * var(--cell-size) + (var(--left-depth) - 1) * var(--grid-gap)) calc(var(--board-w) * var(--cell-size) + (var(--board-w) - 1) * var(--grid-gap));grid-template-rows:calc(var(--top-depth) * var(--cell-size) + (var(--top-depth) - 1) * var(--grid-gap)) calc(var(--board-h) * var(--cell-size) + (var(--board-h) - 1) * var(--grid-gap))}.corner{border:1px solid #0e1f30;background:#e8edf2}.colHints{display:grid;gap:var(--grid-gap);align-items:stretch;border-top:1px solid #0e1f30;border-left:1px solid #0e1f30;border-right:1px solid #0e1f30}.colHintCol{display:grid;gap:var(--grid-gap)}.rowHints{display:grid;gap:var(--grid-gap);align-items:stretch;border-left:1px solid #0e1f30;border-top:1px solid #0e1f30;border-bottom:1px solid #0e1f30}.rowHintRow{display:grid;gap:var(--grid-gap)}.hintNum{display:grid;place-items:center;width:var(--cell-size);height:var(--cell-size);padding:0;background:#ecf2f8;color:#162331;border:1px solid #4b5f75;border-radius:0;font-size:calc(var(--cell-size) * .52);line-height:1;font-weight:900;overflow:hidden;text-align:center}.hintNum.active{background:linear-gradient(180deg,#ffdf9d,#f6c777);color:#5b3500}.board{touch-action:none;cursor:var(--board-cursor);position:relative;border:none;box-shadow:inset 0 0 0 1px #0e1f30;overflow:hidden;background:#dfe6ee}.boardCanvas{display:block;width:100%;height:100%;cursor:var(--board-cursor)}.countdownOverlay{position:absolute;inset:0;display:grid;place-items:center;font-size:82px;font-weight:900;color:#10253b;background:#edf5fcbf;pointer-events:none;text-shadow:0 3px 16px rgba(255,255,255,.6);animation:countdownBeat .9s ease-in-out infinite}.countdownOverlay.wait{font-size:30px}.countdownOverlay.result{font-size:34px;color:#084a35;animation:none}@keyframes countdownBeat{0%{transform:scale(1)}50%{transform:scale(1.06)}to{transform:scale(1)}}@media(max-width:760px){.panel{padding:0 0 .7rem}.modeChooser{flex-direction:column;gap:1rem}.menuStage{min-height:calc(100vh - 76px);padding:1rem}.modeBtn{min-width:min(92vw,520px);min-height:128px;border-width:5px;box-shadow:6px 6px #1832583d}.modeName{font-size:clamp(1.45rem,9.3vw,2.1rem)}.topBar{flex-direction:column;align-items:flex-start;gap:.45rem;padding:.7rem .8rem;min-height:76px}.topAuth{width:100%;justify-content:flex-end}.topAuth .ghostBtn,.topAuth .primaryBtn{min-width:112px;min-height:44px;font-size:.95rem;border-width:2px}.lobbyActions{grid-template-columns:1fr}.lobbyCardBtn{min-height:96px;border-width:3px;box-shadow:4px 4px #1832582e;font-size:1.35rem}.lobbyJoinTitle{font-size:1.35rem}.lobbyJoinRow input{min-height:40px;font-size:1.05rem}.lobbyJoinRow button{min-width:74px;font-size:.9rem}.lobbyTableTitle{font-size:1.65rem}.lobbyTable th,.lobbyTable td{font-size:.84rem;padding:.42rem .35rem}.joinActionBtn{min-width:64px;min-height:32px;font-size:.82rem;border-width:2px}.raceMatchLayout{grid-template-columns:1fr}.raceInfoProgress{font-size:1.3rem}.raceInfoMe{font-size:1.75rem}.raceProgressRow{min-height:38px;font-size:.9rem}.singleTopControls{justify-content:flex-start}.singleTopControls select,.singleActionBtn,.singleSfxBtn,.singleHomeBtn{min-height:44px;border-width:2px;font-size:.92rem}.singleTopControls select{min-width:150px}.singleActionBtn{min-width:160px}.singleSfxBtn{min-width:120px}.singleHomeBtn{min-width:98px}.singleBottomBar{flex-direction:column;align-items:flex-start}.singleTimer{font-size:1.4rem}.singleTools{width:100%}.toolBtn{min-width:0;flex:1;min-height:48px;border-width:2px;box-shadow:3px 3px #1832582e;font-size:1.22rem}.nonogram{--cell-size: 20px}.hintNum{font-size:calc(var(--cell-size) * .52)}.countdownOverlay{font-size:58px}}
