@import"https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800;900&family=Cinzel:wght@700;900&display=swap";*,*:before,*:after{box-sizing:border-box}body{margin:0}:root{--noise: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");--bg-base: #090909;--bg-top: #1a0506;--surface: #160408;--surface2: #200a0c;--card-bg: rgba(18,5,7,.97);--border: rgba(176,141,87,.14);--border-gold: rgba(176,141,87,.4);--border-red: rgba(123,17,19,.55);--text: #F2ECE4;--text2: #E7DED3;--muted: #7A6058;--muted2: #4A3028;--gold: #B08D57;--gold2: #C9A66B;--gold-dim: rgba(176,141,87,.25);--red: #7B1113;--red2: #A31621;--red-bright: #C9202E;--red-bg: rgba(123,17,19,.18);--ok-bg: rgba(45,85,50,.2);--ok-border: #3a6b40;--ok-text: #6ab872;--err: #C9202E;--btn-p-bg: linear-gradient(180deg, #8B1018 0%, #5E0A0F 55%, #3D0609 100%);--btn-p-hover: linear-gradient(180deg, #A31621 0%, #7B1113 55%, #5E0A0F 100%);--btn-p-border: rgba(201,166,107,.4);--btn-p-text: #F8F4EE;--btn-p-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 -1px 0 rgba(0,0,0,.45), 0 4px 12px rgba(0,0,0,.5);--btn-s-bg: linear-gradient(180deg, #221010 0%, #140406 100%);--btn-s-border: rgba(176,141,87,.35);--btn-s-text: #E7DED3;--btn-s-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 2px 6px rgba(0,0,0,.4);--radius: 10px;--radius-lg: 16px}body.light{--bg-base: #F2ECE4;--bg-top: #F2ECE4;--surface: #EDE3D4;--surface2: #E7DED3;--card-bg: rgba(245,241,235,.98);--border: rgba(42,11,13,.12);--border-gold: rgba(42,11,13,.28);--border-red: rgba(123,17,19,.4);--text: #1A1A1A;--text2: #0F0F10;--muted: #6B5040;--muted2: #9A8070;--gold: #8B6D3A;--gold2: #A07840;--gold-dim: rgba(139,109,58,.18);--red: #2A0B0D;--red2: #7B1113;--red-bright: #7B1113;--red-bg: rgba(123,17,19,.08);--ok-bg: rgba(30,90,60,.1);--ok-border: #2a6040;--ok-text: #1a5030;--err: #7B1113;--btn-p-bg: linear-gradient(180deg, #7B1113 0%, #560C0E 55%, #3D0609 100%);--btn-p-hover: linear-gradient(180deg, #9B1518 0%, #7B1113 55%, #560C0E 100%);--btn-p-border: rgba(42,11,13,.55);--btn-p-text: #F2ECE4;--btn-p-shadow: inset 0 1px 0 rgba(255,255,255,.12), inset 0 -1px 0 rgba(0,0,0,.28), 0 3px 8px rgba(0,0,0,.22);--btn-s-bg: linear-gradient(180deg, #E7DED3 0%, #D8CCBE 100%);--btn-s-border: rgba(42,11,13,.32);--btn-s-text: #1A1A1A;--btn-s-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 2px 5px rgba(0,0,0,.14)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{min-height:100vh;direction:rtl;color:var(--text);font-family:Amiri,serif;-webkit-font-smoothing:antialiased;background-color:#090909;background-image:var(--noise),radial-gradient(ellipse 90% 60% at 50% 0%,rgba(140,20,20,.28) 0%,transparent 55%),linear-gradient(180deg,#1a0506,#120304 45%,#090909);background-attachment:fixed;background-size:200px 200px,cover,cover}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;background:radial-gradient(ellipse at center,transparent 38%,rgba(0,0,0,.68) 100%);pointer-events:none}body.light{background-color:#f2ece4;background-image:var(--noise),repeating-linear-gradient(45deg,rgba(42,11,13,.012) 0px,rgba(42,11,13,.012) 1px,transparent 1px,transparent 8px),linear-gradient(180deg,#f2ece4,#ede3d4);background-attachment:fixed;background-size:200px 200px,auto,cover}body.light:after{background:radial-gradient(ellipse at center,transparent 55%,rgba(42,11,13,.08) 100%)}.app{min-height:100vh;position:relative;z-index:1}.game-wrapper{position:relative;min-height:100vh}.screen{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:24px 18px;overflow:hidden}.top-bar{position:fixed;top:14px;right:14px;z-index:500;display:flex;align-items:center;gap:6px}.theme-toggle,.lang-toggle{background:var(--btn-s-bg);border:1px solid var(--border-gold);color:var(--text);border-radius:100px;padding:5px 14px;font-size:12px;font-weight:700;font-family:Cinzel,serif;cursor:pointer;box-shadow:var(--btn-s-shadow);transition:border-color .2s;letter-spacing:.5px}.theme-toggle:hover,.lang-toggle:hover{border-color:var(--gold2)}.btn{display:flex;align-items:center;justify-content:center;padding:14px 26px;border-radius:var(--radius);font-family:Amiri,serif;font-size:17px;font-weight:700;letter-spacing:.5px;cursor:pointer;transition:background .18s,transform .15s;position:relative;overflow:hidden;outline:none}.btn:disabled{opacity:.42;cursor:not-allowed;transform:none!important}.btn:not(:disabled):active{transform:translateY(1px)!important}.btn:before{content:"";position:absolute;top:3px;right:3px;bottom:3px;left:3px;border-radius:calc(var(--radius) - 3px);border:1px solid rgba(255,255,255,.07);pointer-events:none}.btn-primary{background:var(--btn-p-bg);color:var(--btn-p-text);border:1px solid var(--btn-p-border);box-shadow:var(--btn-p-shadow)}.btn-primary:not(:disabled):hover{background:var(--btn-p-hover);transform:translateY(-1px)}.btn-secondary{background:var(--btn-s-bg);color:var(--btn-s-text);border:1px solid var(--btn-s-border);box-shadow:var(--btn-s-shadow)}.btn-secondary:not(:disabled):hover{border-color:var(--gold2);transform:translateY(-1px)}.btn-start,.btn-confirm{width:100%;margin-top:12px;padding:15px;background:var(--btn-p-bg);color:var(--btn-p-text);border:1px solid var(--btn-p-border);border-radius:var(--radius);font-family:Amiri,serif;font-size:18px;font-weight:900;letter-spacing:.5px;cursor:pointer;box-shadow:var(--btn-p-shadow);transition:background .18s,transform .15s;position:relative;overflow:hidden}.btn-start:before,.btn-confirm:before{content:"";position:absolute;top:3px;right:3px;bottom:3px;left:3px;border-radius:calc(var(--radius) - 3px);border:1px solid rgba(255,255,255,.07);pointer-events:none}.btn-start:disabled,.btn-confirm:disabled{opacity:.4;cursor:not-allowed}.btn-start:not(:disabled):hover,.btn-confirm:not(:disabled):hover{background:var(--btn-p-hover);transform:translateY(-1px)}.btn-confirm{margin-top:16px;font-size:17px}.btn-force-end{margin-top:18px;padding:12px 24px;background:var(--btn-s-bg);border:1px solid var(--border-red);border-radius:var(--radius);color:var(--red-bright);font-family:Amiri,serif;font-size:14px;font-weight:700;cursor:pointer;transition:background .18s;width:100%;max-width:420px;box-shadow:var(--btn-s-shadow)}.btn-force-end:hover{background:var(--red-bg)}.full{width:100%}.wide{width:100%;max-width:320px}.mt{margin-top:20px}.menu-screen{justify-content:center}.menu-content{position:relative;z-index:2;text-align:center;max-width:340px;width:100%;padding-top:16px;display:flex;flex-direction:column;align-items:center}.logo{display:flex;justify-content:center;margin-bottom:12px}.logo-img{width:220px;max-width:70vw;filter:drop-shadow(0 3px 10px rgba(0,0,0,.65));transition:filter .3s}body.light .logo-img{filter:drop-shadow(0 2px 7px rgba(42,11,13,.38))}.tagline{color:var(--muted);font-size:15px;font-weight:500;margin-bottom:36px;letter-spacing:2px;font-family:Cinzel,serif;text-transform:uppercase}[dir=rtl] .tagline{font-family:Cairo,sans-serif!important;letter-spacing:0px!important}.menu-buttons{display:flex;flex-direction:column;gap:12px;width:100%}.copyright{position:fixed;bottom:16px;left:50%;transform:translate(-50%);font-size:13px;color:var(--muted);font-family:Amiri,serif;letter-spacing:1.5px;white-space:nowrap;z-index:2;opacity:100%;text-shadow:0 1px .5px rgba(0,0,0,.9)}.form-screen{justify-content:center}.back-btn{position:fixed;top:18px;left:18px;z-index:400;background:var(--btn-s-bg);border:1px solid var(--border-gold);color:var(--muted);border-radius:var(--radius);font-family:Amiri,serif;font-size:14px;font-weight:600;cursor:pointer;padding:7px 14px;box-shadow:var(--btn-s-shadow);transition:border-color .2s}.back-btn:hover{color:var(--text);border-color:var(--gold2)}.form-card{position:relative;z-index:2;background:var(--card-bg);border:1px solid var(--border-gold);border-radius:var(--radius-lg);padding:36px 30px;width:100%;max-width:380px;box-shadow:0 6px 24px #00000080,inset 0 1px #ffffff0d}.form-card:before,.form-card:after{content:"";position:absolute;width:20px;height:20px;border-color:var(--gold);border-style:solid;opacity:.38}.form-card:before{top:10px;right:10px;border-width:2px 2px 0 0}.form-card:after{bottom:10px;left:10px;border-width:0 0 2px 2px}body.light .form-card{background:#f5f1ebfa;box-shadow:0 4px 16px #2a0b0d2e,inset 0 1px #fffc}.form-card h2{font-size:17px;font-weight:900;margin-bottom:28px;text-align:center;color:var(--gold);font-family:Cinzel,serif;letter-spacing:3px;text-transform:uppercase}body.light .form-card h2{color:var(--red2)}.input-group{margin-bottom:16px}.input-group label{display:block;font-size:10px;color:var(--muted);margin-bottom:8px;letter-spacing:2px;text-transform:uppercase;font-family:Amiri,serif;font-weight:700}[dir=rtl] .input-group label{letter-spacing:0px!important}[dir=rtl] .input-group input::placeholder{letter-spacing:0px!important}.input-group input{width:100%;background:#0a0304d1;border:1px solid var(--border-gold);border-radius:8px;padding:12px 14px;color:var(--text);font-family:Amiri,serif;font-size:16px;outline:none;box-shadow:inset 0 2px 8px #0006;transition:border-color .2s}body.light .input-group input{background:#e7ded3e6;color:#1a1a1a;box-shadow:inset 0 2px 4px #2a0b0d1a}.input-group input:focus{border-color:var(--red-bright)}.input-group input::placeholder{color:var(--muted2)}.code-input{letter-spacing:6px;font-size:22px;text-align:center}.error{color:var(--err);font-size:13px;margin:-6px 0 12px;text-align:center}.exit-btn{position:fixed;top:14px;left:14px;z-index:300;background:var(--btn-s-bg);border:1px solid var(--border-gold);color:var(--muted);border-radius:var(--radius);font-family:Amiri,serif;font-size:13px;font-weight:600;cursor:pointer;padding:6px 14px;box-shadow:var(--btn-s-shadow);transition:border-color .2s}.exit-btn:hover{border-color:var(--red-bright);color:var(--red-bright)}.end-game-btn{position:fixed;top:14px;left:14px;z-index:300;background:var(--btn-s-bg);border:1px solid var(--border-red);color:var(--red-bright);border-radius:var(--radius);padding:6px 14px;font-size:12px;font-weight:700;font-family:Amiri,serif;cursor:pointer;box-shadow:var(--btn-s-shadow);transition:background .2s;white-space:nowrap}.end-game-btn:hover{background:var(--red-bg)}.player-name-tag{position:fixed;top:14px;right:14px;z-index:300;background:var(--btn-s-bg);border:1px solid var(--border-gold);border-radius:100px;padding:5px 14px;box-shadow:var(--btn-s-shadow)}.pnt-name{font-size:13px;font-weight:700;color:var(--text)}.lobby-screen{justify-content:flex-start;padding-top:60px;align-items:center}.room-code-banner{text-align:center;margin-bottom:24px;position:relative;z-index:2}.room-code-banner .code-label{display:block;font-size:9px;color:var(--muted);letter-spacing:4px;text-transform:uppercase;font-family:Cinzel,serif;margin-bottom:8px}.code-value-row{display:flex;align-items:center;justify-content:center;gap:10px}.room-code-banner .code-value{font-size:36px;font-weight:900;letter-spacing:10px;color:var(--gold);font-family:Cinzel,serif;text-shadow:0 2px 5px rgba(0,0,0,.5);line-height:1;word-break:keep-all;white-space:nowrap;display:flex;justify-content:center;align-items:center;padding-right:10px}body.light .room-code-banner .code-value{color:var(--red2);text-shadow:0 1px 3px rgba(42,11,13,.25)}.code-copy-btn{background:transparent;border:none;padding:6px;cursor:pointer;color:var(--gold);display:flex;align-items:center;justify-content:center;transition:transform .2s ease,opacity .2s ease;flex-shrink:0;box-shadow:none}.code-copy-btn:hover{background:transparent;opacity:.7;transform:scale(1.15)}.code-copy-btn:active{transform:scale(.9)}body.light .code-copy-btn{color:var(--red2);border:none}body.light .code-copy-btn:hover{background:transparent}.room-code-banner .code-hint{display:block;font-size:12px;color:var(--muted);margin-top:8px}.lobby-body{width:100%;max-width:480px;display:flex;flex-direction:column;align-items:center;position:relative;z-index:2}.lobby-body .section{width:100%}.section{margin-bottom:24px}.section-title{font-size:11px;color:var(--muted);letter-spacing:2px;text-transform:uppercase;font-family:Amiri,serif;font-weight:700;margin-bottom:12px;word-break:keep-all}.lobby-tabs{display:flex;margin-bottom:18px;background:#0a0304d1;border-radius:10px;padding:3px;border:1px solid var(--border-gold);width:100%}body.light .lobby-tabs{background:#e7ded3d1}.lobby-tab{flex:1;padding:9px;border:none;border-radius:8px;background:none;color:var(--muted);font-family:Amiri,serif;font-size:14px;font-weight:700;cursor:pointer;transition:all .18s}.lobby-tab.active{background:var(--btn-p-bg);color:var(--btn-p-text);border:1px solid var(--btn-p-border);box-shadow:var(--btn-p-shadow)}.players-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:10px}.player-card{background:var(--card-bg);border:1px solid var(--border);border-radius:12px;padding:12px 8px;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:0 2px 8px #0000004d}.player-card.me{border-color:var(--gold)}body.light .player-card{background:#f5f1ebf5;border-color:var(--border-gold)}body.light .player-card.me{border-color:var(--red2)}.player-card.offline{opacity:.35}.player-avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--red2),var(--gold));display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;color:#f2ece4}.player-name{font-size:12px;text-align:center;word-break:break-word;color:var(--text)}.host-crown{font-size:10px;color:var(--gold);font-weight:700;font-family:Cinzel,serif}body.light .host-crown{color:var(--red2)}.kick-btn{background:none;border:none;cursor:pointer;color:var(--red-bright);font-size:11px;font-weight:700;padding:2px 6px;border-radius:4px}.kick-btn:hover{background:var(--red-bg)}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px;width:100%}.role-counter{background:var(--card-bg);border:1px solid var(--rc, var(--border-gold));border-radius:12px;padding:14px 10px;display:flex;flex-direction:column;align-items:center;gap:10px;box-shadow:0 2px 8px #00000040}body.light .role-counter{background:#f5f1ebf5}.rc-label{font-size:13px;font-weight:700;color:var(--text);font-family:Amiri,serif}.rc-controls{display:flex;align-items:center;gap:6px}.rc-controls button{width:30px;height:30px;background:transparent;border:none;color:var(--rc, var(--gold));font-size:26px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s ease,opacity .2s ease;line-height:1;font-weight:900;box-shadow:none}.rc-controls button:hover{background:transparent;opacity:.7;transform:scale(1.2)}.rc-controls button:active{transform:scale(.9)}body.light .rc-controls button{color:var(--rc, var(--red2));border:none}body.light .rc-controls button:hover{background:transparent;color:var(--rc, var(--red2))}.rc-controls span{font-size:22px;font-weight:900;min-width:28px;text-align:center;color:var(--text)}.rc-fixed{font-size:22px;font-weight:900;color:var(--rc, var(--gold))}.citizen-count{background:var(--card-bg);border:1px solid var(--rc, var(--border-gold));border-radius:12px;padding:14px;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:0 2px 8px #00000040}body.light .citizen-count{background:#f5f1ebf5}.citizen-count span:first-child{font-size:13px;font-weight:700;color:var(--text);font-family:Amiri,serif}.big-num{font-size:30px;font-weight:900;color:var(--rc, var(--gold))}.big-num.red{color:var(--red-bright)}.game-settings{margin:14px 0 4px;background:var(--card-bg);border-radius:12px;padding:2px 14px;border:1px solid var(--border-gold);box-shadow:0 2px 8px #00000040}body.light .game-settings{background:#f5f1ebf5}.setting-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border)}.setting-toggle-row:last-child{border-bottom:none}.setting-toggle-label{font-size:13px;color:var(--text);flex:1;padding-inline-end:12px;font-family:Amiri,serif}.toggle-switch{width:46px;height:26px;border-radius:13px;border:none;background:#ffffff17;position:relative;cursor:pointer;transition:background .2s;padding:0;flex-shrink:0}.toggle-switch.on{background:var(--red2)}.toggle-switch:disabled{opacity:.5;cursor:default}body.light .toggle-switch{background:#2a0b0d1f}body.light .toggle-switch.on{background:var(--red2)}.toggle-thumb{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #00000059;transition:left .2s;pointer-events:none}.toggle-switch.on .toggle-thumb{left:23px}.sound-pack-row{display:flex;align-items:center;gap:10px;margin:14px 0 4px;flex-wrap:wrap}.sound-pack-label{font-size:11px;color:var(--muted);letter-spacing:1px;text-transform:uppercase;font-family:Amiri,serif;font-weight:700}.sound-pack-btns{display:flex;gap:6px}.sound-pack-btn{padding:5px 14px;border-radius:100px;font-size:13px;font-weight:600;cursor:pointer;background:var(--btn-s-bg);border:1px solid var(--border-gold);color:var(--muted);box-shadow:var(--btn-s-shadow);transition:all .15s}.sound-pack-btn.active{background:var(--btn-p-bg);border-color:var(--btn-p-border);color:var(--btn-p-text);box-shadow:var(--btn-p-shadow)}.sound-pack-btn:disabled{cursor:default}.waiting-block{text-align:center;padding:28px 0;color:var(--muted)}.dots{display:flex;gap:6px;justify-content:center;margin-bottom:12px}.dots span{width:7px;height:7px;border-radius:50%;background:var(--red2);animation:bounce 1.2s infinite}.dots span:nth-child(2){animation-delay:.2s}.dots span:nth-child(3){animation-delay:.4s}@keyframes bounce{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-8px)}}.card-flip-wrapper{perspective:1200px;cursor:pointer;width:min(255px,70vw);aspect-ratio:3 / 4.6;position:relative;flex-shrink:0;-webkit-tap-highlight-color:transparent;will-change:transform;filter:drop-shadow(0 6px 18px rgba(0,0,0,.45)) drop-shadow(0 2px 4px rgba(0,0,0,.25))}body.light .card-flip-wrapper{filter:drop-shadow(0 5px 14px rgba(42,11,13,.3)) drop-shadow(0 2px 4px rgba(42,11,13,.15))}.card-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.45,.05,.55,.95);will-change:transform;transform:translateZ(0)}.card-flip-wrapper.flipped .card-inner{transform:rotateY(180deg)}.card-front,.card-back{position:absolute;top:0;right:0;bottom:0;left:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:var(--radius-lg);overflow:hidden;border:none!important;outline:none;background:transparent;box-shadow:none!important;will-change:transform;-webkit-transform:translate3d(0,0,0);transform:translateZ(0)}.card-front{transform:rotateY(0) translateZ(1px);-webkit-transform:rotateY(0deg) translateZ(1px)}.card-back{transform:rotateY(180deg) translateZ(1px);-webkit-transform:rotateY(180deg) translateZ(1px)}.card-front img,.card-back img{width:100%;height:100%;object-fit:contain;object-position:center;display:block;border-radius:var(--radius-lg);transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden}.card-hint-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:transparent;display:flex;align-items:flex-end;justify-content:center;padding-bottom:18px;border-radius:var(--radius-lg);pointer-events:none;z-index:2}.card-hint-text{color:#ffffffe0;font-size:12px;font-weight:600;text-align:center;background:#00000080;padding:5px 16px;border-radius:100px;letter-spacing:.5px;border:1px solid rgba(255,255,255,.1);font-family:Amiri,serif}.reveal-screen{justify-content:center;gap:18px;padding-top:56px;padding-bottom:24px}.role-label-sm{font-size:13px;color:var(--muted);text-align:center;position:relative;z-index:2;font-family:Amiri,serif}.muted-wait{color:var(--muted);font-size:14px;text-align:center;position:relative;z-index:2;font-family:Amiri,serif}.night-screen{background:var(--noise),radial-gradient(ellipse 80% 50% at 50% 0%,rgba(100,15,15,.2) 0%,transparent 50%),linear-gradient(180deg,#100308,#04020a)!important;background-size:200px 200px,cover,cover!important;justify-content:center}.eyes-closed-screen{display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center;position:relative;z-index:2}.eyes-closed-screen h2{font-size:22px;font-weight:800;color:#b08d57;font-family:Amiri,serif}.eyes-hint{font-size:14px;color:#b08d57a6;font-family:Amiri,serif}.moon-icon{width:44px;height:44px;border-radius:50%;background:transparent;box-shadow:-10px 0 0 8px #b08d57;animation:float 3s ease-in-out infinite}.closed-eye-big{width:54px;height:22px;border:2px solid rgba(176,141,87,.6);border-radius:50%;position:relative;overflow:hidden}.closed-eye-big:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:80%;height:65%;background:#050210;border-radius:50%}.dead-icon{width:44px;height:44px;border-radius:50%;border:2px solid rgba(176,141,87,.55);display:flex;align-items:center;justify-content:center;color:#b08d57;font-size:20px;font-family:Cinzel,serif;font-weight:900}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.close-eyes-overlay{background:var(--noise),linear-gradient(180deg,#0c0205,#04020a)!important;background-size:200px 200px,cover!important;justify-content:center!important;animation:fadeBlack .25s ease}.close-eyes-overlay .overlay-eye{width:64px;height:26px;border:2px solid rgba(176,141,87,.55);border-radius:50%;position:relative;overflow:hidden;animation:float 2s ease-in-out infinite}.close-eyes-overlay .overlay-eye:after{content:"";position:absolute;bottom:-12px;left:50%;transform:translate(-50%);width:80%;height:70%;background:#04020a;border-radius:50%}.close-eyes-overlay p{font-size:20px;font-weight:700;color:#b08d57;margin-top:18px;font-family:Amiri,serif}@keyframes fadeBlack{0%{opacity:0}to{opacity:1}}.active-role{justify-content:flex-start;padding-top:60px}.your-turn-header{display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--rc, var(--red2)) 14%,transparent);border:1px solid var(--rc, var(--red2));border-radius:var(--radius);padding:16px 24px;font-size:17px;font-weight:800;color:var(--rc, var(--red-bright));margin-bottom:24px;width:100%;max-width:420px;text-align:center;font-family:Amiri,serif;position:relative;z-index:2}.target-section{width:100%;max-width:420px;position:relative;z-index:2}.target-list{display:flex;flex-direction:column;gap:10px}.target-btn{background:#ffffff0a;border:1px solid rgba(255,255,255,.09);border-radius:var(--radius);padding:14px 18px;color:#d0d0c0;font-family:Amiri,serif;font-size:16px;font-weight:600;cursor:pointer;transition:background .2s;text-align:right;width:100%;box-shadow:0 2px 7px #00000047}.target-btn:hover{background:#ffffff14;border-color:#ffffff29}.target-btn.selected{border-color:var(--gold);background:#b08d571a;color:var(--gold)}.target-btn.blocked{opacity:.3;cursor:not-allowed;border-style:dashed!important}.self-tag{font-size:11px;color:var(--gold);margin-right:6px}.blocked-tag{font-size:11px;color:var(--red-bright);margin-right:auto}.submitted-wait{text-align:center;padding:30px 0;display:flex;flex-direction:column;align-items:center;gap:14px;position:relative;z-index:2}.submitted-wait p{color:#b08d5799;font-size:14px;font-family:Amiri,serif}.doctor-restriction{background:#b08d5717;border:1px solid rgba(176,141,87,.28);border-radius:var(--radius);padding:10px 14px;font-size:13px;color:var(--gold);margin-bottom:14px;text-align:center;width:100%;max-width:420px;position:relative;z-index:2;font-family:Amiri,serif}.cop-verdict{display:flex;align-items:center;gap:14px;padding:18px 20px;border-radius:var(--radius-lg);border:1px solid;margin-top:16px;animation:popIn .35s ease;width:100%;max-width:340px;position:relative;z-index:2;box-shadow:0 3px 12px #00000061}.cop-verdict.evil{background:#7b11132e;border-color:var(--red-bright)}.cop-verdict.good{background:var(--ok-bg);border-color:var(--ok-border)}.cop-verdict-icon{width:34px;height:34px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;color:#fff;font-family:Cinzel,serif}.cop-verdict.evil .cop-verdict-icon{background:var(--red-bright)}.cop-verdict.good .cop-verdict-icon{background:var(--ok-border)}.cop-name{font-size:19px;font-weight:800;margin-bottom:4px;font-family:Amiri,serif}.cop-status{font-size:13px;font-family:Amiri,serif}.cop-verdict.evil .cop-name{color:var(--red-bright)}.cop-verdict.evil .cop-status{color:#ff9696d9}.cop-verdict.good .cop-name,.cop-verdict.good .cop-status{color:var(--ok-text)}.cop-countdown{position:relative;width:42px;height:42px;flex-shrink:0;display:flex;align-items:center;justify-content:center}.cop-ring{width:42px;height:42px;position:absolute;top:0;left:0}.cop-verdict.evil .cop-ring{color:var(--red-bright)}.cop-verdict.good .cop-ring{color:var(--ok-text)}.cop-countdown span{font-size:14px;font-weight:900;position:relative;z-index:1;color:#d0d0c0;font-family:Cinzel,serif}.mafia-tap-hint{font-size:12px;color:#b08d578c;text-align:center;margin-bottom:12px;font-family:Amiri,serif}.mafia-vote-btn{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-radius:var(--radius);background:#ffffff0a;border:1px solid rgba(255,255,255,.09);color:#d0d0c0;font-family:Amiri,serif;font-size:16px;font-weight:600;cursor:pointer;transition:background .2s;width:100%;box-shadow:0 2px 7px #00000047}.mafia-vote-btn.selected{border-color:var(--red-bright);background:#7b111324}.mafia-vote-btn:hover{border-color:#ffffff2e}.mvb-name{position:relative;z-index:1}.mvb-count{position:relative;z-index:1;font-size:13px;font-weight:800;color:#b08d5780;min-width:36px;text-align:left;font-family:Cinzel,serif}.mvb-count.has-votes{color:#c85050e6}.mvb-bar{position:absolute;top:0;right:0;bottom:0;background:#7b11131f;transition:width .35s ease;z-index:0}.mvb-right{display:flex;align-items:center;gap:6px;position:relative;z-index:1}.mvb-confirmed{font-size:11px;font-weight:800;color:var(--ok-text);background:#2d553233;border-radius:100px;padding:2px 7px;border:1px solid rgba(45,85,50,.4);font-family:Cinzel,serif}.day-screen{justify-content:flex-start;padding-top:60px}.day-header{text-align:center;margin-bottom:20px;position:relative;z-index:2}.day-header h2{font-size:20px;font-weight:900;color:var(--gold);font-family:Cinzel,serif;letter-spacing:2px;text-transform:uppercase}body.light .day-header h2{color:var(--red2)}.day-message-box{background:var(--card-bg);border:1px solid var(--border-gold);border-radius:var(--radius-lg);padding:18px 20px;text-align:center;font-size:15px;line-height:1.8;margin-bottom:22px;width:100%;max-width:420px;box-shadow:0 3px 12px #0000004d;position:relative;z-index:2;font-family:Amiri,serif}body.light .day-message-box{background:#f5f1ebf7}.status-list{display:flex;flex-direction:column;gap:8px;width:100%;max-width:420px;position:relative;z-index:2}.status-row{display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--card-bg);border:1px solid var(--border-gold);border-radius:var(--radius);font-size:14px;box-shadow:0 2px 7px #00000040;font-family:Amiri,serif}body.light .status-row{background:#f5f1ebf5}.status-row.dead{opacity:.35;text-decoration:line-through}.status-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;background:var(--ok-text)}.status-row.dead .status-dot{background:var(--muted2);border-radius:1px;width:10px;height:2px}.sname{flex:1;color:var(--text)}.you-badge{font-size:10px;color:var(--gold);padding:2px 8px;background:#b08d571a;border-radius:100px;border:1px solid rgba(176,141,87,.26);font-family:Cinzel,serif}body.light .you-badge{color:var(--red2);background:#7b111312;border-color:#7b111333}.killed-role-badge{display:inline-block;margin-top:10px;font-size:13px;font-weight:700;padding:4px 14px;border-radius:100px;background:#ffffff0a;border:1px solid currentColor;font-family:Amiri,serif}.host-cta{text-align:center;margin-top:20px;display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;position:relative;z-index:2}.muted-sm{font-size:12px;color:var(--muted);font-family:Amiri,serif}.vote-screen{justify-content:flex-start;padding-top:60px}.vote-header{text-align:center;margin-bottom:24px;position:relative;z-index:2}.vote-header h2{font-size:20px;font-weight:900;color:var(--gold);font-family:Cinzel,serif;letter-spacing:2px;text-transform:uppercase}body.light .vote-header h2{color:var(--red2)}.vote-header p{color:var(--muted);font-size:13px;margin-top:4px;font-family:Amiri,serif}.vote-list{display:flex;flex-direction:column;gap:10px;width:100%;max-width:420px;position:relative;z-index:2}.vote-btn{display:flex;align-items:center;justify-content:space-between;background:var(--card-bg);border:1px solid var(--border-gold);border-radius:var(--radius);padding:14px 18px;color:var(--text);font-family:Amiri,serif;font-size:15px;font-weight:600;cursor:pointer;transition:border-color .2s,transform .15s;width:100%;box-shadow:0 2px 8px #00000040}body.light .vote-btn{background:#f5f1ebf5}.vote-btn:hover{border-color:var(--gold2);transform:translateY(-1px)}.vote-btn.selected{border-color:var(--red-bright);background:var(--red-bg)}.vname{flex:1;text-align:right;color:var(--text)}.vcount{font-size:13px;color:var(--muted);padding-inline-start:10px;font-family:Cinzel,serif}.tally-section{width:100%;max-width:420px;position:relative;z-index:2}.voted-msg{text-align:center;color:var(--gold);margin-bottom:18px;font-size:13px;font-family:Cinzel,serif;letter-spacing:1px;text-transform:uppercase}body.light .voted-msg{color:var(--red2)}.tally-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:13px}.tname{width:80px;text-align:right;color:var(--text);font-family:Amiri,serif}.tcount{font-size:13px;color:var(--muted);min-width:20px;text-align:center;font-family:Cinzel,serif}.tbar-wrap{flex:1;height:6px;background:#ffffff0f;border-radius:3px;overflow:hidden}.tbar{height:100%;background:linear-gradient(90deg,var(--red2),var(--red-bright));border-radius:3px;transition:width .5s ease}.skip-tally .skip-bar{background:linear-gradient(90deg,var(--gold),var(--gold2))}.vote-footer{margin-top:18px;padding:8px 18px;background:var(--card-bg);border:1px solid var(--border-gold);border-radius:100px;font-size:12px;color:var(--muted);box-shadow:var(--btn-s-shadow);font-family:Cinzel,serif;position:relative;z-index:2}.skip-btn{border-style:dashed!important;opacity:.75}.skip-btn:hover{opacity:1}.selected-skip{border-color:var(--gold)!important;background:#b08d5717!important;border-style:solid!important;opacity:1}.result-screen{justify-content:center;gap:16px}.result-card{position:relative;background:var(--card-bg);border:1px solid var(--rc, var(--border-gold));border-radius:var(--radius-lg);padding:36px 28px;text-align:center;width:100%;max-width:340px;z-index:2;box-shadow:0 6px 20px #00000073}.result-card:before,.result-card:after{content:"";position:absolute;width:18px;height:18px;border-color:var(--rc, var(--gold));border-style:solid;opacity:.38}.result-card:before{top:10px;right:10px;border-width:2px 2px 0 0}.result-card:after{bottom:10px;left:10px;border-width:0 0 2px 2px}body.light .result-card{background:#f5f1ebfa}.tie-card{--rc: var(--gold)}.result-label{font-size:9px;color:var(--muted);letter-spacing:4px;text-transform:uppercase;font-family:Cinzel,serif;margin-bottom:14px}.elim-name{display:block;font-size:30px;font-weight:900;margin-bottom:12px;color:var(--text);font-family:Amiri,serif}.elim-role{font-size:16px;font-weight:700;margin-bottom:14px;font-family:Amiri,serif}.game-verdict{padding:10px 16px;border-radius:var(--radius);font-size:14px;font-weight:800;margin-top:8px;font-family:Amiri,serif}.mafia-found{background:var(--ok-bg);border:1px solid var(--ok-border);color:var(--ok-text)}.not-mafia{background:var(--red-bg);border:1px solid var(--red-bright);color:var(--red-bright)}.continue-msg{color:var(--muted);margin-top:8px;font-size:13px;font-family:Amiri,serif}.gameover-screen{justify-content:flex-start;padding-top:70px;gap:20px}.winner-card{position:relative;text-align:center;width:100%;max-width:420px;padding:36px 28px;border-radius:var(--radius-lg);border:1px solid;z-index:2}.winner-card:before,.winner-card:after{content:"";position:absolute;width:20px;height:20px;border-style:solid;opacity:.38}.winner-card:before{top:10px;right:10px;border-width:2px 2px 0 0}.winner-card:after{bottom:10px;left:10px;border-width:0 0 2px 2px}.winner-card.mafia{background:#120507f5;border-color:var(--red-bright);box-shadow:0 6px 20px #00000080}.winner-card.mafia:before,.winner-card.mafia:after{border-color:var(--red-bright)}.winner-card.citizens{background:#0c0803f5;border-color:var(--gold);box-shadow:0 6px 20px #00000080}.winner-card.citizens:before,.winner-card.citizens:after{border-color:var(--gold)}body.light .winner-card.mafia,body.light .winner-card.citizens{background:#f5f1ebfa;box-shadow:0 4px 14px #2a0b0d33}.winner-label{font-size:9px;color:var(--muted);letter-spacing:4px;text-transform:uppercase;font-family:Cinzel,serif;margin-bottom:16px}.winner-card h1{font-size:22px;font-weight:900;margin-bottom:8px;color:var(--text);font-family:Cinzel,serif;letter-spacing:1px}.w-you{font-size:15px;color:var(--muted);font-family:Amiri,serif}.final-roles{width:100%;max-width:420px;position:relative;z-index:2}.final-roles-title{font-size:9px;color:var(--muted);text-align:center;letter-spacing:4px;margin-bottom:14px;text-transform:uppercase;font-family:Cinzel,serif}.final-row{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--card-bg);border-radius:var(--radius);margin-bottom:8px;border:1px solid var(--border-gold);border-inline-end:3px solid var(--rc, var(--border-gold));font-size:14px;font-family:Amiri,serif;box-shadow:0 2px 6px #00000038}body.light .final-row{background:#f5f1ebf5}.frole{color:var(--rc, var(--gold));font-weight:700}.dead-marker{font-size:10px;color:var(--muted);font-weight:700;font-family:Cinzel,serif}.loading{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px}.loading-logo-img{width:190px;max-width:65vw;filter:drop-shadow(0 3px 10px rgba(0,0,0,.6));animation:logoPulse 2s ease-in-out infinite}body.light .loading-logo-img{filter:drop-shadow(0 2px 7px rgba(42,11,13,.35))}.loading-text{font-size:10px;color:var(--muted);letter-spacing:5px;text-transform:uppercase;font-family:Cinzel,serif}.spinner{width:42px;height:42px;border-radius:50%;border:2px solid rgba(176,141,87,.12);border-top-color:var(--gold);animation:spin .9s linear infinite}body.light .spinner{border-color:#2a0b0d1a;border-top-color:var(--red2)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes logoPulse{0%,to{opacity:1}50%{opacity:.6}}.reconnecting-banner{position:fixed;top:16px;left:50%;transform:translate(-50%);background:#a0780024;border:1px solid rgba(160,130,0,.3);color:#c8aa50e6;border-radius:100px;padding:7px 18px;font-size:12px;font-weight:600;z-index:501;white-space:nowrap;animation:slideDown .3s ease;font-family:Cinzel,serif;letter-spacing:1px}.toast-banner{position:fixed;top:16px;left:50%;transform:translate(-50%);background:var(--red-bg);border:1px solid var(--border-red);color:var(--red-bright);border-radius:100px;padding:7px 18px;font-size:12px;font-weight:600;z-index:500;white-space:nowrap;animation:slideDown .3s ease,fadeAway .5s ease 3s forwards;font-family:Amiri,serif}@keyframes slideDown{0%{opacity:0;transform:translate(-50%) translateY(-12px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes fadeAway{to{opacity:0;pointer-events:none}}@keyframes popIn{0%{transform:scale(.88);opacity:0}to{transform:scale(1);opacity:1}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:var(--surface)}::-webkit-scrollbar-thumb{background:var(--border-gold);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:var(--gold)}.form-card,.player-card,.vote-btn,.target-btn,.mafia-vote-btn,.status-row,.day-message-box,.result-card,.winner-card,.final-row,.game-settings,.lobby-tabs,.lobby-tab,.role-counter,.citizen-count,.vote-footer{transition:background .25s ease,border-color .25s ease,color .25s ease}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}:lang(ar) .code-value,:lang(ar) .code-label,:lang(ar) .winner-label,:lang(ar) .final-roles-title,:lang(ar) .result-label,:lang(ar) .voted-msg,:lang(ar) .vote-footer,:lang(ar) .loading-text,:lang(ar) .copyright,:lang(ar) .you-badge,:lang(ar) .host-crown,:lang(ar) .info-modal-title,:lang(ar) .tagline{font-family:Cairo,sans-serif!important;letter-spacing:.5px!important;word-break:keep-all}.section-header-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.section-header-row .section-title{margin-bottom:0}.info-btn{width:22px;height:22px;border-radius:50%;background:transparent;border:1px solid var(--border-gold);color:var(--gold);font-size:12px;font-weight:900;font-family:Cinzel,serif;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:background .18s,border-color .18s;line-height:1}.info-btn:hover{background:var(--gold-dim);border-color:var(--gold2)}body.light .info-btn{border-color:var(--border-gold);color:var(--red2)}body.light .info-btn:hover{background:#7b111314;border-color:var(--red2)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:#04020ad1;display:flex;align-items:center;justify-content:center;padding:24px;animation:fadeIn .18s ease}body.light .modal-overlay{background:#2a0b0d8c}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.info-modal{background:var(--card-bg);border:1px solid var(--border-gold);border-radius:var(--radius-lg);padding:28px 24px;width:100%;max-width:340px;box-shadow:0 8px 32px #0009;position:relative;animation:popIn .22s ease}.info-modal:before,.info-modal:after{content:"";position:absolute;width:16px;height:16px;border-color:var(--gold);border-style:solid;opacity:.38}.info-modal:before{top:8px;right:8px;border-width:2px 2px 0 0}.info-modal:after{bottom:8px;left:8px;border-width:0 0 2px 2px}body.light .info-modal{background:#f5f1ebfc;box-shadow:0 6px 24px #2a0b0d38}.info-modal-title{font-size:13px;font-weight:900;color:var(--gold);font-family:Cinzel,serif;letter-spacing:3px;text-transform:uppercase;text-align:center;margin-bottom:20px}body.light .info-modal-title{color:var(--red2)}.info-role-item{display:flex;flex-direction:column;gap:3px;padding:12px 0;border-bottom:1px solid var(--border)}.info-role-item:last-of-type{border-bottom:none}.info-role-label{font-size:14px;font-weight:800;color:var(--rc, var(--gold));font-family:Amiri,serif}.info-role-desc{font-size:12px;color:var(--muted);font-family:Amiri,serif;line-height:1.5}.info-modal-close{width:100%;margin-top:18px;padding:10px;background:var(--btn-p-bg);color:var(--btn-p-text);border:1px solid var(--btn-p-border);border-radius:var(--radius);font-family:Amiri,serif;font-size:14px;font-weight:700;cursor:pointer;box-shadow:var(--btn-p-shadow);transition:background .18s}.info-modal-close:hover{background:var(--btn-p-hover)}[dir=rtl] *:not(.code-value):not(.code-input){letter-spacing:0px!important}[dir=rtl] .code-value,[dir=rtl] .code-input{letter-spacing:8px!important;direction:ltr!important}