:root{color-scheme:light;--mint: #cfe9df;--cream: #fbf6ec;--ink: #2b2a28;--pink: #f6a7bb;--yellow: #f6dc82;--brown: #6b4226;--card: rgba(255,255,255,.92)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:var(--mint);color:var(--ink);font-family:Noto Sans KR,system-ui,sans-serif;overflow:hidden;overscroll-behavior:none;forced-color-adjust:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}.screen{overflow-x:hidden}.card{max-width:100%;overflow:hidden}button{font-family:inherit}#app{position:fixed;inset:0}canvas.game{position:absolute;inset:0;display:block;touch-action:none}.screen{position:absolute;inset:0;display:flex;align-items:safe center;justify-content:center;padding:16px;overflow:auto;-webkit-overflow-scrolling:touch}.screen.bg{background:radial-gradient(circle at 30% 20%,#e7f4ee 0%,var(--mint) 60%,#b9ddd0 100%)}.card{background:var(--card);border-radius:22px;padding:22px;width:min(440px,100%);box-shadow:0 16px 40px #0000001f}h1.logo{font-family:Gaegu,cursive;font-size:40px;margin:0 0 4px;line-height:1}h1.logo small{display:block;font-size:14px;letter-spacing:4px;color:#888;font-family:Noto Sans KR;font-weight:700}.sub{color:#777;font-size:13px;margin-bottom:14px}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}.field label{font-size:12px;color:#666;font-weight:700}input[type=text],input[type=password]{font-size:16px;padding:12px 14px;border-radius:12px;border:2px solid #e5e5e5;outline:none;background:#fff}input:focus{border-color:var(--pink)}.btn{border:0;border-radius:14px;padding:13px 18px;font-size:16px;font-weight:700;cursor:pointer;background:var(--ink);color:#fff;width:100%}.btn.secondary{background:#eee;color:var(--ink)}.btn.pink{background:var(--pink);color:#fff}.btn:disabled{opacity:.5}.row{display:flex;gap:8px}.err{color:#d33;font-size:13px;min-height:18px;margin:6px 0}.tabs{display:flex;gap:6px;margin-bottom:12px}.tabs button{flex:1;background:#f0f0f0;border:0;border-radius:10px;padding:8px;font-weight:700;color:#777}.tabs button.on{background:var(--ink);color:#fff}.chars{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:6px 0 10px}.char{border:3px solid transparent;border-radius:14px;background:#fff;padding:6px 4px;text-align:center;cursor:pointer}.char.on{border-color:var(--pink);background:#fff3f6}.char canvas{width:100%;aspect-ratio:1;display:block}.char b{display:block;font-size:12px}.char i{display:block;font-size:10px;color:#999;font-style:normal}.lobby{width:min(900px,100%);display:grid;grid-template-columns:1.2fr 1fr;gap:14px}@media (max-width: 760px){.lobby{grid-template-columns:1fr}}.rooms{max-height:46vh;overflow:auto;display:flex;flex-direction:column;gap:8px}.room{display:flex;align-items:center;justify-content:space-between;background:#fff;border-radius:12px;padding:10px 12px}.room b{font-size:15px}.room span{color:#888;font-size:12px}.room button{width:auto;padding:8px 14px;font-size:14px}.me{display:flex;gap:12px;align-items:center;margin-bottom:10px}.me canvas{width:64px;height:64px}.rank-list{max-height:40vh;overflow:auto;font-size:13px}.rank-list div{display:flex;justify-content:space-between;padding:6px 4px;border-bottom:1px solid #f0f0f0}.rank-list div:first-child{font-weight:700;color:#777}.mini{font-size:11px;color:#999}.hud{position:absolute;inset:0;pointer-events:none}.hud>*{pointer-events:auto}.pill.hint{position:absolute;left:50%;transform:translate(-50%);top:54px;background:#2b2a28cc;color:#fff;font-size:12px;white-space:nowrap}.topbar{position:absolute;top:max(10px,env(safe-area-inset-top));left:10px;right:10px;display:flex;gap:8px;align-items:flex-start;justify-content:space-between}.pill{background:#ffffffe6;border-radius:14px;padding:8px 12px;font-size:13px;font-weight:700;box-shadow:0 4px 14px #0000001f}.pill.timer{font-size:20px;font-family:Gaegu;min-width:78px;text-align:center}.pill.team{display:flex;gap:10px;flex-wrap:wrap}.namebar{position:absolute;top:calc(max(10px,env(safe-area-inset-top)) + 44px);left:10px;right:10px;display:flex;pointer-events:none}.namebar .rname{max-width:72%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-weight:800;color:#7a5;background:#ffffffeb}.breakdown-banner{position:absolute;top:max(10px,env(safe-area-inset-top));left:50%;transform:translate(-50%);max-width:92vw;background:#c0392bf2;color:#fff;font-weight:800;font-size:13px;padding:9px 14px;border-radius:12px;box-shadow:0 4px 16px #00000040;text-align:center;z-index:20;animation:bdpulse 1s ease-in-out infinite}.breakdown-banner b{font-size:16px;color:#ffe08a}@keyframes bdpulse{0%,to{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.04)}}.pill .w{color:#d33}.pill .s{color:#a40}.pill .e{color:#a60}.stamina{position:absolute;left:50%;transform:translate(-50%);bottom:max(118px,calc(env(safe-area-inset-bottom) + 118px));width:180px;height:12px;background:#00000040;border-radius:8px;overflow:hidden}.stamina i{display:block;height:100%;background:linear-gradient(90deg,#ffb24d,#f6dc82);width:100%}.stamina b{position:absolute;inset:0;font-size:9px;color:#fff;text-align:center;line-height:12px}.toast{position:absolute;left:50%;transform:translate(-50%);top:24%;background:#2b2a28d9;color:#fff;padding:10px 16px;border-radius:14px;font-size:14px;font-weight:700;opacity:0;transition:opacity .2s;white-space:nowrap}.toast.on{opacity:1}.log{position:absolute;left:10px;bottom:max(118px,calc(env(safe-area-inset-bottom) + 118px));width:min(46vw,320px);max-height:150px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;font-size:12px}.log div{background:#ffffffd9;border-radius:10px;padding:4px 8px;width:fit-content;max-width:100%}.log div.sys{background:#2b2a28b3;color:#fff}.log div.voice{background:#f6a7bbd9}.chatbar{position:absolute;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));display:none;gap:6px}.chatbar.on{display:flex}.chatbar input{flex:1}.chatbar button{width:auto}.controls{position:absolute;right:12px;bottom:max(14px,calc(env(safe-area-inset-bottom) + 14px));display:flex;flex-direction:column;gap:10px;align-items:flex-end}.controls .row{gap:10px}.cbtn{width:68px;height:68px;border-radius:50%;border:0;font-size:12px;font-weight:900;color:#fff;background:var(--ink);box-shadow:0 6px 16px #00000040;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;user-select:none}.cbtn em{font-style:normal;font-size:22px}.cbtn.act{background:var(--pink);width:84px;height:84px}.cbtn.eat{background:var(--yellow);color:var(--ink)}.cbtn.mic{background:#8ab}.cbtn.mic.on{background:#2bb673}.cbtn.chat{background:#777;width:52px;height:52px;font-size:11px}.cbtn.leave{background:#c55;width:52px;height:52px;font-size:11px}.joy{position:absolute;left:18px;bottom:max(18px,calc(env(safe-area-inset-bottom) + 18px));width:140px;height:140px;border-radius:50%;background:#ffffff40;border:2px solid rgba(255,255,255,.6);touch-action:none}.joy i{position:absolute;left:50%;top:50%;width:60px;height:60px;margin:-30px;border-radius:50%;background:#ffffffd9;box-shadow:0 4px 10px #0003}@media (hover: hover) and (pointer: fine){.joy,.controls .cbtn.act,.controls .cbtn.eat{display:none}}.keys{position:absolute;left:10px;bottom:max(10px,env(safe-area-inset-bottom));font-size:11px;color:#0000008c;background:#fff9;padding:6px 10px;border-radius:10px}@media (hover: none){.keys{display:none}}.players{position:absolute;right:10px;top:60px;display:flex;flex-direction:column;gap:4px}.players div{background:#ffffffd9;border-radius:10px;padding:4px 10px;font-size:12px;display:flex;gap:8px;justify-content:space-between;min-width:130px}.players div.me{outline:2px solid var(--pink)}.players div .mic{color:#2bb673}.results{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#00000059}.results .card{width:min(520px,94vw);max-height:86vh;overflow:auto}.results h2{font-family:Gaegu;font-size:34px;margin:0}.results table{width:100%;border-collapse:collapse;font-size:14px}.results td,.results th{padding:6px;border-bottom:1px solid #eee;text-align:left}.results tr.me td{background:#fff3f6}.stat{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:10px 0}.stat div{background:#f6f6f6;border-radius:10px;padding:8px 4px;text-align:center;font-size:11px;color:#777}.stat div b{display:block;font-size:18px;color:var(--ink)}.label3d{position:absolute;transform:translate(-50%,-100%);pointer-events:none;text-align:center;white-space:nowrap}.label3d b{font-size:12px;background:#ffffffd9;padding:2px 8px;border-radius:10px}.label3d .sub{display:block;margin:2px 0 0;font-size:12px;color:#fff;background:#2b2a28cc;padding:3px 8px;border-radius:10px;max-width:220px;white-space:normal}.label3d .sub:empty{display:none}.label3d .act{display:block;font-size:20px}@media (max-width: 640px){.topbar{gap:6px}.pill.team{font-size:11px;padding:6px 8px;gap:6px;white-space:nowrap;overflow:hidden}.pill.timer{font-size:17px;min-width:60px;padding:6px 8px}.pill.hint{top:44px;font-size:11px;white-space:normal;text-align:center;max-width:92vw}.players{top:50px;right:8px}.players div{font-size:11px;min-width:100px;padding:3px 8px}.log{bottom:210px;width:56vw;max-height:62px;font-size:10px;opacity:.9}.stamina{bottom:188px;width:130px}.waiting{top:86px;width:94vw}.waiting h2{font-size:17px}.waiting .card p{font-size:12px}.controls{bottom:max(12px,calc(env(safe-area-inset-bottom) + 12px))}.cbtn{width:58px;height:58px;font-size:11px}.cbtn em{font-size:18px}.cbtn.act{width:76px;height:76px}.joy{width:120px;height:120px}}@media (max-width: 760px){.cprev canvas{max-width:210px}}.custom{width:min(960px,100%);display:grid;grid-template-columns:340px 1fr;gap:14px}@media (max-width: 760px){.custom{grid-template-columns:1fr}}.cprev canvas{width:100%;max-width:300px;aspect-ratio:1;display:block;margin:0 auto;background:radial-gradient(circle,#fff,#f3efe6);border-radius:18px;touch-action:none}.copts{max-height:82vh;overflow:auto}.optrow{margin-bottom:12px}.optrow label{display:block;font-size:12px;color:#666;font-weight:700;margin-bottom:6px}.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.chip{border:2px solid #e5e5e5;background:#fff;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700;cursor:pointer}.chip.on{border-color:var(--pink);background:#fff3f6}.sw{width:28px;height:28px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px #ddd;cursor:pointer}.sw.on{box-shadow:0 0 0 3px var(--pink)}.chips input[type=color]{width:32px;height:32px;border:0;background:none;padding:0;cursor:pointer}.shopgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}.shopitem{background:#fff;border:2px solid #eee;border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:4px;align-items:center;text-align:center}.shopitem.on{border-color:var(--pink)}.shopitem i{width:26px;height:26px;border-radius:50%;box-shadow:inset 0 0 0 2px #00000014}.shopthumb{width:72px;height:72px;object-fit:contain;image-rendering:auto;background:linear-gradient(160deg,#fafafa,#f0f0f3);border-radius:10px}.upg-wrap{display:flex;flex-direction:column;gap:8px;margin:8px 0}.upg-box{background:#f6fbf8;border:1.5px solid #d7eee4;border-radius:12px;padding:10px;margin:0;display:flex;flex-direction:column;gap:6px}.upg-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700;color:#3a6a57}.upg-bar{height:8px;background:#e2efe8;border-radius:6px;overflow:hidden}.upg-bar i{display:block;height:100%;background:linear-gradient(90deg,#7fd1a8,#4fb98a);border-radius:6px}.upg-box .btn{width:100%}.shopitem .sellbtn{width:100%;font-size:11px;color:#a06}.shopitem b{font-size:12px}.shopitem .btn{padding:6px 8px;font-size:12px;border-radius:10px}.waiting{position:absolute;left:50%;top:92px;transform:translate(-50%);width:min(360px,92vw);pointer-events:none}.waiting .card{text-align:center;padding:12px 16px;background:#ffffffd1;backdrop-filter:blur(2px)}.waiting .card p{margin:4px 0 0;font-size:13px}.waiting .card p.mini{font-size:11px}.waiting h2{font-family:Gaegu;margin:0;font-size:20px}@media (max-width: 640px){h1.logo{font-size:28px}h1.logo small{font-size:11px;letter-spacing:3px}.card{padding:15px;border-radius:18px}.sub{font-size:12px;margin-bottom:10px}.btn{padding:11px 14px;font-size:15px}#create{white-space:nowrap;width:auto;padding:11px 16px;flex-shrink:0}#roomName{min-width:0;flex:1}.me canvas{width:52px;height:52px;flex-shrink:0}.me{gap:10px;margin-bottom:8px;align-items:flex-start}.me>div{min-width:0;flex:1}.me .mini{word-break:keep-all}.lobby{gap:10px}.rooms .room{flex-wrap:wrap}.tabs button{min-width:0;font-size:13px;padding:8px 4px}.rank-list div{font-size:12px}.rank-list div span:last-child{text-align:right;flex-shrink:0}}.me>div{min-width:0}.tabs button{min-width:0}.row>input{min-width:0}.dimrow{display:flex;align-items:center;gap:8px;margin:4px 0}.dimlbl{width:108px;flex-shrink:0;font-size:12px;color:#555}.dimslider{flex:1;accent-color:var(--pink);height:22px}.dimval{width:44px;text-align:right;font-size:11px;color:#888;font-variant-numeric:tabular-nums}.versus{margin-top:10px;background:#fff8e8}.versus h2{font-size:26px}.screen.cz{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:0;overflow:hidden}.cz-top{flex:none;background:#ffffffeb;backdrop-filter:blur(4px);border-bottom:2px dashed #f0dfe4;padding:10px 14px 8px;box-shadow:0 6px 14px #0000000f;display:flex;flex-direction:column;align-items:center;gap:6px}.cz-prev{width:min(220px,56vw)}.cz-prev canvas{width:100%;height:auto;aspect-ratio:1 / 1;display:block}.cz-hint{font-family:Gaegu,cursive;font-size:15px;color:#c98aa0;font-weight:700;margin-top:-4px}.cz-act{display:flex;gap:8px;width:100%;max-width:420px}.cz-act .btn{flex:1;padding:10px 8px;font-size:14px;border-radius:14px}.btn.mintbtn{background:#bfe8da;color:#2f6b58}.btn.mintbtn b{color:#2f6b58}.btn.ink{background:var(--ink);color:#fff}.cz-tabs{flex:none;display:flex;gap:8px;padding:10px 14px 6px;background:#fff9}.cz-tabs button{flex:1;background:#fff;border:2px solid #f0e2e6;border-radius:999px;padding:9px;font-family:Gaegu,cursive;font-size:17px;font-weight:700;color:#a98}.cz-tabs button.on{background:var(--pink);border-color:var(--pink);color:#fff}.cz-pane{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:12px 14px 28px}.cz .optrow label{font-family:Gaegu,cursive;font-size:15px;color:#8a6;color:#a07}.cz .chip{border-radius:999px;font-size:13px}.shop-pts{font-family:Gaegu,cursive;font-size:18px;color:#2f6b58;font-weight:700}.shop-pts b{color:var(--pink);font-size:22px}.shopitem.owned{border-color:#bfe8da;background:#f3fbf7}.owned-tag{font-size:11px;font-weight:800;color:#2f9b78;background:#d7f3e7;border-radius:8px;padding:4px 8px}.shopitem .buybtn{width:100%}.myfac-card{border:2px solid #f3dde3;background:linear-gradient(180deg,#fff,#fff7f9);border-radius:18px;padding:12px 14px;box-shadow:0 4px 12px #f6a7bb24}.myfac-card.myfac-new{background:#fbfbff;border-color:#e6e6f0}.myfac-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.myfac-badge{font-size:12px;font-weight:800;color:#c77e96;background:#fdeef3;border-radius:999px;padding:3px 10px}.myfac-name{font-family:Gaegu,cursive;font-size:24px;line-height:1.1;color:var(--ink);word-break:keep-all}.myfac-stat{margin:6px 0 10px}.myfac-btns{display:flex;gap:8px}.myfac-btns .btn{padding:12px 10px;font-size:15px}.myfac-btns #enterFac{flex:2}.myfac-btns #renameFac{flex:1;white-space:nowrap}@media (max-width: 640px){.cz-prev{width:min(190px,52vw)}.cz-hint{font-size:14px}.cz-act .btn{font-size:13px;padding:10px 6px}.myfac-name{font-size:21px}}.me{align-items:flex-start}.me-info{min-width:0;flex:1}.me-nick{font-family:Gaegu,cursive;font-size:24px;line-height:1.1}.me-stat{margin:4px 0 8px;word-break:keep-all;line-height:1.5;color:#8a8077}.me-money{display:block;font-weight:800;color:#d98a00;font-size:1.15em}.me-sub{display:block}.me-btns{display:flex;flex-wrap:wrap;gap:6px}.chipbtn{border:2px solid #ececf2;background:#fff;color:#6b6b73;border-radius:999px;padding:7px 13px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;font-family:Noto Sans KR,sans-serif}.chipbtn.pink{background:var(--pink);border-color:var(--pink);color:#fff}.chipbtn:active{transform:scale(.96)}.sechead{font-family:Gaegu,cursive;font-size:21px;font-weight:700}#makeFac,#enterFac,#renameFac,#saveFac,#cancelFac,#makeFac2{white-space:nowrap;flex-shrink:0;width:auto}.myfac-card .row>input{min-width:0;flex:1}.myfac-badge{font-family:Gaegu,cursive;font-size:15px;padding:2px 12px}.rank-list>div:first-child{font-weight:800;color:#9a8;color:#b58}@media (max-width: 640px){.me-nick{font-size:21px}.chipbtn{font-size:12px;padding:7px 11px}.sechead{font-size:19px}}.lobby,.lobby *{font-family:Noto Sans KR,system-ui,sans-serif}.lobby h1.logo{font-family:Gaegu,cursive;font-size:32px}.lobby h1.logo small{font-family:Noto Sans KR,sans-serif;letter-spacing:3px;font-weight:700;font-size:11px}.lobby,.lobby .mini,.lobby .me-stat,.lobby .myfac-stat,.lobby p,.lobby .rank-list{word-break:keep-all}.lobby .mini{font-size:12px;font-weight:500;line-height:1.5}.lobby .me-nick{font-family:Noto Sans KR,sans-serif;font-size:18px;font-weight:800}.lobby .me-stat{font-size:12px}.lobby .sechead{font-family:Noto Sans KR,sans-serif;font-size:15px;font-weight:800;white-space:nowrap}.lobby .myfac-name{font-family:Noto Sans KR,sans-serif;font-size:18px;font-weight:800;white-space:nowrap}.lobby .myfac-badge{font-family:Noto Sans KR,sans-serif;font-size:12px;font-weight:700;white-space:nowrap}.lobby .myfac-stat{font-size:12px}.lobby .tabs button{font-size:14px;font-weight:700}.lobby .rank-list,.lobby .rank-list>div{font-size:13px}.lobby .rank-list .mini{font-size:12px}.lobby .chipbtn{font-size:12px;font-weight:700;padding:6px 12px}.lobby .btn{font-size:14px;font-weight:700;padding:10px 14px;border-radius:12px}.lobby .myfac-btns .btn{font-size:14px;padding:11px 12px}.lobby input{font-size:14px;font-weight:500}.pill.sndbtn{border:0;cursor:pointer;font-size:18px;line-height:1;padding:7px 11px}.pill.sndbtn:active{transform:scale(.92)}.me{align-items:flex-start;gap:12px}.me canvas#meThumb{width:92px;height:92px;flex-shrink:0}.me-right{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.me-id{display:flex;align-items:baseline;gap:6px;white-space:nowrap;overflow:hidden}.lobby .me-id .me-nick{font-size:19px}.lobby .me-stat{margin:0;white-space:normal;word-break:keep-all;overflow-wrap:break-word;font-size:11px;color:#8a8077;line-height:1.4}.me-btns{display:flex;flex-direction:column;flex-wrap:nowrap;gap:6px;align-items:flex-start;margin-top:4px}.me-btns .chipbtn{width:100%;max-width:165px;text-align:center}@media (max-width: 640px){.me canvas#meThumb{width:84px;height:84px}.lobby .me-stat{font-size:10.5px}}
