/* hero */
.co-hero{position:relative;overflow:hidden;isolation:isolate;border-radius:28px;border:1px solid var(--co-line2);min-height:min(560px,64vh);display:flex;align-items:center;background:#252a30}
.co-hero__bg{position:absolute;inset:0;z-index:-2}
.co-hero__bg img{width:100%;height:100%;object-fit:cover;object-position:center right;display:block}
.co-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(22,27,31,.94) 0%,rgba(22,27,31,.82) 46%,rgba(22,27,31,.45) 100%),linear-gradient(0deg,rgba(22,27,31,.85),transparent 45%)}
.co-hero__fx{position:absolute;inset:0;z-index:-1;pointer-events:none}
.co-hero__in{width:100%;padding:clamp(24px,3.6vw,44px) clamp(20px,4.5vw,56px)}
.co-hero__eyebrow{display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;padding:6px 12px;border-radius:999px;background:rgba(0,85,254,.14);color:var(--co-lime);font-size:.85rem;font-weight:700;letter-spacing:.02em}
.co-hero h1{background:linear-gradient(100deg,#fff 30%,#9dbcff 75%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#fff}
@supports not ((-webkit-background-clip:text) or (background-clip:text)){.co-hero h1{-webkit-text-fill-color:#fff}}
.co-hero__lead{max-width:700px;margin:12px 0 22px;font-size:clamp(1.02rem,.95rem + .35vw,1.18rem);color:#dbe6dc}
.co-hero__offers{list-style:none;margin:0 0 22px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:760px}
.co-ob{position:relative;margin:0;border-radius:16px;overflow:hidden;border:1px solid rgba(127,168,255,.3);height:112px;background:#2d363e}
.co-ob img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.co-ob::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(18,22,26,.92) 8%,rgba(18,22,26,.55) 60%,rgba(18,22,26,.25))}
.co-ob__txt{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.co-ob__k{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--co-lime)}
.co-ob__v{font-family:var(--serif-font);font-weight:800;font-size:clamp(1.05rem,.8rem + .9vw,1.45rem);line-height:1.1;color:#fff}
.co-ob__x{font-size:.86rem;color:#cfdccf}
.co-hero__cta{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:899px){.co-hero__offers{gap:10px}}
@media (max-width:639px){
  .co-hero{min-height:0;border-radius:20px}
  .co-hero__bg img{object-position:center}
  .co-hero::before{background:linear-gradient(180deg,rgba(22,27,31,.78),rgba(22,27,31,.9) 60%,rgba(22,27,31,.96))}
  .co-hero__in{padding:20px 16px 20px}
  .co-hero__eyebrow{display:none}
  .co-hero__lead{margin:8px 0 14px;font-size:.95rem;line-height:1.5}
  .co-hero__offers{gap:8px;margin-bottom:18px}
  .co-ob{height:76px;border-radius:12px}
  .co-ob__txt{padding:8px}
  .co-ob__k{font-size:12px;letter-spacing:.02em;gap:4px}
  .co-ob__k .co-ic{display:none}
  .co-ob__v{font-size:.95rem;line-height:1.15}
  .co-ob__x{display:none}
  .co-hero__cta{flex-direction:column;gap:10px}
  .co-hero__cta .co-btn{width:100%;height:48px}
}

/* toc */
.co-toc{margin:14px 4px 0;color:var(--co-muted);font-size:.92rem}
.co-toc summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;padding:6px 2px;color:var(--co-muted);font-weight:600}
@media (min-width:1024px) and (hover:hover){.co-toc summary:hover{color:var(--co-text)}}
.co-toc ul{list-style:none;margin:8px 0 4px;padding:0;columns:3 220px;column-gap:28px}
.co-toc li{margin:0 0 6px;break-inside:avoid}
.co-toc a,.co-toc a:visited{color:var(--co-body);font-size:.92rem}
@media (min-width:1024px) and (hover:hover){.co-toc a:hover{color:var(--co-lime)}}

/* games mosaic */
.co-mosaic{list-style:none;margin:18px 0 22px;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;grid-auto-flow:dense}
.co-tile{margin:0;aspect-ratio:1;min-width:0}
.co-tile--big{grid-column:span 2;grid-row:span 2}
.co-tile__a{position:relative;display:block;width:100%;height:100%;border-radius:8px;overflow:hidden;background:#2d363e}
.co-tile__a img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.co-tile__ov{position:absolute;inset:auto 0 0 0;padding:28px 10px 10px;background:linear-gradient(0deg,rgba(18,22,26,.95),rgba(18,22,26,0));display:flex;flex-direction:column;gap:2px;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s}
.co-tile__ov strong{color:#fff;font-size:.9rem;line-height:1.2}
.co-tile__ov span{color:var(--co-lime);font-size:.78rem}
.co-tile__a:focus-visible .co-tile__ov{opacity:1;transform:none}
@media (min-width:1024px) and (hover:hover){.co-tile__a:hover .co-tile__ov{opacity:1;transform:none}.co-tile__a:hover img{transform:scale(1.05)}}
.co-tile--all .co-tile__a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:10px;background:linear-gradient(140deg,#0055fe,#0038b0);color:var(--co-ink)}
.co-tile--all .co-ic{width:30px;height:30px;stroke-width:2}
.co-tile--all strong{font-size:.92rem;line-height:1.2}
@media (max-width:1023px){.co-mosaic{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:599px){.co-mosaic{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.co-tile--all strong{font-size:12px}.co-tile--all .co-ic{width:22px;height:22px}}
@media (prefers-reduced-motion:reduce){.co-tile__a img,.co-tile__ov{transition:none}}

/* promo cards */
.co-promos{list-style:none;margin:24px 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.co-promos li{margin:0;display:flex}
.co-promo{display:flex;flex-direction:column;width:100%;border-radius:16px;overflow:hidden;background:var(--co-paper);box-shadow:0 10px 30px rgba(0,0,0,.35);transition:transform .25s,box-shadow .25s}
.co-promo__img{display:block;aspect-ratio:16/6;overflow:hidden;background:#2d363e}
.co-promo__img img{width:100%;height:100%;object-fit:cover;display:block}
.co-promo__body{display:flex;flex-direction:column;gap:4px;padding:16px 18px 18px;flex:1 1 auto}
.co-promo__k{font-family:var(--sans-font);font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#0047d6;margin:0}
.co-promo__v{font-family:var(--serif-font);font-weight:900;text-transform:uppercase;font-size:clamp(1.25rem,1rem + .6vw,1.55rem);line-height:1.08;color:var(--co-paper-ink)}
.co-promo__x{font-size:.95rem;font-weight:600;color:#2a3445}
.co-promo__c{margin-top:auto;padding-top:10px;font-size:.84rem;color:#4f5b6b}
@media (min-width:1024px) and (hover:hover){.co-promo:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,85,254,.22)}}
@media (max-width:1099px){.co-promos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:559px){.co-promos{grid-template-columns:minmax(0,1fr)}}

/* bonus ladder */
.co-ladder{border:1px solid var(--co-line2);border-radius:14px;overflow:hidden;margin:0 0 20px}
.co-ladder__head,.co-ladder__row{display:grid;grid-template-columns:1.1fr 1.6fr 1fr auto;gap:16px;align-items:center;padding:12px 18px}
.co-ladder__head{background:var(--co-card2);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--co-muted)}
.co-ladder__head span:last-child{text-align:right;min-width:104px}
.co-ladder__row{border-top:1px solid var(--co-line)}
.co-ladder__t{display:inline-flex;align-items:center;gap:10px;font-weight:700;color:var(--co-text)}
.co-ladder__t .co-ic{color:var(--co-lime);width:1.3em;height:1.3em}
.co-ladder__o{color:var(--co-text)}
.co-ladder__w small{display:none}
.co-ladder__row .co-btn{min-width:104px}
@media (max-width:719px){
  .co-ladder__head{display:none}
  .co-ladder__row{grid-template-columns:minmax(0,1fr) max-content;gap:4px 12px;padding:14px 16px}
  .co-ladder__o{grid-column:1/-1;order:3}
  .co-ladder__w{grid-column:1/-1;order:4;font-size:.9rem;color:var(--co-muted)}
  .co-ladder__w small{display:inline;margin-right:6px;font-size:.9rem}
  .co-ladder__row .co-btn{order:2;min-width:0}
}
.co-note{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:14px;background:rgba(0,85,254,.07);border:1px solid rgba(0,85,254,.25)}
.co-note>.co-ic{color:var(--co-lime);width:24px;height:24px;margin-top:2px}
.co-note p{margin:0}
.co-note__t{font-weight:800;color:var(--co-text);margin-bottom:4px!important}

/* pros and cons */
.co-pc__h{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;font-family:var(--sans-font);font-size:.95rem;margin:4px 0 14px}
.co-pc__h--pro{background:rgba(0,85,254,.14);color:var(--co-lime)}
.co-pc__h--con{background:rgba(240,181,74,.12);color:#f6cf86;margin-top:22px}
.co-pc__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 28px}
.co-pc__list li{display:flex;gap:12px;align-items:flex-start;margin:0;padding:12px 0;border-bottom:1px solid var(--co-line)}
.co-pc__list .co-ic{width:22px;height:22px;margin-top:1px}
.co-pc__list span{color:var(--co-body)}
@media (max-width:767px){.co-pc__list{grid-template-columns:minmax(0,1fr);gap:0}}

/* about + facts */
.co-about__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:start}
.co-about__txt>:last-child{margin-bottom:0}
.co-facts{border:1px solid var(--co-line2);border-radius:16px;overflow:hidden;background:var(--co-card2)}
.co-facts__cap{padding:16px 18px;background:linear-gradient(120deg,rgba(0,85,254,.22),rgba(0,85,254,.04));border-bottom:1px solid var(--co-line2)}
.co-facts__name{font-family:var(--serif-font);font-weight:800;font-size:1.3rem;color:#fff;margin:0}
.co-facts__sub{display:flex;align-items:center;gap:6px;margin:2px 0 0;color:var(--co-lime);font-size:.9rem;font-weight:600}
.co-facts .co-tablewrap{margin:0;border:0;border-radius:0}
@media (max-width:1023px){.co-about__grid{grid-template-columns:minmax(0,1fr)}}

/* tables */
.co-tablewrap{overflow-x:auto;margin:20px 0 0;border:1px solid var(--co-line2);border-radius:14px;-webkit-overflow-scrolling:touch}
.co-table{width:100%;border-collapse:collapse;margin:0;font-size:.95rem;display:table}
.co-table th,.co-table td{padding:12px 16px;border:0;border-bottom:1px solid var(--co-line);text-align:left;vertical-align:middle}
.co-table thead th{background:#333f48;color:var(--co-muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.co-table tbody tr:nth-child(2n){background:rgba(255,255,255,.02)}
.co-table tbody tr:last-child td{border-bottom:0}
.co-table--facts td:first-child{color:var(--co-muted);white-space:nowrap}
.co-table--facts td:first-child .co-ic{color:var(--co-lime);margin-right:8px}
.co-table--facts td:last-child{color:var(--co-text);font-weight:600}

/* game banner */
.co-banner{position:relative;overflow:hidden;isolation:isolate;border-radius:var(--co-r);border:1px solid var(--co-line2);min-height:420px;display:flex;align-items:center;justify-content:center;text-align:center;background:#252a30}
.co-banner__bg{position:absolute;inset:-20px;width:calc(100% + 40px);height:calc(100% + 40px);max-width:none;object-fit:cover;z-index:-2;filter:saturate(1.15)}
.co-banner::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(closest-side,rgba(22,27,31,.45),rgba(22,27,31,.86))}
.co-banner__in{padding:36px 20px;display:flex;flex-direction:column;align-items:center}
.co-banner__art{display:block;width:clamp(170px,22vw,250px);aspect-ratio:1;border-radius:22px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.12);margin-bottom:18px;transition:transform .3s}
.co-banner__art img{width:100%;height:100%;object-fit:cover;display:block}
@media (min-width:1024px) and (hover:hover){.co-banner__art:hover{transform:translateY(-4px) rotate(-1deg)}}
.co-banner__k{margin:0 0 4px;font-size:.8rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--co-lime)}
.co-banner h2{margin:0 0 4px;color:#fff}
.co-banner__p{margin:0 0 18px;color:#d1ddd2}
@media (max-width:599px){.co-banner{min-height:0}.co-banner__art{width:min(200px,62vw)}}
