:root{font-family:system-ui,-apple-system,sans-serif;color:#1a1a1a}*{box-sizing:border-box}body{margin:0;background:#f1f5f9}.app{max-width:600px;margin:0 auto;padding:1.5rem 1rem 4rem}.app h1{margin:0 0 .25rem}.muted{color:#888;font-size:.9rem}.auth{text-align:center}.toggle{cursor:pointer;text-decoration:underline}.bar{display:flex;justify-content:space-between;align-items:center;padding:.6rem .9rem;background:#0f172a;color:#fff;border-radius:8px;margin-bottom:.75rem;gap:.5rem}.timer{font-variant-numeric:tabular-nums;opacity:.85}.ava{font-size:1.1rem}.card{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:1rem;margin:.75rem 0}.card h3{margin:0 0 .6rem;font-size:1rem}input{width:100%;padding:.6rem;border:1px solid #ccc;border-radius:8px;margin-bottom:.6rem;font-size:1rem}button{padding:.6rem 1rem;border:none;border-radius:8px;background:#4f46e5;color:#fff;font-size:.95rem;cursor:pointer}button:hover{filter:brightness(1.06)}button.mini{padding:.15rem .5rem;font-size:.75rem;margin-left:.5rem}.leave{background:#9ca3af;margin-top:.6rem}.gamepick{display:flex;flex-wrap:wrap;gap:.5rem}.gamepick button{display:flex;flex-direction:column;align-items:flex-start}.gamepick small{opacity:.7;font-size:.7rem}.ava-big{width:80px;height:80px;display:flex;align-items:center;justify-content:center;font-size:2.5rem;border-radius:16px;color:#fff;margin-bottom:.6rem}.picker{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.5rem}.picker button{background:#f1f5f9;color:#333;padding:.3rem .5rem}.picker .swatch{width:28px;height:28px;padding:0;border-radius:50%}.players{list-style:none;padding:0;margin:0}.players li{padding:.35rem 0;border-bottom:1px solid #eee}.players li.off{opacity:.45}.role{padding:.6rem .9rem;border-radius:8px;margin-bottom:.5rem;background:#eef2ff}.dead{color:#b91c1c;font-weight:700}.error{background:#fee2e2;color:#b91c1c;padding:.5rem .8rem;border-radius:8px;margin:.5rem 0}.winner{text-align:center;background:#dcfce7}.qtext{font-size:1.15rem}.oxbtns{display:flex;gap:.75rem}.oxbtns button{flex:1;font-size:2rem;padding:1.2rem 0}.oxbtns .ox-o{background:#2563eb}.oxbtns .ox-x{background:#dc2626}.log .logline{font-size:.85rem;color:#444;padding:.15rem 0;border-bottom:1px dashed #eee}.chatlog{max-height:160px;overflow-y:auto;margin-bottom:.5rem}.chatline{font-size:.88rem;padding:.12rem 0}.chatform{display:flex;gap:.4rem}.chatform input{margin:0}.phaser-wrap{width:100%;margin:.75rem 0;border-radius:10px;overflow:hidden}.phaser-wrap canvas{width:100%!important;height:auto!important;display:block}.auth-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(#6cc0ff,#a9e0ff 45%,#e6f7ff);position:relative;overflow:hidden;padding:1rem}.clouds{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.cloud{position:absolute;width:120px;height:38px;background:#fff;border-radius:40px;opacity:.9}.cloud:before,.cloud:after{content:"";position:absolute;background:#fff;border-radius:50%}.cloud:before{width:58px;height:58px;top:-26px;left:16px}.cloud:after{width:42px;height:42px;top:-16px;right:18px}.cloud.c1{top:12%;left:8%;transform:scale(1.1);animation:drift 26s linear infinite}.cloud.c2{top:26%;right:6%;transform:scale(.8);animation:drift 34s linear infinite reverse}.cloud.c3{bottom:22%;left:14%;transform:scale(.7);opacity:.75;animation:drift 30s linear infinite}.cloud.c4{bottom:12%;right:12%;transform:scale(1);opacity:.8;animation:drift 40s linear infinite reverse}@keyframes drift{0%{margin-left:-30px}to{margin-left:30px}}.auth-inner{position:relative;z-index:1;width:100%;max-width:360px;text-align:center}.logo3d{font-size:4.6rem;font-weight:900;line-height:1;color:#ffd400;-webkit-text-stroke:3px #e8730a;text-shadow:0 4px 0 #c85a00,0 7px 0 #a84a00,0 10px 12px rgba(0,0,0,.28);letter-spacing:.04em;transform:rotate(-4deg);animation:bob 3s ease-in-out infinite}.logo-sub{color:#0b6cb0;font-weight:800;margin:.1rem 0 1.3rem;text-shadow:0 1px 0 #fff;letter-spacing:.02em}@keyframes bob{0%,to{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(-4deg) translateY(-7px)}}.login-panel{display:flex;gap:.6rem;align-items:center;background:#fffffff2;border:3px solid #7ec8ff;border-radius:18px;padding:.9rem;box-shadow:0 12px 26px #00468c47}.panel-fields{flex:1;display:flex;flex-direction:column;gap:.5rem}.field{display:flex;align-items:center;gap:.45rem;background:#eef6ff;border:2px solid #bfe0ff;border-radius:11px;padding:0 .6rem}.field-ico{font-size:1rem}.field input{border:none;background:transparent;margin:0;padding:.55rem .1rem;font-size:1rem;width:100%}.field input:focus{outline:none}.go-btn{width:68px;height:68px;border-radius:50%;flex-shrink:0;background:radial-gradient(circle at 34% 28%,#9ff58a,#25ad45);color:#fff;font-size:1.3rem;font-weight:900;border:3px solid #fff;box-shadow:0 5px #1c8a38,0 8px 12px #00000040;cursor:pointer}.go-btn:hover{filter:brightness(1.06)}.go-btn:active{transform:translateY(3px);box-shadow:0 2px #1c8a38}.auth-error{background:#fff0f0;color:#c0392b;border:2px solid #ffc9c9;border-radius:10px;padding:.5rem .8rem;margin-top:.8rem;font-size:.9rem}.auth-links{margin-top:1.1rem;display:flex;gap:.5rem;justify-content:center;align-items:center}.auth-links span{color:#0b6cb0;font-weight:800;cursor:pointer;text-shadow:0 1px 0 #fff}.auth-links .dot{color:#0b6cb0;cursor:default}.auth-links .muted-link{color:#5b86a6;font-weight:600}.phaser-fullscreen{width:100vw;height:100vh;overflow:hidden}.auth-dom{width:340px;max-height:96vh;overflow-y:auto;text-align:center;padding:4px}.auth-dom .logo3d{font-size:3.6rem;margin-bottom:0}.auth-dom .logo-sub{margin:.1rem 0 1rem}.auth-dom .auth-error{margin:0 0 .7rem}.signup-card{background:#fffffff5;border:3px solid #7ec8ff;border-radius:18px;padding:1.1rem;box-shadow:0 12px 26px #00468c47;display:flex;flex-direction:column;gap:.5rem}.signup-card h2{margin:0 0 .4rem;text-align:center;color:#0b6cb0;font-size:1.2rem}.signup-btn{margin-top:.5rem;padding:.75rem;border:none;border-radius:12px;background:linear-gradient(#34c759,#1e9e44);color:#fff;font-weight:900;font-size:1.05rem;box-shadow:0 4px #1c8a38;cursor:pointer}.signup-btn:active{transform:translateY(2px);box-shadow:0 2px #1c8a38}.oauth-row{margin-top:.9rem;display:flex;flex-direction:column;gap:.45rem}.oauth-divider{display:flex;align-items:center;gap:.5rem;color:#0b6cb0;font-size:.78rem;font-weight:700;margin:.2rem 0;text-shadow:0 1px 0 #fff}.oauth-divider:before,.oauth-divider:after{content:"";flex:1;height:1px;background:#0b6cb04d}.oauth-btn{display:flex;align-items:center;gap:.55rem;justify-content:center;padding:.6rem;border-radius:11px;font-weight:800;font-size:.92rem;text-decoration:none;border:2px solid transparent;box-shadow:0 2px 6px #0000001f}.oauth-ico{width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:900;font-size:.8rem;background:#fff}.oauth-google{background:#fff;color:#333;border-color:#dadce0}.oauth-google .oauth-ico{color:#4285f4}.oauth-kakao{background:#fee500;color:#191600}.oauth-kakao .oauth-ico{background:#191600;color:#fee500}.oauth-naver{background:#03c75a;color:#fff}.oauth-naver .oauth-ico{background:#fff;color:#03c75a}.lb{width:96vw;max-width:1100px;height:92vh;max-height:760px;display:flex;flex-direction:column;background:linear-gradient(#eaf6ff,#d7edfc);border:3px solid #0f5e9e;border-radius:20px;box-shadow:0 0 0 4px #ffffffa6,0 0 0 7px #1f77b859,0 18px 44px #00326e73;color:#16435f;overflow:hidden;font-size:14px}.lb-top{display:flex;align-items:center;gap:.9rem;padding:.5rem 1rem;background:linear-gradient(#5fbdf6,#2186cf 55%,#15659f);border-bottom:2px solid #ffd23e;box-shadow:inset 0 2px #ffffff73,0 3px 8px #00285a40}.lb-logo{font-size:1.8rem!important;transform:rotate(-3deg);animation:none;filter:drop-shadow(0 2px 2px rgba(0,0,0,.3))}.lb-tagline{color:#ffe9a8;font-size:.68rem;font-weight:900;letter-spacing:.22em;text-shadow:0 1px 0 rgba(0,0,0,.35)}.lb-actions{margin-left:auto;display:flex;align-items:center;gap:.6rem}.lb-me{display:flex;align-items:center;gap:.5rem;background:linear-gradient(#fff,#e8f4ff);border:2px solid #0f5e9e;border-radius:13px;padding:.25rem .7rem .25rem .3rem;box-shadow:inset 0 1px #fff,0 2px 4px #00285a40}.lb-me-ava{width:34px;height:42px;display:block}.lb-me-info small{color:#1d7fc4;font-weight:800}.lb-lv{display:inline-block;background:linear-gradient(#ffe34d,#f5a623);color:#6b3c00;border:1px solid #c87f1a;border-radius:999px;padding:0 .42rem;font-size:.7rem;font-weight:900;text-shadow:0 1px 0 rgba(255,255,255,.5);box-shadow:inset 0 1px #fff9;vertical-align:1px}.lb-btn{border:none;border-radius:12px;padding:.5rem .85rem;font-weight:900;font-size:.9rem;cursor:pointer;color:#fff;box-shadow:inset 0 1px #ffffff80,0 3px #00000047;transition:transform .06s;text-shadow:0 1px 1px rgba(0,0,0,.25)}.lb-btn:active{transform:translateY(2px);box-shadow:inset 0 1px #fff6,0 1px #00000047}.lb-btn-green{background:linear-gradient(#5ee282,#2cba53,#1e9e44);box-shadow:inset 0 1px #ffffff8c,0 3px #14732f}.lb-btn-amber{background:linear-gradient(#ffd75e,#e88c06);box-shadow:inset 0 1px #ffffff8c,0 3px #a85a04}.lb-btn-red{background:linear-gradient(#ff8a8a,#d92626);box-shadow:inset 0 1px #ffffff80,0 3px #971a1a}.lb-mid{flex:1;display:flex;gap:.7rem;padding:.7rem .7rem .4rem;min-height:0}.lb-rooms{flex:1;display:flex;flex-direction:column;min-width:0;background:#fff;border:2px solid #7db9e0;border-radius:14px;overflow:hidden;box-shadow:inset 0 0 0 1px #fff,0 3px 8px #00326e1f}.lb-rooms-head{display:flex;justify-content:space-between;align-items:center;padding:.45rem .8rem;background:linear-gradient(#dff1fe,#bfe2f8);border-bottom:2px solid #7db9e0;box-shadow:inset 0 1px #fff}.lb-rooms-head h3{margin:0;font-size:1.02rem;color:#0f5e9e;text-shadow:0 1px 0 #fff}.lb-table-wrap{flex:1;overflow-y:auto}.lb-table{width:100%;border-collapse:collapse}.lb-table th{position:sticky;top:0;background:linear-gradient(#f8fcff,#e9f4fd);color:#4f7ea3;font-size:.76rem;padding:.42rem .5rem;border-bottom:2px solid #cfe5f5;text-align:left;z-index:1}.lb-table td{padding:.52rem .5rem;border-bottom:1px solid #e4f1fb}.lb-table tbody tr:nth-child(2n){background:#f3fafe}.lb-table tr.joinable{cursor:pointer}.lb-table tr.joinable:hover{background:linear-gradient(#eaf7ff,#d8eefc);box-shadow:inset 3px 0 #2cba53}.lb-table tr.locked{opacity:.62}.lb-badge{display:inline-block;padding:.16rem .55rem;border-radius:999px;font-size:.72rem;font-weight:900;color:#fff;box-shadow:inset 0 1px #ffffff73,0 1px 2px #0003;text-shadow:0 1px 1px rgba(0,0,0,.25)}.lb-badge.wait{background:linear-gradient(#4ade80,#16a34a)}.lb-badge.play{background:linear-gradient(#fb923c,#ea580c)}.lb-code{font-weight:900;letter-spacing:.06em;color:#0f5e9e}.lb-title{font-weight:700;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-count{font-weight:900;color:#16a34a}.lb-empty{color:#7da7c4;padding:2.2rem 1rem;text-align:center}.lb-users{width:235px;flex-shrink:0;background:#fff;border:2px solid #7db9e0;border-radius:14px;padding:.5rem;display:flex;flex-direction:column;box-shadow:inset 0 0 0 1px #fff,0 3px 8px #00326e1f}.lb-users h4{margin:.15rem .25rem .5rem;color:#0f5e9e;text-shadow:0 1px 0 #fff}.lb-userlist{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1}.lb-user{display:flex;align-items:center;gap:.5rem;padding:.32rem .35rem;border-radius:10px;cursor:pointer;border:1px solid transparent}.lb-user:hover{background:#e9f6ff;border-color:#bfe2f8}.lb-user-ava{width:28px;height:34px;flex-shrink:0}.lb-user-nick{flex:1;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-user-meta{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.lb-user-iq{font-size:.7rem;font-weight:900;color:#16a34a}.lb-chatbox{height:132px;flex-shrink:0;display:flex;flex-direction:column;margin:.3rem .7rem;background:#fff;border:2px solid #7db9e0;border-radius:14px;padding:.45rem;box-shadow:inset 0 0 0 1px #fff,0 3px 8px #00326e1f}.lb-chatlog{flex:1;overflow-y:auto;padding:0 .3rem}.lb-chatline{font-size:.86rem;padding:.1rem 0}.lb-chatline b{color:#1d7fc4}.lb-chatform{display:flex;gap:.4rem;margin-top:.35rem}.lb-chatform input{flex:1;margin:0;padding:.5rem .6rem;border:2px solid #bfe0f7;border-radius:10px;background:#f6fbff}.lb-chatform input:focus{outline:none;border-color:#3aa4e8;box-shadow:0 0 0 3px #3aa4e833}.lb-bottombar{display:flex;align-items:center;gap:.5rem;padding:.45rem .7rem;background:linear-gradient(#1d7fc4,#11578c);border-top:2px solid #ffd23e;box-shadow:inset 0 2px #ffffff40}.lb-fn{border:2px solid #0d4a77;border-radius:11px;padding:.45rem .9rem;font-weight:900;font-size:.86rem;cursor:pointer;color:#fff;background:linear-gradient(#58aae6,#2576b9 60%,#1b639e);box-shadow:inset 0 1px #ffffff73,0 2px #0d4a77;text-shadow:0 1px 1px rgba(0,0,0,.3);transition:transform .06s}.lb-fn:hover{filter:brightness(1.1)}.lb-fn:active{transform:translateY(2px);box-shadow:inset 0 1px #fff6}.lb-spacer{flex:1}.lb-exit{padding:.45rem 1.3rem}.modal-bg{position:fixed;top:0;right:0;bottom:0;left:0;background:#0728468c;display:flex;align-items:center;justify-content:center;z-index:10}.modal{background:#fff;border:3px solid #0f5e9e;border-radius:16px;padding:1.2rem;width:300px;text-align:center;box-shadow:0 0 0 4px #fff6,0 16px 36px #00285a73;color:#16435f}.modal h3{margin:0 0 .8rem;color:#0f5e9e}.modal select,.modal input{width:100%;padding:.55rem;margin-bottom:.6rem;border-radius:10px;border:2px solid #bfe0f7;background:#f6fbff;color:#16435f;box-sizing:border-box}.modal-btns{display:flex;gap:.5rem}.btn-ghost{flex:1;background:#dbeafe;color:#1d4ed8;border:none;border-radius:10px;padding:.6rem;font-weight:800;cursor:pointer}.btn-primary{flex:1;background:linear-gradient(#5ee282,#1e9e44);color:#fff;border:none;border-radius:10px;padding:.6rem;font-weight:900;cursor:pointer;box-shadow:inset 0 1px #ffffff80,0 3px #14732f}.profile-modal .prof-ava{width:90px;height:110px;margin:0 auto .5rem}.prof-iq{color:#16a34a;font-weight:900;margin-bottom:1rem}.dx-head{display:flex;align-items:center;gap:.8rem;padding:.6rem .9rem;background:linear-gradient(#5fbdf6,#1d7fc4 60%,#15659f);color:#fff;font-size:1.05rem;border-bottom:2px solid #ffd23e;box-shadow:inset 0 2px #fff6}.dx-head b{flex:1;text-shadow:0 1px 1px rgba(0,0,0,.3)}.dx-sub{font-size:.76rem;color:#ffe9a8;font-weight:700}.dx-coins{background:linear-gradient(#fff,#ffeebf);color:#b45309;font-weight:900;border-radius:999px;padding:.2rem .7rem;border:1px solid #e3b04b;box-shadow:inset 0 1px #fff}.dx-close{background:#ffffff40;border:1px solid rgba(255,255,255,.4);color:#fff;font-size:1rem;font-weight:900;border-radius:8px;width:30px;height:30px;cursor:pointer}.dx{width:92vw;max-width:760px;height:86vh;max-height:580px;display:flex;flex-direction:column;background:#fff;border:3px solid #0f5e9e;border-radius:18px;overflow:hidden;box-shadow:0 0 0 4px #fff6,0 16px 36px #00285a80;color:#16435f}.dx-body{flex:1;display:flex;min-height:0}.dx-preview-pane{width:200px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;background:linear-gradient(#eaf6ff,#d3eafc);border-right:2px solid #bfe0f7}.dx-big{width:130px;height:170px;filter:drop-shadow(0 6px 8px rgba(0,40,90,.25))}.dx-right{flex:1;display:flex;flex-direction:column;min-width:0}.dx-tabs{display:flex;gap:.35rem;padding:.55rem .7rem 0;flex-wrap:wrap}.dx-tab{border:2px solid #bfe0f7;background:#f6fbff;color:#0f5e9e;border-radius:999px;padding:.32rem .7rem;font-weight:800;font-size:.82rem;cursor:pointer}.dx-tab.on{background:linear-gradient(#3aa4e8,#1d7fc4);border-color:#15659f;color:#fff;box-shadow:inset 0 1px #fff6}.dx-grid{flex:1;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:.55rem;padding:.7rem;align-content:start}.dx-card{border:2px solid #d9ecfa;border-radius:12px;padding:.45rem .3rem;text-align:center;cursor:pointer;background:linear-gradient(#fff,#f4faff);transition:.1s;box-shadow:0 2px 4px #00326e14}.dx-card:hover{border-color:#3aa4e8;transform:translateY(-2px);box-shadow:0 5px 10px #00326e2e}.dx-card.sel{border-color:#22c55e;background:linear-gradient(#f3fff6,#e4fbe9)}.dx-prev{width:64px;height:80px;margin:0 auto .25rem}.dx-name{font-size:.8rem;font-weight:800;margin-bottom:.25rem}.dx-badge{display:inline-block;font-size:.7rem;font-weight:900;border-radius:999px;padding:.12rem .5rem}.dx-badge.on{background:linear-gradient(#4ade80,#16a34a);color:#fff;box-shadow:inset 0 1px #ffffff73}.dx-badge.own{background:#dbeafe;color:#1d4ed8}.dx-badge.price{background:linear-gradient(#fff3cf,#fde2a3);color:#b45309;border:1px solid #e3b04b}.dx-foot{display:flex;align-items:center;justify-content:flex-end;gap:.8rem;padding:.55rem .9rem;border-top:2px solid #d9ecfa;background:linear-gradient(#f8fcff,#eaf4fd)}.dx-msg{color:#0f5e9e;font-weight:700;font-size:.85rem}.mini-panel{width:92vw;max-width:620px;max-height:88vh;display:flex;flex-direction:column;background:#fff;border:3px solid #0f5e9e;border-radius:18px;overflow:hidden;box-shadow:0 0 0 4px #fff6,0 16px 36px #00285a80;color:#16435f}.mini-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.7rem;padding:.9rem;overflow-y:auto}.mini-card{border:2px solid #bfe2f8;border-radius:14px;padding:1rem .9rem;cursor:pointer;text-align:center;background:linear-gradient(#fff,#eef7ff);transition:.12s;box-shadow:0 3px 6px #00326e1a}.mini-card:hover{transform:translateY(-3px);border-color:#3aa4e8;box-shadow:0 8px 16px #00326e33}.mini-card.soon{opacity:.55;cursor:default}.mini-card.soon:hover{transform:none;border-color:#bfe2f8;box-shadow:0 3px 6px #00326e1a}.mini-icon{font-size:2.2rem;margin-bottom:.3rem}.mini-card b{color:#0f5e9e}.mini-card p{font-size:.8rem;color:#5b87a6;margin:.35rem 0 .5rem}.mini-go{display:inline-block;background:linear-gradient(#5ee282,#1e9e44);color:#fff;font-weight:900;font-size:.78rem;border-radius:999px;padding:.22rem .8rem;box-shadow:inset 0 1px #ffffff80,0 2px #14732f}.mini-host{padding:.9rem;overflow-y:auto}.help-panel .help-body{padding:.9rem 1.1rem;overflow-y:auto}.help-body h4{margin:.7rem 0 .25rem;color:#0f5e9e}.help-body p{margin:0;font-size:.88rem;color:#335e7c;line-height:1.55}.wd{display:flex;flex-direction:column;align-items:center;gap:.6rem}.wd-head{text-align:center}.wd-head b{color:#0f5e9e;font-size:1.1rem}.wd-sub{display:block;font-size:.76rem;color:#5b87a6;margin-top:.15rem}.wd-grid{display:flex;flex-direction:column;gap:.3rem}.wd-row{display:flex;gap:.3rem}.wd-tile{width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:900;border-radius:9px;color:#fff;box-shadow:inset 0 1px #ffffff59,0 2px 3px #00285a26}.wd-tile.empty{background:#f2f9ff;border:2px solid #cfe5f5;box-shadow:none}.wd-tile.hit{background:linear-gradient(#56c45c,#379e3e)}.wd-tile.near{background:linear-gradient(#e8cb46,#c9a92c)}.wd-tile.miss{background:linear-gradient(#a8b0b8,#848b93)}.wd-tile.cur{background:#fff;border:2px solid #3aa4e8;color:#0f5e9e;box-shadow:0 0 0 3px #3aa4e826}.wd-row.active .wd-tile.empty{border-style:dashed}.kb{display:flex;flex-direction:column;gap:.3rem;align-items:center;width:100%}.kb-row{display:flex;gap:.28rem;justify-content:center}.kb-key{min-width:36px;height:44px;padding:0 .35rem;border:none;border-radius:8px;cursor:pointer;background:linear-gradient(#fff,#dcebf7);color:#16435f;font-size:1.05rem;font-weight:900;border-bottom:2px solid #a8c8e0;box-shadow:0 1px 2px #00285a26}.kb-key:hover{filter:brightness(1.05)}.kb-key:active{transform:translateY(1px)}.kb-key.hit{background:linear-gradient(#56c45c,#379e3e);color:#fff;border-bottom-color:#2a7d30}.kb-key.near{background:linear-gradient(#e8cb46,#c9a92c);color:#fff;border-bottom-color:#9c8420}.kb-key.miss{background:linear-gradient(#a8b0b8,#848b93);color:#fff;border-bottom-color:#6a7078}.kb-key.wide{min-width:52px}.kb-key.fn{background:linear-gradient(#cfe5f5,#aecfe8);font-size:.95rem}.kb-key.fn.on{background:linear-gradient(#3aa4e8,#1d7fc4);color:#fff;border-bottom-color:#15659f}.kb-key.enter{min-width:200px;background:linear-gradient(#5ee282,#1e9e44);color:#fff;border-bottom-color:#14732f;font-size:.95rem;box-shadow:inset 0 1px #ffffff80,0 2px #14732f}.wd-done{text-align:center;font-weight:900;font-size:1.02rem;padding:.5rem .9rem;border-radius:12px}.wd-done.win{background:#eafff0;color:#15803d;border:2px solid #86efac}.wd-done.fail{background:#fef2f2;color:#b91c1c;border:2px solid #fecaca}.wd-reward{font-size:.9rem;margin-top:.25rem;color:#b45309}.wd-share{min-width:220px}.wd-msg{min-height:1.2em;color:#0f5e9e;font-weight:700;font-size:.85rem;text-align:center}.room{width:96vw;max-width:1000px;height:92vh;max-height:700px;display:flex;flex-direction:column;background:linear-gradient(#eaf6ff,#d7edfc);border:3px solid #0f5e9e;border-radius:20px;box-shadow:0 0 0 4px #ffffffa6,0 0 0 7px #1f77b859,0 18px 44px #00326e73;color:#16435f;overflow:hidden;font-size:14px}.room-top{display:flex;justify-content:space-between;align-items:center;padding:.55rem 1rem;background:linear-gradient(#5fbdf6,#2186cf 55%,#15659f);border-bottom:2px solid #ffd23e;box-shadow:inset 0 2px #ffffff73;color:#fff}.room-head{font-weight:800;text-shadow:0 1px 1px rgba(0,0,0,.25)}.room-head b{color:#ffe34d}.room-phase{color:#e3f3fe;font-weight:700}.room-phase .timer{color:#ffe34d}.room-err{margin:.5rem .75rem 0;padding:.5rem .7rem;background:#fee2e2;border:2px solid #fca5a5;border-radius:10px;color:#b91c1c}.room-body{flex:1;display:flex;gap:.7rem;padding:.7rem;min-height:0}.room-main{flex:1;display:flex;flex-direction:column;min-width:0;overflow-y:auto}.room-card{background:#fff;border:2px solid #7db9e0;border-radius:14px;padding:1rem;box-shadow:inset 0 0 0 1px #fff,0 3px 8px #00326e1f}.room-card h3{margin:0 0 .6rem;color:#0f5e9e}.room-start-btn{margin-top:.8rem;width:100%;padding:.7rem;border:none;border-radius:12px;background:linear-gradient(#5ee282,#2cba53,#1e9e44);color:#fff;font-weight:900;font-size:1rem;cursor:pointer;box-shadow:inset 0 1px #ffffff8c,0 3px #14732f;text-shadow:0 1px 1px rgba(0,0,0,.25)}.wait-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:.6rem}.wait-seat{text-align:center;background:linear-gradient(#fff,#f0f8ff);border:2px solid #d9ecfa;border-radius:12px;padding:.5rem .25rem;box-shadow:0 2px 4px #00326e14}.wait-seat.off{opacity:.4}.wait-ava{width:56px;height:70px;margin:0 auto .3rem}.wait-name{font-size:.8rem;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.game-pane{display:flex;flex-direction:column;gap:.6rem;align-items:center}.game-mount{width:560px;max-width:100%;aspect-ratio:4 / 3;border-radius:12px;overflow:hidden;border:2px solid #15659f;box-shadow:0 4px 10px #00285a4d}.game-mount canvas{display:block;width:100%!important;height:100%!important}.game-log{width:100%;max-width:560px;background:#fff;border:2px solid #7db9e0;border-radius:12px;padding:.5rem .7rem}.game-log h4{margin:.1rem 0 .4rem;color:#0f5e9e}.logline{font-size:.85rem;padding:.1rem 0;color:#335e7c}.room-side{width:250px;flex-shrink:0;background:#fff;border:2px solid #7db9e0;border-radius:14px;padding:.5rem;display:flex;flex-direction:column;box-shadow:inset 0 0 0 1px #fff,0 3px 8px #00326e1f}.room-side h4{margin:.2rem .2rem .5rem;color:#0f5e9e}.room-side .chatlog{flex:1;overflow-y:auto;margin-bottom:.5rem}.room-side .chatline{font-size:.85rem;padding:.12rem 0}.room-side .chatline b{color:#1d7fc4}.room-side .chatline.mafia{color:#dc2626}.room-side .chatline.mafia b{color:#b91c1c}.room-side .chatline.dead{color:#8aa3b8;font-style:italic}.room-side .chatline.dead b{color:#8aa3b8}.room-side .chatform input:disabled{background:#e8eef4;color:#9bb0c0;cursor:not-allowed}.room-side .chatform{display:flex;gap:.4rem}.room-side .chatform input{flex:1;padding:.45rem;border-radius:10px;border:2px solid #bfe0f7;background:#f6fbff;color:#16435f}.room-side .chatform input:focus{outline:none;border-color:#3aa4e8}.room-side .chatform button{background:linear-gradient(#5ee282,#1e9e44);color:#fff;border:none;border-radius:10px;padding:0 .8rem;font-weight:800;cursor:pointer;box-shadow:inset 0 1px #ffffff80,0 2px #14732f}.result-card{max-width:560px;width:100%;margin:0 auto}.result-table{width:100%;border-collapse:collapse;margin-bottom:.6rem}.result-table th,.result-table td{padding:.45rem .5rem;text-align:center;border-bottom:1px solid #d9ecfa}.result-table th{color:#5b87a6;font-size:.8rem}.result-table .rname{text-align:left;font-weight:700}.result-table tr.win td{color:#16a34a;font-weight:800}.room-leave{margin:0 .7rem .7rem;padding:.55rem;border:none;border-radius:12px;background:#dbeafe;color:#1d4ed8;font-weight:800;cursor:pointer}.room-leave:hover{background:#bfdbfe}.room .muted{color:#5b87a6}.gender-pick{text-align:left}.gender-label{display:block;font-size:.78rem;font-weight:800;color:#0b6cb0;margin:.2rem 0 .3rem}.gender-btns{display:flex;gap:.5rem}.gender-btn{flex:1;padding:.55rem;border-radius:11px;border:2px solid #bfe0ff;background:#eef6ff;color:#5b86a6;font-weight:800;cursor:pointer}.gender-btn.on{background:linear-gradient(#3aa4e8,#1d7fc4);border-color:#15659f;color:#fff;box-shadow:inset 0 1px #fff6}.pcard{text-align:center}.pcard-ava{width:100px;height:124px;margin:0 auto .4rem;filter:drop-shadow(0 5px 7px rgba(0,40,90,.25))}.pcard h3{margin:.1rem 0 .35rem;color:#0f5e9e}.pcard-iq{color:#16a34a;font-weight:900;margin-bottom:.5rem}.pcard-xp{margin-bottom:.8rem}.pcard-xp-bar{height:12px;border-radius:999px;background:#e2eef8;border:1px solid #bfe0f7;overflow:hidden}.pcard-xp-fill{height:100%;background:linear-gradient(90deg,#5fbdf6,#1d7fc4);border-radius:999px}.pcard-xp small{color:#5b87a6;font-weight:700}.page-panel{width:96vw;max-width:1000px;height:92vh;max-height:700px;display:flex;flex-direction:column;background:#fff;border:3px solid #0f5e9e;border-radius:20px;overflow:hidden;color:#16435f;font-size:14px;box-shadow:0 0 0 4px #ffffffa6,0 0 0 7px #1f77b859,0 18px 44px #00326e73}.page-panel .dx-head{font-size:1.15rem}.page-panel .dx-body{min-height:0}.page-panel .dx-preview-pane{width:240px;gap:.6rem;padding:.8rem}.page-panel .dx-big{width:150px;height:195px}.shop-hint{color:#5b87a6;font-weight:700}.shop-buy{margin-top:.3rem;width:100%;border:none;border-radius:8px;padding:.3rem 0;font-weight:900;font-size:.78rem;color:#fff;background:linear-gradient(#fbbf24,#d97706);box-shadow:0 2px #a85a04;cursor:pointer}.shop-buy:active{transform:translateY(1px)}.nick-edit{display:flex;gap:.35rem;width:90%}.nick-edit input{flex:1;margin:0;padding:.45rem .5rem;border:2px solid #bfe0f7;border-radius:9px;background:#f6fbff;font-size:.85rem;font-weight:700}.nick-edit .lb-btn{padding:.35rem .6rem;font-size:.78rem}.wear-chips{display:flex;flex-wrap:wrap;gap:.25rem;justify-content:center;padding:0 .5rem}.wear-chip{background:#e9f6ff;border:1px solid #bfe2f8;color:#1769a8;border-radius:999px;padding:.1rem .5rem;font-size:.7rem;font-weight:800}.juke-panel{max-width:560px}.juke-list{flex:1;overflow-y:auto;padding:.6rem .8rem;display:flex;flex-direction:column;gap:.4rem}.juke-row{display:flex;align-items:center;gap:.6rem;padding:.5rem .6rem;border:2px solid #d9ecfa;border-radius:12px;background:linear-gradient(#fff,#f4faff)}.juke-row.on{border-color:#1d7fc4;background:linear-gradient(#eaf7ff,#d8eefc);box-shadow:inset 3px 0 #1d7fc4}.juke-chk{width:17px;height:17px;margin:0;flex-shrink:0;accent-color:#1d7fc4}.juke-info{flex:1;min-width:0}.juke-info b{color:#0f5e9e;display:block}.juke-info small{color:#5b87a6;font-weight:700}.juke-row.on .juke-info b:after{content:" ♪ 재생 중";color:#16a34a;font-size:.75rem}.juke-play{padding:.35rem .7rem!important;font-size:.85rem!important}.fr-panel{max-width:480px}.fr-body{flex:1;overflow-y:auto;padding:.7rem .9rem}.fr-body h4{margin:.7rem 0 .35rem;color:#0f5e9e}.fr-add{display:flex;gap:.4rem}.fr-add input{flex:1;margin:0;padding:.5rem .6rem;border:2px solid #bfe0f7;border-radius:10px;background:#f6fbff}.fr-add input:focus{outline:none;border-color:#3aa4e8}.fr-row{display:flex;align-items:center;gap:.5rem;padding:.35rem .45rem;border:2px solid #e4f1fb;border-radius:11px;background:linear-gradient(#fff,#f6fbff);margin-bottom:.35rem}.fr-ava{width:26px;height:32px;flex-shrink:0}.fr-dot{width:10px;height:10px;border-radius:50%;background:#cbd5e1;flex-shrink:0}.fr-dot.on{background:#22c55e;box-shadow:0 0 5px #22c55e}.fr-nick{flex:1;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fr-wait{font-size:.75rem;color:#7da7c4;font-weight:700}.fr-btn{border:none;border-radius:8px;padding:.3rem .6rem;font-weight:800;font-size:.76rem;cursor:pointer;color:#fff}.fr-accept{background:linear-gradient(#4ade80,#16a34a)}.fr-decline{background:linear-gradient(#a8b0b8,#848b93)}.fr-del{background:linear-gradient(#f87171,#dc2626)}.ava-stack{position:relative;display:block;width:100%;height:100%}.ava-stack img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.base-pick{display:flex;align-items:center;gap:.45rem;padding:.55rem .7rem 0}.base-pick-label{font-size:.8rem;font-weight:900;color:#0f5e9e}.base-opt{width:56px;height:74px;border:2px solid #d9ecfa;border-radius:10px;cursor:pointer;background:linear-gradient(#fff,#f4faff);padding:3px;transition:.1s}.base-opt img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.base-opt:hover{border-color:#3aa4e8}.base-opt.sel{border-color:#22c55e;background:#f0fdf4}.gamecat-panel{max-width:640px}.gc-grid{flex:1;overflow-y:auto;display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem;padding:.8rem}.gc-card{position:relative;border:3px solid #d9ecfa;border-radius:14px;overflow:hidden;cursor:pointer;background:#fff;transition:.12s}.gc-card:hover{transform:translateY(-2px);border-color:#3aa4e8;box-shadow:0 6px 14px #00326e33}.gc-card.sel{border-color:#22c55e;box-shadow:0 0 0 3px #22c55e40,0 6px 14px #00326e33}.gc-img{height:110px;background:#0f172a}.gc-img img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;display:block}.gc-img.noimg{background:linear-gradient(#3aa4e8,#1d7fc4)}.gc-info{padding:.45rem .6rem .55rem}.gc-info b{color:#0f5e9e;display:block}.gc-info small{color:#5b87a6;font-weight:700;display:block;margin:.1rem 0 .25rem}.gc-players{display:inline-block;background:#e9f6ff;border:1px solid #bfe2f8;color:#1769a8;border-radius:999px;padding:.08rem .5rem;font-size:.72rem;font-weight:800}.gc-check{position:absolute;top:8px;right:8px;width:26px;height:26px;border-radius:50%;background:#22c55e;color:#fff;font-weight:900;display:none;align-items:center;justify-content:center;box-shadow:0 2px 4px #0000004d}.gc-card.sel .gc-check{display:flex}.gc-foot input{flex:1;margin:0;padding:.55rem .7rem;border:2px solid #bfe0f7;border-radius:10px;background:#f6fbff}.gc-foot input:focus{outline:none;border-color:#3aa4e8}.base-opt{display:flex;flex-direction:column;align-items:center;width:60px;height:92px}.base-opt img{height:70px}.base-name{font-size:.68rem;font-weight:900;color:#0f5e9e}.pet-adopt{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:1rem}.pet-adopt h3{margin:0;color:#0f5e9e}.pet-species-row{display:flex;gap:1rem}.pet-species{width:140px;border:3px solid #d9ecfa;border-radius:16px;padding:.8rem .5rem;text-align:center;cursor:pointer;background:linear-gradient(#fff,#f4faff);transition:.12s}.pet-species:hover{transform:translateY(-3px);border-color:#3aa4e8}.pet-species.sel{border-color:#22c55e;box-shadow:0 0 0 3px #22c55e40}.pet-species-img{width:90px;height:104px;margin:0 auto .4rem}.pet-species b{display:block;color:#0f5e9e;margin-bottom:.3rem}.pet-adopt-form{display:flex;gap:.5rem}.pet-adopt-form input{width:220px;margin:0;padding:.55rem .7rem;border:2px solid #bfe0f7;border-radius:10px;background:#f6fbff}.pet-care{flex:1;display:flex;gap:1rem;padding:1rem;min-height:0}.pet-left{width:250px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:.5rem;background:linear-gradient(#eaf6ff,#d3eafc);border:2px solid #bfe0f7;border-radius:16px;padding:1rem}.pet-big{width:170px;height:196px;filter:drop-shadow(0 6px 8px rgba(0,40,90,.25))}.pet-nameline b{color:#0f5e9e;font-size:1.1rem}.pet-mood{font-weight:800;color:#5b87a6}.pet-right{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem}.pet-right h4{margin:.5rem 0 .1rem;color:#0f5e9e}.pet-gauge{display:flex;align-items:center;gap:.5rem}.pet-gauge-label{width:84px;font-weight:900;color:#16435f}.pet-gauge-bar{flex:1;height:16px;border-radius:999px;background:#e2eef8;border:1px solid #bfe0f7;overflow:hidden}.pet-gauge-fill{height:100%;border-radius:999px;transition:width .4s}.pet-gauge-val{width:30px;text-align:right;font-weight:900;color:#0f5e9e}.pet-play{align-self:flex-start}.pet-feeds{display:flex;flex-wrap:wrap;gap:.5rem}.pet-feed-btn{display:flex;align-items:center;gap:.45rem;border:2px solid #bfe2f8;border-radius:12px;background:linear-gradient(#fff,#eef7ff);padding:.4rem .7rem;font-weight:800;color:#16435f;cursor:pointer}.pet-feed-btn:hover{border-color:#3aa4e8}.pet-feed-btn.on{border-color:#22c55e;background:#f0fdf4}.pet-item-ico{width:30px;height:30px;display:inline-block}.dx-prev.pet-ico{width:56px;height:56px;margin:.5rem auto .4rem}.jk-player{display:flex;align-items:center;gap:1rem;padding:.8rem 1rem;background:linear-gradient(#243044,#141c2b);border-bottom:2px solid #ffd23e}.jk-cover{width:96px;height:96px;border-radius:10px;object-fit:cover;image-rendering:pixelated;box-shadow:0 4px 10px #00000073;flex-shrink:0}.jk-vinyl-wrap{position:relative;width:110px;height:110px;flex-shrink:0}.jk-vinyl{width:104px;height:104px;border-radius:50%;background:repeating-radial-gradient(circle at center,#111 0,#111 2px,#1f1f1f 2px,#1f1f1f 4px);box-shadow:0 3px 8px #00000080,inset 0 0 0 3px #000;display:flex;align-items:center;justify-content:center}.jk-vinyl img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid #d4a017}.jk-vinyl.spin{animation:jk-rotate 3.5s linear infinite}@keyframes jk-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.jk-tonearm{position:absolute;top:-4px;right:2px;width:7px;height:56px;background:linear-gradient(#cbd5e1,#94a3b8);border-radius:4px;transform:rotate(-24deg);transform-origin:top center;box-shadow:0 2px 4px #0006}.jk-tonearm:after{content:"";position:absolute;bottom:-8px;left:-3px;width:13px;height:12px;background:#e2e8f0;border-radius:3px}.jk-meta{flex:1;min-width:0;color:#fff}.jk-meta b{display:block;font-size:1.1rem;color:#ffe34d}.jk-meta small{display:block;color:#b8c4d8;margin:.15rem 0 .5rem}.jk-progress{height:8px;border-radius:999px;background:#ffffff2e;overflow:hidden}.jk-bar{height:100%;width:0%;background:linear-gradient(90deg,#ffd23e,#f5a623);border-radius:999px;transition:width .4s linear}.jk-ctrl-row{display:flex;align-items:center;justify-content:space-between;margin-top:.4rem}.jk-time{font-size:.75rem;color:#b8c4d8;font-variant-numeric:tabular-nums}.jk-ctrls{display:flex;gap:.5rem;align-items:center}.jk-btn{border:none;border-radius:50%;width:34px;height:34px;cursor:pointer;font-size:.95rem;background:#ffffff26;color:#fff}.jk-btn:hover{background:#ffffff4d}.jk-btn-main{width:42px;height:42px;background:linear-gradient(#ffd23e,#f5a623);color:#4a3000;font-size:1.1rem;box-shadow:0 3px #b97a08}.juke-thumb{width:38px;height:38px;border-radius:8px;object-fit:cover;image-rendering:pixelated;cursor:pointer;flex-shrink:0}.juke-panel{max-width:600px}