*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--crimson:#8b0000;--crimson-light:#c0392b;--bg:#1a1a2e;--surface:#16213e;--surface2:#0f3460;--text:#e0e0e0;--text-muted:#888;--accent:#e94560;--radius:8px}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:Segoe UI,system-ui,sans-serif}.home-page{text-align:center;max-width:480px;margin:0 auto;padding:4rem 1rem}.home-page h1{color:var(--accent);margin-bottom:.5rem;font-size:2.5rem}.home-page>p{color:var(--text-muted);margin-bottom:2rem}.create-room-form{background:var(--surface);border-radius:var(--radius);text-align:left;flex-direction:column;gap:1rem;padding:2rem;display:flex}.create-room-form h2{color:var(--accent);margin-bottom:.5rem}.create-room-form label{flex-direction:column;gap:.4rem;font-size:.9rem;display:flex}.create-room-form input,.create-room-form select{border-radius:var(--radius);border:1px solid var(--surface2);background:var(--bg);color:var(--text);padding:.6rem .8rem;font-size:1rem}button{cursor:pointer;border-radius:var(--radius);background:var(--accent);color:#fff;border:none;padding:.6rem 1.2rem;font-size:1rem;transition:opacity .15s}button:disabled{opacity:.4;cursor:not-allowed}button:not(:disabled):hover{opacity:.85}.room-page{flex-direction:column;height:100vh;display:flex}.room-header{background:var(--surface);border-bottom:1px solid var(--surface2);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex}.room-header h1{color:var(--accent);font-size:1.4rem}.room-layout{flex:1;display:flex;overflow:hidden}.room-sidebar{background:var(--surface);border-right:1px solid var(--surface2);width:220px;padding:1rem;overflow-y:auto}.room-main{flex-direction:column;flex:1;gap:1.5rem;padding:1.5rem;display:flex;overflow-y:auto}.participant-list h3{color:var(--text-muted);text-transform:uppercase;margin-bottom:.75rem;font-size:.85rem}.participant-list ul{flex-direction:column;gap:.5rem;list-style:none;display:flex}.participant-item{background:var(--surface2);border-radius:var(--radius);justify-content:space-between;align-items:center;padding:.5rem .75rem;font-size:.9rem;display:flex}.participant-status{color:var(--accent);font-weight:600}.voting-cards{flex-wrap:wrap;gap:.75rem;display:flex}.card{background:var(--surface2);border-radius:var(--radius);border:2px solid #0000;width:64px;height:88px;font-size:1.3rem;font-weight:700;transition:transform .15s,border-color .15s}.card:not(:disabled):hover{transform:translateY(-6px)}.card--selected{border-color:var(--accent);background:var(--crimson);transform:translateY(-8px)}.vote-results h3{color:var(--accent);margin-bottom:.75rem}.vote-consensus{margin-bottom:.5rem;font-size:1.1rem}.vote-tally{flex-direction:column;gap:.5rem;list-style:none;display:flex}.vote-tally li{align-items:center;gap:.75rem;display:flex}.tally-value{width:40px;font-weight:600}.tally-bar{background:var(--accent);border-radius:4px;height:20px;transition:width .4s}.tally-count{color:var(--text-muted);font-size:.85rem}.story-panel{background:var(--surface);border-radius:var(--radius);padding:1rem}.story-title{margin-top:.5rem;font-size:1.2rem}.story-empty{color:var(--text-muted);font-style:italic}.story-history{margin-top:1rem}.story-history h4{color:var(--text-muted);text-transform:uppercase;margin-bottom:.5rem;font-size:.8rem}.story-history ul{flex-direction:column;gap:.4rem;list-style:none;display:flex}.story-history li{justify-content:space-between;font-size:.9rem;display:flex}.moderator-controls{background:var(--surface);border-radius:var(--radius);border:1px solid var(--crimson);padding:1rem}.moderator-controls h4{color:var(--crimson-light);margin-bottom:.75rem}.story-input{gap:.5rem;margin-bottom:.75rem;display:flex}.story-input input{border-radius:var(--radius);border:1px solid var(--surface2);background:var(--bg);color:var(--text);flex:1;padding:.5rem .75rem}.vote-actions{gap:.75rem;display:flex}.copy-link-btn{background:var(--surface2);font-size:.85rem}.modal-overlay{background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border-radius:var(--radius);flex-direction:column;gap:1rem;min-width:320px;padding:2rem;display:flex}.modal h2{color:var(--accent)}.modal form{flex-direction:column;gap:.75rem;display:flex}.modal input{border-radius:var(--radius);border:1px solid var(--surface2);background:var(--bg);color:var(--text);padding:.6rem .8rem;font-size:1rem}.error-banner{background:var(--crimson);cursor:pointer;padding:.75rem 1.5rem;font-size:.9rem}.loading,.not-found{flex-direction:column;justify-content:center;align-items:center;gap:1rem;height:100vh;display:flex}.not-found h1{color:var(--accent);font-size:4rem}.not-found a{color:var(--accent)}
