:root{color-scheme:dark;--bg:#171619;--panel:#211f24;--line:#ffffff12;--muted:#b0a9ae;--text:#f3eff1;--mint:#b52b4b;--gold:#e7a0af;--focus:#f08ba1;--serif:Georgia,'Times New Roman',serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:20px}
body{margin:0;background:#1b1a1a;color:var(--text);font:14px/1.65 'Segoe UI',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
button,input,select{font:inherit}
button,a,input,select{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
button{cursor:pointer;border:1px solid #ffffff1c;border-radius:8px;background:#353334;color:var(--text);padding:11px 18px;font-weight:650;transition:transform .2s,background .2s,border-color .2s}
button:hover,.button:hover{background:#454344;border-color:#ffffff40;transform:translateY(-2px)}
button:disabled{opacity:.5;cursor:wait;transform:none}
button.primary,.button.primary{background:var(--mint);border-color:var(--mint);color:#201316;box-shadow:0 5px 22px #0002}
button.primary:hover,.button.primary:hover{background:#f8aec0;border-color:#f8aec0;box-shadow:0 8px 26px #d47f9430}
button.danger{color:#ffb6a8}
button.ghost,.button.ghost{background:transparent}
button.small,.button.small{padding:8px 13px;font-size:12px}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:2px solid var(--focus);outline-offset:5px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:11px 19px;border:1px solid #ffffff24;border-radius:8px;font-weight:650;transition:transform .2s,background .2s,border-color .2s}
.button span,button.primary>span{font-size:20px;line-height:1}
.skip-link{position:fixed;top:-70px;left:15px;background:var(--mint);color:#191818;padding:10px 20px;z-index:99;border-radius:5px}
.skip-link:focus{top:15px}
.shell{max-width:1800px;margin:auto;display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100dvh}
.shell>aside{padding:36px 22px 23px;position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;border-right:1px solid var(--line);background:linear-gradient(180deg,#24232377,#1b1a1a)}
.brand{display:flex;align-items:center;gap:11px;font:18px/1.15 var(--serif);letter-spacing:-.4px}
.brand small{display:block;font:9px/1.5 'Segoe UI',sans-serif;letter-spacing:1.7px;color:#9f9b9d;margin-top:8px}
.mark{display:block;width:41px;height:44px;flex-shrink:0;color:var(--gold)}
.mark svg{display:block;width:100%;height:100%}
nav{margin-top:59px;display:grid;gap:9px}
nav a{display:flex;gap:13px;align-items:center;padding:13px 15px;border-radius:8px;color:var(--muted);font-size:12px;font-weight:550;transition:background .2s,color .2s}
nav a:hover{background:#ffffff06;color:var(--text)}
nav a.active{background:linear-gradient(90deg,#bc748622,#bc74860b);color:#efaebf;box-shadow:inset 2px 0 #df95a8}
nav a span{width:19px;height:19px;display:flex;flex-shrink:0}
nav svg{width:19px;height:19px}
nav b{margin-left:auto;font-size:10px;background:#ffffff10;min-width:19px;text-align:center;border-radius:4px}
.sidebar-note{margin-top:auto;padding:28px 15px 32px;position:relative}
.sidebar-note small{display:block;font-size:9px;letter-spacing:1.6px;color:var(--gold);margin-bottom:13px}
.sidebar-note strong{display:block;color:#c9d1cd;font:22px/1.3 var(--serif);letter-spacing:-.3px}
.sidebar-note p{font-size:11px;color:#918d8f;margin:11px 0 0;max-width:150px}
.sidebar-suit{display:block;color:#83808177;font:40px var(--serif);margin-bottom:15px}
#account{padding:21px 8px 0;border-top:1px solid var(--line);display:flex;gap:11px;align-items:center;font-size:12px}
#account small{display:block;color:#9e9a9c;font-size:10px}
main{padding:28px 42px 22px;min-width:0}
header{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:50px;margin-bottom:28px}
.eyebrow{display:block;font-size:9px;line-height:1.3;letter-spacing:2.2px;font-weight:650;color:var(--gold)}
header .eyebrow{font-size:10px;color:#9f9b9d;letter-spacing:1.8px}
header p{margin:6px 0 0;font-size:13px;color:#d2d8d5}
#header-actions{display:flex;gap:8px}
#header-actions button,#header-actions a{font-size:11px;min-height:38px;padding:8px 16px;border-radius:7px;background:#333132}
h1,h2,h3,p{overflow-wrap:anywhere}
h1,h2,h3{font-family:var(--serif);font-weight:400}
p{margin:0 0 16px}
h1{font-size:clamp(40px,4vw,66px);line-height:1.1;letter-spacing:-1.5px;margin:18px 0}
h2{font-size:31px;line-height:1.2;letter-spacing:-.7px;margin:0 0 12px}
h3{margin:0 0 9px;font-size:24px;line-height:1.25;letter-spacing:-.4px}
.muted{color:var(--muted)}
.hero{position:relative;isolation:isolate;border:1px solid #c27b8d44;border-radius:15px;min-height:440px;overflow:hidden;background:#1e1d1e;margin-bottom:39px;box-shadow:0 24px 70px #0002;display:flex;align-items:center}
.hero-picture{position:absolute;inset:0;z-index:-3;background:url('/assets/club-table-v2.webp') center 54%/cover no-repeat;animation:hero-reveal 1.2s ease-out both}
.hero:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#1b1a1af7 0%,#1b1a1aeb 23%,#1b1a1a66 48%,#1b1a1a00 75%),linear-gradient(0deg,#1b1a1a99,transparent 50%)}
.hero-grain{position:absolute;inset:12px;border:1px solid #ebb8c50e;border-radius:7px;pointer-events:none}
.hero-copy{padding:43px 45px;max-width:58%}
.hero-eyebrow{display:flex;align-items:center;gap:10px;color:#e8a7b7;font-size:10px;letter-spacing:2px}
.hero-eyebrow>span{width:5px;height:5px;background:#d2889b;transform:rotate(45deg)}
.hero h1{font-size:clamp(52px,4.7vw,80px);line-height:.99;margin:23px 0 22px;letter-spacing:-2.8px;text-wrap:balance}
.hero h1 em{font-weight:400;color:#eca6b8}
.hero p{font-size:12px;line-height:1.9;color:#c2bdc0;max-width:310px;margin-bottom:25px}
.hero-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.hero-actions .primary{font-size:12px;padding:12px 18px;display:flex;align-items:center;gap:21px;border-radius:7px}
.hero-login{border:0;background:transparent;color:#c0c9c6;padding:10px 0;font-size:11px;font-weight:400;text-decoration:underline;text-decoration-color:#85828388;text-underline-offset:4px}
.hero-login:hover{background:transparent;color:white}
.hero-caption{display:flex;align-items:center;gap:10px;color:#938f91;font-size:9px;letter-spacing:1.3px;margin-top:34px;white-space:nowrap}
.caption-line{display:block;width:22px;height:1px;background:#ac828c}
.hero-seal{position:absolute;right:28px;top:26px;width:80px;height:80px;border:1px solid #e2a9b744;outline:1px solid #e2a9b722;outline-offset:-6px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(13deg);color:#f2c3cfbb;background:#21202118}
.hero-seal span{font-size:9px;letter-spacing:2px}
.hero-seal b{font:30px var(--serif);line-height:1.3;font-weight:400}
.collection-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin:0 0 23px}
.collection-head .eyebrow{font-size:10px;color:#c08695;margin-bottom:9px}
.collection-head h2{margin:0;font-size:32px}
.collection-count{font-size:10px;color:#9e9a9c;padding-bottom:4px;white-space:nowrap;display:flex;align-items:center;gap:8px}
.collection-count b{color:#d69cab;border:1px solid #cb909f30;padding:0 6px;border-radius:4px;font-size:9px;font-weight:500}
.games{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.game{--accent:#c57e90;border:1px solid #a67a8533;border-radius:12px;overflow:hidden;background:linear-gradient(150deg,#2d2c2c,#262425);display:flex;flex-direction:column;transition:transform .3s,border-color .3s,box-shadow .3s;animation:card-in .65s ease-out both;animation-delay:calc(var(--card-index)*90ms)}
.game-impostorul{--accent:#bd9395;border-color:#79526055}
.game-licitatia{--accent:#aeaaac;border-color:#6e6b6c55}
.game:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:0 18px 40px #0004}
.game-art{height:260px;position:relative;background:#393738;isolation:isolate;overflow:hidden}
.game-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3;transition:transform .7s,filter .5s;filter:saturate(.65)}
.game:hover .game-background{transform:scale(1.05);filter:saturate(.95)}
.game-art:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#262425 0%,#2624259c 20%,#1817180a 60%,#18171866 100%)}
.game-cuceritorii .game-background{filter:sepia(.5) brightness(.53) saturate(.7);transform:scale(1.08)}
.game-cuceritorii:hover .game-background{filter:sepia(.3) brightness(.6) saturate(.9);transform:scale(1.12)}
.castle-piece{position:absolute;right:0;top:2%;width:88%;height:94%;object-fit:contain;z-index:-2;filter:brightness(.82) drop-shadow(-12px 16px 20px #0008);transform:rotate(-5deg);transition:transform .5s}
.game:hover .castle-piece{transform:rotate(-2deg) translateY(-5px)}
.game-impostorul .game-background{object-position:54% 45%}
.game-licitatia .game-background{object-position:55% center;filter:saturate(.65) brightness(.85)}
.tag{position:absolute;top:17px;left:17px;border:1px solid #ddb4bf2b;background:#26242599;backdrop-filter:blur(5px);border-radius:4px;padding:5px 8px;font-size:9px;letter-spacing:1.35px;font-weight:700;color:#f3d0d9}
.game-number{position:absolute;top:55px;left:15px;color:#f4d3db15;font:68px/1 var(--serif)}
.game-title{position:absolute;bottom:10px;left:21px;right:15px}
.game-category{display:block;font-size:9px;letter-spacing:1.8px;font-weight:600;color:var(--accent);margin-bottom:8px}
.game-title h3{font-size:31px;line-height:1.05;letter-spacing:-.8px;margin:0;color:#f4eee3}
.game-licitatia h3{max-width:200px}
.game-body{padding:10px 21px 19px;display:flex;flex-direction:column;flex:1}
.game-body p{font-size:11px;color:#b3afb1;line-height:1.85;min-height:42px;margin:0 0 20px}
.game-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:16px;margin-top:auto}
.game-bottom small{font-size:9px;color:#bec8c8;display:flex;align-items:center;gap:6px;white-space:nowrap}
.game-bottom small i{display:block;width:5px;height:5px;border-radius:50%;background:var(--accent);opacity:.8}
.game-play{font-size:10px;border-radius:5px;padding:5px 10px;background:#ffffff05;border-color:#e3ddd11c;color:#f0c2ce;gap:20px}
.game-play span{font-size:15px}
.game-play:hover{background:#d7889b;color:#201316;border-color:#d7889b}
.under-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:21px;margin-top:33px}
.panel{padding:28px;background:var(--panel);border:1px solid var(--line);border-radius:12px}
.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}
.panel-heading .eyebrow,.record-panel>.eyebrow{font-size:9px;letter-spacing:1.8px}
.online-count{display:flex;gap:6px;align-items:center;font-size:9px;color:#b5b0b3}
.online-count i{width:4px;height:4px;border-radius:50%;background:#bdb8bb;box-shadow:0 0 8px #a29ea088}
.panel h3{font-size:27px}
.panel p{color:var(--muted);font-size:13px}
.friends-panel{background:linear-gradient(110deg,#302e2f66,#282627)}
.social-empty{display:flex;gap:17px;align-items:center;min-height:100px;margin:5px 0 12px}
.empty-seats{display:flex;padding-left:0;min-width:90px}
.empty-seats span{width:37px;height:37px;margin-left:-8px;border:2px solid #2c2b2b;border-radius:50%;display:grid;place-items:center;font:21px var(--serif);background:#555253;color:#d4b4bc}
.empty-seats span:first-child{margin:0;background:#655256}
.empty-seats span:last-child{background:#373536;color:#9c989a;font-size:16px;border-style:dashed;border-color:#605c5e}
.social-empty p{font-size:11px;line-height:1.65;margin:0;color:#c2cdcb}
.social-empty small{display:block;font-size:10px;color:#9f9b9d;margin-top:4px}
.panel-link{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#c697a3;border-top:1px solid var(--line);padding-top:16px;margin-top:9px}
.panel-link span{font-size:19px;line-height:1}
.record-panel{position:relative;overflow:hidden;background:#e0c3cb;color:#2f2d2e;border-color:#e0c3cb;isolation:isolate}
.record-panel>.eyebrow{color:#7b5b63}
.record-panel h3{font-size:31px;margin:15px 0 12px;line-height:1.07;letter-spacing:-.6px}
.record-panel p{font-size:11px;color:#646163;max-width:70%;margin-bottom:12px;line-height:1.8}
.record-suit{position:absolute;right:7px;top:15px;font:190px var(--serif);color:#6f756c22;transform:rotate(-14deg);z-index:-1}
.record-cta{border:0;border-bottom:1px solid #7a6e7155;border-radius:0;color:#403e3f;background:transparent;font-size:11px;padding:4px 0;display:flex;gap:22px;align-items:center}
.record-cta:hover{background:transparent;color:#2b2a2a}
.record-panel .panel-link{border-color:#7760662c;color:#413f40}
.record-panel .stats{margin-top:17px;max-width:84%}
.record-panel .stats b{font:27px var(--serif);color:#424041}
.record-panel .stats small{display:block;font-size:9px;color:#716165}
.prototype{margin-top:30px;display:flex;gap:16px;align-items:center;padding:20px 23px;border:1px dashed #ffffff17;border-radius:11px;color:var(--muted)}
.prototype-icon{display:grid;place-items:center;width:44px;height:49px;border:1px solid #866c7233;border-radius:5px;color:#8f7c80;font:29px var(--serif);background:#ffffff02;flex-shrink:0;transform:rotate(-7deg)}
.prototype small{display:block;font-size:9px;letter-spacing:1.8px;color:#8c948b}
.prototype strong{color:#bcc5c0;font:22px var(--serif)}
.prototype p{font-size:10px;margin:3px 0 0;color:#8e8a8c}
.prototype .pill{margin-left:auto;white-space:nowrap;color:#979395;font-size:10px}
.section-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:30px 0 20px}
.section-top h2{margin:0}
.section-top small{color:var(--muted)}
.empty{padding:30px 18px;text-align:center;color:var(--muted);font-size:12px;border:1px dashed #ffffff1c;border-radius:9px}
.empty strong{display:block;color:#d0d9d2;margin-bottom:7px;font-weight:600}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:25px 0}
.stat{padding:23px;border:1px solid var(--line);border-radius:11px;background:var(--panel)}
.stat b{display:block;font:37px var(--serif);color:var(--mint);margin-bottom:5px}
.stat small{color:var(--muted);font-size:12px}
.row{display:flex;align-items:center;gap:14px;padding:19px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.row:last-child{border-bottom:0}
.row .info{flex:1;min-width:110px;font-size:12px}
.row .info strong{font-weight:600}
.row .info small{display:block;color:var(--muted);font-size:10px;margin-top:2px}
.row-actions{display:flex;gap:7px;flex-wrap:wrap}
.avatar{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;background:var(--av,#484547);border:1px solid #ffffff25;border-radius:13px;font:24px var(--serif);color:#f2ccd6;box-shadow:inset 0 0 10px #0002}
.online{color:#c6c1c4}
.pill{font-size:10px;border:1px solid #ffffff20;padding:3px 10px;border-radius:30px}
.win{color:#d3ced0;background:#43414233}
.loss{color:#e6aa9c;background:#722e2e22}
.draw{color:var(--gold);background:#975b6a22}
.forms{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.forms form{align-self:start}
.forms .panel h3{font-size:25px}
.forms .panel p{font-size:12px;line-height:1.8}
label{display:block;font-size:12px;color:#c5c0c3;margin:16px 0}
input,select{display:block;width:100%;font-size:16px;background:#1d1c1d;color:var(--text);border:1px solid #555253;border-radius:7px;padding:12px;margin-top:7px;min-width:0;transition:border-color .2s}
input:focus,select:focus{outline:2px solid #db8ea188;outline-offset:2px;border-color:#e69aad}
form button[type=submit]{margin-top:8px}
.search-form{display:flex;gap:12px;align-items:center;margin:25px 0}
.search-form input{margin:0}
.search-form button{margin:0!important;flex-shrink:0}
.avatar-picker{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0}
.avatar-picker button{padding:4px;border-radius:14px;background:transparent}
.avatar-picker button.selected{outline:2px solid var(--mint);outline-offset:2px}
dialog{max-width:470px;width:calc(100% - 30px);border:1px solid #b6828f55;border-radius:16px;background:radial-gradient(ellipse at 90% 0,#4d4b4c44,transparent 65%),#282728;color:var(--text);padding:36px;max-height:90dvh;overflow:auto;box-shadow:0 30px 100px #0008}
dialog[open]{animation:dialog-in .25s ease-out}
dialog::backdrop{background:#100f0fc4;backdrop-filter:blur(9px)}
dialog h2{padding-right:20px;font-size:35px;margin-top:14px}
dialog .muted{font-size:12px}
.close{position:absolute;top:15px;right:15px;background:transparent;border:0;color:#beb9bc;font-size:24px;padding:0 7px;line-height:1.2}
.tabs{display:flex;gap:5px;margin:22px 0;background:#19181866;border:1px solid var(--line);padding:4px;border-radius:9px}
.tabs button{flex:1;border:0;font-size:12px;background:transparent;padding:9px}
.tabs button.active{background:#444243;color:#e9c3cd;box-shadow:0 1px 4px #0003}
.form-error{color:#efb2a3;font-size:12px;min-height:20px;margin-top:12px}
.text-link{background:none;border:0;color:var(--gold);padding:7px 0;font-size:12px}
.text-link:hover{background:none;color:#f2b8c7}
.recovery{word-break:break-all;padding:17px;display:block;background:#1d1c1c;border:1px dashed #cd8f9e88;border-radius:7px;color:var(--gold);user-select:all;font-size:13px}
.notice{padding:17px;border:1px solid #c57b8d55;border-radius:10px;background:#72445022;color:#dbacb8;font-size:12px;margin-bottom:18px}
#invite-tray .notice{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:calc(100% - 30px);padding:14px 22px;border-radius:9px;background:#e9b1bf;color:#2d2c2c;border:1px solid #fcbecd;z-index:10;box-shadow:0 10px 35px #0006;font-size:13px;font-weight:550}
footer{margin-top:40px;padding:22px 0 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;font-size:9px;letter-spacing:.2px;color:#868384}
.page-head{margin:30px 0 16px}
.page-head h1{font-size:48px;letter-spacing:-1.5px;margin:15px 0}
.page-head p{color:var(--muted);max-width:650px;font-size:13px}
.loading{color:var(--muted);padding:50px;text-align:center}
@keyframes card-in{from{opacity:0;transform:translateY(15px)}
to{opacity:1;transform:translateY(0)}
}
@keyframes hero-reveal{from{opacity:.6;transform:scale(1.025)}
to{opacity:1;transform:scale(1)}
}
@keyframes dialog-in{from{opacity:0;transform:translateY(10px)}
to{opacity:1;transform:translateY(0)}
}

@media(min-width:1500px){main{padding:34px 55px}
.hero{min-height:510px}
.hero-copy{padding:50px 55px}
.hero h1{font-size:88px}
.hero p{font-size:14px;max-width:350px}
.hero-actions .primary{font-size:13px}
.hero-caption{font-size:9px}
.game-art{height:310px}
.game-title h3{font-size:36px}
.game-body p{font-size:12px}
.game-bottom small{font-size:10px}
.game-play{font-size:11px}
.tag{font-size:9px}
}
@media(max-width:1150px){.shell{grid-template-columns:205px minmax(0,1fr)}
.shell>aside{padding:29px 15px 20px}
.brand{font-size:15px;gap:7px}
.brand small{font-size:9px;letter-spacing:1.3px}
.mark{width:34px}
nav a{font-size:11px;padding:12px 10px;gap:10px}
main{padding:25px}
.hero{min-height:405px}
.hero-copy{padding:32px;max-width:65%}
.hero h1{font-size:64px}
.hero-picture{background-position:57% center}
.hero-caption{font-size:9px;letter-spacing:1px}
.hero-login{font-size:10px}
.hero-actions{gap:12px}
.hero-seal{width:66px;height:66px;top:22px;right:23px}
.hero-seal b{font-size:24px}
.hero-seal span{font-size:9px}
.games{gap:13px}
.game-art{height:235px}
.game-title{left:16px}
.game-title h3{font-size:27px}
.game-category{font-size:9px;letter-spacing:1.2px}
.tag{font-size:9px;letter-spacing:1px;left:13px;top:13px;padding:5px 6px}
.game-body{padding:9px 16px 16px}
.game-body p{font-size:10px;min-height:54px}
.game-bottom{gap:6px}
.game-bottom small{font-size:10px}
.game-play{font-size:9px;padding:5px 8px;gap:11px}
.collection-head h2{font-size:28px}
.panel{padding:23px}
.under-grid{gap:15px}
.panel h3{font-size:25px}
.social-empty{gap:11px}
.empty-seats{min-width:74px}
.empty-seats span{width:31px;height:31px;font-size:18px}
.social-empty p{font-size:10px}
.social-empty small{font-size:9px}
.record-panel h3{font-size:29px}
.record-panel p{max-width:85%}
.record-suit{right:-20px;font-size:180px}
.forms{grid-template-columns:1fr}
.sidebar-note{padding-left:10px;padding-right:10px}
}

@media(max-width:850px) and (min-width:701px){.shell{grid-template-columns:76px minmax(0,1fr)}
.shell>aside{padding:24px 12px}
.brand>span:last-child,.sidebar-note,#account{display:none}
.brand{justify-content:center}
.mark{width:40px}
nav{margin-top:40px}
nav a{font-size:0;justify-content:center;padding:15px 10px}
nav a span{width:21px;height:21px}
nav svg{width:21px;height:21px}
nav b{display:none}
.hero-copy{max-width:65%}
.hero h1{font-size:67px}
.hero{min-height:410px}
}

@media(max-width:700px){.shell{display:block}
.shell>aside{position:static;height:auto;padding:19px 20px 0;border:0;border-bottom:1px solid var(--line);background:#24232344}
.brand{font-size:20px;gap:9px}
.brand small{font-size:9px;letter-spacing:1.6px;margin-top:5px}
.mark{width:38px;height:42px}
.sidebar-note,#account{display:none}
nav{display:flex;margin-top:22px;gap:2px;justify-content:space-between}
nav a{padding:12px 6px 13px;font-size:9px;flex-direction:column;align-items:center;gap:7px;flex:1;white-space:nowrap;border-radius:6px 6px 0 0}
nav a.active{box-shadow:inset 0 -2px #dc9aab;background:linear-gradient(0deg,#d597a60d,transparent)}
nav a span,nav svg{width:18px;height:18px}
nav b{display:none}
main{padding:19px 18px 24px}
header{margin:0 0 19px;min-height:37px;gap:10px}
header .eyebrow{font-size:9px;letter-spacing:1.3px}
header p{font-size:10px;margin-top:4px}
#header-actions button,#header-actions a{font-size:10px;padding:6px 11px;min-height:33px;border-radius:5px}
.hero{min-height:530px;align-items:flex-start;border-radius:12px;margin-bottom:31px}
.hero-picture{background-position:65% bottom;background-size:auto 80%;background-color:#1b1a1a;background-repeat:no-repeat}
.hero:before{background:linear-gradient(180deg,#1b1a1a 0%,#1b1a1af2 23%,#1b1a1a9c 43%,transparent 70%),linear-gradient(0deg,#1b1a1a55,transparent 20%)}
.hero-copy{padding:30px 25px;max-width:100%}
.hero-eyebrow{font-size:9px;letter-spacing:1.6px;gap:7px}
.hero h1{font-size:66px;margin:19px 0 17px;letter-spacing:-2.4px;line-height:.96}
.hero p{font-size:11px;max-width:275px;line-height:1.8;margin-bottom:21px}
.hero-actions{gap:15px}
.hero-actions .primary{font-size:11px;padding:11px 14px;gap:19px}
.hero-login{font-size:10px}
.hero-caption{position:absolute;bottom:18px;left:24px;margin:0;font-size:9px;letter-spacing:1px;color:#c5a5ad}
.hero-grain{inset:9px}
.hero-seal{width:58px;height:58px;top:auto;bottom:36px;right:17px;background:#24232355}
.hero-seal span{font-size:4px;letter-spacing:1.3px}
.hero-seal b{font-size:22px}
.collection-head{align-items:center;margin-bottom:18px;gap:10px}
.collection-head .eyebrow{font-size:9px;letter-spacing:1.8px;margin-bottom:7px}
.collection-head h2{font-size:25px;letter-spacing:-.6px}
.collection-count{font-size:0;gap:0;padding:0}
.collection-count b{font-size:10px;padding:3px 6px}
.games{grid-template-columns:1fr;gap:19px}
.game{border-radius:11px}
.game-art{height:270px}
.game-title{bottom:8px;left:23px;right:20px}
.game-title h3{font-size:37px;letter-spacing:-1px}
.game-licitatia h3{max-width:260px}
.game-category{font-size:9px;letter-spacing:1.7px;margin-bottom:9px}
.game-number{font-size:85px;top:58px;left:19px}
.tag{font-size:9px;letter-spacing:1.3px;padding:6px 8px;left:21px;top:20px}
.castle-piece{width:77%;height:99%;right:-7px;top:-6px}
.game-cuceritorii .game-background{object-position:center 30%}
.game-impostorul .game-background{object-position:50% 54%}
.game-licitatia .game-background{object-position:center 55%}
.game-body{padding:10px 23px 20px}
.game-body p{min-height:0;font-size:12px;line-height:1.8;max-width:290px;margin-bottom:18px}
.game-bottom{padding-top:16px}
.game-bottom small{font-size:10px}
.game-play{font-size:11px;padding:7px 13px;gap:25px}
.game-play span{font-size:18px}
.under-grid{grid-template-columns:1fr;gap:18px;margin-top:26px}
.panel{padding:25px}
.panel h3{font-size:28px}
.panel-heading{margin-bottom:17px}
.panel-heading .eyebrow,.record-panel>.eyebrow{font-size:9px}
.online-count{font-size:10px}
.social-empty{min-height:94px;gap:16px}
.empty-seats{min-width:85px}
.empty-seats span{width:36px;height:36px;font-size:21px}
.social-empty p{font-size:11px}
.social-empty small{font-size:10px}
.panel-link{font-size:11px;padding-top:16px}
.record-panel{min-height:255px}
.record-panel h3{font-size:34px}
.record-panel p{font-size:12px;max-width:76%;margin-bottom:18px}
.record-suit{right:0;top:0;font-size:225px}
.record-cta{font-size:12px}
.record-panel .stats{margin:20px 0 14px;max-width:86%}
.record-panel .stats b{font-size:31px}
.record-panel .stats small{font-size:10px}
.prototype{padding:18px 17px;gap:13px;position:relative;align-items:flex-start;margin-top:23px}
.prototype-icon{width:34px;height:40px;font-size:24px;margin-top:3px}
.prototype small{font-size:9px;letter-spacing:1.6px}
.prototype strong{font-size:24px}
.prototype p{font-size:10px;margin-top:6px;line-height:1.8;padding-right:5px}
.prototype .pill{position:absolute;right:14px;top:16px;font-size:9px;padding:2px 7px}
.section-top{align-items:center}
.section-top h2{font-size:26px}
.section-top small{font-size:9px}
.stats{gap:9px;margin:22px 0}
.stat{padding:17px 13px}
.stat b{font-size:32px}
.stat small{font-size:10px}
.forms{gap:18px}
.forms .panel p{font-size:12px}
.row{gap:10px}
.row .info{font-size:12px;min-width:105px}
.row .info small{font-size:10px}
.row-actions{margin-left:auto}
.row-actions button,.row-actions .button{font-size:10px;padding:7px 10px}
.page-head{margin-top:18px}
.page-head h1{font-size:40px;letter-spacing:-1.2px}
.page-head p{font-size:12px}
.page-head .eyebrow{font-size:9px;letter-spacing:1.7px}
.search-form{gap:8px}
.search-form input{font-size:16px;padding:11px}
.search-form button{font-size:11px;padding:13px 12px}
dialog{padding:30px 25px;border-radius:13px}
dialog h2{font-size:32px}
footer{font-size:10px;margin-top:32px;padding-top:20px}
footer span{max-width:48%;text-align:right}
.notice{padding:14px;font-size:11px}
#toast{font-size:12px;padding:12px 17px;bottom:15px}
.game:hover{transform:none}
.game:hover .castle-piece{transform:rotate(-5deg)}
}

@media(max-width:359px){main{padding:17px 13px}
.shell>aside{padding-left:15px;padding-right:15px}
.hero-copy{padding:28px 20px}
.hero h1{font-size:60px}
.hero{min-height:510px}
.hero-actions{gap:12px}
.hero-actions .primary{font-size:10px}
.hero-login{font-size:9px}
.collection-head h2{font-size:23px}
.game-art{height:250px}
.game-title h3{font-size:33px}
.game-body{padding-left:20px;padding-right:20px}
.social-empty{gap:11px}
.prototype{gap:10px}
.prototype .pill{font-size:9px;right:10px}
.prototype small{letter-spacing:1.1px}
.search-form{flex-wrap:wrap}
.search-form input{flex:1;min-width:170px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}


/* Ambient background: illustrated texture, slow light and floating dust. */
body{isolation:isolate}

.ambient-background{position:fixed;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(180deg,#1b1a1a25,#1d1c1d38 60%,#1a191944),url('/assets/club-atmosphere-v3.webp') center center/cover no-repeat;opacity:.92}

.ambient-background:before,.ambient-background:after{content:'';position:absolute;inset:-15%;pointer-events:none;will-change:transform;filter:blur(25px)}

.ambient-background:before{background:radial-gradient(ellipse at 90% 12%,#e3889f28,transparent 39%),radial-gradient(ellipse at 14% 80%,#9f9b9d2b,transparent 47%);animation:ambient-wander 32s ease-in-out infinite alternate}

.ambient-background:after{background:radial-gradient(ellipse at 50% 35%,#6a666833,transparent 43%),radial-gradient(ellipse at 75% 92%,#9c65721b,transparent 40%);animation:ambient-wander 41s ease-in-out -17s infinite alternate-reverse}

.ambient-grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.055;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.8' d='M0 0h180v180H0z'/%3E%3C/svg%3E");background-size:180px 180px}

#club-dust{position:fixed;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;opacity:.74}

.shell>aside{background:linear-gradient(180deg,#222121c9,#222121a6 75%,#2928295c);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-right-color:#d5d0d214}

header{border-bottom:1px solid #ddd7da0e;padding-bottom:15px}

.games{position:relative}

.games:before{content:'';position:absolute;inset:-45px -28px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 15% 10%,#cb7a8e0c,transparent 50%),radial-gradient(ellipse at 90% 80%,#9d999b10,transparent 52%);filter:blur(18px)}

.friends-panel{background:linear-gradient(120deg,#353334b5,#2f2d2ec4);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

.prototype{background:#2c2b2b42;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}

@keyframes ambient-wander{from{transform:translate3d(-1%,-1%,0) scale(1)}
to{transform:translate3d(3%,2%,0) scale(1.075)}
}

@media(max-width:700px){.ambient-background{background-position:65% center;opacity:.83}
.ambient-background:before,.ambient-background:after{filter:blur(17px)}
.shell>aside{background:linear-gradient(90deg,#282728c9,#292829c9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#club-dust{opacity:.62}
header{padding-bottom:12px}
}

@media(prefers-reduced-motion:reduce){#club-dust{display:none}
.ambient-background:before,.ambient-background:after{animation:none;will-change:auto}
}


/* Anthracite and ruby identity. */
body{background:#171619}

button.primary,.button.primary{background:#b52b4b;border-color:#c6405f;color:#fff6f8;box-shadow:0 6px 24px #b01b3f26}

button.primary:hover,.button.primary:hover{background:#c13758;border-color:#e75a78;box-shadow:0 8px 28px #b01b3f44}

.skip-link{background:#b52b4b;color:#fff}

.brand small{color:#b8a7ae}
.mark{color:#e29aa9}

nav a.active{background:linear-gradient(90deg,#b52b4b2b,#b52b4b0b);color:#f0a6b7;box-shadow:inset 2px 0 #ce4263}

.hero{border-color:#ae4e6544;background:#1b181d}

.hero-picture{filter:saturate(.58)}

.hero:before{background:linear-gradient(90deg,#19161bf7 0%,#19161beb 23%,#19161b77 48%,#19161b00 75%),linear-gradient(0deg,#171419aa,transparent 50%)}

.hero:after{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(ellipse at 90% 40%,#ab17424d,transparent 65%);mix-blend-mode:soft-light}

.hero h1 em{color:#f1a0b1}
.hero-eyebrow{color:#e1a2b2}
.hero-eyebrow>span{background:#d94b6b}

.hero-caption{color:#b8a1aa}
.caption-line{background:#bc6c80}
.hero-seal{color:#edc1cc;border-color:#e1a0b644;outline-color:#e1a0b622;background:#32182433}

.game{--accent:#d69aa6;background:linear-gradient(150deg,#29242a,#1d1b20);border-color:#b9778840}

.game-impostorul{--accent:#d4a0b3;border-color:#b3758d44}
.game-licitatia{--accent:#c9b5bd;border-color:#8f858d55}

.game-art:after{background:linear-gradient(0deg,#1d1b20 0%,#1d1b209c 20%,#1512160a 60%,#15121666 100%)}

.tag{background:#211b2499;color:#edc7d0}
.game-title h3{color:#faf0f2}
.game-category{color:var(--accent)}

.game-play{color:#f2bdca;background:#ac294116;border-color:#ba536335}
.game-play:hover{background:#b52b4b;color:#fff6f8;border-color:#d34365}

.shell>aside{background:linear-gradient(180deg,#1d1b21de,#211d24b3 75%,#341c295c);border-right-color:#e8cadb12}

header .eyebrow{color:#b09ea8}
header p{color:#e0d6dc}
#header-actions button,#header-actions a{background:#32252d;border-color:#9a5d7238}

.friends-panel{background:linear-gradient(120deg,#2f232cc4,#221f28cc)}

.panel-link{color:#e4a8b8}
.panel p{color:var(--muted)}

.record-panel{background:radial-gradient(ellipse at 90% 20%,#a3314f26,transparent 65%),linear-gradient(120deg,#38202c,#271e28);color:#f2e6eb;border-color:#a94d6855}

.record-panel>.eyebrow{color:#d58da3}
.record-panel h3{color:#f6e9ee}
.record-panel p{color:#c2a9b6}
.record-panel .panel-link{border-color:#c48aa52b;color:#efb2c5}
.record-panel .stats b{color:#f4adbf}
.record-panel .stats small{color:#c1a8b4}
.record-suit{color:#df779c1c}
.record-cta{color:#f2b6c8;border-bottom-color:#d28aa944}
.record-cta:hover{color:#fff0f5}

.empty-seats span{background:#684251;border-color:#2a2229;color:#efc6d5}
.empty-seats span:first-child{background:#754154}
.empty-seats span:last-child{background:#352a33;border-color:#7d5e6b;color:#c193a6}

.sidebar-note strong{color:#d9ccd3}
.sidebar-note p{color:#a6919e}
.sidebar-suit{color:#ad536b88}

.online,.win{color:#a9cbb2}
.online-count{color:#c6b4bc}
.online-count i{background:#d98fa5;box-shadow:0 0 9px #c8587b66}
.loss{color:#eda3b3}
.draw{color:#ded0d7}

.tabs button.active{background:#783044;color:#ffe7ed}
.avatar{color:#f1d3dc}
.notice{background:#7d284127;border-color:#bf5d7855;color:#edbdcb}

#toast{background:#472631;color:#ffe3ed;border-color:#b5677e;box-shadow:0 12px 35px #0006}

input:focus,select:focus{outline-color:#c7466b88;border-color:#d86c88}

.ambient-background{isolation:isolate;background:linear-gradient(180deg,#17151a14,#20161d30 60%,#16121866);opacity:1}

.ambient-image{position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('/assets/club-atmosphere-v3.webp') center center/cover no-repeat;filter:grayscale(1) brightness(.56)}

.ambient-background:before{background:radial-gradient(ellipse at 92% 12%,#bf254e38,transparent 43%),radial-gradient(ellipse at 12% 82%,#ae37533b,transparent 49%)}

.ambient-background:after{background:radial-gradient(ellipse at 48% 32%,#714b6230,transparent 44%),radial-gradient(ellipse at 78% 92%,#c0496926,transparent 43%)}

.games:before{background:radial-gradient(ellipse at 15% 10%,#c74c690f,transparent 50%),radial-gradient(ellipse at 90% 80%,#aa516c19,transparent 52%)}

.prototype{background:#271e274d}
.recovery{color:#f1a7ba;border-color:#c16b8488;background:#1a151c}

@media(max-width:700px){nav a.active{box-shadow:inset 0 -2px #cc4a6c;background:linear-gradient(0deg,#c24c6a15,transparent)}
.shell>aside{background:linear-gradient(90deg,#211b24df,#30202ac9)}
.hero:before{background:linear-gradient(180deg,#19161b 0%,#19161bf2 23%,#19161b9c 43%,transparent 70%),linear-gradient(0deg,#17141966,transparent 20%)}
.ambient-image{background-position:65% center}
.hero-seal{background:#32182466}
}


dialog{background:radial-gradient(ellipse at 90% 0,#9b2c5140,transparent 65%),#231e27;border-color:#af5a7766}