:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f4f6f8;--ink:#101820;--muted:#66717f;--surface:#fff;--line:#d7dde5;--red:#c94343;--teal:#117b80;--gold:#d59b24;--blue:#315ca8;--green:#2d7d46;--shadow:0 16px 42px #1018201a}*{box-sizing:border-box}html,body,#root{min-height:100%}body{background:linear-gradient(180deg, #fdfefe, #eef2f5), var(--bg);color:var(--ink);margin:0;font-family:Yu Gothic UI,Yu Gothic,Hiragino Kaku Gothic ProN,Meiryo,system-ui,sans-serif;line-height:1.6}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}.app{grid-template-rows:auto 1fr;min-height:100vh;display:grid}.topbar{border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:10;background:#ffffffe6;grid-template-columns:minmax(0,1fr);align-items:center;min-height:64px;padding:10px 28px;display:grid;position:sticky;top:0}.brandLink,.buttonRow,.titleActions{align-items:center;display:flex}.brandLink{gap:12px;width:fit-content;text-decoration:none}.brandGlyph{border:2px solid var(--ink);background:linear-gradient(135deg, var(--red) 0 32%, var(--gold) 32% 66%, var(--teal) 66%);color:#fff;border-radius:8px;place-items:center;width:44px;height:44px;font-weight:900;display:grid}.brandLink strong,.brandLink small{display:block}.brandLink small{color:var(--muted);font-size:.78rem}.main{min-width:0}.screen{width:min(1180px,100% - 36px);margin:0 auto;padding:42px 0 58px}.narrowScreen{place-items:center;min-height:calc(100vh - 72px);display:grid}.titleScreen{align-items:center;min-height:calc(100vh - 72px);display:grid}.titleGrid{grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);align-items:center;gap:34px;display:grid}.titleCopy h1,.panel h1,.roomHeader h1,.resultPanel h1{margin:0;font-weight:900;line-height:1.08}.titleCopy h1{font-size:4.8rem}.panel h1,.roomHeader h1,.resultPanel h1{font-size:2.4rem}.panel h2,.logPanel h2{margin:0 0 14px;font-size:1.2rem}.kicker{color:var(--teal);text-transform:uppercase;margin:0 0 8px;font-size:.82rem;font-weight:900}.lead{max-width:620px;color:var(--muted);margin:18px 0 0;font-size:1.08rem}.titleActions,.buttonRow{flex-wrap:wrap;gap:10px}.titleActions{margin-top:28px}.primaryButton,.ghostButton,.dangerButton{cursor:pointer;border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;min-height:44px;padding:8px 16px;font-weight:900;text-decoration:none;display:inline-flex}.primaryButton{background:var(--ink);color:#fff}.dangerButton{background:var(--red);color:#fff}.ghostButton{border-color:var(--line);color:var(--ink);background:#fff}.primaryButton:disabled,.dangerButton:disabled,.ghostButton:disabled{cursor:not-allowed;opacity:.45}.handStage{grid-template-rows:repeat(6,1fr);grid-template-columns:repeat(6,1fr);gap:12px;min-height:430px;display:grid}.handCard{box-shadow:var(--shadow);color:#fff;border-radius:8px;align-content:center;place-items:center;gap:8px;display:grid}.handCard span{background:#ffffff29;border:2px solid #ffffff52;border-radius:50%;place-items:center;width:94px;height:94px;font-size:3rem;font-weight:900;line-height:1;display:grid}.handCard strong{font-size:1.35rem}.handCard.red{background:var(--red);grid-area:1/1/4/5}.handCard.gold{background:var(--gold);grid-area:3/3/6/7}.handCard.teal{background:var(--teal);grid-area:4/1/7/4}.panel,.logPanel,.resultPanel{border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);border-radius:8px;padding:22px}.formPanel{width:min(460px,100%)}.fieldLabel{color:var(--muted);margin-top:22px;margin-bottom:8px;font-weight:800;display:block}input{border:1px solid var(--line);width:100%;min-height:48px;color:var(--ink);background:#fff;border-radius:8px;padding:10px 12px;font-size:1rem}input:focus{border-color:var(--teal);outline:3px solid #117b802e}.formMeta{min-height:28px;color:var(--muted);justify-content:space-between;gap:12px;margin:8px 0 18px;font-size:.86rem;display:flex}.formMeta strong{color:var(--red)}.menuLayout{grid-template-columns:minmax(260px,.8fr) minmax(320px,1fr);gap:16px;display:grid}.modeGrid{grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.modeButton{border:1px solid var(--line);text-align:left;background:#fff;border-radius:8px;min-height:122px;padding:16px}.modeButton span,.modeButton strong{display:block}.modeButton span{color:var(--muted);font-size:.8rem;font-weight:800}.modeButton strong{color:var(--ink);margin-top:10px;font-size:1.2rem}.modeButton.active{border-color:var(--teal);background:#edfafa}.modeButton.disabled{opacity:.5}.mutedText{color:var(--muted)}.accountPanel,.roomJoinPanel{align-content:start;gap:14px;display:grid}.segmented{border:1px solid var(--line);background:#f8fafc;border-radius:8px;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:4px;display:grid}.segmented button{min-height:38px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:6px;font-weight:900}.segmented button.selected{background:var(--ink);color:#fff}.segmented.singleMode{grid-template-columns:minmax(0,1fr)}.segmented button:disabled{cursor:not-allowed;opacity:.42}.roomHeader,.battleHud{justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px;display:flex}.roomCountdown{width:fit-content;min-height:34px;color:var(--gold);background:#fff8e8;border-radius:999px;align-items:center;margin:10px 0 0;padding:4px 10px;font-size:.9rem;font-weight:900;display:inline-flex}.seatGrid{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;display:grid}.seat{border:1px solid var(--line);min-height:112px;color:var(--muted);text-align:left;background:#fff;border-radius:8px;align-content:start;gap:8px;padding:14px;display:grid;position:relative;overflow:hidden}.seat:before{content:"";background:var(--seat-accent,var(--line));width:6px;position:absolute;inset:0 auto 0 0}.seatRole{font-size:.8rem;font-weight:800}.seatName{color:var(--ink);font-size:1rem}.seat.playerASeat{--seat-accent:var(--blue);background:#f3f7ff;border-color:#c4d2ec}.seat.playerBSeat{--seat-accent:var(--red);background:#fff4f3;border-color:#edc6c6}.seat.spectatorSeat{--seat-accent:var(--gold);background:#fffaf0;border-color:#ead7ae}.seat.filled{box-shadow:inset 0 0 0 1px #1018200a}.seat.you{outline-offset:2px;outline:3px solid #117b803d}.seat.ready{box-shadow:inset 0 0 0 2px #2d7d4652,0 10px 24px #2d7d461a}.readyBadge{background:var(--green);color:#fff;border-radius:999px;align-items:center;width:fit-content;min-height:28px;padding:4px 9px;font-size:.78rem;font-weight:900;line-height:1;display:inline-flex}.seat:disabled{cursor:default}.emojiRainLayer{z-index:30;pointer-events:none;position:fixed;inset:0;overflow:hidden}.emojiDrop{top:-96px;left:var(--emoji-left);animation:emojiFall var(--emoji-duration) linear forwards;will-change:transform, opacity;justify-items:center;gap:2px;display:grid;position:absolute}.emojiDropName{max-width:120px;color:var(--ink);text-overflow:ellipsis;white-space:nowrap;background:#ffffffe0;border-radius:999px;padding:2px 7px;font-size:.72rem;font-weight:900;line-height:1.3;overflow:hidden;box-shadow:0 5px 14px #1018201f}.emojiDropIcon{filter:drop-shadow(0 7px 14px #1018202e);font-size:3.2rem;line-height:1}.emojiChatPanel{border:1px solid var(--line);background:#fff;border-radius:8px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:14px;padding:12px;display:grid}.emojiPalette{grid-template-columns:repeat(10,minmax(38px,1fr));gap:6px;display:grid}.emojiButton{border:1px solid var(--line);cursor:pointer;background:#f8fafc;border-radius:8px;place-items:center;min-height:42px;font-size:1.45rem;line-height:1;display:grid}.emojiButton:hover,.emojiButton:focus-visible{border-color:var(--teal);background:#eaf8f7;outline:none}.emojiButton:disabled{cursor:not-allowed;opacity:.42}.emojiCooldown{min-width:58px;color:var(--muted);text-align:right;font-size:.82rem;font-weight:900}@keyframes emojiFall{0%{opacity:0;transform:translateY(-20px)rotate(-5deg)}8%{opacity:1}to{opacity:.92;transform:translate3d(var(--emoji-drift), 112vh, 0) rotate(12deg)}}.battleScreen{gap:18px;display:grid}.battleHud{margin-bottom:0}.fighter{gap:8px;min-width:180px;display:grid}.fighter.right{justify-items:end}.fighter span{color:var(--muted);font-weight:800}.scoreDots{gap:6px;display:flex}.scoreDot{border:1px solid var(--line);background:#fff;border-radius:999px;width:24px;height:14px}.scoreDot.won{border-color:var(--green);background:var(--green)}.roundCounter{border:1px solid var(--line);background:#fff;border-radius:8px;justify-items:center;min-width:160px;padding:12px 18px;display:grid}.roundCounter strong{font-size:1.15rem}.roundCounter span{color:var(--red);font-weight:900}.arena{grid-template-columns:minmax(0,1fr) 86px minmax(0,1fr);align-items:center;gap:12px;min-height:280px;display:grid}.choiceDisplay{background:var(--blue);color:#fff;min-height:250px;box-shadow:var(--shadow);border-radius:8px;align-content:center;place-items:center;gap:10px;display:grid}.choiceDisplay.opponent{background:var(--red)}.choiceDisplay span{background:#ffffff24;border:2px solid #ffffff57;border-radius:50%;place-items:center;width:118px;height:118px;font-size:4rem;font-weight:900;line-height:1;display:grid}.choiceDisplay strong{font-size:1.25rem}.versus{background:var(--ink);color:#fff;border-radius:50%;place-items:center;min-height:86px;font-weight:900;display:grid}.resultStrip{border:1px solid var(--line);background:#fff8e8;border-radius:8px;justify-content:center;align-items:center;gap:16px;min-height:58px;padding:10px 14px;display:flex}.resultStrip strong{color:var(--gold);font-size:1.2rem}.handButtons{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.handButton{border:1px solid var(--line);min-height:116px;color:var(--ink);cursor:pointer;background:#fff;border-radius:8px;align-content:center;place-items:center;gap:8px;display:grid}.handButton span{font-size:2.8rem;font-weight:900;line-height:1}.handButton strong{font-size:1.1rem}.handButton.selected{border-color:var(--teal);background:#eaf8f7}.handButton:disabled{cursor:not-allowed;opacity:.58}.logPanel{box-shadow:none}.logPanel.wide{width:min(760px,100%);margin:0 auto}.logList{gap:8px;display:grid}.logItem{border:1px solid var(--line);background:#f8fafc;border-radius:8px;grid-template-columns:52px 88px minmax(0,1fr);align-items:center;gap:12px;min-height:46px;padding:8px 10px;display:grid}.logItem.win{background:#eef6ff;border-color:#bed8f6}.logItem.lose{background:#fff0f0;border-color:#f0c5c5}.logItem.draw{background:#fffaf0;border-color:#ead7ae}.logItem span{color:var(--muted);font-size:.85rem;font-weight:900}.logItem em{color:var(--muted);font-style:normal}.resultScreen{justify-items:center;gap:18px;display:grid}.resultPanel{text-align:center;width:min(620px,100%)}.resultPanel h1{overflow-wrap:anywhere;gap:4px;display:grid}.resultOutcomeList span{display:block}.resultPanel.player{border-top:6px solid var(--green)}.resultPanel.opponent{border-top:6px solid var(--red)}.resultPanel.draw{border-top:6px solid var(--gold)}.finalScore{grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;margin:24px 0;display:grid}.finalScore span{color:var(--muted);font-weight:900}.finalScore strong{font-size:2.4rem}.centered{justify-content:center}@media (width<=980px){.topbar{grid-template-columns:1fr;justify-items:stretch}.titleGrid,.menuLayout{grid-template-columns:1fr}.titleCopy h1{font-size:3.2rem}.handStage{min-height:340px}.seatGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.emojiPalette{grid-template-columns:repeat(7,minmax(38px,1fr))}}@media (width<=720px){.screen{width:min(100% - 24px,1180px);padding-top:26px}.roomHeader,.battleHud{flex-direction:column;align-items:stretch}.fighter.right{justify-items:start}.arena{grid-template-columns:1fr}.versus{justify-self:center;width:54px;min-height:54px}.handButtons,.modeGrid{grid-template-columns:1fr}.choiceDisplay{min-height:190px}.choiceDisplay span{width:92px;height:92px;font-size:3rem}.logItem{grid-template-columns:44px 70px minmax(0,1fr)}.emojiChatPanel{grid-template-columns:1fr}.emojiPalette{grid-template-columns:repeat(5,minmax(42px,1fr))}.emojiCooldown{text-align:left}}@media (width<=480px){.topbar{padding:12px}.titleCopy h1,.panel h1,.roomHeader h1,.resultPanel h1{font-size:2.4rem}.panel,.logPanel,.resultPanel{padding:16px}.seatGrid{grid-template-columns:1fr}.finalScore{grid-template-columns:1fr;gap:4px}}
