@import"https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,500;0,8..60,600;1,8..60,400;1,8..60,500&family=Source+Sans+3:wght@400;500;600&display=swap";*{margin:0;padding:0;box-sizing:border-box}:root{--font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;--font-sans: "Source Sans 3", system-ui, -apple-system, sans-serif;--radius-sm: 7.5px;--radius-md: 12px;--radius-lg: 16px;--radius-full: 9999px;--accent-terracotta: #c96442;--accent-terracotta-hover: #d97757;--success: #2d8a5f;--danger: #c96442}:root,[data-theme=light]{--bg-primary: #faf9f5;--bg-secondary: #ffffff;--bg-tertiary: #f0eee6;--bg-elevated: #ffffff;--bg-input: #ffffff;--text-primary: #141413;--text-secondary: #5e5d59;--text-muted: #87867f;--text-inverse: #faf9f5;--accent-dark: #141413;--accent-dark-hover: #302f2e;--accent-light: #faf9f5;--accent-light-hover: #f0eee6;--border-light: #e8e6dc;--border-medium: #d1cfc5;--input-border: #d1cfc5;--card-bg: #ffffff;--card-border: #e8e6dc;--pill-bg: #ffffff;--pill-text: #141413}[data-theme=dark]{--bg-primary: #141413;--bg-secondary: #1f1e1d;--bg-tertiary: #262624;--bg-elevated: #302f2e;--bg-input: #3d3d3a;--text-primary: #faf9f5;--text-secondary: #9c9a92;--text-muted: #87867f;--text-inverse: #141413;--accent-dark: #faf9f5;--accent-dark-hover: #e8e6dc;--accent-light: #141413;--accent-light-hover: #1f1e1d;--border-light: #302f2e;--border-medium: #3d3d3a;--input-border: transparent;--card-bg: #1f1e1d;--card-border: #302f2e;--pill-bg: #1f1e1d;--pill-text: #faf9f5;--accent-terracotta: #c96442;--accent-terracotta-hover: #d97757}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);min-height:100vh;min-height:100dvh;line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .3s ease,color .3s ease}#root{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.container{width:100%;max-width:480px;margin:0 auto;padding:1.25rem;flex:1;display:flex;flex-direction:column}h1{font-family:var(--font-serif);font-size:2.75rem;font-weight:500;color:var(--text-primary);line-height:1.1;letter-spacing:-.01em;font-style:italic}h2{font-family:var(--font-serif);font-size:1.75rem;font-weight:500;color:var(--text-primary);line-height:1.2;letter-spacing:-.01em;font-style:italic}h3{font-family:var(--font-sans);font-size:1.125rem;font-weight:600;color:var(--text-primary);line-height:1.4}p{color:var(--text-secondary);line-height:1.6}button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:var(--radius-sm);border:none;padding:.625rem 1rem;font-size:1rem;font-weight:400;font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-secondary);cursor:pointer;transition:all .15s ease;touch-action:manipulation}button:hover{background-color:var(--bg-tertiary)}button:active{transform:scale(.98)}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background-color:var(--accent-dark);color:var(--accent-light);border:none;padding:.75rem 1.25rem;font-weight:400}button.primary:hover{background-color:var(--accent-dark-hover)}button.secondary{background-color:var(--bg-primary);color:var(--text-secondary);border:1px solid var(--border-medium);padding:.625rem 1rem}button.secondary:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}button.accent{background-color:var(--accent-terracotta);color:#fff;border:none;border-radius:var(--radius-md)}button.accent:hover{background-color:var(--accent-terracotta-hover)}button.danger{background-color:var(--accent-terracotta);color:#fff;border-color:var(--accent-terracotta)}button.danger:hover{background-color:var(--accent-terracotta-hover);border-color:var(--accent-terracotta-hover)}button.success{background-color:var(--success);color:#fff;border-color:var(--success)}button.ghost{background-color:transparent;border-color:transparent;color:var(--text-secondary)}button.ghost:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}button.pill{border-radius:var(--radius-md);padding:.5rem 1rem .5rem .75rem;font-size:1rem;font-weight:400;background-color:var(--pill-bg);color:var(--pill-text);border:none;box-shadow:0 1px 3px #00000014}button.pill:hover{background-color:var(--bg-tertiary);box-shadow:0 2px 6px #0000001f}input{width:100%;padding:.875rem 1rem;font-size:1rem;font-family:var(--font-sans);border:1px solid var(--input-border);border-radius:var(--radius-sm);background-color:var(--bg-input);color:var(--text-primary);transition:all .2s ease}input:focus{outline:none;box-shadow:0 0 0 2px var(--accent-terracotta)}input::placeholder{color:var(--text-muted)}.card{background-color:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-md);padding:1.25rem;box-shadow:0 1px 3px #0000000a;transition:background-color .2s ease,border-color .2s ease}.card:hover{box-shadow:0 4px 12px #00000014}.text-center{text-align:center}.text-muted{color:var(--text-secondary)}.text-small{font-size:.875rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-12{margin-top:3rem}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.flex{display:flex}.flex-col{flex-direction:column}.flex-1{flex:1}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.w-full{width:100%}.grid{display:grid}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.illustration{stroke:var(--text-primary);stroke-width:2;fill:none}.illustration-accent{fill:var(--accent-terracotta)}.room-code{font-family:var(--font-sans);font-size:2rem;font-weight:600;letter-spacing:.15em;color:var(--text-primary)}.player-item{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;background-color:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-md);transition:background-color .2s ease}.game-card-display{background-color:var(--bg-tertiary);padding:1rem;border-radius:var(--radius-sm);font-weight:500;text-align:center}.status-connected{color:var(--success)}.status-disconnected{color:var(--text-muted)}.lives{display:flex;gap:.25rem}.life-heart{color:var(--accent-terracotta)}.winner-emoji{font-size:4rem;line-height:1}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:fadeIn .3s ease-out}