*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #0f172a;--surface: #1e293b;--surface2: #334155;--text: #e2e8f0;--muted: #94a3b8;--neon: #22d3ee;--danger: #ef4444}html,body{height:100%}body{background:#0f172a;color:#e2e8f0;font-family:Pretendard,Segoe UI,Apple SD Gothic Neo,sans-serif;-webkit-font-smoothing:antialiased;touch-action:manipulation}#root{height:100%}.page{min-height:100dvh;display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.hero{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;padding:1.5rem;text-align:center}.logo{font-size:clamp(2rem,10vw,3.2rem);letter-spacing:.28em;padding-left:.28em;font-weight:800}.tagline{color:#94a3b8;font-size:1rem}.auth{display:flex;flex-direction:column;align-items:center;gap:.6rem;margin-top:.5rem}.welcome{display:inline-flex;align-items:center;gap:.5rem;font-size:1rem;color:#e2e8f0}.avatar{width:32px;height:32px;border-radius:50%}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:48px;padding:0 1.4rem;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;text-decoration:none;-webkit-tap-highlight-color:transparent}.btn.google{margin-top:.75rem;background:#fff;color:#1f2937}.btn.google:active{transform:scale(.98)}.btn.ghost{background:transparent;color:#94a3b8;border:1px solid #334155;min-height:44px;font-size:.9rem}.status{margin-top:1.25rem;display:inline-flex;align-items:center;gap:.5rem;font-size:.9rem;color:#cbd5e1;background:#1e293b;border-radius:999px;padding:.55rem 1.1rem}.dot{width:.6rem;height:.6rem;border-radius:50%}.dot.ok{background:#22c55e;box-shadow:0 0 8px #22c55e88}.dot.bad{background:#ef4444}.dot.wait{background:#eab308}.foot{padding:1rem;text-align:center;color:#475569;font-size:.8rem}.btn.play{margin-top:.25rem;background:#2563eb;color:#fff}.btn.play:active{transform:scale(.98)}.rank{width:100%;max-width:420px;margin-top:1.5rem}.rank-title{font-size:1rem;color:#cbd5e1;margin-bottom:.6rem}.rank-list{list-style:none;display:flex;flex-direction:column;gap:.35rem}.rank-list li{display:flex;align-items:center;gap:.6rem;background:#1e293b;border-radius:10px;padding:.5rem .8rem;font-size:.92rem}.rank-list li.me{outline:1px solid #2563eb}.rank-no{width:1.4rem;text-align:center;color:#94a3b8;font-weight:700}.avatar.sm{width:24px;height:24px}.avatar.ph{display:inline-block;background:#334155;border-radius:50%}.rank-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}.rank-score{font-weight:700;color:#93c5fd}.my-rank{margin-top:.5rem;font-size:.85rem;color:#94a3b8;text-align:center}.game-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#0b1120;display:flex;flex-direction:column}.game-close{align-self:flex-end;margin:max(.5rem,env(safe-area-inset-top)) .75rem .25rem;min-height:44px;padding:0 1rem;background:#1e293b;color:#cbd5e1;border:none;border-radius:10px;font-size:.9rem;cursor:pointer}.game-frame{flex:1;width:100%;border:none}.app-shell{min-height:100dvh;background:var(--bg)}.app-content{width:100%;max-width:680px;min-height:100dvh;margin:0 auto;padding:env(safe-area-inset-top) max(1rem,env(safe-area-inset-right)) calc(84px + env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))}.tab-bar{position:fixed;z-index:30;right:0;bottom:0;left:0;min-height:56px;display:grid;grid-template-columns:repeat(4,1fr);padding:.2rem max(.5rem,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(.5rem,env(safe-area-inset-left));background:#111c31f5;border-top:1px solid var(--surface2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.tab-link{min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;color:var(--muted);font-size:.75rem;text-decoration:none}.tab-link.active{color:var(--neon)}.tab-icon{font-size:1.2rem;line-height:1}.screen{width:100%;padding:1rem 0}.screen-header,.channel-header{min-height:52px;display:flex;align-items:center;margin-bottom:1rem}.screen-header h1,.channel-header h1{font-size:1.45rem}.center-state,.centered-screen{min-height:calc(100dvh - 120px);display:flex;align-items:center;justify-content:center;color:var(--muted);text-align:center}.centered-screen{flex-direction:column;gap:1rem}.compact-state{min-height:120px}.home-guest{min-height:calc(100dvh - 100px)}.card-list{display:flex;flex-direction:column;gap:.75rem}.empty-card,.feature-card,.profile-card,.manage-card,.fandan-card,.channel-cell{background:var(--surface);border:1px solid var(--surface2);border-radius:14px}.empty-card,.feature-card{min-height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;padding:1.5rem;color:var(--muted);text-align:center}.empty-card h2{color:var(--text);font-size:1.15rem}.btn.primary,.btn.compact{background:#164e63;color:#cffafe}.btn.compact{min-height:44px;padding:0 .9rem;font-size:.85rem}.btn.danger{color:#fecaca;background:#7f1d1d}.fandan-card{border-left-width:4px;overflow:hidden}.card-main{display:flex;flex-direction:column;gap:.25rem;padding:1rem;color:var(--text);text-decoration:none}.card-main span,.channel-cell span{color:var(--muted);font-size:.88rem}.quick-actions{display:flex;gap:.5rem;padding:0 1rem 1rem}.channel-cell{position:relative;min-height:72px;display:flex;flex-direction:column;justify-content:center;gap:.3rem;padding:.8rem 3rem .8rem 1rem;color:var(--text);text-decoration:none}.cell-arrow{position:absolute;top:50%;right:1rem;transform:translateY(-50%);font-size:1.8rem!important}.channel-header{gap:.7rem}.icon-button{width:44px;min-width:44px;height:44px;border:0;border-radius:50%;background:var(--surface);color:var(--text);font-size:1.2rem;cursor:pointer}.sub-tabs{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:1rem;border-bottom:1px solid var(--surface2)}.sub-tab{min-height:44px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:.9rem;text-decoration:none;border-bottom:2px solid transparent}.sub-tab.active{color:var(--neon);border-bottom-color:var(--neon)}.board-caption{margin:-.35rem 0 1rem;color:var(--muted);font-size:.78rem;line-height:1.45;text-align:center}.seat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.seat-card{min-width:0;display:flex;flex-direction:column;align-items:center;gap:.55rem;padding:1rem .7rem;background:var(--surface);border:1px solid;border-radius:14px;text-align:center}.seat-card .google{width:100%;margin-top:0;padding:0 .5rem;font-size:.78rem}.seat-photo{width:72px;height:72px;object-fit:cover;border-radius:50%}.seat-photo.placeholder{display:block;opacity:.55}.muted{display:block;color:var(--muted);font-size:.85rem}.faction-badge{min-height:44px;display:inline-flex;align-items:center;padding:0 .8rem;border:1px solid;border-radius:999px;font-size:.82rem;font-weight:700}.multiplier-badge{display:inline-flex;align-items:center;min-height:30px;padding:0 .65rem;border:1px solid;border-radius:999px;font-size:.88rem;font-weight:800}.faction-sum{color:var(--muted);font-size:.78rem}.faction-dot{width:.65rem;height:.65rem;flex:0 0 auto;border-radius:50%;box-shadow:0 0 0 2px #ffffff1f}.faction-dot.neutral{background:var(--muted)}.channel-rank{max-width:none;margin-top:0}.rank-caption{margin:-.3rem 0 .8rem;color:var(--muted);font-size:.78rem}.error-text{color:#fca5a5}.dialog-backdrop{position:fixed;z-index:60;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:1rem;background:#020617cc}.dialog-card{width:min(100%,380px);padding:1.25rem;background:var(--surface);border:1px solid var(--surface2);border-radius:16px;box-shadow:0 24px 64px #0008}.dialog-card h2{margin-bottom:.7rem;font-size:1.15rem}.dialog-card p{color:#cbd5e1;line-height:1.55}.dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin-top:1.2rem}.profile-card{display:flex;align-items:center;gap:.8rem;padding:1rem}.profile-avatar{width:52px;height:52px;flex:0 0 auto;object-fit:cover;border-radius:50%}.profile-avatar.placeholder{background:var(--surface2)}.section-title{margin:1.5rem 0 .7rem;font-size:1rem}.manage-card{min-height:72px;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:.5rem;padding:.7rem}.color-chip{width:12px;height:36px;border-radius:999px}.manage-copy{min-width:0}.manage-copy strong,.manage-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.logout-button{width:100%;margin-top:1.5rem}.my-health{display:flex;justify-content:center;margin-top:1rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:360px){.manage-card{grid-template-columns:auto minmax(0,1fr) auto}.manage-card .danger{grid-column:2 / 4}}