/* Cosmic Starship 2.53: the website's design. Full-width dark "space" bands (banners, videos, the fleet carousel,
   calls to action) alternate with the theme's own content column, so the pages read well in any light or dark
   theme. Everything is scoped to .cs-page; --veilbound-sbw (scrollbar width) is measured by site.php. */
.cs-page{--cs-gold:#e2c694;--cs-gold-2:#c9a46a;--cs-mint:#a1e1c8;--cs-ink:#071017;--cs-deep:#0b1418;--cs-panel:#0f1d24;--cs-line:rgba(128,140,150,.28);--cs-soft:rgba(128,140,150,.08);--cs-on-dark:#e9eee8;--cs-muted-dark:#a9b8b5;--cs-radius:14px;--cs-vw:max(calc(100vw - var(--veilbound-sbw,0px)),calc(100vw - 24px))}
.cs-page>*:first-child{margin-top:0}
.cs-page section{margin:2.5em 0}
.cs-page h2{scroll-margin-top:90px}
.cs-page img{max-width:100%;height:auto}

/* ---- full-width bands ---- */
.cs-bleed{width:var(--cs-vw)!important;max-width:none!important;margin-left:calc(50% - var(--cs-vw) / 2)!important;margin-right:0!important;box-sizing:border-box}
.cs-inner{max-width:1180px;margin:0 auto;padding:0 24px;box-sizing:border-box}
.cs-band{background:radial-gradient(1200px 400px at 85% -10%,rgba(93,242,201,.09),transparent 60%),radial-gradient(900px 500px at 0% 110%,rgba(226,198,148,.08),transparent 60%),var(--cs-ink);color:var(--cs-on-dark);padding:64px 0}
.cs-band h2,.cs-band h3{color:#fff}
.cs-band p{color:var(--cs-muted-dark)}
.cs-band a:not(.cs-button){color:var(--cs-gold)}
.cs-cta{text-align:center;padding:72px 0;background:linear-gradient(180deg,rgba(7,16,23,.6),rgba(7,16,23,.95)),url("img/battle.webp") center/cover,var(--cs-ink)}
.cs-cta h2{font-size:clamp(1.6rem,3.5vw,2.4rem);margin:0 0 .3em}
.cs-cta .cs-actions{justify-content:center}

/* ---- banners ---- */
.cs-hero{position:relative;display:flex;align-items:flex-end;min-height:320px;padding:56px 0 48px;color:var(--cs-on-dark);background:linear-gradient(90deg,rgba(4,10,16,.94) 0%,rgba(4,10,16,.7) 45%,rgba(4,10,16,.25) 100%),var(--bg) center/cover no-repeat,var(--cs-ink);overflow:hidden}
.cs-hero::after{content:"";position:absolute;inset:auto 0 0 0;height:2px;background:linear-gradient(90deg,transparent,var(--cs-gold),transparent);opacity:.55}
.cs-hero .cs-inner{position:relative;width:100%}
.cs-hero-main{min-height:min(78vh,720px);align-items:center}
.cs-hero-title{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(2rem,4.6vw,3.6rem);line-height:1.08;letter-spacing:-.01em;color:#fff!important;margin:.15em 0 .35em;max-width:16em;text-shadow:0 2px 24px rgba(0,0,0,.5)}
.cs-hero-main .cs-hero-title{font-size:clamp(2.3rem,6vw,4.6rem)}
.cs-hero-sub{font-size:clamp(1rem,1.6vw,1.2rem);line-height:1.6;color:#d3dcd8!important;max-width:38em;margin:0 0 1.4em}
.cs-race{background:linear-gradient(90deg,rgba(4,10,16,.95) 0%,rgba(4,10,16,.75) 50%,rgba(4,10,16,.35) 100%),radial-gradient(800px 400px at 80% 50%,color-mix(in srgb,var(--c) 35%,transparent),transparent 70%),var(--bg) right center/auto 120% no-repeat,var(--cs-ink)}
.cs-race .cs-eyebrow{color:var(--c)}
.cs-eyebrow{font:600 12px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--cs-gold-2);margin:0 0 .5em}
.cs-hero .cs-eyebrow,.cs-band .cs-eyebrow{color:var(--cs-gold)}

/* ---- buttons ---- */
.cs-actions{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.cs-button{display:inline-flex;align-items:center;gap:.4em;padding:.8em 1.5em;border-radius:999px;background:linear-gradient(180deg,#f0d6a6,var(--cs-gold) 60%,var(--cs-gold-2));color:#10161b!important;font-weight:700;letter-spacing:.01em;text-decoration:none!important;box-shadow:0 6px 24px rgba(226,198,148,.25),inset 0 1px 0 rgba(255,255,255,.5);transition:transform .15s,box-shadow .15s}
.cs-button:hover,.cs-button:focus-visible{transform:translateY(-1px);box-shadow:0 10px 30px rgba(226,198,148,.35),inset 0 1px 0 rgba(255,255,255,.5)}
.cs-ghost{background:rgba(255,255,255,.06);color:var(--cs-gold)!important;box-shadow:inset 0 0 0 1px rgba(226,198,148,.6)}
.cs-ghost:hover,.cs-ghost:focus-visible{background:rgba(226,198,148,.12);box-shadow:inset 0 0 0 1px var(--cs-gold)}
section:not(.cs-band):not(.cs-hero)>p>.cs-ghost,.cs-page>p>.cs-ghost{color:var(--cs-gold-2)!important;background:transparent;box-shadow:inset 0 0 0 1px var(--cs-gold-2)}

/* ---- home ---- */
body.cosmic-home .entry-header,body.cosmic-home .entry-title,body.cosmic-home .page-header,body.cosmic-home .wp-block-post-title,body.cosmic-home h1.page-title{display:none!important}
.cs-stats{list-style:none;margin:0 0 2.5em!important;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--cs-line);border:1px solid var(--cs-line);border-radius:var(--cs-radius);overflow:hidden;position:relative;z-index:1;transform:translateY(-36px)}
.cs-stats li{background:var(--cs-deep);color:var(--cs-on-dark);padding:20px 12px;text-align:center}
.cs-stats b{display:block;font:400 clamp(1.6rem,3.4vw,2.4rem)/1 Georgia,serif;color:var(--cs-gold)}
.cs-stats span{display:block;margin-top:6px;font:600 11px/1.3 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--cs-muted-dark)}
.cs-lead{font-size:1.15em;line-height:1.7}
.cs-intro{max-width:52em}

/* ---- cards and grids ---- */
.cs-features,.cs-cards,.cs-carousel,.cs-civs,.cs-mosaic,.cs-gallery,.cs-roles,.cs-tiers{list-style:none!important;margin:1.2em 0!important;padding:0!important}
.cs-features{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.cs-features li{margin:0;border:1px solid var(--cs-line);border-radius:var(--cs-radius);overflow:hidden;background:var(--cs-soft);transition:transform .2s,box-shadow .2s}
.cs-features li:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(0,0,0,.18)}
.cs-features a{display:block;color:inherit!important;text-decoration:none!important;height:100%}
.cs-features img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--cs-ink)}
.cs-card-body{display:block;padding:14px 16px 16px}
.cs-card-body strong{display:block;font-size:1.05em;margin-bottom:4px}
.cs-card-body span{display:block;font-size:.92em;line-height:1.5;opacity:.8}
.cs-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.cs-cards-sm{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.cs-card{margin:0}
.cs-card a{display:block;height:100%;color:inherit!important;text-decoration:none!important;border:1px solid var(--cs-line);border-radius:12px;overflow:hidden;background:var(--cs-soft);transition:border-color .15s,transform .15s}
.cs-card a:hover,.cs-card a:focus-visible{border-color:var(--cs-gold-2);transform:translateY(-2px)}
.cs-card img.cs-ship{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:0}
.cs-card .cs-card-body{padding:10px 12px 12px}
.cs-card .cs-card-body span{font-size:.82em}
.cs-tag{display:inline-flex!important;align-items:center;gap:6px;margin-top:6px;font:600 10px/1.4 ui-monospace,monospace!important;letter-spacing:.1em;text-transform:uppercase;opacity:.85!important}
.cs-tag::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c)}
.cs-band .cs-card a{background:var(--cs-panel);border-color:#21333a;color:var(--cs-on-dark)!important}
.cs-carousel{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,250px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 16px!important;scrollbar-color:var(--cs-gold-2) transparent}
.cs-carousel>li{scroll-snap-align:start}
img.cs-ship{display:block;width:100%;height:auto;background:#06101a;border-radius:10px}
/* 1.17.0: the civilizations as a register (ship, name, kind, one line of lore) between hairlines, not tinted cards */
.cs-civs{display:grid;grid-template-columns:1fr;column-gap:40px;border-top:1px solid var(--cs-line)}
.cs-civs li{margin:0;border-bottom:1px solid var(--cs-line)}
.cs-civs a{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:center;padding:14px 0;color:inherit!important;text-decoration:none!important}
.cs-civs img{display:block;width:120px;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 50%;background:#06101a;border-radius:3px}
.cs-civs strong{display:block;font-size:1.12em;line-height:1.25}
.cs-civs small{display:block;margin:2px 0 4px;font-size:.72em;letter-spacing:.08em;text-transform:uppercase;opacity:.6}
.cs-civs a>span>span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.9em;line-height:1.45;opacity:.82}
.cs-civs a:hover strong,.cs-civs a:focus-visible strong{text-decoration:underline;text-underline-offset:3px}
@media (min-width:860px){.cs-civs{grid-template-columns:1fr 1fr}.cs-civs a{grid-template-columns:128px minmax(0,1fr);gap:18px}.cs-civs img{width:128px}}
@media (max-width:420px){.cs-civs a{grid-template-columns:96px minmax(0,1fr);gap:12px}.cs-civs img{width:96px}}

/* ---- pictures ---- */
.cs-shot{margin:1.8em 0}
.cs-shot img{display:block;width:100%;height:auto;border-radius:var(--cs-radius);background:var(--cs-ink);box-shadow:0 12px 40px rgba(0,0,0,.25)}
.cs-shot figcaption,.cs-gallery figcaption,.cs-video figcaption{font-size:.86em;opacity:.75;margin-top:.6em}
.cs-mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:150px;gap:10px}
.cs-mosaic li{margin:0;overflow:hidden;border-radius:12px;background:var(--cs-ink)}
.cs-mosaic li:first-child{grid-column:span 2;grid-row:span 2}
.cs-mosaic li:nth-child(6){grid-column:span 2}
.cs-mosaic a,.cs-mosaic img{display:block;width:100%;height:100%}
.cs-mosaic img{object-fit:cover;transition:transform .4s}
.cs-mosaic a:hover img{transform:scale(1.05)}
.cs-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.cs-gallery li{margin:0}
.cs-gallery figure{margin:0}
.cs-gallery img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:12px;background:var(--cs-ink);transition:transform .2s}
.cs-gallery a:hover img{transform:scale(1.02)}
.cs-video{margin:1.5em 0}
.cs-video video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:var(--cs-radius);background:#000;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.cs-band .cs-video{max-width:980px;margin:1.5em auto 0}
.cs-video-tall video{aspect-ratio:9/16;max-height:80vh;width:auto;max-width:100%;margin:0 auto}
.cs-videos-tall{display:grid;grid-template-columns:minmax(0,360px) 1fr;gap:24px;align-items:center;margin:1.2em 0}
.cs-center{text-align:center}

/* ---- guides, tables, lists ---- */
.cs-toc{border:1px solid var(--cs-line);border-radius:12px;padding:14px 18px;background:var(--cs-soft);margin:1.5em 0}
.cs-toc ol{margin:0;padding-left:1.2em;columns:2 220px;column-gap:28px}
.cs-toc li{margin:.15em 0}
.cs-table{width:100%;border-collapse:collapse;margin:1.2em 0;font-size:.95em}
.cs-table th,.cs-table td{border-bottom:1px solid var(--cs-line);padding:.6em .7em;text-align:left;vertical-align:top}
.cs-table thead th{font:600 11px/1.4 ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;opacity:.8}
.cs-table tbody th{width:34%;font-weight:600}
kbd{display:inline-block;min-width:1.6em;padding:0 .45em;border:1px solid rgba(128,128,128,.45);border-bottom-width:3px;border-radius:5px;font:600 .82em/1.7 ui-monospace,monospace;text-align:center;background:var(--cs-soft)}
.cs-roles{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.cs-roles li{margin:0;padding:14px 16px;border:1px solid var(--cs-line);border-radius:12px;background:var(--cs-soft)}
.cs-roles strong{display:block;font-size:1.05em;margin-bottom:4px}
.cs-roles span{display:block;line-height:1.55}
.cs-roles small{display:block;margin-top:8px;opacity:.7;line-height:1.45}
.cs-race-head{border-left:4px solid var(--c);padding-left:12px}
.cs-trait{border:1px solid var(--cs-line);border-left:4px solid var(--c);border-radius:10px;padding:14px 16px;background:linear-gradient(90deg,color-mix(in srgb,var(--c) 12%,transparent),transparent 60%)}
.cs-trait strong{display:block;margin-bottom:2px}
.cs-grid2{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px;margin:1.2em 0}
.cs-mode{margin:0!important;padding:0 0 16px;border:1px solid var(--cs-line);border-radius:var(--cs-radius);overflow:hidden;background:var(--cs-soft)}
.cs-mode>*{margin-left:18px;margin-right:18px}
.cs-mode>img{display:block;width:100%;margin:0 0 4px;aspect-ratio:16/9;object-fit:cover}
.cs-mode h2,.cs-mode h3{margin-top:14px;margin-bottom:4px}
.cs-pill{display:inline-block;padding:1px 9px;margin-left:4px;border:1px solid var(--cs-line);border-radius:999px;font:600 11px/1.6 ui-monospace,monospace;letter-spacing:.05em;opacity:.85;vertical-align:middle}
.cs-missions{padding-left:1.4em}
.cs-missions li{margin:.55em 0}
.cs-missions li span:not(.cs-pill){opacity:.8;font-size:.95em}
.cs-region,.cs-boss{padding-top:.5em;border-top:1px solid var(--cs-line)}
.cs-tiers{display:flex;flex-wrap:wrap;gap:10px}
.cs-tiers li{margin:0;padding:10px 14px;border-radius:10px;border:1px solid color-mix(in srgb,var(--c) 60%,transparent);background:color-mix(in srgb,var(--c) 12%,transparent)}
.cs-tiers strong{display:block;color:var(--c);filter:brightness(.85)}
.cs-tiers span{font-size:.85em;opacity:.8}
.cs-civ{display:grid;grid-template-columns:minmax(0,320px) 1fr;gap:22px;align-items:start;padding:18px;border:1px solid var(--cs-line);border-left:4px solid var(--c);border-radius:var(--cs-radius);background:linear-gradient(90deg,color-mix(in srgb,var(--c) 9%,transparent),transparent 50%)}
.cs-civ img{display:block;width:100%;border-radius:10px;background:var(--cs-ink)}
.cs-civ h2{margin:0}
.cs-civ .cs-eyebrow{color:var(--c);filter:brightness(.8)}
.cs-news{border:1px solid var(--cs-line);border-radius:var(--cs-radius);padding:6px 22px 14px;background:var(--cs-soft)}
.cs-contact{font-size:1.2em;padding:16px 20px;border:1px solid var(--cs-line);border-radius:12px;background:var(--cs-soft)}
.cs-contact strong{display:block;font:600 11px/1.4 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;opacity:.7}
.cs-cols{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:2em}
.cs-page details{border:1px solid var(--cs-line);border-radius:12px;margin:10px 0;background:var(--cs-soft)}
.cs-page summary{cursor:pointer;padding:14px 18px;font-weight:600;font-size:1.05em}
.cs-page details>p{margin:0;padding:0 18px 16px}

/* ---- ship cards with stat bars ---- */
.cs-shipcard{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:0 26px;margin:2.2em 0;padding:20px;border:1px solid var(--cs-line);border-radius:18px;background:var(--cs-soft);scroll-margin-top:90px}
.cs-shipcard-img img{border-radius:12px}
.cs-shipcard-body h2{margin:.1em 0 .5em}
.cs-shipcard-text{grid-column:1/-1;margin-top:14px;columns:2 300px;column-gap:28px}
.cs-shipcard-text p{break-inside:avoid;margin:0 0 .8em}
.cs-price{font:600 12px/1.4 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--cs-gold-2)}
.cs-bar{display:grid;grid-template-columns:76px 1fr auto;align-items:center;gap:10px;margin:7px 0;font-size:.88em}
.cs-bar span{opacity:.75}
.cs-bar i{position:relative;display:block;height:8px;border-radius:4px;background:rgba(128,140,150,.2);overflow:hidden}
.cs-bar i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--v);border-radius:inherit;background:linear-gradient(90deg,var(--cs-gold-2),var(--cs-gold) 60%,var(--cs-mint))}
.cs-bar b{font:600 12px/1 ui-monospace,monospace;min-width:4.5em;text-align:right}

/* ---- the play page and the footer ---- */
.cs-play .veilbound-shell{margin-top:1.5em;margin-bottom:2em}
.cosmic-legal{text-align:center;font-size:.85em;padding:1.5em 16px;opacity:.85}

@media (max-width:900px){
  .cs-stats{grid-template-columns:repeat(3,1fr)}
  .cs-stats li:nth-child(n+4){grid-column:span 1}
  .cs-cols{grid-template-columns:1fr}
  .cs-mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:130px}
  .cs-shipcard{grid-template-columns:1fr}
  .cs-shipcard-img{margin-bottom:12px}
  .cs-civ{grid-template-columns:1fr}
}
@media (max-width:600px){
  .cs-inner{padding:0 16px}
  .cs-hero{min-height:280px;padding:40px 0 32px}
  .cs-hero-main{min-height:520px}
  .cs-stats{grid-template-columns:repeat(2,1fr);transform:translateY(-24px)}
  .cs-stats li:last-child{grid-column:span 2}
  .cs-band{padding:44px 0}
  .cs-cards{grid-template-columns:1fr 1fr;gap:10px}
  .cs-table tbody th{width:42%}
  .cs-bar{grid-template-columns:64px 1fr auto}
  .cs-grid2{grid-template-columns:1fr}
  .cs-videos-tall{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.cs-page *{transition:none!important}}
/* 1.5.0: wide tables scroll inside their own box on phones; YouTube videos load only when played. */
.cs-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.cs-table-wrap .cs-table{min-width:560px}
.cs-yt .cs-yt-play{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:var(--cs-radius,14px);background:#000;box-shadow:0 12px 40px rgba(0,0,0,.35)}
.cs-yt .cs-yt-play img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s,filter .3s}
.cs-yt .cs-yt-play:hover img,.cs-yt .cs-yt-play:focus-visible img{transform:scale(1.03);filter:brightness(1.08)}
.cs-yt-btn{position:absolute;left:50%;top:50%;width:76px;height:54px;margin:-27px 0 0 -38px;border-radius:14px;background:rgba(220,30,30,.92);box-shadow:0 6px 24px rgba(0,0,0,.45)}
.cs-yt-btn::after{content:"";position:absolute;left:31px;top:16px;border-style:solid;border-width:11px 0 11px 19px;border-color:transparent transparent transparent #fff}
.cs-yt-label{position:absolute;left:12px;bottom:10px;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;font:600 12px/1.4 ui-monospace,monospace;letter-spacing:.06em}
.cs-yt iframe{display:block;width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:var(--cs-radius,14px)}
.cs-shipcard .cs-blueprint{margin-top:.4em;padding:.5em .8em;border-left:3px solid var(--cs-gold);background:rgba(226,198,148,.08);border-radius:6px;font-size:.92em}
.cs-byline{font:600 12px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.06em;color:var(--cs-gold-2);margin:0 0 1.4em}
.cs-post h3{margin-top:1.4em}
.cs-ad{display:block;clear:both;margin:2em auto;padding:.4em 0 .6em;min-height:310px;max-width:100%;text-align:center;border-top:1px solid rgba(128,128,128,.25);border-bottom:1px solid rgba(128,128,128,.25);overflow:hidden}
.cs-ad-label{display:block;margin-bottom:.4em;font-size:.72em;letter-spacing:.12em;text-transform:uppercase;opacity:.6}
.cs-ad ins.adsbygoogle{min-height:280px}
.cs-videos{list-style:none!important;margin:1.2em 0!important;padding:0!important;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.cs-video-card{margin:0;min-width:0;display:flex;flex-direction:column;gap:10px}
.cs-video-card .cs-yt-play,.cs-video-card .cs-yt iframe{border-radius:12px}
.cs-video-card.is-short .cs-yt-play img{object-fit:cover}
.cs-video-text{display:grid;gap:3px;min-width:0}
.cs-video-text strong{font-size:1.02em;line-height:1.3;overflow-wrap:anywhere}
.cs-video-text time{font-size:.82em;opacity:.7}
.cs-video-text span{font-size:.9em;line-height:1.45;opacity:.82;overflow-wrap:anywhere}
.cs-videos-title{margin:1.6em 0 0;font-size:1.15em}
.cs-videos-more,.cs-videos-empty{margin:.6em 0 0}