:root{
  --bg-0:#120a06; --bg-1:#1b0f0a; --panel:#26150e;
  --cocoa-1:#2e1a12; --cocoa-2:#3b2117; --cocoa-3:#140b07;
  --gold-1:#f3d7a2; --gold-2:#d1a869; --gold-3:#9c6c34;
  --jade-1:#33a164; --jade-2:#2a8a55; --jade-3:#1d6a40;
  --text:#ffe7cc; --muted:#c9a984;
  --shadow: 0 10px 24px rgba(0,0,0,.45);
  --bevel: 0 8px 0 var(--cocoa-3), inset 0 1px 0 rgba(255,255,255,.06), inset 0 -2px 0 rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{height:100%}
body.robin{
  margin:0; background: radial-gradient(1600px 600px at 20% -10%, #2c1a12 0%, #180e09 50%, #0f0906 100%) fixed;
  color:var(--text); font: 500 16px/1.45 ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Apple Color Emoji","Segoe UI Emoji";
}

.topbar{
  position:sticky; top:0; z-index:30;
  height:64px; margin-left:260px; display:flex; gap:16px; align-items:center; padding:0 24px;
  background:linear-gradient(#1e120c,#170d08); border-bottom:1px solid #2d1912; box-shadow:var(--shadow);
}
.search{ flex:1; }
.search input{
  width:100%; height:40px; border-radius:10px; padding:0 14px 0 40px; color:var(--text);
  background:linear-gradient(180deg,#2a1a12,#1f120c); border:1px solid #3a2218; outline:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), inset 0 -1px 0 rgba(0,0,0,.35);
}
.search input::placeholder{ color:#b89169 }
.auth{ display:flex; gap:10px }

.rail{
  position:fixed; inset:0 auto 0 0; width:260px; background:linear-gradient(#20120c,#150b07);
  border-right:1px solid #2c1913; z-index:40; box-shadow: var(--shadow);
}
.brand{ padding:18px 16px; display:flex; align-items:center; justify-content:center; border-bottom:1px solid #2c1913 }
.brand__logo{ height:36px; filter: drop-shadow(0 4px 0 var(--cocoa-3)) }
.rail__nav{ display:flex; flex-direction:column; gap:6px; padding:12px }
.rail__item{
  display:flex; align-items:center; gap:10px; height:44px; padding:0 14px; border-radius:12px;
  color:#f6e3c7; text-decoration:none; background:linear-gradient(#27170f,#1d100a);
  border:1px solid #3a2218; box-shadow: var(--bevel);
}
.rail__item.current{ outline:2px solid #5a3a20; background:linear-gradient(#2c1a11,#20120c) }
.rail__footer{ padding:12px; display:flex; gap:8px; border-top:1px solid #2c1913; margin-top:10px }
.pill{
  height:36px; padding:0 12px; border-radius:10px; background:linear-gradient(#3b2519,#2a1a12);
  color:#f7dcb5; border:1px solid #55331f; box-shadow: var(--bevel); cursor:pointer;
}
.pill--lang::before{content:"🇬🇧"; margin-right:8px}
.pill--chat::before{content:"💬"; margin-right:8px}

.burger{ display:none }
.scrim{ position:fixed; inset:0; background:rgba(0,0,0,.5) }

.content{ margin-left:260px; padding:18px 24px 80px }

.btn{
  position:relative; display:inline-grid; place-items:center; height:40px; padding:0 16px; border-radius:12px;
  border:1px solid var(--cocoa-2); color:#fff; text-decoration:none; cursor:pointer; user-select:none;
  transition: transform .06s ease;
}
.btn:active{ transform:translateY(1px) }
.btn--lg{ height:48px; padding:0 22px; font-weight:700 }
.btn--gold{ background:linear-gradient(#f6d39c,#d4a764); color:#3a2415; border-color:#9b6c32; box-shadow:0 8px 0 #2b180e,inset 0 1px 0 #fff6, inset 0 -2px 0 #0006 }
.btn--emerald{ background:linear-gradient(#34a365,#2a8b55); border-color:#0a4226; box-shadow:0 8px 0 #0a4226, inset 0 1px 0 #fff3, inset 0 -2px 0 #0005 }
.btn--glass{ background:linear-gradient(#3b271c,#25160f); border-color:#55331f; color:#f3d7a2; box-shadow:var(--bevel) }

.chip{
  height:34px; padding:0 12px; border-radius:12px; color:#f3d7a2; background:linear-gradient(#3b2519,#2a1a12);
  border:1px solid #4c2f1c; box-shadow:var(--bevel); cursor:pointer;
}
.chip.is-on{ background:linear-gradient(#4a2e1d,#372114); outline:2px solid #5a3620 }

.hero-slider{ position:relative; max-width:1400px; margin:0 auto 16px; padding:10px 0; perspective:1000px }
.hero-slider .slides{
  position:relative; display:flex; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  height:clamp(260px, 34vw, 460px); border-radius:16px; border:2px solid var(--cocoa-2); background:#1b100a;
}
.hero-slider .slides::-webkit-scrollbar{ display:none }
.slide{ position:relative; flex:0 0 100%; height:100%; display:flex; align-items:center; scroll-snap-align:start; background:#000 }
.slide::before{
  content:""; position:absolute; inset:0 42% 0 0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, rgba(43,32,26,.95) 0%, rgba(43,32,26,.78) 45%, rgba(43,32,26,0) 100%);
}
.slide__video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:#000; z-index:0; pointer-events:none }
.slide__content{ position:relative; z-index:2; padding:24px; max-width:620px; will-change:transform; transition: transform .2s ease }
.eyebrow{ color:var(--gold-1); letter-spacing:.12em; text-transform:uppercase; margin:0 0 6px }
.lede{ color:#f4e3c7; opacity:.95; margin:.4em 0 1em }
.hero-nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:5; width:42px; height:42px; border-radius:10px;
  border:2px solid var(--cocoa-2); color:#ffe6c9; background:linear-gradient(#5b4538,#3f3027); box-shadow:0 6px 0 var(--cocoa-3);
  display:grid; place-items:center; cursor:pointer; user-select:none;
}
.hero-nav.prev{ left:16px } .hero-nav.next{ right:16px }
.hero-nav:active{ transform:translateY(calc(-50% + 1px)) }
.tabs{ display:flex; gap:8px; padding:10px 4px; justify-content:center; }
.dots{ position:absolute; left:0; right:0; bottom:10px; display:flex; gap:8px; justify-content:center; z-index:4 }
.dots button{ width:10px; height:10px; border-radius:50%; border:2px solid var(--cocoa-2); background:#6e5142; opacity:.9; cursor:pointer }
.dots button[aria-current="true"]{ background:var(--gold-1); animation:breathe 1.6s ease-in-out infinite }
@keyframes breathe{ 0%,100%{ transform:scale(1.04) } 50%{ transform:scale(1.2) } }

.hero-ambient{ position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden }
.hero-ambient .speck{
  position:absolute; width:6px; height:6px; border-radius:50%; opacity:.35; filter:blur(.4px);
  background: radial-gradient(var(--gold-1), rgba(255,210,122,0) 60%);
  animation: floatY var(--dur, 12s) linear infinite;
  transform: translate3d(var(--x,0px), var(--y,0px), 0) scale(var(--s,1));
}
@keyframes floatY{
  0%{ transform: translate3d(var(--x), calc(var(--y) + 40px), 0) scale(var(--s)); opacity:0 }
  10%,90%{ opacity:.35 }
  100%{ transform: translate3d(var(--x), calc(var(--y) - 140px), 0) scale(var(--s)); opacity:0 }
}

.row{ max-width:1400px; margin:18px auto }
.row__head{ display:flex; align-items:center; justify-content:space-between; margin:0 4px 10px }
.row__head h2{ margin:0; font-size:22px }
.seeall{ color:var(--gold-1); text-decoration:none }
.cards{ display:flex; gap:14px; overflow:auto; padding:6px 4px }
.cards::-webkit-scrollbar{ height:10px } .cards::-webkit-scrollbar-thumb{ background:#3a2317; border-radius:10px }

.game{
  position:relative; display:block; width:210px; aspect-ratio:210/310; flex:0 0 auto; border-radius:16px;
  background:linear-gradient(#2b1a12,#1c100a); border:2px solid #4c2f1c; box-shadow: var(--shadow);
  overflow:hidden; isolation:isolate;
}
.game img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(1.02) contrast(1.02) }
.tag--num{
  position:absolute; left:8px; bottom:8px; z-index:2; display:grid; place-items:center; width:28px; height:28px;
  border-radius:8px; background:linear-gradient(#4a2e1d,#372114); color:#ffdca3; border:1px solid #5b3a23; box-shadow: var(--bevel);
  font-weight:700;
}
.badge{
  position:absolute; right:10px; top:10px; z-index:2; padding:4px 8px; border-radius:9px;
  background:linear-gradient(#4a2e1d,#2e1a12); border:1px solid #6a4326; color:#ffdca3; font-size:12px; box-shadow:var(--bevel)
}
.badge--new{ background:linear-gradient(#2b6e3f,#1e4f2d); border-color:#0c3d1f }

.promo{
  position:relative; max-width:1400px; margin:14px auto; border-radius:18px; background:#1b100a; border:2px solid #4c2f1c;
  display:grid; grid-template-columns: 1.2fr .8fr; overflow:hidden;
}
.promo__media{ min-height:220px; background:#000 center / cover no-repeat }
.promo__content{ padding:18px 20px; display:grid; align-content:center; gap:8px }
.promo__lede{ font-size:26px; color:var(--gold-1); margin:0 }

.arches{ display:grid; grid-template-columns:repeat(7,minmax(160px,1fr)); gap:14px }
.arch{
  position:relative; aspect-ratio: 210/310; border-radius:18px 18px 12px 12px;
  background:radial-gradient(200% 100% at 50% 0%, #4a0 0%, #711 30%, #1a0f0a 60%) center/cover no-repeat; 
  border:2px solid #4c2f1c; box-shadow:var(--shadow); overflow:hidden;
}
.arch::after{
  content:""; position:absolute; inset:0; background: var(--img, none) center/cover no-repeat; filter:saturate(1.02) contrast(1.02);
}
.arch span{
  position:absolute; left:0; right:0; bottom:8px; text-align:center; padding:0 10px; font-weight:700;
  text-shadow:0 2px 0 #000a;
}

.strip{ max-width:1400px; margin:18px auto; display:grid; grid-template-columns:repeat(3,1fr); gap:12px }
.strip__item{ height:180px; border-radius:16px; border:2px solid #4c2f1c; box-shadow:var(--shadow); background:#000 center/cover no-repeat }

.sitefoot{ margin-left:260px; padding:24px 24px 60px; background:linear-gradient(#1a0f0a,#150c07); border-top:1px solid #2b1912 }
.footgrid{ max-width:1400px; margin:0 auto 20px; display:grid; grid-template-columns:repeat(6,1fr); gap:16px }
.sitefoot h4{ margin:0 0 10px; color:#f3d7a2 }
.sitefoot a{ color:#e8cfaa; text-decoration:none; display:block; padding:2px 0 }
.footpay{ display:flex; gap:8px; justify-content:center; margin:12px 0 }
.fineprint{ color:#c9a984; text-align:center; opacity:.85 }

@media (max-width: 1024px){
  .content,.sitefoot,.topbar{ margin-left:0 }
  .rail{ transform:translateX(-100%); transition:transform .2s ease }
  body.nav-open .rail{ transform:none }
  .burger{ display:block; position:fixed; left:10px; top:10px; z-index:50; background:#2b1a12; border:1px solid #4c2f1c; border-radius:10px; width:42px; height:42px }
  .scrim[hidden]{ display:none }
  .topbar{ padding-left:60px }
  .arches{ grid-template-columns:repeat(3,1fr) }
  .strip{ grid-template-columns:1fr }
}
@media (prefers-reduced-motion: reduce){
  .hero-ambient .speck, .dots button[aria-current="true"]{ animation:none !important }
  .slide__content{ transition:none !important }
}

img.twemoji, svg.twemoji{ width:1.05em; height:1.05em; vertical-align:-0.15em; filter: drop-shadow(0 1px 0 rgba(0,0,0,.25)) }

.fold{
  border-radius:16px;
  border:1px solid var(--cocoa-2, #3b2117);
  background:linear-gradient(180deg, var(--cocoa-1, #2e1a12), var(--cocoa-3, #140b07));
  box-shadow: 0 8px 20px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06), inset 0 -2px 0 rgba(0,0,0,.35);
  overflow:hidden;
}

.fold > summary{
  list-style:none;
  display:flex; align-items:center; gap:10px;
  padding:14px 16px;
  cursor:pointer; user-select:none;
  color:var(--text, #ffe7cc);
  background:linear-gradient(180deg, #3b2519, #2a1a12);
  border-bottom:1px solid rgba(0,0,0,.35);
  position:relative;
}
.fold > summary::-webkit-details-marker{ display:none }

.fold .fold__icon{
  width:22px; height:22px; border-radius:8px;
  background:linear-gradient(180deg, #5b4538, #3f3027);
  border:1px solid var(--cocoa-2, #3b2117);
  box-shadow:0 3px 0 var(--cocoa-3, #140b07), inset 0 1px 0 rgba(255,255,255,.18);
  position:relative; flex:0 0 22px;
}
.fold .fold__icon::before{
  content:""; position:absolute; inset:0;
  width:100%; height:100%; display:block;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M6 8l4 4 4-4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/14px 14px no-repeat;
  background:#ffe6c9;
  transition: transform .18s ease;
}

.fold .fold__body{
  padding:16px 16px 18px;
  background:
    radial-gradient(1200px 300px at 20% 0%, rgba(243,215,162,.08), transparent 60%),
    linear-gradient(180deg, #1b100a, #150c07);
  color:var(--text, #ffe7cc);
}
.fold .fold__body p{ margin:0 0 12px; opacity:.96 }
.fold .fold__body p:last-child{ margin-bottom:0 }

.fold[open] > summary{
  background:linear-gradient(180deg, #4a2e1d, #372114);
  border-bottom-color:rgba(0,0,0,.45);
  outline:2px solid #5a3620;
  outline-offset:-2px;
}
.fold[open] .fold__icon::before{ transform: rotate(180deg); }

.fold > summary:hover{ filter:saturate(1.04) }
.fold > summary:focus-visible{
  outline:2px solid var(--gold-2, #d1a869);
  outline-offset:2px;
  border-radius:14px;
}

@media (prefers-reduced-motion: reduce){
  .fold .fold__icon::before{ transition:none }
}

@media (max-width: 1024px){
.footgrid {
    display: flex;
    flex-wrap: wrap;
}}

.main_404 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 40px 20px;
}

.breadcrumbs_404 {
    width: 100%;
    max-width: 1200px;
    font-size: 14px;
}

.link-ma-b_404 {
    color: #666;
    text-decoration: none;
    margin-right: 10px;
}

.link-ma-b_404:hover {
    color: #d1a869;
}

.breadcrumbs-link_404 {
    color: #999;
    text-decoration: none;
}

.container_404 {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.page_404_content {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.title_404 {
    font-size: 120px;
    font-weight: bold;
    color: #333;
    margin: 0 0 20px 0;
    line-height: 1;
}

.description_404 {
    font-size: 24px;
    color: #666;
    margin: 0 0 40px 0;
}

.btn_404 {
    display: inline-block;
    padding: 15px 30px;
    background-color: #d1a869;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    font-size: 18px;
    font-weight: bold;
    transition: background-color 0.3s ease;
    border: none;
    cursor: pointer;
}

.btn_404:hover {
    background-color: #d1a869;
    color: white;
    text-decoration: none;
}

@media (max-width: 768px) {
    .main_404 {
        min-height: calc(100vh - 120px);
        padding: 20px 15px;
        margin: 60px 0;
    }
    
    .breadcrumbs_404 {
        margin-bottom: 20px;
        font-size: 12px;
    }
    
    .title_404 {
        font-size: 80px;
        margin-bottom: 15px;
    }
    
    .description_404 {
        font-size: 18px;
        margin-bottom: 30px;
    }
    
    .btn_404 {
        padding: 12px 25px;
        font-size: 16px;
    }
    
    .container_404 {
        padding: 0 15px;
    }
}

@media (max-width: 480px) {
    .main_404 {
        min-height: calc(100vh - 100px);
        padding: 15px 10px;
        margin: 50px 0;
    }
    
    .title_404 {
        font-size: 60px;
    }
    
    .description_404 {
        font-size: 16px;
        margin-bottom: 25px;
    }
    
    .btn_404 {
        padding: 10px 20px;
        font-size: 14px;
    }
}