:root{--cream: #fdf6ec;--paper: #fffaf2;--ink: #4a3f35;--pip: #e8834a;--hazel: #5b4b8a;--shadow: 0 8px 24px rgba(74, 63, 53, .12)}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Fredoka,system-ui,sans-serif;color:var(--ink);background:linear-gradient(180deg,#fdf1e0,#fdf6ec 40%,#f6ead9)}#app{max-width:720px;margin:0 auto;padding:32px 20px 64px;display:flex;flex-direction:column;gap:24px}h1{text-align:center;font-weight:700;font-size:1.8rem;margin:0}.tally{text-align:center;font-size:.95rem;opacity:.75}.matchup{display:flex;justify-content:center;align-items:center;gap:16px}.character-card{background:var(--paper);border-radius:20px;box-shadow:var(--shadow);padding:20px;text-align:center;width:160px;border:3px solid transparent;transition:transform .15s ease}.character-card .avatar{font-size:2.5rem}.character-card .name{font-weight:600;margin-top:8px}.character-card.pip{border-color:var(--pip)}.character-card.hazel{border-color:var(--hazel)}.vs{font-weight:700;font-size:1.2rem;opacity:.6}.topic-form{display:flex;flex-direction:column;gap:12px;align-items:center}.topic-input{width:100%;max-width:480px;padding:14px 16px;border-radius:16px;border:2px solid #e8d9c3;font-family:inherit;font-size:1rem;background:var(--paper)}.topic-input:focus{outline:none;border-color:var(--pip)}.start-button,.pick-button,.retry-button,.new-debate-button{font-family:inherit;font-weight:600;font-size:1rem;padding:12px 28px;border-radius:999px;border:none;cursor:pointer;background:var(--pip);color:#fff;box-shadow:var(--shadow);transition:transform .1s ease}.start-button:disabled{background:#d8cabb;cursor:not-allowed}.start-button:not(:disabled):hover,.pick-button:hover,.retry-button:hover,.new-debate-button:hover{transform:translateY(-2px)}.turns{display:flex;flex-direction:column;gap:14px}.turn-bubble{background:var(--paper);border-radius:18px;box-shadow:var(--shadow);padding:14px 18px;max-width:85%;border-left:6px solid transparent}.turn-bubble:last-child{animation:fade-in .35s ease}.turn-bubble.pip{border-left-color:var(--pip);align-self:flex-start}.turn-bubble.hazel{border-left-color:var(--hazel);align-self:flex-end;text-align:right}.turn-bubble .speaker{font-weight:600;font-size:.85rem;opacity:.7;margin-bottom:4px}.thinking{font-size:.9rem;opacity:.6;text-align:center;animation:pulse 1.4s ease-in-out infinite}.error-bubble{background:#fbe4e0;border-radius:18px;padding:14px 18px;text-align:center}.verdict{text-align:center;display:flex;flex-direction:column;gap:16px;align-items:center}.verdict-choices{display:flex;gap:16px}.confetti-piece{position:fixed;top:-10px;width:8px;height:14px;border-radius:2px;animation:fall 1.6s ease-in forwards;pointer-events:none}@keyframes fade-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:.4}50%{opacity:.8}}@keyframes fall{to{transform:translateY(100vh) rotate(360deg);opacity:0}}