:root{--ink:#1f1b18;--muted:#6f6259;--paper:#fff9eb;--paper-strong:#fffdf5;--line:#27211d;--red:#e84d35;--blue:#2e75c9;--green:#14966d;--yellow:#f4c542;--shadow:8px 8px 0 #1f1b18;--soft-shadow:4px 4px 0 #1f1b18;--display:"Darumadrop One", "Noto Sans JP", sans-serif;--body:"Noto Sans JP", sans-serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{color:var(--ink);font-family:var(--body);background:linear-gradient(90deg, #1f1b180d 1px, transparent 1px), linear-gradient(#1f1b180d 1px, transparent 1px), radial-gradient(circle at 20% 10%, #e84d352e, transparent 28%), radial-gradient(circle at 85% 16%, #2e75c933, transparent 26%), var(--paper);background-size:28px 28px,28px 28px,auto,auto,auto}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{color:inherit}.nav{z-index:10;border-bottom:3px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fff9ebeb;justify-content:space-between;align-items:center;gap:16px;padding:14px max(18px,50vw - 590px);display:flex;position:sticky;top:0}.brand,.nav-links{align-items:center;gap:10px;display:inline-flex}.brand{font-weight:900}.brand-mark{border:3px solid var(--line);background:var(--yellow);width:40px;height:40px;font-family:var(--display);box-shadow:var(--soft-shadow);border-radius:50%;place-items:center;display:grid}.nav-links a{border:2px solid var(--line);background:var(--paper-strong);border-radius:999px;padding:10px 14px;font-weight:800}.nav-links a.active{background:var(--blue);color:#fff}.page{min-height:calc(100vh - 72px);padding:34px 0 64px}.shell{width:min(1180px,100vw - 28px);margin:0 auto}.hero{grid-template-columns:minmax(0,1fr);align-items:stretch;gap:10px;margin-bottom:12px;display:grid}.hero-copy,.panel,.game-card{border:3px solid var(--line);background:var(--paper-strong);box-shadow:var(--shadow)}.hero-copy{background:linear-gradient(135deg, #f4c54273, transparent 50%), var(--paper-strong);flex-direction:column;justify-content:center;padding:clamp(22px,4vw,42px);display:flex}.hero h1,.room-header h1,.panel h2,.center-stage h2{font-family:var(--display);margin:0;line-height:1}.hero h1{max-width:820px;font-size:clamp(3.1rem,8vw,7.3rem)}.hero p{color:var(--muted);margin:8px 0 0;line-height:1.6}.room-header p,.panel p,.hint{color:var(--muted);line-height:1.8}.eyebrow{color:var(--red);letter-spacing:.12em;margin:0 0 8px;font-size:.82rem;font-weight:900}.panel{padding:24px}.field{gap:8px;font-weight:900;display:grid}.field input,.field select,.inline-form input{border:3px solid var(--line);width:100%;min-height:48px;color:var(--ink);background:#fff;border-radius:0;padding:0 14px}.compact-field{max-width:220px}.selected-game,.status-strip{border:2px dashed var(--line);background:#fff3c7;justify-content:space-between;gap:10px;padding:14px;font-weight:900;display:flex}.practice-toggle{cursor:pointer;align-items:center;gap:10px;width:fit-content;font-weight:900;display:flex}.practice-toggle input{width:22px;height:22px;accent-color:var(--red)}.button{border:3px solid var(--line);min-height:48px;box-shadow:var(--soft-shadow);cursor:pointer;background:#fff;justify-content:center;align-items:center;padding:0 18px;font-weight:900;transition:transform .14s,box-shadow .14s;display:inline-flex}.button:hover:not(:disabled),.game-card:hover,.choice:hover:not(:disabled){box-shadow:6px 6px 0 var(--line);transform:translate(-2px,-2px)}.button:disabled,.choice:disabled{cursor:not-allowed;opacity:.48}.button-primary{background:var(--red);color:#fff}.button-soft{background:var(--yellow)}.button-ghost{background:var(--paper)}.alert{border:3px solid var(--line);color:#9f2618;background:#ffe0da;margin:0 0 18px;padding:12px 14px;font-weight:800}.setup-bar{border:3px solid var(--line);background:var(--paper-strong);box-shadow:var(--shadow);flex-wrap:wrap;align-items:flex-end;gap:16px;margin-bottom:18px;padding:18px 22px;display:flex}.setup-bar .field{flex:240px}.setup-bar .practice-toggle{margin-bottom:6px}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:28px;display:grid}.game-card{text-align:left;cursor:pointer;min-height:230px;padding:22px}.game-card.selected{background:#dff2ff}.game-card span,.game-card small,.room-meta span,.turn-label{border:2px solid var(--line);background:var(--yellow);width:fit-content;padding:6px 10px;font-weight:900;display:inline-flex}.game-card h2{font-family:var(--display);margin:18px 0 10px;font-size:2.2rem;line-height:1}.game-card .tempo{color:var(--blue);margin-top:8px;font-size:.9rem;font-weight:800;display:block}.game-card p{color:var(--muted);line-height:1.7}.lobby-grid,.room-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:24px;display:grid}.room-list,.player-list,.log-list,.stack{gap:12px;display:grid}.room-list button,.player-row,.rank-row{border:2px solid var(--line);text-align:left;cursor:pointer;background:#fff;grid-template-columns:80px 1fr auto;align-items:center;gap:12px;width:100%;padding:12px;display:grid}.inline-form{grid-template-columns:1fr auto;gap:10px;display:grid}.room-shell{gap:24px;display:grid}.room-header{border:3px solid var(--line);background:var(--green);color:#fff;box-shadow:var(--shadow);justify-content:space-between;align-items:end;gap:20px;padding:28px;display:flex}.room-header p{color:#ffffffdb}.room-header .eyebrow{color:#fff0a8}.room-header h1{font-size:clamp(2.8rem,6vw,5.8rem)}.room-meta{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.room-meta span,.room-meta button{color:var(--ink);background:#fff;min-height:36px;padding:0 12px;font-size:.85rem}.room-meta button:hover:not(:disabled){transform:translate(-1px,-1px)}.room-grid{grid-template-columns:280px minmax(0,1fr) 280px;align-items:start}.panel-heading h2{font-size:2.2rem}.player-row{grid-template-columns:42px 1fr auto auto auto}.player-row.is-me{background:#fff3c7}.center-stage{text-align:center;align-content:center;place-items:center;gap:14px;min-height:280px;display:grid}.game-surface{gap:18px;display:grid}.round-banner,.result-callout{border:3px solid var(--line);background:#dff2ff;padding:18px}.round-banner{gap:6px;display:grid}.round-banner span{color:var(--blue);font-weight:900}.score-cards{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;display:grid}.score-card{border:3px solid var(--line);background:#fff;gap:8px;padding:16px;display:grid}.score-card strong{font-family:var(--display);font-size:1.8rem;line-height:1}.control-row{flex-wrap:wrap;gap:10px;display:flex}.choice{border:3px solid var(--line);min-width:96px;min-height:58px;box-shadow:var(--soft-shadow);cursor:pointer;background:#fff;padding:0 18px;font-weight:900}.choice.selected{background:var(--yellow)}.giant-cue{color:var(--red);text-shadow:4px 4px 0 var(--line);font-size:clamp(4rem,13vw,9rem)}.word-bank{flex-wrap:wrap;gap:8px;display:flex}.word-bank span{border:2px solid var(--line);background:#fff;padding:8px 12px;font-weight:900}.rules-box{border:3px dashed var(--line);background:#fff3c7;padding:18px}.rules-box ol{margin:0;padding-left:20px;line-height:1.8}.rules-box li{margin-bottom:6px}.log-list{max-height:440px;overflow:auto}.log-list p{border-bottom:1px dashed #1f1b1847;margin:0;padding-bottom:10px}@media (max-width:980px){.hero,.lobby-grid,.room-grid{grid-template-columns:1fr}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.room-grid{grid-template-columns:1fr}}@media (max-width:640px){.page{padding:18px 0 40px}.shell{width:calc(100vw - 20px)}.nav{padding:10px 14px}.brand-mark{width:34px;height:34px}.hero-copy{padding:24px}.hero h1{font-size:clamp(2.4rem,10vw,3.1rem)}.setup-bar{padding:14px 16px}.setup-bar .practice-toggle{margin-bottom:0}.game-grid{grid-template-columns:1fr;gap:12px;margin-bottom:20px}.game-card{min-height:auto;padding:18px}.game-card h2{margin:12px 0 8px;font-size:1.8rem}.lobby-grid{gap:16px}.inline-form,.room-list button{grid-template-columns:1fr}.room-header{flex-direction:column;align-items:flex-start;gap:14px;padding:20px}.room-header h1{font-size:clamp(2.2rem,8vw,2.8rem)}.room-meta{justify-content:flex-start}.choice{min-width:72px;min-height:52px;padding:0 14px;font-size:1rem}.score-cards{grid-template-columns:repeat(2,1fr)}.control-row{gap:8px}.center-stage{min-height:200px}.giant-cue{font-size:clamp(3rem,12vw,5rem)}.panel{padding:18px}.panel-heading h2{font-size:1.6rem}}@keyframes slide-up{0%{opacity:0;transform:translateY(40px)scale(.8)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes slide-down{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(40px)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}@keyframes bounce-in{0%{opacity:0;transform:scale(0)}60%{opacity:1;transform:scale(1.2)}to{opacity:1;transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}@keyframes glow{0%,to{box-shadow:0 0 #f4c54200}50%{box-shadow:0 0 24px #f4c54299}}@keyframes score-pop{0%{transform:scale(1)}40%{transform:scale(1.3)}to{transform:scale(1)}}@keyframes result-flash{0%{opacity:0;transform:scale(.6)}50%{opacity:1;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes hand-clash{0%{transform:translate(0)}30%{transform:translate(20px)}60%{transform:translate(-10px)}to{transform:translate(0)}}.animate-slide-up{animation:.35s ease-out both slide-up}.animate-slide-down{animation:.3s ease-in both slide-down}.animate-pulse{animation:.6s ease-in-out pulse}.animate-bounce-in{animation:.4s ease-out both bounce-in}.animate-shake{animation:.4s ease-in-out shake}.animate-glow{animation:1.2s ease-in-out infinite glow}.animate-score-pop{animation:.3s ease-out score-pop}.animate-result-flash{animation:.4s ease-out both result-flash}.animate-hand-clash{animation:.5s ease-out hand-clash}.janken-hands{justify-content:center;gap:32px;margin:24px 0;display:flex}.janken-hand{flex-direction:column;align-items:center;gap:8px;min-width:100px;display:flex}.janken-hand-icon{font-size:3.5rem;line-height:1;transition:transform .2s}.janken-hand-icon.is-active{animation:.5s ease-in-out pulse}.janken-hand-name{font-size:.9rem;font-weight:900}.janken-result-banner{border:3px solid var(--line);background:#fff3c7;justify-content:center;align-items:center;gap:16px;padding:18px;font-size:1.2rem;font-weight:900;display:flex}.janken-result-banner.is-win{border-color:var(--green);background:#d4f5e2}.janken-result-banner.is-lose{border-color:var(--red);background:#ffe0da}.janken-result-banner.is-draw{border-color:var(--blue);background:#dff2ff}.score-value{transition:transform .2s;display:inline-block}.score-value.just-changed{animation:.3s ease-out score-pop}.round-counter{border:2px solid var(--line);background:var(--yellow);align-items:center;gap:6px;padding:6px 12px;font-size:.85rem;font-weight:900;display:inline-flex}.vs-icon{color:var(--red);font-size:1.5rem;font-weight:900}.hand-display{border:3px solid var(--line);background:#fff;justify-content:center;align-items:center;gap:8px;min-width:120px;padding:12px 16px;font-weight:900;display:flex}.hand-display-value{font-family:var(--display);font-size:2rem;line-height:1}.hand-display-label{color:var(--muted);font-size:.8rem}.game-emoji{font-size:2.5rem;line-height:1}.game-emoji-large{font-size:4rem;line-height:1}.result-overlay{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:200px;display:flex;position:relative}.result-overlay .result-icon{font-size:5rem;animation:.5s ease-out bounce-in}.result-overlay .result-text{font-family:var(--display);font-size:2.5rem;line-height:1;animation:.4s ease-out both result-flash}.result-overlay .result-sub{color:var(--muted);font-size:1rem;animation:.3s ease-out .2s both slide-up}.pending-indicator{border:2px dashed var(--line);color:var(--muted);background:#f0f0f0;align-items:center;gap:8px;padding:10px 16px;font-weight:700;display:flex}.pending-indicator .dot{background:var(--blue);border-radius:50%;width:8px;height:8px;animation:1s ease-in-out infinite pulse}.pending-indicator .dot:nth-child(2){animation-delay:.2s}.pending-indicator .dot:nth-child(3){animation-delay:.4s}.app-layout{min-height:calc(100vh - 72px);display:flex}.game-sidebar{border-right:3px solid var(--line);background:var(--paper-strong);flex-shrink:0;width:280px;height:calc(100vh - 72px);padding:24px;position:sticky;top:72px;overflow-y:auto}.game-sidebar-inner{gap:16px;display:grid}.game-sidebar-inner h2{font-family:var(--display);margin:0;font-size:1.8rem;line-height:1}.game-list{gap:12px;display:grid}.game-list-item{border:3px solid var(--line);width:100%;box-shadow:var(--soft-shadow);text-align:left;cursor:pointer;font:inherit;color:inherit;background:#fff;gap:6px;padding:14px;transition:transform .14s,box-shadow .14s;display:grid}.game-list-item:hover:not(:disabled){box-shadow:6px 6px 0 var(--line);transform:translate(-2px,-2px)}.game-list-item:disabled{cursor:not-allowed;opacity:.48}.game-list-item.selected{background:#dff2ff}.game-list-item strong{font-family:var(--display);font-size:1.4rem;line-height:1}.game-list-item small{color:var(--muted);font-weight:700}.game-list-kind{border:2px solid var(--line);background:var(--yellow);width:fit-content;padding:4px 8px;font-size:.75rem;font-weight:900;display:inline-flex}.main-content{flex:1;min-width:0}.game-bottom-bar{z-index:20;border-top:3px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fff9ebf5;padding:10px 14px;display:none;position:fixed;bottom:0;left:0;right:0}.game-bottom-bar-inner{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:10px;display:flex;overflow-x:auto}.game-bottom-bar-inner::-webkit-scrollbar{display:none}.game-chip{border:3px solid var(--line);min-width:84px;box-shadow:var(--soft-shadow);scroll-snap-align:start;cursor:pointer;font:inherit;color:inherit;background:#fff;flex-direction:column;flex:none;align-items:center;gap:4px;padding:10px 12px;font-weight:900;transition:transform .14s,box-shadow .14s;display:flex}.game-chip:hover:not(:disabled){box-shadow:6px 6px 0 var(--line);transform:translate(-2px,-2px)}.game-chip:disabled{cursor:not-allowed;opacity:.48}.game-chip.selected{background:var(--yellow)}.game-chip span{font-size:1.5rem;line-height:1}.game-chip strong{font-family:var(--display);white-space:nowrap;font-size:.95rem;line-height:1}.game-chip small{color:var(--muted);font-size:.7rem}@media (max-width:980px){.app-layout{flex-direction:column}.game-sidebar{display:none}.game-bottom-bar{display:block}.main-content{padding-bottom:120px}.hero,.lobby-grid,.room-grid{grid-template-columns:1fr}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.room-grid{grid-template-columns:1fr}}@media (max-width:640px){.page{padding:18px 0 40px}.shell{width:calc(100vw - 20px)}.nav{padding:10px 14px}.brand-mark{width:34px;height:34px}.hero-copy{padding:24px}.hero h1{font-size:clamp(2.4rem,10vw,3.1rem)}.setup-bar{padding:14px 16px}.setup-bar .practice-toggle{margin-bottom:0}.game-grid{grid-template-columns:1fr;gap:12px;margin-bottom:20px}.game-card{min-height:auto;padding:18px}.game-card h2{margin:12px 0 8px;font-size:1.8rem}.lobby-grid{gap:16px}.inline-form,.room-list button{grid-template-columns:1fr}.room-header{flex-direction:column;align-items:flex-start;gap:14px;padding:20px}.room-header h1{font-size:clamp(2.2rem,8vw,2.8rem)}.room-meta{justify-content:flex-start}.choice{min-width:72px;min-height:52px;padding:0 14px;font-size:1rem}.score-cards{grid-template-columns:repeat(2,1fr)}.control-row{gap:8px}.center-stage{min-height:200px}.giant-cue{font-size:clamp(3rem,12vw,5rem)}.panel{padding:18px}.panel-heading h2{font-size:1.6rem}}
