:root{background:#12101a;color:#faf4ec;--muted:#b5aabd;--line:#383043;--lime:#ffd193;--sidebar:190px;--top:68px}
body{background:radial-gradient(ellipse at 72% 6%,#36223f 0,transparent 32%),#12101a;min-height:100vh}
.top,.sidebar{background:#1b1724;border-color:var(--line)}.brand strong{font-style:normal;font-weight:850;letter-spacing:.01em;font-size:20px}.brand strong span{color:#e9ac83}.top-search,.secondary,.icon-button,#language{background:#282132;border-color:#43364f}.sidebar-head{background:linear-gradient(105deg,#3d2a47,#282032);color:#f8e4ca}.side-foot{color:#a795ad}.nav-button:hover,.nav-button[aria-current="page"]{background:#372940}.demo-badge{color:#e4cbae}
.content{max-width:1510px;padding-top:32px}.page-heading{margin-bottom:19px}.page-heading h1{font-size:29px;letter-spacing:-.035em}.hero-grid{gap:18px}.hero{min-height:255px;border-radius:15px;background:#392229;border-color:#735057}.slots-hero{background:#2b2144;border-color:#5d4672}.hero>img{width:68%;left:auto;object-position:center 48%;mask-image:linear-gradient(90deg,transparent,#000 29%);filter:saturate(.94)}.hero::after{background:linear-gradient(90deg,#2b1827 0%,#2b1827eb 26%,#2b18272e 60%,transparent 90%)}.slots-hero::after{background:linear-gradient(90deg,#21192f 0%,#21192fe8 28%,#21192f15 66%,transparent 95%)}.hero-copy{padding:25px;max-width:63%}.hero h2{font-size:clamp(26px,3.45vw,52px);line-height:1.02;margin:10px 0 21px}.eyebrow{color:#f1b895}.cta{background:#ffd193;color:#34211a;min-height:40px}.cta.purple{background:#e5bdff;color:#362241}
.search-row{margin-top:25px}.search,.filters .nav-button{background:#241e30;border-color:#463a51}.search input{font-size:14px}.filters{gap:8px;margin:14px 0 28px}.filters .nav-button[aria-current="page"]{background:#53364e;border-color:#ad6e75}.shelf{margin-bottom:37px}.shelf-title{margin-bottom:15px}.shelf-title h2{font-size:21px}.cards{gap:15px;grid-template-columns:repeat(4,minmax(0,1fr))}.poster-card .card-preview{border-radius:12px;background:#211b2c;border-color:#483b51;transition:box-shadow .24s,border-color .24s,transform .24s;height:100%}.poster-card .card-preview:hover{transform:translateY(-3px);border-color:#c7958c;box-shadow:0 12px 27px #09060f66}.poster-card .card-preview img{aspect-ratio:1;object-position:center;object-fit:cover;background:#292238}.card-caption{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:13px 13px 15px}.card-category{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:#d4a9aa;font-weight:750}.poster-card .card-title{position:static;padding:0;background:none;text-align:left;font-size:clamp(14px,1.6vw,20px);line-height:1.18;text-transform:none;font-weight:760;color:#fff1e8}.favorite{top:9px;right:9px;width:35px;height:35px;background:#211728e8;border-color:#ead0d042;color:#fff4e8}.favorite[aria-pressed=true]{color:#ffc08c}.empty{border-color:#68516c}
dialog{background:#241b2e;border-color:#654d70}.dialog-body img{aspect-ratio:1;object-fit:cover}.dialog-body h2{color:#fff0e6}.dialog-close{background:#37253e}.mobile-nav{background:#211a2c;border-color:#483852}footer p{text-align:left}#site-footer{padding-bottom:30px}
@media(min-width:1400px){.cards{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1000px) and (min-width:761px){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-copy{padding:20px;max-width:73%}}
@media(max-width:760px){.content{padding:19px 15px 0}.top{padding:9px 12px}.top-left,.top-right{gap:7px}.brand strong{font-size:15px}.brand img{width:28px;height:28px}.top-search{display:none}.top-right>.cta{display:none}#language{max-width:104px}.hero-grid{grid-template-columns:1fr;gap:12px}.hero{min-height:172px}.hero-copy{padding:18px;max-width:70%}.hero h2{font-size:clamp(26px,7vw,38px)}.page-heading h1{font-size:24px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.card-caption{padding:10px 10px 12px}.poster-card .card-title{font-size:15px}.card-category{font-size:8px}.favorite{width:34px;height:34px}.shelf-title h2{font-size:18px}.filters .nav-button{min-height:41px}#site-footer{padding-bottom:78px}}
@media(prefers-reduced-motion:reduce){.poster-card .card-preview{transition:none}.poster-card .card-preview:hover{transform:none}}
#game-dialog{background:linear-gradient(155deg,#34253d,#20192b);border-color:#76586d}dialog::backdrop{background:#100b17dd}.dialog-body img{aspect-ratio:1;border-color:#b38caa55}.sidebar .nav-button,.mobile-nav .nav-button{background:transparent}.sidebar .nav-button:hover,.sidebar .nav-button[aria-current=page],.mobile-nav .nav-button[aria-current=page]{background:#372940}.mobile-nav .nav-button{min-height:48px}.hero>img{max-width:none}

#game-dialog { width: min(460px, calc(100% - 24px)); max-height: 90dvh; padding: 22px; }
#game-dialog .dialog-body {
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 14px;
  padding: 0 36px 0 0;
  text-align: start;
}
#game-dialog .dialog-body h2 { font-size: clamp(17px, 4vw, 23px); overflow-wrap: anywhere; }
#game-dialog .dialog-close { min-width: 44px; min-height: 44px; }
#dialog-favorite { min-height: 44px; padding: 6px 11px; }
.signup-form {
  display: grid;
  gap: 9px;
  margin-top: 18px;
  padding: clamp(14px, 4vw, 21px);
  background: #191322;
  border: 1px solid #705470;
  border-radius: 14px;
}
.signup-form p, .signup-form h3 { margin: 0; }
.signup-eyebrow { color: #f6baad; font-size: .79rem; font-weight: 700; }
.signup-form h3 { color: #fff0e6; font-size: clamp(1.4rem, 5vw, 1.9rem); line-height: 1.15; }
#signup-result { color: #dbdaff; font-size: .82rem; line-height: 1.45; }
.signup-form label { margin-top: 3px; font-weight: 650; font-size: .88rem; }
.signup-form input {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding: 9px 12px;
  border: 1px solid #8c6b8e;
  border-radius: 8px;
  background: #2d2237;
  color: #fff0e6;
  font-size: 16px;
}
.signup-form input:focus-visible { outline: 2px solid #f6baad; outline-offset: 2px; }
.signup-form .cta { min-height: 46px; justify-content: center; text-align: center; }
#signup-result:empty { margin-top: -9px; }

:root {
  background: #09132d;
  --muted: #c3d2ef;
  --line: #809be055;
  --lime: #a7faff;
}
body {
  background:
    radial-gradient(ellipse 62rem 44rem at 90% 4rem, #1f4589a6, transparent 71%),
    radial-gradient(ellipse 56rem 39rem at 19% 12rem, #153e84bb, transparent 73%),
    linear-gradient(150deg, #0e1d3d, #0a142c 52%, #11244b);
  background-attachment: fixed;
}
.top, .sidebar, .mobile-nav { background: #0e1c3d; border-color: var(--line); }
.brand strong span { color: #a7faff; }
.brand img { filter: drop-shadow(0 0 7px #70d9ff80); }
.side-foot { display: flex; align-items: center; gap: 8px; color: #cadbff; }
.sidebar-head { background: linear-gradient(110deg, #214983, #22336a); color: #fff; }
.top-search, .secondary, .icon-button, #language, .search, .filters .nav-button {
  background: #172c56;
  border-color: #6e94d591;
}
.sidebar .nav-button:hover, .sidebar .nav-button[aria-current=page],
.mobile-nav .nav-button[aria-current=page], .filters .nav-button[aria-current=page] {
  background: #25477e;
  border-color: #89b9ff;
}
.hero { background: #142751; border-color: #6f9ce5; }
.slots-hero { background: #15234b; border-color: #8b9de3; }
.hero::after { background: linear-gradient(90deg, #102447, #132a52ee 25%, #132a5238 62%, transparent); }
.slots-hero::after { background: linear-gradient(90deg, #182348, #19264fee 25%, #19264f38 62%, transparent); }
.eyebrow, .card-category, .demo-badge { color: #c7edff; }
.cta { background: linear-gradient(125deg, #a6faff, #9cc0ff); color: #15123e; }
.cta.purple { background: linear-gradient(125deg, #d4bcff, #ffa8e6); color: #2c143b; }
.poster-card .card-preview { background: #14254a; border-color: #6e91cf8f; }
.poster-card .card-preview:hover { border-color: #a3f1ff; box-shadow: 0 10px 26px #07132c9c; }
#game-dialog { background: linear-gradient(145deg, #244577, #14274d); border-color: #94bbff; }
dialog::backdrop { background: #080f24dd; }
.signup-form { background: #111f41; border-color: #688dc6; }
.signup-form input { background: #1a315b; border-color: #7699d0; }
.signup-eyebrow { color: #a7faff; }
.signup-form input:focus-visible { outline-color: #a7faff; }
#site-footer { display: grid; gap: 14px; }
#footer-pages details {
  min-width: 0;
  padding: 13px;
  background: #14254a;
  border: 1px solid var(--line);
  border-radius: 11px;
}
#footer-pages summary { font-weight: 700; overflow-wrap: anywhere; }
#footer-pages p { color: #d1dfff; overflow-wrap: anywhere; }

main { margin-left: 0; padding-bottom: 0; }
.lobby-showcase {
  display: grid;
  grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
  gap: 18px;
}
.crown-feature {
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid #ffc678aa;
  background: #321e25;
  box-shadow: 0 12px 42px #030b205c;
}
.crown-feature img { width: 100%; height: auto; }
.crown-actions {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 14px 12px;
  background: #201a31;
}
.crown-open {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 5px 9px;
  min-height: 48px;
  padding: 9px 20px;
  border: 1px solid #ffe9ab;
  border-radius: 10px;
  background: linear-gradient(135deg, #fff0b1, #ffc363 56%, #eda045);
  color: #361b13;
  box-shadow: 0 6px 20px #1b0a0bd9, 0 0 14px #ffb95566;
  font-weight: 800;
  text-align: center;
}
.crown-open:hover { filter: brightness(1.08); }
.crown-browser { border-left: 1px solid #71402277; padding-left: 9px; font-size: .78rem; }
.crown-continue {
  padding: 7px 10px;
  border-radius: 7px;
  background: #1a1529ed;
  color: #ffebbd;
  font-size: .8rem;
  text-align: center;
  text-decoration: underline;
}
.lobby-showcase .hero-grid { grid-template-columns: 1fr; grid-template-rows: 1fr 1fr; }
.lobby-showcase .hero h2 { margin-bottom: 0; }
.lobby-showcase .slots-hero { background: #2b0c47; }
.lobby-showcase .slots-hero img {
  object-fit: contain;
  object-position: right center;
  filter: none;
}
#catalog { margin-top: 18px; }
@media (max-width: 760px) {
  .lobby-showcase { grid-template-columns: 1fr; gap: 13px; }
  .crown-feature { width: min(100%, 420px); justify-self: center; }
  #site-footer { padding-bottom: 26px; }
}

.prize-banner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
  padding: 8px 11px 8px 14px;
  border: 1px solid #a77b4e;
  border-radius: 13px;
  background: linear-gradient(110deg, #35262e, #171f40 46%, #211e37);
  box-shadow: 0 7px 24px #080e2680;
}
.prize-heading { margin: 0; color: #ffd996; font-size: .91rem; line-height: 1.15; }
.prize-heading svg { width: 23px; height: 23px; flex: none; }
.prize-window { overflow: hidden; container-type: inline-size; }
.prize-track { display: flex; width: max-content; animation: prize-scroll 27s linear infinite; }
.prize-list {
  display: flex;
  flex: none;
  min-width: 100cqi;
  align-items: stretch;
  gap: 7px;
  margin: 0;
  padding: 0 7px 0 0;
  list-style: none;
}
.prize-item {
  display: flex;
  flex: 1 0 auto;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 5px 10px;
  border-radius: 7px;
  background: #ffffff0c;
  white-space: nowrap;
  font-size: .81rem;
}
.prize-rank {
  display: grid;
  place-items: center;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background: #314779;
  color: #e1edff;
  font-size: .71rem;
  font-weight: 800;
}
.prize-item:nth-child(1) .prize-rank { background: #ffd58b; color: #432613; }
.prize-item:nth-child(2) .prize-rank { background: #d2dff4; color: #26334f; }
.prize-item:nth-child(3) .prize-rank { background: #e5ab89; color: #3a261f; }
.prize-item strong { color: #ffdb93; font-variant-numeric: tabular-nums; }
.prize-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font-weight: inherit;
}
.is-paused .prize-track { animation-play-state: paused; }
@keyframes prize-scroll { to { transform: translateX(-50%); } }

.catalog-layout {
  display: grid;
  grid-template-columns: 174px minmax(0, 1fr);
  gap: 18px;
  margin-top: 25px;
  align-items: start;
}
.category-panel { padding: 12px; border-radius: 12px; background: #0e1c3d; border: 1px solid var(--line); }
.category-panel h2 { margin: 2px 6px 10px; color: #b8dcff; font-size: .9rem; }
.category-links { display: grid; gap: 5px; }
.category-links a {
  display: flex;
  align-items: center;
  min-height: 43px;
  padding: 6px 9px;
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: .84rem;
  font-weight: 650;
}
.category-links a:hover, .category-links a[aria-current="page"] { background: #24477b; border-color: #7598cf; color: #ecf6ff; }
.catalog-main .search-row { margin-top: 0; }

.cover-frame { display: block; overflow: hidden; }
.trim-cover img { transform: scale(1.06); }
.dialog-body .cover-frame { border: 1px solid #7798ce; border-radius: 11px; }
.dialog-body .cover-frame img { border: 0; border-radius: 0; }
@media (max-width: 760px) {
  .prize-banner { grid-template-columns: minmax(0, 1fr); gap: 2px; padding: 4px 9px 9px; }
  .catalog-layout { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .category-links { display: flex; overflow-x: auto; padding: 3px; }
  .category-links a { flex: none; }
}
