*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}@keyframes splash-bar{0%{width:0%}30%{width:55%}60%{width:78%}85%{width:91%}to{width:100%}}:root{--bg: #0f172a;--surface: #1e293b;--border: #334155;--accent: #6366f1;--accent-hover: #818cf8;--text: #f1f5f9;--muted: #94a3b8;--success: #22c55e;--danger: #ef4444;--card-size: 72px;--radius: 10px}body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;min-height:100vh}.app-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;background:var(--surface);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.app-header-brand{font-weight:700;font-size:1rem;color:var(--accent);letter-spacing:.02em}.app-header-user{display:flex;align-items:center;gap:.75rem}.app-header-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;border:2px solid var(--accent)}.app-header-name{font-size:.875rem;font-weight:500;color:var(--text);max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}h1{font-size:1.75rem;font-weight:700}h2{font-size:1.25rem;font-weight:600}.page{max-width:900px;margin:0 auto;padding:2rem 1rem}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem}.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1.1rem;border-radius:var(--radius);border:none;font-size:.9rem;font-weight:600;cursor:pointer;transition:opacity .15s,background .15s}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-ghost{background:transparent;color:var(--muted);border:1px solid var(--border)}.btn-ghost:hover:not(:disabled){color:var(--text);border-color:var(--muted)}.btn-danger{background:var(--danger);color:#fff}.btn-sm{padding:.3rem .7rem;font-size:.8rem}.input{width:100%;padding:.6rem .9rem;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:.95rem;outline:none}.input:focus{border-color:var(--accent)}.row{display:flex;gap:.75rem;align-items:center}.col{display:flex;flex-direction:column;gap:.75rem}.gap-sm{gap:.4rem}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.text-muted{color:var(--muted);font-size:.875rem}.text-success{color:var(--success)}.badge{display:inline-block;padding:.15rem .55rem;border-radius:999px;font-size:.75rem;font-weight:600;background:var(--border);color:var(--text)}.badge-accent{background:var(--accent)}.badge-success{background:var(--success);color:#000}.badge-revealed{background:#7c3aed}.deck{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.75rem}.vote-card{width:var(--card-size);height:calc(var(--card-size) * 1.4);display:flex;align-items:center;justify-content:center;border-radius:var(--radius);border:2px solid var(--border);background:var(--surface);font-size:1.3rem;font-weight:700;cursor:pointer;transition:border-color .15s,transform .1s,background .15s;-webkit-user-select:none;user-select:none}.vote-card:hover{border-color:var(--accent);transform:translateY(-3px)}.vote-card.selected{border-color:var(--accent);background:var(--accent);color:#fff}.vote-card.disabled{opacity:.5;cursor:default;transform:none}.participant-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.participant-chip{display:flex;align-items:center;gap:.4rem;padding:.3rem .7rem;border-radius:999px;background:var(--surface);border:1px solid var(--border);font-size:.85rem}.vote-dot{width:8px;height:8px;border-radius:50%;background:var(--border)}.vote-dot.voted{background:var(--success)}.active-panel{border-color:var(--accent);background:linear-gradient(160deg,var(--surface) 60%,rgba(99,102,241,.12) 100%)}.active-panel.revealed{border-color:#7c3aed;background:linear-gradient(160deg,var(--surface) 60%,rgba(124,58,237,.12) 100%)}.pv-grid{display:flex;flex-wrap:wrap;gap:1rem}.pv-item{display:flex;flex-direction:column;align-items:center;gap:.4rem}.pv-card{width:84px;min-height:100px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;padding:.6rem .4rem .5rem;border-radius:var(--radius);border:2px solid var(--border);font-size:1.3rem;font-weight:700;transition:all .25s}.pv-card.pv-waiting{background:var(--bg);border-style:dashed;color:var(--muted)}.pv-card.pv-voted{background:var(--accent);border-color:var(--accent);color:#fff;font-size:1.1rem}.pv-card.pv-revealed{background:var(--surface);border-color:#7c3aed;color:var(--text);box-shadow:0 0 0 1px #7c3aed44}.pv-avatar-img{width:52px;height:52px;border-radius:50%;object-fit:cover;display:block}.pv-badge{display:block;font-size:.95rem;font-weight:700;line-height:1;margin-top:.2rem}.pv-name{font-size:.8rem;color:var(--muted);text-align:center;max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.avatar-preview{width:120px;height:120px;border-radius:50%;overflow:hidden;border:3px solid var(--accent);display:flex;align-items:center;justify-content:center;background:var(--bg)}.avatar-preview img{width:100%;height:100%;object-fit:cover}.avatar-placeholder{font-size:2.5rem;color:var(--muted)}.story-item{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 1rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface)}.story-item.active{border-color:var(--accent)}.story-item.clickable{cursor:pointer}.story-item.clickable:hover,.story-item.history-selected{border-color:var(--muted);background:var(--bg)}.votes-grid{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1rem}.vote-reveal-card{display:flex;flex-direction:column;align-items:center;gap:.3rem;min-width:64px}.vote-reveal-value{width:var(--card-size);height:calc(var(--card-size) * 1.4);display:flex;align-items:center;justify-content:center;border-radius:var(--radius);border:2px solid var(--accent);background:var(--surface);font-size:1.4rem;font-weight:700}.error{color:var(--danger);font-size:.875rem}.separator{height:1px;background:var(--border);margin:1rem 0}.history-wrapper{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1),opacity .2s ease}.history-wrapper.history-open{grid-template-rows:1fr;opacity:1}.history-inner{overflow:hidden}.history-inner>*{margin-bottom:1.5rem}
