.playing-view-container{position:relative;width:100%;max-width:900px;min-height:80vh;display:flex;flex-direction:column;padding:20px;border-radius:16px;transition:background-color .5s ease,color .5s ease;box-shadow:0 10px 40px #0006}.night-mode{background-color:#050814;color:#a0a6cc}.day-mode{background-color:#d8e2eb;color:#1a1f4a}.phase-header{text-align:center;margin-bottom:20px}.phase-header h2{margin:0;font-size:1.8rem}.highlight-role{font-weight:700;color:#ffd166;background:#0003;padding:4px 8px;border-radius:6px}.phase-time{position:absolute;top:20px;right:20px;background:#000000b3;color:#ff5e5e;font-weight:700;font-size:1.5rem;padding:10px 20px;border-radius:16px;box-shadow:0 4px 10px #00000080;z-index:100;border:2px solid #ff5e5e;animation:pulse-border 1.5s infinite}.day-mode .phase-time{background:#ffffffe6;box-shadow:0 4px 10px #0000001a}@keyframes pulse-border{0%{box-shadow:0 0 5px #ff5e5e}50%{box-shadow:0 0 20px #ff5e5e}to{box-shadow:0 0 5px #ff5e5e}}.game-area{display:flex;flex-direction:column-reverse;align-items:center;gap:20px;flex:1}@media (max-width: 768px){.playing-view-container{padding:10px;margin-top:10px}}.mc-chat-panel{width:100%;max-width:600px;background:#0006;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:12px;padding:16px;display:flex;flex-direction:column;box-shadow:inset 0 0 10px #00000080}.day-mode .mc-chat-panel{background:#fff9;border:1px solid rgba(0,0,0,.1)}.chat-messages{flex:1;overflow-y:auto;margin-bottom:12px;display:flex;flex-direction:column;gap:8px;max-height:400px}.mc-message{font-weight:700;padding:10px 14px;border-radius:10px;background:#ffffff1a;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);box-shadow:0 2px 5px #0003;line-height:1.4}.day-mode .mc-message{background:#fff9;box-shadow:0 2px 5px #0000000d}.mc-message.mc{color:#ffd166}.mc-message.death{color:#ff5e5e}.mc-message.save{color:#4ade80}.mc-message.player{color:#fff;font-weight:400}.day-mode .mc-message.player{color:#0b0f2b}.wolf-chat-form{display:flex;gap:8px}.wolf-chat-form input{margin:0;flex:1}.btn-wolf-chat{width:auto;margin:0;background:#ff5e5e;color:#fff;transition:transform .2s,filter .2s}.btn-wolf-chat:hover{transform:scale(1.05);filter:brightness(1.2)}.btn-wolf-chat:active{transform:scale(.95)}.circle-panel{flex:2;position:relative;display:flex;flex-direction:column;align-items:center}.player-circle-container{position:relative;width:340px;height:340px;margin:20px auto;border-radius:50%}@media (max-width: 400px){.player-circle-container{transform:scale(.85);margin:0 auto}}.campfire-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;background:radial-gradient(circle,#ffa50080,#ff450000 70%);border-radius:50%;display:flex;align-items:center;justify-content:center}.campfire-icon{font-size:2.5rem;animation:flicker 1.5s infinite alternate}@keyframes flicker{0%{transform:scale(1);opacity:.8}to{transform:scale(1.1);opacity:1}}.player-circle-item{position:absolute;top:50%;left:50%;width:60px;display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:transform .2s}.player-circle-item:hover{transform:scale(1.1);z-index:10}.avatar-wrapper{position:relative}.avatar-img{width:50px;height:50px;border-radius:50%;border:3px solid transparent;background:#2a2f5c;transition:all .2s}.day-mode .avatar-img{background:#fff;border-color:#cbd5e1}.player-circle-item.selected .avatar-img{border-color:#ffd166;box-shadow:0 0 15px #ffd166cc}.player-circle-item.dead-or-victim .avatar-img{border-color:#ff5e5e;filter:grayscale(80%)}.player-circle-item.dimmed .avatar-img{opacity:.4}.player-circle-item.seer-wolf .avatar-img{border-color:#ff5e5e!important;box-shadow:0 0 20px #ff5e5ecc!important}.player-circle-item.seer-human .avatar-img{border-color:#4ade80!important;box-shadow:0 0 20px #4ade80cc!important}.wolf-target-badge{position:absolute;top:-8px;right:-8px;background:#ff5e5e;color:#fff;font-size:.75rem;padding:2px 6px;border-radius:12px;font-weight:700}.mini-voters-container{display:flex;flex-wrap:wrap;justify-content:center;gap:2px;margin-top:5px;width:100%}.mini-voter-img{width:20px;height:20px;border-radius:50%;border:1px solid white}.final-vote-badge{margin-top:5px;padding:2px 6px;border-radius:4px;font-size:.75rem;font-weight:700;color:#fff}.final-vote-badge.hang{background:#ff5e5e}.final-vote-badge.spare{background:#4ade80}.defendant-badge{position:absolute;top:-25px;background:#f59e0b;color:#fff;padding:2px 8px;border-radius:4px;font-size:.75rem;font-weight:700;animation:pulse 1.5s infinite;white-space:nowrap}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.player-name-plate{margin-top:4px;font-size:.75rem;text-align:center;background:#0009;padding:2px 6px;border-radius:4px;color:#fff;white-space:nowrap}.speech-bubble{position:absolute;bottom:100%;background:#fff;color:#000;padding:6px 10px;border-radius:12px;font-size:.8rem;white-space:nowrap;pointer-events:none;animation:popIn .2s ease-out forwards}.speech-bubble:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#fff transparent transparent transparent}@keyframes popIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.action-panel{margin-top:20px;text-align:center;background:#0006;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:16px;border-radius:12px;width:100%;box-shadow:0 4px 15px #0000004d}.day-mode .action-panel{background:#ffffff80}.waiting-text{font-style:italic;color:#8892b0}.day-mode .waiting-text{color:#64748b}.btn-action{margin-top:10px}.witch-actions,.final-vote-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.btn-save{background:#4ade80;color:#000;transition:transform .2s,filter .2s}.btn-skip{background:#94a3b8;color:#000;transition:transform .2s,filter .2s}.btn-poison,.btn-kill{background:#ff5e5e;color:#fff;transition:transform .2s,filter .2s}.btn-save:hover,.btn-skip:hover,.btn-poison:hover,.btn-kill:hover{transform:scale(1.05);filter:brightness(1.1)}.btn-save:active,.btn-skip:active,.btn-poison:active,.btn-kill:active{transform:scale(.95)}.endgame-recap-panel{margin-top:20px;background:#0009;padding:20px;border-radius:12px;box-shadow:0 4px 15px #00000080;text-align:center;max-width:600px;margin-left:auto;margin-right:auto}.recap-lines{display:flex;flex-direction:column;gap:8px;margin:15px 0;max-height:200px;overflow-y:auto;text-align:left}.recap-line{padding:8px 12px;border-radius:8px;background:#ffffff1a;opacity:.5;transition:opacity .5s ease}.recap-line.active{opacity:1;background:#fff3;border-left:4px solid #ffd166;font-weight:700}.restart-section{margin-top:20px}.recap-anim-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:3rem;pointer-events:none;z-index:20;animation:popInAnim .5s cubic-bezier(.175,.885,.32,1.275) forwards}@keyframes popInAnim{0%{transform:translate(-50%,-50%) scale(0);opacity:0}50%{transform:translate(-50%,-50%) scale(1.2);opacity:1}to{transform:translate(-50%,-50%) scale(1);opacity:1}}.anim-wolf-bite .avatar-img{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both;border-color:#ff5e5e!important;box-shadow:0 0 20px #ff5e5e}.anim-guard-shield .avatar-img{animation:pulse-shield 1s infinite alternate;border-color:#4ade80!important}@keyframes pulse-shield{0%{box-shadow:0 0 10px #4ade80}to{box-shadow:0 0 30px #4ade80}}.anim-witch-save .avatar-img{animation:pop .5s ease-out;border-color:#4ade80!important}.anim-witch-poison .avatar-img{animation:shake .5s infinite;border-color:#a855f7!important;box-shadow:0 0 20px #a855f7}.anim-hang .avatar-img{animation:dropdown .8s ease-in forwards;filter:grayscale(100%)}@keyframes dropdown{0%{transform:translateY(0);opacity:1}to{transform:translateY(30px);opacity:.5}}.anim-seer .avatar-img{animation:pulse-eye 1s ease-in-out}@keyframes pulse-eye{0%{transform:scale(1)}50%{transform:scale(1.2);box-shadow:0 0 20px #fff}to{transform:scale(1)}}@keyframes shake{10%,90%{transform:translate3d(-2px,0,0)}20%,80%{transform:translate3d(4px,0,0)}30%,50%,70%{transform:translate3d(-6px,0,0)}40%,60%{transform:translate3d(6px,0,0)}}*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Helvetica Neue,Arial,sans-serif;background:linear-gradient(180deg,#0b0f2b,#1a1f4a);color:#f1f1f6;min-height:100vh}#root{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:24px 16px}.card{background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:28px;width:100%;max-width:420px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}h1{font-size:1.7rem;margin-bottom:4px;text-align:center}.subtitle{text-align:center;color:#b7bce0;margin-bottom:24px;font-size:.9rem}label{display:block;font-size:.85rem;margin-bottom:6px;color:#c9cdf0}input,select{width:100%;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:#00000040;color:#fff;font-size:1rem;margin-bottom:16px}input:focus,select:focus{outline:2px solid #7c8cf8}select option{background:#1a1f4a;color:#fff}button{width:100%;padding:12px;border-radius:10px;border:none;font-size:1rem;font-weight:600;cursor:pointer;margin-bottom:10px;transition:transform .1s ease,opacity .15s ease}button:active{transform:scale(.98)}button:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:#7c8cf8;color:#0b0f2b}.btn-secondary{background:transparent;border:1px solid rgba(255,255,255,.25);color:#f1f1f6}.divider{text-align:center;color:#7c81a8;margin:16px 0;font-size:.8rem}.error{color:#ff8080;font-size:.85rem;margin:-8px 0 14px}.room-code{text-align:center;font-size:2rem;font-weight:700;letter-spacing:6px;color:#ffd166;margin:8px 0 20px}.player-list{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.player-row{display:flex;align-items:center;gap:12px;background:#ffffff0d;padding:8px 12px;border-radius:10px}.player-row img{width:40px;height:40px;border-radius:50%;background:#2a2f5c}.player-name{flex:1;font-size:.95rem}.host-tag{font-size:.7rem;background:#ffd166;color:#3a2c00;padding:2px 8px;border-radius:999px;font-weight:700}.you-tag{font-size:.7rem;background:#7c8cf8;color:#0b0f2b;padding:2px 8px;border-radius:999px;font-weight:700}.status-text{text-align:center;color:#b7bce0;font-size:.85rem;margin-top:8px}