@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&display=swap";:root{--bg-color:#0b0c10;--text-main:#e2e8f0;--text-muted:#94a3b8;--accent-werewolf:#ef4444;--accent-seer:#06b6d4;--accent-villager:#10b981;--accent-mod:#a855f7;--glass-bg:#ffffff08;--glass-border:#ffffff14;--glass-shadow:0 8px 32px 0 #0000005e;color:var(--text-main);background-color:var(--bg-color);background-image:radial-gradient(circle at 15%,#a855f726,#0000 25%),radial-gradient(circle at 85% 30%,#ef444426,#0000 25%);background-attachment:fixed;min-height:100vh;margin:0;padding:0;font-family:Outfit,system-ui,-apple-system,sans-serif}body{justify-content:center;align-items:center;min-height:100vh;margin:0;display:flex;overflow-x:hidden}h1,h2,h3{letter-spacing:-.05em;margin:0;font-weight:600}button{font-family:Outfit,sans-serif}.app-container{box-sizing:border-box;grid-template-columns:350px 1fr;gap:24px;width:100vw;max-width:1200px;height:100vh;padding:24px;display:grid}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:24px;flex-direction:column;padding:24px;transition:transform .3s,border-color .3s;display:flex;overflow:hidden}.sidebar{gap:16px}.brand{-webkit-text-fill-color:transparent;text-align:center;text-transform:uppercase;letter-spacing:2px;background:linear-gradient(90deg,#a855f7,#ef4444);-webkit-background-clip:text;background-clip:text;margin-bottom:24px;font-size:28px;font-weight:800}.agent-card{cursor:pointer;background:#0003;border:1px solid #ffffff0d;border-radius:16px;align-items:center;gap:16px;padding:16px;transition:all .3s cubic-bezier(.25,.8,.25,1);display:flex}.agent-card:hover{background:#ffffff0d;border-color:#ffffff26;transform:translateY(-2px)}.avatar{background-color:#1e1e24;border:2px solid #0000;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:24px;display:flex}.avatar.werewolf{border-color:var(--accent-werewolf);box-shadow:0 0 15px #ef444466}.avatar.villager{border-color:var(--accent-villager)}.avatar.seer{border-color:var(--accent-seer);box-shadow:0 0 15px #06b6d466}.agent-info{flex-direction:column;display:flex}.agent-name{color:var(--text-main);font-size:16px;font-weight:600}.agent-status{color:var(--text-muted);font-size:12px}.arena{flex-direction:column;display:flex;position:relative}.phase-banner{text-align:center;color:var(--accent-mod);letter-spacing:1px;text-transform:uppercase;background:#a855f71a;border:1px solid #a855f74d;border-radius:12px;margin-bottom:24px;padding:12px 24px;font-weight:600;animation:2s infinite pulse}.chat-log{flex-direction:column;flex:1;gap:16px;padding-right:8px;display:flex;overflow-y:auto}.chat-bubble{opacity:0;background:#ffffff08;border:1px solid #ffffff0d;border-radius:16px;max-width:80%;padding:16px;font-size:15px;line-height:1.5;animation:.4s ease-out forwards slideUp;transform:translateY(10px)}.chat-bubble.werewolf{border-left:4px solid var(--accent-werewolf)}.chat-bubble.villager{border-left:4px solid var(--accent-villager)}.chat-bubble.seer{border-left:4px solid var(--accent-seer)}.chat-bubble.mod{text-align:center;width:100%;max-width:100%;color:var(--accent-mod);background:0 0;border:1px solid #a855f733;border-left:none;border-right:none;border-radius:0;align-self:flex-start;padding:12px;font-style:italic}.chat-header{align-items:center;gap:8px;margin-bottom:8px;display:flex}.chat-name{font-size:14px;font-weight:600}.chat-time{color:var(--text-muted);font-size:11px}.controls{gap:16px;margin-top:24px;display:flex}.action-btn{background:var(--accent-mod);color:#fff;cursor:pointer;border:none;border-radius:12px;flex:1;padding:16px;font-size:16px;font-weight:600;transition:all .2s;box-shadow:0 4px 15px #a855f766}.action-btn:hover{background:#9333ea;transform:translateY(-2px);box-shadow:0 6px 20px #a855f799}.action-btn.secondary{border:1px solid var(--glass-border);box-shadow:none;background:0 0}.action-btn.secondary:hover{background:#ffffff0d}@keyframes slideUp{to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%{box-shadow:0 0 #a855f766}70%{box-shadow:0 0 0 10px #a855f700}to{box-shadow:0 0 #a855f700}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#fff3}.game-over-modal{-webkit-backdrop-filter:blur(16px);text-align:center;z-index:100;background:#10b98126;border:1px solid #10b98180;border-radius:24px;width:80%;padding:40px;animation:.5s cubic-bezier(.175,.885,.32,1.275) forwards popIn;position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);box-shadow:0 10px 40px #10b9814d}.game-over-modal h2{color:var(--accent-villager);text-transform:uppercase;letter-spacing:2px;margin-bottom:8px;font-size:36px}.game-over-modal p{color:var(--text-main);font-size:18px}@keyframes popIn{0%{opacity:0;transform:translate(-50%,-40%)scale(.8)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}