/* ussarcana.com. Generated by site.mjs (estate-sites, claude). Edit the generator or the content module, not this file. */
/* Fonts: Chakra Petch and Exo 2, SIL Open Font License 1.1, served from this site (licences in /assets/fonts). */
@font-face{font-family:"Chakra Petch";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/chakra-petch.woff2) format("woff2")}
@font-face{font-family:"Exo 2";font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/exo-2.woff2) format("woff2")}
:root{--head:"Chakra Petch",ui-sans-serif,system-ui,sans-serif;--body:"Exo 2",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--mono:ui-monospace,"Cascadia Mono","SFMono-Regular",Consolas,monospace;--ground:#050816;--ground-2:#0d1638;--glow:#1a2f6b;--ink:#eef3ff;--muted:#a8b6dc;--a:#6fd3ff;--b:#ffcf7a;--b2:#e09a2a;--pill:#ffcf7a;--surface:rgba(255,255,255,.045);--surface-2:rgba(255,255,255,.075);--line:rgba(255,255,255,.1);--under:rgba(255,255,255,.32);--wide:72rem;--read:40rem;color-scheme:dark}
*{box-sizing:border-box}
html{background:var(--ground);-webkit-text-size-adjust:100%}
body{margin:0;color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.65;background:radial-gradient(1100px 520px at 50% -120px,var(--glow) 0%,transparent 70%),linear-gradient(180deg,var(--ground-2),var(--ground) 640px);background-repeat:no-repeat;min-height:100vh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}
a{color:inherit}
a:focus-visible{outline:2px solid var(--b);outline-offset:3px;border-radius:3px}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:var(--ground);padding:8px 14px;border-radius:8px;text-decoration:none;font-weight:600;z-index:9}
.skip:focus{top:12px}
header.top{width:100%;max-width:var(--wide);margin:0 auto;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px 24px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--head);font-weight:600;font-size:17px;letter-spacing:.005em}
.brand svg{width:30px;height:30px;flex:none}
nav.site ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 18px;font-size:15px}
nav.site a{text-decoration:none;color:var(--muted);padding:6px 0;display:inline-block;border-bottom:1px solid transparent}
nav.site a:hover{color:var(--ink);border-bottom-color:var(--under)}
nav.site a[aria-current]{color:var(--ink);border-bottom-color:var(--a)}
main{flex:1;width:100%;max-width:var(--wide);margin:0 auto;padding:20px 20px 40px}
main:focus{outline:none}
h1,h2,h3{font-family:var(--head);line-height:1.12;letter-spacing:-.005em;text-wrap:balance}
h1{font-size:clamp(34.0px,5.60vw,60px);font-weight:600;margin:.2em 0 .35em;max-width:18em}
h2{font-size:clamp(23px,3vw,30px);font-weight:600;margin:2.2em 0 .6em}
h3{font-size:19px;font-weight:600;margin:1.6em 0 .4em}
p{margin:0 0 1em}
.read{max-width:var(--read)}
.lede{font-size:clamp(18px,2.1vw,21px);line-height:1.55;color:var(--ink);max-width:36em}
.muted{color:var(--muted)}
.eyebrow{font-family:var(--mono);font-size:13px;letter-spacing:.1em;color:var(--a);margin:0}
.crumbs{font-size:14px;color:var(--muted);margin:6px 0 0}
.crumbs a{color:var(--muted);text-decoration:none;border-bottom:1px solid var(--line)}
.crumbs a:hover{color:var(--ink)}
.hero{display:flex;flex-direction:column;align-items:flex-start;padding:28px 0 8px}
.hero .mark{width:120px;height:120px;margin:0 0 18px;overflow:visible}
.mark .core{animation:glow 3.5s ease-in-out infinite}
@keyframes drift-a{0%,100%{transform:translateX(0)}50%{transform:translateX(10px)}}
@keyframes drift-b{0%,100%{transform:translateX(0)}50%{transform:translateX(-10px)}}
@keyframes glow{0%,100%{opacity:1}50%{opacity:.55}}
.mark .orbiter{transform-origin:256px 256px;animation:orbit 28s linear infinite}.mark .star{animation:glow 3.5s ease-in-out infinite}.mark .s1{animation-delay:-.7s}.mark .s2{animation-delay:-1.4s}.mark .s3{animation-delay:-2.1s}.mark .s4{animation-delay:-2.8s}@keyframes orbit{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.mark *{animation:none!important;opacity:1}.mark .wave{opacity:0}}
.doors{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:16px;margin:28px 0 8px;padding:0;list-style:none}
.door{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px 20px 18px;display:flex;flex-direction:column;gap:6px}
.door a{text-decoration:none}
.door h2,.door h3{margin:0;font-size:20px}
.door h2 a::after,.door h3 a::after{content:" \2192";color:var(--a)}
.door p{margin:0;color:var(--muted);font-size:15.5px;line-height:1.55}
.grid{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,168px),1fr));gap:22px 18px}
.card a{text-decoration:none;display:block}
.card img,.card .tile{width:100%;height:auto;aspect-ratio:1/1;border-radius:8px;display:block;background:var(--surface-2);border:1px solid var(--line);object-fit:cover}
.card .tile{display:flex;align-items:center;justify-content:center;padding:14px;text-align:center;font-family:var(--head);font-size:15px;line-height:1.25;color:var(--ink)}
.card b{display:block;font-family:var(--head);font-weight:600;font-size:15.5px;line-height:1.3;margin-top:9px}
.card a:hover b{text-decoration:underline;text-decoration-color:var(--a);text-underline-offset:3px}
.card span{display:block;color:var(--muted);font-size:13.5px;line-height:1.4;margin-top:2px}
.card span.badge{display:inline-block;color:var(--a);font-size:11.5px;margin-top:6px}
.badge{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--a);border:1px solid var(--line);border-radius:999px;padding:1px 8px;display:inline-block;margin-top:5px}
.release{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:28px 40px;align-items:start;margin-top:14px}
.release .cover img,.release .cover .tile{width:100%;height:auto;aspect-ratio:1/1;border-radius:10px;border:1px solid var(--line);display:block;background:var(--surface-2)}
.release .cover .tile{display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;font-family:var(--head);font-size:22px;line-height:1.2}
.release h1{margin-top:.05em}
dl.facts{display:grid;grid-template-columns:fit-content(13em) minmax(0,1fr);gap:4px 16px;margin:14px 0 18px;font-size:15px}
dl.facts dt{color:var(--muted)}
dl.facts dd{margin:0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
ul.links{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
ul.links a{display:inline-block;text-decoration:none;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 14px;font-size:14.5px}
ul.links a:hover{border-color:var(--a)}
figure.words{margin:26px 0;padding:4px 0 4px 20px;border-left:2px solid var(--a);max-width:var(--read)}
figure.words blockquote{margin:0}
figure.words p{margin:0 0 .7em}
figure.words figcaption{color:var(--muted);font-size:14px;margin-top:10px}
figure.words blockquote p.gap{color:var(--muted);letter-spacing:.3em}
ol.tracks{margin:10px 0 0;padding:0;list-style:none;max-width:var(--read);counter-reset:t}
ol.tracks li{display:flex;gap:12px;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--line);font-size:15.5px}
ol.tracks li::before{counter-increment:t;content:counter(t);color:var(--muted);font-variant-numeric:tabular-nums;min-width:1.6em;text-align:right;font-size:14px}
ol.tracks .t{flex:1}
ol.tracks .d{color:var(--muted);font-variant-numeric:tabular-nums;font-size:14px}
.pager{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:40px 0 0;padding-top:16px;border-top:1px solid var(--line);font-size:15px}
.pager a{text-decoration:none;color:var(--muted)}
.pager a:hover{color:var(--ink)}
.note{font-size:14.5px;color:var(--muted);max-width:var(--read)}
.inline a,.read a,.lede a,.note a,dl.facts a{text-decoration:none;border-bottom:1px solid var(--under)}
.inline a:hover,.read a:hover,.note a:hover,dl.facts a:hover{border-bottom-color:var(--ink)}
hr.soft{border:0;border-top:1px solid var(--line);margin:40px 0}
nav.constellation{width:100%;max-width:62rem;margin:40px auto 0;padding:26px 20px 0;border-top:1px solid var(--line);text-align:left}
nav.constellation h2{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 16px;text-align:center}
nav.constellation h2 a{color:inherit;text-decoration:none;border-bottom:1px solid var(--under)}
nav.constellation h2 a:hover{color:var(--ink)}
nav.constellation .groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,12.5rem),1fr));gap:18px 26px}
nav.constellation section{min-width:0}
nav.constellation h3{font-family:var(--body);font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;padding-bottom:6px;border-bottom:1px solid var(--line)}
nav.constellation ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
nav.constellation li a,nav.constellation li .here{display:block;text-decoration:none;color:var(--ink);padding:1px 0 1px 10px;border-left:2px solid transparent}
nav.constellation li .here{border-left-color:var(--ink)}
nav.constellation b{display:block;font-weight:600;font-size:14.5px;line-height:1.3}
nav.constellation .w{display:block;color:var(--muted);font-size:13.5px;line-height:1.35}
nav.constellation small{display:block;font-family:ui-monospace,"Cascadia Mono","SFMono-Regular",Consolas,monospace;font-size:12px;color:var(--muted);margin-top:1px}
nav.constellation li a:hover b{text-decoration:underline;text-underline-offset:3px}
nav.constellation li a:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:2px}
nav.constellation.map{border-top:0;margin-top:8px;padding-top:0}
nav.constellation.map h2{display:none}
nav.constellation.map b{font-size:17px}
nav.constellation.map .w{font-size:15px}
footer a.sign{border-bottom:1px solid var(--under)}
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
footer{text-align:center;color:var(--muted);font-size:13.5px;padding:18px 20px 30px}
footer a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--under)}
footer .sign{font-family:"Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;font-style:italic}
@media (max-width:760px){.release{grid-template-columns:1fr}.release .cover{max-width:340px}header.top{padding:14px 20px}.hero .mark{width:96px;height:96px}}
.deck{position:relative}
.deck::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(1000px 640px at 80% -120px,var(--tint,#0f1d44) 0%,transparent 72%)}
.deck-view{--tint:#0d1a3d}.deck-ship{--tint:#0b2a3c}.deck-crew{--tint:#1b1538}.deck-voyage{--tint:#2a1f0c}.deck-behind{--tint:#111827}
.chip{margin:0;font-size:13px;letter-spacing:.08em;color:var(--muted)}
.chip::before{content:"";display:inline-block;width:28px;height:1px;background:currentColor;vertical-align:middle;margin-right:10px;opacity:.7}
.chip.real{color:var(--b)}
.chip a{color:inherit;text-decoration-color:rgba(201,212,234,.4);text-underline-offset:4px}.chip a:hover{color:var(--ink)}
figure.plate{margin:0;position:relative}
figure.plate img{display:block;width:100%;height:auto;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 84%,transparent 100%),linear-gradient(180deg,transparent 0,#000 20%,#000 74%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 84%,transparent 100%),linear-gradient(180deg,transparent 0,#000 20%,#000 74%,transparent 100%);mask-composite:intersect}
.launch .title{margin-top:-6%;position:relative}
.launch h1{font-size:clamp(46px,9vw,112px);line-height:.95;letter-spacing:.035em;margin:.12em 0 .2em;max-width:none}
.launch .lede{font-family:var(--body);font-weight:300;font-size:clamp(21px,2.7vw,30px);line-height:1.3;max-width:24em;margin-bottom:.7em}
.status{color:var(--b);font-size:15.5px;margin:18px 0 4px;letter-spacing:.02em}
.status::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--b);margin-right:10px;vertical-align:1px}
.actions{display:flex;flex-wrap:wrap;gap:10px 12px;margin:18px 0 6px}
.btn{display:inline-block;text-decoration:none;background:var(--b);color:#160f03;font-weight:600;padding:11px 22px;border-radius:2px;font-size:15.5px;letter-spacing:.02em}
.btn:hover{background:#ffe2a8}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid rgba(201,212,234,.38)}
.btn.ghost:hover{border-color:var(--ink)}
.note{color:var(--muted);font-size:14px;max-width:var(--read)}
.more{margin:20px 0 0}.more a{font-weight:600;color:var(--ink);text-decoration-color:var(--a);text-underline-offset:5px}
.coldopen{margin:76px 0 0;max-width:44rem}
.coldopen p{font-weight:300;font-size:clamp(20px,2.5vw,27px);line-height:1.42;margin:0 0 .85em;color:#dce4f5}
.coldopen p.test{font-weight:500;color:var(--b)}
.crew-teaser,.voyage-teaser,.behind-teaser{margin-top:84px}
ol.cast{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(201,212,234,.16)}
@media (max-width:900px){ol.cast{grid-template-columns:repeat(2,minmax(0,1fr))}}
ol.cast li a{display:flex;flex-direction:column;height:100%;text-decoration:none;padding:18px 16px 18px 0;border-bottom:1px solid rgba(201,212,234,.16)}
ol.cast li a:hover b{text-decoration:underline;text-decoration-color:var(--dept);text-underline-offset:5px}
.member .num{font-family:var(--head);font-size:13px;letter-spacing:.14em;color:var(--muted)}
ol.cast b{font-family:var(--head);font-weight:600;font-size:21px;line-height:1.15;margin-top:8px}
.member .rank{color:var(--muted);font-size:14px;margin-top:3px}
.member .dept{margin-top:10px;font-size:13.5px;color:var(--ink);padding-left:10px;border-left:2px solid var(--dept)}
.t-command{--dept:#e8c27a}.t-nav{--dept:#78c6e8}.t-art{--dept:#b9a3e6}.t-research{--dept:#86cfa9}.t-ops{--dept:#e3a27c}.t-culture{--dept:#e39bb5}.t-archive{--dept:#c4cddf}.t-comms{--dept:#8faee6}
svg.chart{display:block;width:100%;height:auto;margin:18px 0 6px;max-width:960px}
svg.chart .grid path{stroke:rgba(201,212,234,.08);stroke-width:1}
svg.chart .leg1{fill:none;stroke:#c9d4ea;stroke-width:1.2}
svg.chart .leg2{fill:none;stroke:#c9d4ea;stroke-opacity:.55;stroke-width:1.2;stroke-dasharray:2 7}
svg.chart .way circle{fill:none;stroke:#eef3ff;stroke-width:1.2}svg.chart .way path{stroke:#eef3ff;stroke-width:1}
svg.chart .way.far circle,svg.chart .way.far path{stroke:var(--b)}
ol.legs{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:12px 36px}
ol.legs h3{margin:.6em 0 .4em;font-size:15px;letter-spacing:.06em;color:var(--muted)}
ol.stops{list-style:none;margin:0;padding:0;border-top:1px solid rgba(201,212,234,.16)}
li.stop{padding:12px 0;border-bottom:1px solid rgba(201,212,234,.16)}
li.stop b{display:block;font-family:var(--head);font-weight:600;font-size:19px;line-height:1.2}
li.stop .tease{display:block;color:#dce4f5;margin-top:4px;max-width:36em}
li.stop .state{display:block;color:var(--muted);font-size:13.5px;margin-top:4px}li.stop.far .state{color:var(--b)}
figure.plate.side{margin:26px 0 8px}
.decks{margin:30px 0 0;max-width:44rem}
.decks section{padding:18px 0;border-top:1px solid rgba(201,212,234,.14)}
.decks h2{margin:0 0 .35em}
.decks p{margin:0}
.codex-end{display:grid;grid-template-columns:140px minmax(0,1fr);gap:8px 32px;align-items:start;margin:40px 0 10px;max-width:48rem;padding-top:24px;border-top:1px solid rgba(201,212,234,.14)}
.emblem-plate{padding-top:28px;color:#d9c9a0}
svg.emblem{width:120px;height:120px}
@media (max-width:620px){.codex-end{grid-template-columns:1fr}.emblem-plate{padding-top:6px}svg.emblem{width:84px;height:84px}}
ol.manifest{list-style:none;margin:28px 0 0;padding:0;max-width:52rem;border-top:1px solid rgba(201,212,234,.16)}
ol.manifest li{display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:16px;padding:20px 0;border-bottom:1px solid rgba(201,212,234,.16)}
ol.manifest .num{grid-row:span 4;padding-top:8px}
ol.manifest h2{margin:0;font-size:25px}
ol.manifest .dept{justify-self:start}
ol.manifest p{margin:10px 0 0;max-width:38em}
.heard{margin-top:60px}
ol.tracklist{list-style:none;margin:18px 0 0;padding:0;max-width:44rem;border-top:1px solid rgba(201,212,234,.16)}
li.aboard{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid rgba(201,212,234,.16)}
li.aboard a{text-decoration:none;min-width:0}
li.aboard b{font-family:var(--head);font-weight:600;font-size:17.5px;line-height:1.25;margin-right:12px}
li.aboard a:hover b{text-decoration:underline;text-decoration-color:var(--b);text-underline-offset:5px}
li.aboard .rel{color:var(--muted);font-size:14.5px}
li.aboard .year{color:var(--muted);font-size:14px;font-variant-numeric:tabular-nums;flex:none}
.flyby{margin:64px 0 0}
figure.film{margin:18px 0 0}
figure.film video{display:block;width:100%;height:auto;background:#000;border:1px solid rgba(201,212,234,.14)}
figure.film figcaption{color:var(--muted);font-size:14px;margin-top:10px;max-width:var(--read)}
ul.go{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px;max-width:var(--read)}ul.go a{font-weight:600;text-underline-offset:4px}
@media (prefers-reduced-motion:no-preference){figure.plate.hero img{animation:emerge 2.2s ease-out both}@keyframes emerge{from{opacity:0;transform:scale(1.015)}to{opacity:1;transform:none}}}
