@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800;900&display=swap');
:root{--thn-bg:#1b120e;--thn-panel:#302015;--thn-text:#fff0d9;--thn-muted:#cfb18c;--thn-gold:#e9bc75;--thn-border:#c1945340}
[hidden]{display:none!important}body.thn-game{font-family:Tajawal,Tahoma,sans-serif;background:radial-gradient(ellipse at 10% 0%,#9a5b2529,transparent 50%),linear-gradient(#1b120eea,#1b120ef2),url('/thn-hero.webp') center/cover fixed;color:var(--thn-text);align-items:flex-start;padding:88px 22px 40px;min-height:100dvh;line-height:1.6}button,input,select{font-family:inherit}.container{max-width:920px}header{margin-bottom:26px;text-shadow:none}header h1{font-weight:900;font-size:47px;letter-spacing:0;margin:4px 0;color:#ffe3b1}.subtitle{font-size:15px;color:var(--thn-muted)}.game-eyebrow{color:var(--thn-gold);font-size:12px;letter-spacing:.5px}.back-home{position:absolute;top:24px;right:max(22px,calc((100vw - 1160px)/2));color:var(--thn-gold);font-size:21px;font-weight:900;text-decoration:none}.back-home span{font-size:11px;color:var(--thn-muted);font-weight:500;margin-right:15px}
.card,.role-card,.god-card,.modal-content{background:linear-gradient(140deg,#3c291cdc,#24170ff5);border:1px solid var(--thn-border);box-shadow:0 15px 55px #0005;border-radius:20px;padding:30px;color:var(--thn-text)}.entry-card{padding:0;overflow:hidden;display:grid;grid-template-columns:.95fr 1.05fr;min-height:415px}.entry-art{background:linear-gradient(0deg,#1e120de0,transparent 70%),url('/thn-mafia.webp') 28% center/cover;position:relative;min-height:415px}.entry-art span{position:absolute;bottom:30px;right:26px;font-size:34px;color:#fff0d6;font-weight:900}.entry-content{padding:32px}.entry-content h2{font-size:27px;font-weight:900;text-align:right;margin:8px 0}.entry-description{font-size:13px;color:var(--thn-muted);margin-bottom:23px}.entry-choices{display:grid;gap:13px}.entry-choice{width:100%;text-align:right;position:relative;padding:16px 66px 16px 18px;border-radius:12px;border:1px solid #c2944b55;background:linear-gradient(120deg,#64422240,#271910);color:var(--thn-text);cursor:pointer;transition:border-color .2s,transform .2s}.entry-choice:hover{border-color:var(--thn-gold);transform:translateX(-3px)}.entry-choice b{position:absolute;right:20px;top:20px;font-size:25px;color:var(--thn-gold)}.entry-choice strong{display:block;font-size:20px}.entry-choice small{display:block;font-size:12px;color:var(--thn-muted);margin-top:3px}.entry-form label{display:block;color:var(--thn-muted);font-size:12px;margin:12px 0 5px}.entry-form h3{font-size:23px;margin:0 0 10px}.entry-back{background:none;border:0;color:#cdb18e;cursor:pointer;font-size:12px;padding:12px;width:100%}
input[type=text],input:not([type]),select{background:#1c120d;color:var(--thn-text);border:1px solid #b98b4b66;border-radius:10px;width:100%;padding:13px 15px;font-size:16px;margin-bottom:13px;outline:none}input::placeholder{color:#ae8e68}input:focus{border-color:var(--thn-gold);box-shadow:0 0 0 3px #e7b76914}.btn{font-size:15px;font-weight:800;border-radius:10px;padding:12px 18px;border:1px solid transparent;box-shadow:none;transition:filter .15s,transform .15s;letter-spacing:0}.btn:hover:not(:disabled){filter:brightness(1.12);transform:translateY(-2px)}.btn-primary,.btn-success{background:linear-gradient(115deg,#f1c884,#c98b42);color:#25180f;box-shadow:0 6px 22px #b47b2820}.btn-secondary{background:#4c3524;color:#ffe4bd;border-color:#c2944b44}.btn-warning{background:#78522c;color:#fff0d1}.btn-danger{background:#823e30;color:#ffead6}.btn:disabled{opacity:.42;cursor:not-allowed;transform:none;box-shadow:none}.btn-large{font-size:17px}.btn-reveal{background:repeating-linear-gradient(45deg,#2a1a11 0 12px,#2e1d13 12px 13px);border:1px solid #d3a25b99;color:var(--thn-gold);font-size:26px;min-height:128px;max-width:340px;width:100%;margin:23px auto 0;box-shadow:inset 0 0 35px #aa733916,0 8px 30px #0003}.role-card{max-width:650px;margin:auto;padding:36px}.role-card h2{font-size:33px;color:var(--thn-text)}.role-instruction,.role-warning,.role-info,.waiting-instruction,.note{color:var(--thn-muted)!important;font-size:13px}.role-warning{color:#e7b875!important;background:#b0783115;padding:9px;border-radius:10px}.secret-seal{display:grid;place-items:center;width:64px;height:64px;border:1px solid #d3a25b70;color:var(--thn-gold);font-size:32px;border-radius:17px;transform:rotate(-7deg);margin:0 auto 20px;background:#261810}.role-mafia{background:#693424;color:#ffd3b0}.role-doctor{background:#315348;color:#dcf1cd}.role-detective{background:#5e4b29;color:#ffedb3}.role-villager{background:#5b422e;color:#fff0dc}.mafia-team-info,.my-role-display{background:#24170f;border:1px solid var(--thn-border);color:#f2d6ad;border-radius:11px;padding:16px;margin:16px 0}.player-item,.readiness-card,.player-status-card,.player-card,.voting-card,.final-role-item,.god-player-card,.transfer-player-btn{background:#291b13!important;color:#fff0da;border:1px solid var(--thn-border);border-radius:12px;box-shadow:none;padding:13px 16px}.player-item.host{border-color:#d9aa6366!important;background:#50351e!important}.players-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.readiness-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.readiness-card{min-height:100px}.readiness-card.ready{border-color:#85a77199;background:#33402a!important}.readiness-card.viewed{border-color:#d1a46866}.readiness-status,.player-count,.host-info{color:var(--thn-muted)!important}.readiness-icon{font-size:22px}.player-name{color:var(--thn-text)!important;font-weight:700}.status-badge{background:#674322;color:#ffe1aa;border:1px solid #cb995255;border-radius:8px}.player-count{font-size:14px;padding:17px}.player-count span{color:var(--thn-gold);font-size:25px}.info-box,.waiting-message,.night-instructions,.phase-info,.spectator-message,.game-over-info,.voting-info,.readiness-status{background:#22160f;border:1px solid var(--thn-border);color:var(--thn-muted);border-radius:12px;padding:18px}.info-box h3{color:var(--thn-gold)}.info-box ul{padding-right:20px;padding-left:0;font-size:13px;line-height:2.1}.info-box li{margin:5px 0}.info-box strong{color:#f4d6a9}.room-invite-panel,#roomInvitePanel{padding:13px 20px;margin-bottom:18px;display:flex;align-items:center;justify-content:space-between;gap:10px}#roomCodeDisplay{font-family:monospace;font-size:22px;color:var(--thn-gold);letter-spacing:3px;margin:0 10px}#copyInviteBtn{width:auto;margin:0;font-size:12px}.collapsible-header{background:#392519;color:#eccc9a;border:1px solid var(--thn-border);border-radius:9px}.history-item,.role-badge,.phase-badge{background:#402b1c!important;color:#edd0a4;border-color:var(--thn-border)}.history-round{color:#ecb969}.phase-badge{border:1px solid var(--thn-border)}.player-name-badge{background:#342217;color:#ffe0ab;border-color:var(--thn-border);font-family:inherit}.modal{background:#120a07bf;backdrop-filter:blur(5px)}.modal-content h3{color:var(--thn-gold)}.modal-content p{color:var(--thn-muted)}.notification{background:#52371f;color:#ffebcc;border:1px solid #c89555;box-shadow:0 10px 30px #0005;font-family:inherit}.notification-error{background:#6e3024}.notification-success,.notification-safe{background:#344c2b}.announcement-safe-big,.announcement-death-big,.announcement-next-round{background:#3f2b1c;color:#ffe2b8;border:1px solid var(--thn-border);border-radius:12px}.center-announcement-overlay{background:#140d08cf}.winner-mafia{color:#ffb196}.winner-villagers{color:#c2dc9b}.winner-draw{color:#e7c086}.revote-notice,.not-voted-list,.vote-progress-container{background:#3b271a;color:#efd3ac;border-color:var(--thn-border)}.your-role,.win-reason{color:var(--thn-muted)}.timer-display{color:var(--thn-gold)}h2,h3,h4{color:var(--thn-text)}.card p[style*="color"],.role-card p[style*="color"]{color:var(--thn-muted)!important}.hidden-role{background:#392719;color:#f3d7ab}#reconnectSection{border-color:var(--thn-border)!important}#reconnectSection p{color:var(--thn-muted)!important}.voting-card.selected{border:2px solid var(--thn-gold)}:focus-visible{outline:3px solid #ebbf79;outline-offset:3px}
@media(max-width:650px){body.thn-game{padding:77px 15px 24px}.back-home{top:20px;right:18px;font-size:18px}header h1{font-size:37px}.entry-card{grid-template-columns:1fr}.entry-art{min-height:220px;background-position:25% 35%}.entry-art span{font-size:30px;bottom:20px}.entry-content{padding:24px}.entry-content h2{font-size:24px}.card,.role-card,.god-card,.modal-content{padding:22px}.entry-card{padding:0}.players-list{grid-template-columns:1fr}.readiness-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.role-card{padding:25px 20px}.role-card h2{font-size:29px}.btn{font-size:14px;padding:12px}.btn-reveal{font-size:24px}.god-card .button-group{flex-wrap:wrap}.modal-content{max-width:calc(100vw - 30px);width:95%}#roomInvitePanel{flex-wrap:wrap;padding:14px}#copyInviteBtn{padding:9px}.button-group{gap:8px}.back-home span{font-size:10px}.player-name-badge{font-size:12px;top:16px;left:14px}.info-box{padding:15px}.container{max-width:100%}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Final screen audit: moderator panel and compact roster share the same materials. */
.god-panel{background:linear-gradient(140deg,#3c291cec,#24170ff5);border:1px solid var(--thn-border);border-radius:20px;color:var(--thn-text);padding:30px;box-shadow:0 15px 55px #0005}.god-player-row{background:#2b1c13;color:var(--thn-text);border:1px solid var(--thn-border);border-radius:11px;box-shadow:none;margin-bottom:9px;padding:12px 16px}.god-player-row:hover{background:#3f2a1a}.player-name-compact{color:var(--thn-text);font-size:14px}.player-role-compact{background:#4b3320;color:#f5d4a5;border-color:#b88a4e66;font-size:12px}.player-role-compact.role-mafia{background:#653525;color:#ffd5b7}.player-role-compact.role-doctor{background:#334a31;color:#d4e5b9}.player-role-compact.role-detective{background:#574527;color:#f9dc98}.player-role-compact.role-villager{background:#4c3829;color:#edd4b6}.control-section{background:#22160f;border:1px solid var(--thn-border);color:var(--thn-text);border-radius:13px;padding:20px}.control-section .section-header{border-color:var(--thn-border);font-size:19px}.action-selection,.vote-results,.timer-display{background:#392619;border-color:var(--thn-border);color:#f0cea0}.action-selection h4{color:var(--thn-gold)}.view-votes-btn{background:#4d3523;color:#f8dfb7;border-color:var(--thn-border)}.readiness-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.readiness-card{display:grid;grid-template-columns:35px 1fr;grid-template-rows:auto auto;text-align:right;gap:2px 10px;min-height:86px;padding:14px}.readiness-icon{grid-row:1/3;align-self:center;margin:0;font-size:25px}.readiness-card .player-name{font-size:15px;text-align:right;margin:0}.readiness-card .readiness-status{grid-column:2;background:none;border:0;padding:0;margin:0;font-size:11px;text-align:right;box-shadow:none}.readiness-status:not(.readiness-card .readiness-status){padding:14px}.history-log{background:#1e140e;border-color:var(--thn-border)}.host-prompt-content,.voter-item,.vote-details-player,.my-votes-section{background:#322217;color:#f1d7b0;border-color:var(--thn-border)}
@media(max-width:650px){.god-panel{padding:20px}.god-player-row{padding:11px;font-size:12px;gap:8px}.control-section{padding:15px}.readiness-grid{gap:9px}.readiness-card{grid-template-columns:25px 1fr;padding:11px;min-height:78px;gap:3px 7px}.readiness-icon{font-size:20px}.readiness-card .player-name{font-size:14px}}
#votingGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;width:100%;margin:20px 0}.voting-card{display:flex;flex-direction:column;gap:10px;position:relative;min-width:0;min-height:155px;text-align:center;padding:19px!important;cursor:default}.voting-player-name{font-size:18px;font-weight:800;color:var(--thn-text);position:static;margin:0;line-height:1.5}.view-votes-btn{position:static!important;inset:auto!important;transform:none!important;width:100%;margin:0;padding:7px 10px;font-size:11px;background:#3b291d;color:#d6b78e;border:1px solid var(--thn-border);border-radius:8px;cursor:pointer}.cast-vote-btn{background:linear-gradient(115deg,#ebbc73,#ca8e44);color:#28180e;border:0;font-size:13px;font-weight:800;padding:10px;border-radius:8px;cursor:pointer;width:100%;margin-top:auto}.cast-vote-btn:hover{filter:brightness(1.12)}.player-vote-status,#playerVoteStatus,.vote-results,.vote-result-item,.my-votes-received{background:#342318;color:#f2d6b0;border:1px solid var(--thn-border);border-radius:11px}.player-vote-status span,#playerVoteStatus span{color:var(--thn-gold)}.vote-count-badge{position:static;margin:0 auto;background:#765029;color:#ffdfaa}.vote-progress-bar{background:#20140d}.vote-progress-fill{background:#d7a25a}.host-voting-prompt{background:#372515;color:#f0d7b0;border-color:var(--thn-border)}
@media(max-width:650px){#votingGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.voting-card{padding:14px!important;min-height:145px}.voting-player-name{font-size:16px}}