@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#101114;--panel:#18191e;--line:#2c2d32;--muted:#9999a6;--gold:#e1bd7d;--red:#b4424c;--green:#8dc8ad;--safe:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#f1eee9;font:14px 'DM Sans',sans-serif}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:4px}button{transition:background .2s,transform .2s}button:hover:not(:disabled){filter:brightness(1.13)}a{color:inherit;text-decoration:none}.shell{max-width:1600px;margin:auto;min-height:100vh;display:grid;grid-template-columns:232px 1fr}.sidebar{border-right:1px solid var(--line);padding:38px 25px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:12px;font-family:Manrope,sans-serif;font-size:24px;font-weight:800;letter-spacing:3px}.brand small{font-size:8px;color:var(--muted);letter-spacing:2px;display:block;margin-top:4px}.brand-mark{width:42px;height:48px;display:grid;place-items:center;border:1px solid #89734e;border-radius:13px 13px 22px 22px;color:var(--gold);font-family:Georgia;font-size:31px;letter-spacing:-5px;padding-right:5px;background:linear-gradient(140deg,#3e3324,#171719)}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:var(--gold)}.menu-label{color:#70717d;margin:61px 14px 15px}.nav-item{display:flex;gap:13px;align-items:center;padding:15px;border-radius:8px;margin-bottom:6px;color:var(--muted);font-weight:500}.nav-item.active{background:#2b2521;color:var(--gold)}.nav-item svg{width:19px;height:19px}.sidebar-note{margin-top:auto;border:1px solid var(--line);border-radius:14px;padding:18px;background:radial-gradient(ellipse at top right,#3a2725,transparent 80%)}.sidebar-note p{line-height:1.8;color:#d6c8bb}.sidebar-note small{font-size:10px;color:var(--muted)}.tiny-moon{font-size:28px;color:var(--gold)}.workspace{min-width:0;padding:0 40px}header{height:93px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:12px}.breadcrumb{font-size:10px;letter-spacing:1.4px;color:#7d7e87}.breadcrumb span{margin:0 13px;color:#4c4c54}.breadcrumb b{font-weight:500;color:#d6d3d0}.header-right{display:flex;align-items:center;gap:20px}.status{font-size:11px;color:var(--muted)}.status:before{content:'';display:inline-block;width:6px;height:6px;background:var(--green);border-radius:50%;margin-right:8px}.avatar{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#383144;color:#ddc7e8;font:700 15px Manrope;border:2px solid #51465f}.avatar.small{width:34px;height:34px;font-size:11px;background:#3b3328;border-color:#635238;color:var(--gold)}main{padding-top:32px;min-height:calc(100vh - 155px)}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:Manrope,sans-serif}h1{font-size:30px;letter-spacing:-1.1px;margin-bottom:10px;font-weight:800}h2{font-size:19px;letter-spacing:-.4px}h3{font-size:16px}.muted{color:var(--muted);line-height:1.7}.page-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px;gap:18px}.page-heading p{margin-bottom:0}.pill{font-size:10px;color:var(--gold);border:1px solid #665239;border-radius:20px;padding:7px 11px;white-space:nowrap}.hero{overflow:hidden;position:relative;min-height:260px;border:1px solid #5d383a;border-radius:18px;background:radial-gradient(ellipse at 75% 40%,#663239 0%,#392127 35%,#221b21 75%);padding:34px;margin-bottom:25px}.hero-content{position:relative;z-index:2;width:60%}.hero h2{font-family:Georgia,serif;font-weight:400;font-size:41px;line-height:1.13;letter-spacing:-1px;margin:14px 0}.hero p{color:#c0a8ab;font-size:12px;margin-bottom:23px;max-width:310px;line-height:1.7}.hero-art{position:absolute;right:0;bottom:0;width:46%;height:100%;opacity:.9}.moon{position:absolute;right:24%;top:34px;width:100px;height:100px;border-radius:50%;background:linear-gradient(140deg,#e6cfa0,#a47564);box-shadow:0 0 70px #d08b6860}.skyline{position:absolute;bottom:0;right:0;left:0;height:125px;display:flex;align-items:end;gap:7px;opacity:.5}.skyline i{flex:1;background:repeating-linear-gradient(0deg,transparent 0px,transparent 18px,#a76e4b22 18px,#a76e4b22 23px),#1b1820;height:70%}.skyline i:nth-child(2n){height:95%}.skyline i:nth-child(3n){height:50%}.silhouette{position:absolute;bottom:-15px;left:20%;width:180px;height:155px;background:#15141c;border-radius:50% 50% 0 0;transform:rotate(-4deg)}.silhouette:before{content:'';position:absolute;top:-72px;left:55px;width:70px;height:100px;background:#15141c;border-radius:30px 30px 40px 40px}.hat{position:absolute;bottom:213px;left:calc(20% + 30px);width:127px;height:13px;border-radius:50%;background:#12121a;transform:rotate(-8deg)}.hat:before{content:'';position:absolute;width:76px;height:45px;background:#15141c;bottom:4px;left:24px;border-radius:15px 15px 0 0;border-bottom:8px solid #442730}.primary,.secondary,.ghost{padding:13px 18px;border-radius:8px;font-size:12px;font-weight:700;border:1px solid transparent}.primary{background:var(--gold);color:#241d17}.secondary{background:#28272c;color:#ddd4ca;border-color:#454047}.ghost{background:transparent;color:var(--muted);border-color:var(--line)}.primary svg,.secondary svg{width:14px;height:14px;vertical-align:-2px;margin-right:7px}.content-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);gap:24px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:2px 0 15px}.section-heading h2{margin:0}.text-button{border:0;background:none;color:var(--gold);font-size:11px;padding:8px}.card{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:21px}.room-row{display:flex;align-items:center;gap:12px;margin-bottom:10px;padding:17px}.room-icon{width:40px;height:40px;display:grid;place-items:center;background:#302a2b;border-radius:9px;font-size:20px;color:var(--gold)}.room-info{flex:1;min-width:0}.room-info h3{margin:0 0 6px;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-info small{color:var(--muted);font-size:10px}.room-count{color:#c8b698;font-size:10px;margin-left:9px}.room-row button{padding:9px 12px}.empty{text-align:center;padding:32px 15px;color:var(--muted);line-height:1.7;font-size:12px}.empty svg{width:32px;height:32px;display:block;margin:0 auto 12px;color:#796246}.join-form{display:flex;gap:8px;margin-top:15px}input{width:100%;min-width:0;background:#131418;border:1px solid #39383e;color:#f4eee7;padding:12px;border-radius:8px;font-size:12px}.side-card{margin-bottom:18px;background:linear-gradient(130deg,#202022,#18191e)}.side-card h3{font-size:14px;margin:10px 0}.side-card p{font-size:11px;line-height:1.8;color:var(--muted)}.steps{padding:0;list-style:none;margin:0}.steps li{display:flex;gap:12px;margin:15px 0;color:#bcb8bc;font-size:11px;line-height:1.7}.steps b{width:22px;height:22px;flex-shrink:0;display:grid;place-items:center;border:1px solid #48413a;border-radius:50%;color:var(--gold);font-size:10px}.roles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:19px 0 28px}.role-tile{padding:17px 12px;background:var(--panel);border:1px solid var(--line);border-radius:11px}.role-tile span{font-size:22px;display:block;margin-bottom:9px}.role-tile b{font-size:11px}.role-tile small{display:block;color:var(--muted);font-size:10px;margin-top:5px}footer{padding:26px 0;display:flex;justify-content:space-between;gap:10px;color:#686874;font-size:9px;letter-spacing:1px}footer span{letter-spacing:0}#mobile-nav{display:none}.notice{padding:10px 15px;margin-top:15px;border:1px solid #645536;border-radius:8px;color:#c7b58e;background:#282319;font-size:11px;line-height:1.7}.notice[hidden]{display:none}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:24px}.table-wrap{border:1px solid var(--line);background:radial-gradient(ellipse,#302b29,#18191e 70%);border-radius:18px;padding:20px;min-height:500px}.table-top{display:flex;justify-content:space-between;align-items:center}.phase-label{color:var(--gold);font-size:12px}.timer{font-variant-numeric:tabular-nums;font-size:20px;font-family:Manrope}.game-table{height:340px;max-width:440px;position:relative;margin:10px auto}.table-center{position:absolute;inset:65px 65px;border:1px solid #67543c66;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;box-shadow:inset 0 0 0 12px #272522,0 0 0 10px #252326;color:var(--gold)}.table-center strong{font-family:Georgia;font-size:27px;letter-spacing:4px}.table-center small{font-size:9px;letter-spacing:2px;color:#8d7b67;margin-top:10px}.seat{position:absolute;width:86px;transform:translate(-50%,-50%);background:transparent;border:none;color:#eee;display:flex;align-items:center;flex-direction:column;gap:6px;padding:4px}.seat .avatar{width:48px;height:48px}.seat:nth-child(3n) .avatar{background:#343d39;border-color:#4c6558;color:#afcebc}.seat:nth-child(2n) .avatar{background:#3b3032;border-color:#71504c;color:#d9a7a4}.seat small{max-width:84px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.seat.dead{opacity:.35}.seat.target .avatar{border-color:var(--gold);box-shadow:0 0 0 3px #e1bd7d33}.table-hint{text-align:center;min-height:30px;font-size:12px;color:#c3bcb2;line-height:1.7}.full{width:100%}.game-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.role-card{background:radial-gradient(ellipse at top,#41342c,#1e1d21);text-align:center;margin-bottom:18px;padding:25px}.role-card .big-symbol{font-family:Georgia;font-size:50px;color:var(--gold);margin-bottom:12px}.role-card h3{margin-bottom:8px}.role-card p{font-size:11px;color:var(--muted);line-height:1.7}.voice-card h3{margin-bottom:10px}.voice-card p{color:var(--muted);font-size:11px;line-height:1.8}.voice-state{display:flex;align-items:center;gap:7px;margin-bottom:15px;font-size:10px;color:var(--green)}.wave{display:flex;align-items:center;gap:3px;height:22px}.wave i{height:7px;width:3px;background:var(--green);border-radius:3px}.wave i:nth-child(2n){height:17px}.wave i:nth-child(3n){height:11px}.ranking-tabs,.periods{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}.ranking-tabs button,.periods button{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:8px;padding:10px 16px;font-size:12px}.ranking-tabs .active,.periods .active{background:#302a23;border-color:#7a6442;color:var(--gold)}.leader-row{display:grid;grid-template-columns:35px 1fr auto;gap:14px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}.leader-row:last-child{border-bottom:0}.leader-row .place{color:var(--gold);font-size:20px;font-family:Georgia}.leader-row b{font-size:13px}.leader-row small{display:block;color:var(--muted);font-size:10px;margin-top:6px}.leader-row strong{color:var(--gold);font-size:17px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:25px 0}.stat{padding:23px;text-align:center}.stat strong{display:block;color:var(--gold);font-size:30px;margin-bottom:8px}.stat small{color:var(--muted);font-size:11px}.profile-head{text-align:center;padding-top:20px}.profile-head .avatar{width:80px;height:80px;font-size:30px;margin-bottom:15px}.profile-head h2{margin-bottom:6px}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);z-index:30;background:#e1bd7d;color:#292017;border-radius:10px;padding:13px 22px;max-width:90vw;font-size:12px;box-shadow:0 8px 35px #0007;display:none}dialog{background:#211e23;color:#eee;border:1px solid #6a5142;border-radius:20px;max-width:420px;width:90%;padding:35px;text-align:center}dialog::backdrop{background:#090a0dd9;backdrop-filter:blur(5px)}dialog p{line-height:1.8;color:#c1b9bd}dialog .role-emoji{font-size:65px;margin-bottom:20px}.icon-button{position:absolute;right:10px;top:8px;border:0;background:transparent;color:var(--muted);font-size:26px}.reconnect{color:#dc9b81}.rule-copy{font-size:12px;line-height:1.9;color:#bcb8bc}.result{padding:35px;text-align:center;background:radial-gradient(ellipse at top,#51402a,#18191e)}.result h2{color:var(--gold);font-size:28px}.report{padding:10px;border:1px solid var(--line);margin-top:10px;font-size:11px;line-height:1.7;border-radius:8px}
@media(min-width:1350px){.workspace{padding:0 55px}.hero{min-height:280px}.hero h2{font-size:48px}.hero-content{padding:4px}.game-table{max-width:500px}}
@media(max-width:1100px){.shell{grid-template-columns:190px 1fr}.sidebar{padding:30px 16px}.workspace{padding:0 25px}.content-grid{grid-template-columns:1.3fr 1fr}.hero h2{font-size:35px}.game-layout{grid-template-columns:1fr}.game-side{display:grid;grid-template-columns:1fr 1fr;gap:18px}.role-card{margin:0}}
@media(max-width:760px){.shell{display:block}.sidebar{display:none}.workspace{padding:0 18px}header{height:70px}.breadcrumb{font-size:9px}.header-right{gap:10px}.status{font-size:10px}main{padding-top:25px;min-height:calc(100vh - 160px)}h1{font-size:26px}.page-heading{margin-bottom:20px;align-items:flex-start}.page-heading p{font-size:12px}.page-heading .pill{font-size:9px;padding:6px 9px}.hero{padding:24px;min-height:266px;margin-bottom:25px}.hero-content{width:76%}.hero h2{font-size:34px}.hero p{max-width:210px}.hero-art{width:45%;opacity:.7;right:-17px}.moon{width:70px;height:70px;top:25px;right:20px}.silhouette{left:5%;width:140px;bottom:-10px;height:130px}.silhouette:before{left:42px}.hat{left:calc(5% + 18px);bottom:184px}.content-grid{display:block}.side-content{margin-top:25px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.side-card{padding:16px;margin-bottom:0}.side-card p{font-size:10px}.steps li{font-size:10px;margin:10px 0}.roles{gap:8px}.role-tile{padding:14px 9px}.role-tile small{font-size:9px}.role-tile b{font-size:10px}footer{padding-bottom:calc(94px + var(--safe));font-size:8px}#mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;padding:8px 12px calc(8px + var(--safe));background:#18191ef5;border-top:1px solid var(--line);z-index:10;justify-content:space-around;backdrop-filter:blur(10px)}#mobile-nav .nav-item{font-size:9px;flex-direction:column;padding:8px 16px;gap:6px;margin:0}#mobile-nav .nav-item svg{width:20px;height:20px}#toast{bottom:calc(90px + var(--safe))}.table-wrap{padding:16px 8px;min-height:450px}.table-top{padding:0 10px}.game-table{height:320px}.table-center{inset:65px 58px}.seat{width:65px}.seat .avatar{width:42px;height:42px}.seat small{max-width:65px;font-size:9px}.game-side{gap:12px}.game-side .card{padding:17px 12px}.role-card .big-symbol{font-size:35px}.role-card h3{font-size:13px}.game-side p{font-size:10px}.game-side button{font-size:10px;padding:11px 8px}.stat{padding:20px 10px}.stat strong{font-size:26px}.join-form button{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.avatar { position: relative; overflow: hidden; flex-shrink: 0; }
.telegram-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }