:root[data-theme="arcade"][data-page="outposts"] {
  --op-plate: var(--ar-panel);
  --op-line: var(--ar-line);
  --op-line-hi: rgba(127, 176, 255, 0.42);
  --op-slate: #2E353C;
  --op-bezel: #05070D;
  --op-body: 1.125rem;
  --op-note: 1rem;
}
:root[data-theme="arcade"][data-page="outposts"] body { font-weight: 400; letter-spacing: 0; }

:root[data-theme="arcade"][data-page="outposts"] main :is(h1, h2, h3) { font-family: var(--font-serif) !important; font-weight: 400; color: var(--ar-text); }
:root[data-theme="arcade"][data-page="outposts"] main h2 { font-size: clamp(2.2rem, 4.8vw, 3.6rem); line-height: 1.04; letter-spacing: -0.01em; text-wrap: balance; margin: 0 0 16px; }
:root[data-theme="arcade"][data-page="outposts"] main h3 { font-size: clamp(1.4rem, 2.4vw, 1.8rem); line-height: 1.15; letter-spacing: -0.005em; margin: 0; }
:root[data-theme="arcade"][data-page="outposts"] :is(.page-head .lede, main .sub, .op-callout.green, .diamonds li, .dare p, .free p, .never-sub, .built-team, .built-tiles li) {
  font-family: var(--font-text); font-size: var(--op-body); font-weight: 400; line-height: 1.6; color: var(--ar-dim); max-width: 38em;
}
:root[data-theme="arcade"][data-page="outposts"] main .sub { margin: 0 0 32px; }
:root[data-theme="arcade"][data-page="outposts"] .contact h2 { font-family: var(--font-serif) !important; font-weight: 400; }

:root[data-theme="arcade"][data-page="outposts"] .op-band {
  display: flex; align-items: center; gap: 14px; margin: 0 0 clamp(22px, 3vw, 34px); padding: 0;
  background: none; border: 0; border-radius: 0; box-shadow: none; color: var(--ar-blue-l);
}
:root[data-theme="arcade"][data-page="outposts"] .op-band img { display: none; }
:root[data-theme="arcade"][data-page="outposts"] .op-band-n, :root[data-theme="arcade"][data-page="outposts"] .op-band-t {
  margin: 0; padding: 0; background: none; border: 0; border-radius: 0; box-shadow: none; text-shadow: none; transform: none;
  font-family: var(--font-px); font-weight: 400; font-size: 14px; line-height: 1; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ar-blue-l);
}
:root[data-theme="arcade"][data-page="outposts"] .op-band-n {
  order: -1; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--ar-blue); background: var(--ar-panel); color: var(--ar-text);
}
:root[data-theme="arcade"][data-page="outposts"] .op-band::after { content: ""; flex: 1; height: 1px; background: var(--ar-line); }
:root[data-theme="arcade"][data-page="outposts"] .op-slide-band { padding-top: 0; }
:root[data-theme="arcade"][data-page="outposts"] main :is(#loop, #miss, #islands, #clans, #events, #market, #never, #built) { padding-block: clamp(56px, 7vw, 104px) clamp(8px, 2vw, 24px); }
:root[data-theme="arcade"][data-page="outposts"] main #film { padding-bottom: 0; }

@media (prefers-reduced-motion: no-preference) {
  :root[data-theme="arcade"][data-page="outposts"] .rise { transform: translate3d(0, 18px, 0); }
  :root[data-theme="arcade"][data-page="outposts"] .rise.in { transform: none; transition: opacity 600ms var(--ar-ease), transform 700ms var(--ar-ease); }
  :root[data-theme="arcade"][data-page="outposts"] :is(.decay-houses, .halls, .decos, .villains) img, :root[data-theme="arcade"][data-page="outposts"] .sizes li { transition: none; }
}
:root[data-theme="arcade"][data-page="outposts"] :is(.decay-houses, .halls, .decos, .villains) li:hover img, :root[data-theme="arcade"][data-page="outposts"] .sizes li:hover, :root[data-theme="arcade"][data-page="outposts"] .op-band:hover .op-band-n { transform: none; }

:root[data-theme="arcade"][data-page="outposts"] .page-head {
  background-color: var(--ar-night);
  background-image: radial-gradient(60% 46% at 50% 100%, rgba(47, 123, 255, 0.3), rgba(47, 123, 255, 0) 72%);
  color: var(--ar-text); border-bottom: 1px solid var(--ar-line); padding-bottom: 268px;
}
:root[data-theme="arcade"][data-page="outposts"] .page-head::before { display: none; }
:root[data-theme="arcade"][data-page="outposts"] .page-head > .wrap { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; }
:root[data-theme="arcade"][data-page="outposts"] .op-path { margin: 0 0 18px; font-family: var(--font-px); font-size: 14px; line-height: 1.5; color: var(--ar-dim); }
:root[data-theme="arcade"][data-page="outposts"] .page-head .app-mark {
  order: -1; justify-self: start; margin: 0 0 26px; width: 80px; height: 80px; border-radius: 10px;
  background: var(--op-slate); border: 1px solid var(--op-line-hi); box-shadow: none;
}
:root[data-theme="arcade"][data-page="outposts"] .page-head h1 {
  font-size: clamp(2.8rem, 6.6vw, 5.8rem); line-height: 1; letter-spacing: -0.012em; font-weight: 400; color: var(--ar-text);
  text-wrap: balance; margin: 0 0 24px; max-width: 14ch;
}
:root[data-theme="arcade"][data-page="outposts"] .page-head .lede { font-size: 1.25rem; color: var(--ar-dim); max-width: 34em; margin: 0; }
@media (min-width: 900px) {
  :root[data-theme="arcade"][data-page="outposts"] .page-head > .wrap { grid-template-columns: minmax(0, 1fr) auto; column-gap: 40px; }
  :root[data-theme="arcade"][data-page="outposts"] .page-head > .wrap > :not(.app-mark) { grid-column: 1; }
  :root[data-theme="arcade"][data-page="outposts"] .page-head .app-mark { order: 0; grid-column: 2; grid-row: 1 / span 3; justify-self: end; margin: 0; width: 96px; height: 96px; }
}
@media (max-width: 720px) { :root[data-theme="arcade"][data-page="outposts"] .page-head { padding-bottom: 214px; } }

.ar-town { position: absolute; left: 50%; bottom: 0; width: 1320px; height: 252px; margin-left: -660px; pointer-events: none; --k: 1; }
@media (max-width: 720px) { .ar-town { width: 1056px; height: 200px; margin-left: -528px; --k: 0.8; } }
.ar-bld { position: absolute; left: calc(var(--x) * 1px * var(--k)); width: calc(var(--w) * 1px * var(--k)); top: calc(var(--y) * 1px * var(--k)); height: 18px; pointer-events: auto; cursor: pointer; }
:root:not([data-theme="arcade"]) :is(.ar-town, .ar-vhead, .ar-step) { display: none; }

:root[data-theme="arcade"][data-page="outposts"] .beta-call {
  margin-top: 32px; padding: 10px 10px 10px 22px; gap: 12px 22px; justify-self: start;
  background: var(--ar-raise); color: var(--ar-text); border: 1px solid var(--op-line-hi); border-radius: 12px; box-shadow: none;
  transition: border-color 200ms var(--ar-ease);
}
:root[data-theme="arcade"][data-page="outposts"] .beta-text { font-family: var(--font-text); font-size: 1rem; line-height: 1.45; color: var(--ar-dim); }
:root[data-theme="arcade"][data-page="outposts"] .beta-text strong { color: var(--ar-text); font-weight: 600; }
:root[data-theme="arcade"][data-page="outposts"] .beta-go { background: var(--ar-melon); color: var(--ar-night); border-radius: 8px; font-family: var(--font-text); font-weight: 600; font-size: 1rem; min-height: 44px; }
@media (hover: hover) { :root[data-theme="arcade"][data-page="outposts"] .beta-call:hover { transform: none; box-shadow: none; border-color: var(--ar-melon); } }
:root[data-theme="arcade"][data-page="outposts"] .beta-call:active { transform: none; box-shadow: none; }
:root[data-theme="arcade"][data-page="outposts"] .beta-call:focus-visible { outline: 2px solid var(--ar-melon); outline-offset: 3px; }

:root[data-theme="arcade"][data-page="outposts"] :is(.op-card, .isle, .villains li, .decos li, .screen) {
  background: var(--op-plate); border: 1px solid var(--op-line); border-radius: 10px; box-shadow: none;
}
:root[data-theme="arcade"][data-page="outposts"] .screen video { background: var(--op-plate); }
@media (hover: hover) { :root[data-theme="arcade"][data-page="outposts"] :is(.screen, .isle):hover { transform: none; box-shadow: none; } }

:root[data-theme="arcade"][data-page="outposts"] .film-play { background: none; }
:root[data-theme="arcade"][data-page="outposts"] .film-play-dot { background: var(--ar-melon); border: 0; border-radius: 12px; box-shadow: none; width: clamp(64px, 7vw, 84px); transition: background-color 200ms var(--ar-ease); }
:root[data-theme="arcade"][data-page="outposts"] .film-play-dot svg { fill: var(--ar-night); }
:root[data-theme="arcade"][data-page="outposts"] .film-play-t { background: var(--ar-panel); color: var(--ar-text); border: 1px solid var(--op-line-hi); border-radius: 8px; font-family: var(--font-text); font-weight: 600; font-size: 1rem; padding: 9px 14px; }
:root[data-theme="arcade"][data-page="outposts"] .film-len { color: var(--ar-dim); font-size: 1rem; }
@media (hover: hover) and (pointer: fine) { :root[data-theme="arcade"][data-page="outposts"] .film-play:hover .film-play-dot { transform: none; background: #FFC2A0; } }
:root[data-theme="arcade"][data-page="outposts"] .film-play:active .film-play-dot { transform: none; box-shadow: none; }
:root[data-theme="arcade"][data-page="outposts"] .film-play:focus-visible { outline: 2px solid var(--ar-melon); outline-offset: -6px; border-radius: 12px; }

:root[data-theme="arcade"][data-page="outposts"] .op-callout.green { background: var(--ar-panel); color: var(--ar-dim); border: 1px solid var(--op-line-hi); border-radius: 10px; box-shadow: none; max-width: none; padding: 20px 24px; }
:root[data-theme="arcade"][data-page="outposts"] .op-callout strong { font-family: var(--font-serif); font-weight: 400; font-size: 1.6rem; line-height: 1.15; color: var(--ar-text); margin-bottom: 6px; display: block; }
:root[data-theme="arcade"][data-page="outposts"] .op-h3 { margin: clamp(44px, 5vw, 64px) 0 20px; }
:root[data-theme="arcade"][data-page="outposts"] .diamonds { gap: 18px; }
:root[data-theme="arcade"][data-page="outposts"] .diamonds li { color: var(--ar-text); font-weight: 400; padding-left: 32px; }
:root[data-theme="arcade"][data-page="outposts"] .diamonds li::before { left: 4px; top: 0.6em; width: 9px; height: 9px; background: transparent; border: 1px solid var(--ar-blue-l); border-radius: 0; }
:root[data-theme="arcade"][data-page="outposts"] .diamonds li small { display: block; font-family: var(--font-text); font-size: var(--op-note); line-height: 1.5; color: var(--ar-dim); margin-top: 3px; font-weight: 400; }

:root[data-theme="arcade"][data-page="outposts"] .isle { padding: 12px 12px 14px; text-align: left; }
:root[data-theme="arcade"][data-page="outposts"] .isle b { margin: 8px 0 0; font-family: var(--font-text); font-weight: 600; font-size: 1.0625rem; line-height: 1.3; letter-spacing: 0; color: var(--ar-text); }
:root[data-theme="arcade"][data-page="outposts"] .isle span { font-family: var(--font-text); font-weight: 400; font-size: var(--op-note); color: var(--ar-dim); margin-top: 2px; }
:root[data-theme="arcade"][data-page="outposts"] .free { padding: 22px 24px; }
:root[data-theme="arcade"][data-page="outposts"] .free p { color: var(--ar-text); max-width: 34em; }
:root[data-theme="arcade"][data-page="outposts"] .free p a { text-decoration-color: var(--ar-blue); text-decoration-thickness: 1px; text-underline-offset: 5px; }
@media (hover: hover) { :root[data-theme="arcade"][data-page="outposts"] .free p a:hover { color: var(--ar-melon); text-decoration-color: var(--ar-melon); } }
:root[data-theme="arcade"][data-page="outposts"] .decos li { background: var(--ar-raise); font-family: var(--font-text); font-weight: 500; font-size: 1rem; color: var(--ar-text); }
:root[data-theme="arcade"][data-page="outposts"] .decos small { font-family: var(--font-text); font-weight: 400; font-size: 0.875rem; color: var(--ar-dim); }

:root[data-theme="arcade"][data-page="outposts"] .sizes li { background: transparent; border: 1px solid var(--op-line-hi); border-radius: 10px; box-shadow: none; font-family: var(--font-px); font-weight: 400; font-size: 14px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ar-dim); }
:root[data-theme="arcade"][data-page="outposts"] .sizes b { font-family: var(--font-serif); font-weight: 400; font-size: 2.4rem; color: var(--ar-text); }
:root[data-theme="arcade"][data-page="outposts"] .faces img { background: var(--ar-raise); border: 1px solid var(--op-line-hi); border-radius: 10px; box-shadow: none; }
:root[data-theme="arcade"][data-page="outposts"] .halls li { font-family: var(--font-text); font-weight: 400; font-size: var(--op-note); color: var(--ar-dim); }
:root[data-theme="arcade"][data-page="outposts"] .halls b { font-family: var(--font-serif); font-weight: 400; font-size: 1.7rem; color: var(--ar-blue-l); }
:root[data-theme="arcade"][data-page="outposts"] .halls figcaption { font-family: var(--font-text); font-weight: 400; font-size: var(--op-note); letter-spacing: 0; text-transform: none; color: var(--ar-dim); }

:root[data-theme="arcade"][data-page="outposts"] .dare h3 { font-family: var(--font-serif); font-size: clamp(1.5rem, 2.4vw, 1.9rem); color: var(--ar-text); }
:root[data-theme="arcade"][data-page="outposts"] .dare p { color: var(--ar-dim); }
:root[data-theme="arcade"][data-page="outposts"] .dare .pay { color: var(--ar-blue-l); font-weight: 500; }
:root[data-theme="arcade"][data-page="outposts"] .villains li { position: relative; cursor: pointer; font-family: var(--font-text); font-weight: 600; font-size: 1.0625rem; color: var(--ar-text); }
:root[data-theme="arcade"][data-page="outposts"] .villains small { font-family: var(--font-text); font-weight: 400; font-size: var(--op-note); color: var(--ar-dim); }
:root[data-theme="arcade"][data-page="outposts"] .villains img { width: 96px; height: 96px; }
:root[data-theme="arcade"][data-page="outposts"] .op-h3 { position: relative; }
.ar-step { position: absolute; left: 0; top: 0; width: 140px; height: 6px; pointer-events: none; }
.ar-vhead { position: absolute; display: block; height: 6px; pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
  :root[data-theme="arcade"][data-page="outposts"] .villains li.ar-sq { animation: ar-card 420ms steps(8) 1; }
  :root[data-theme="arcade"][data-page="outposts"] .villains li.ar-sq img { transform-origin: 50% 100%; animation: ar-squash 420ms steps(8) 1; }
}
@keyframes ar-squash { 0% { transform: none; } 18% { transform: scale(1.14, 0.68); } 50% { transform: scale(0.94, 1.1); } 100% { transform: none; } }
@keyframes ar-card { 0% { transform: none; } 24% { transform: translateY(5px); } 60% { transform: translateY(-2px); } 100% { transform: none; } }

:root[data-theme="arcade"][data-page="outposts"] :is(.rail-item, .market-phone) { padding: 6px; border-radius: 12px; background: var(--op-bezel); border: 1px solid var(--op-line-hi); box-shadow: none; }
:root[data-theme="arcade"][data-page="outposts"] :is(.rail-item, .market-phone) img { border-radius: 3px; }
@media (hover: hover) {
  :root[data-theme="arcade"][data-page="outposts"] :is(.rail-item, .market-phone):hover { transform: none; }
  :root[data-theme="arcade"][data-page="outposts"] .rail-item:nth-child(even):hover { transform: translate3d(0, var(--stagger), 0); }
}
:root[data-theme="arcade"][data-page="outposts"] #screens { background-color: var(--ar-night); background-image: none; color: var(--ar-text); border-block: 1px solid var(--ar-line); padding-block: clamp(64px, 8vw, 104px); }
:root[data-theme="arcade"][data-page="outposts"] #screens::before { display: none; }
:root[data-theme="arcade"][data-page="outposts"] #screens h2 { color: var(--ar-text); }
:root[data-theme="arcade"][data-page="outposts"] #screens p { color: var(--ar-dim); }
:root[data-theme="arcade"][data-page="outposts"] :is(#screens a, #screens button):focus-visible { outline: 2px solid var(--ar-melon); outline-offset: 4px; border-radius: 8px; }
:root[data-theme="arcade"][data-page="outposts"] .rail:focus-visible { outline: 2px solid var(--ar-melon); outline-offset: -3px; border-radius: 8px; }
:root[data-theme="arcade"][data-page="outposts"] .rail-btn { background: var(--ar-panel); color: var(--ar-text); border: 1px solid var(--op-line-hi); border-radius: 10px; box-shadow: none; transition: border-color 200ms var(--ar-ease), opacity 200ms var(--ar-ease); }
:root[data-theme="arcade"][data-page="outposts"] .rail-btn:not(:disabled):hover { transform: none; box-shadow: none; border-color: var(--ar-melon); }
:root[data-theme="arcade"][data-page="outposts"] .rail-btn:not(:disabled):active { transform: none; box-shadow: none; }

:root[data-theme="arcade"][data-page="outposts"] .op-card.dark { background: var(--ar-panel); border: 1px solid var(--op-line); color: var(--ar-text); padding: clamp(28px, 4vw, 48px); }
:root[data-theme="arcade"][data-page="outposts"] .never h2 { color: var(--ar-text); margin: 0 0 12px; }
:root[data-theme="arcade"][data-page="outposts"] .never-sub { color: var(--ar-dim); margin: 0 0 28px; }
:root[data-theme="arcade"][data-page="outposts"] .nevers { display: block; max-width: 460px; margin: 0 0 32px; padding: 0; list-style: none; border-top: 1px solid var(--ar-line); }
:root[data-theme="arcade"][data-page="outposts"] .nevers li {
  display: flex; flex-direction: row; align-items: center; gap: 16px; padding: 13px 0; background: transparent; color: var(--ar-text);
  border: 0; border-bottom: 1px solid var(--ar-line); border-radius: 0; box-shadow: none; font-family: var(--font-text); font-weight: 500; font-size: 1.125rem; line-height: 1.4;
}
:root[data-theme="arcade"][data-page="outposts"] .nevers .x { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid var(--ar-melon); color: var(--ar-melon); background: transparent; border-radius: 0; }
:root[data-theme="arcade"][data-page="outposts"] .nevers .x svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2.4; }
:root[data-theme="arcade"][data-page="outposts"] .never-line { font-family: var(--font-serif); font-weight: 400; font-size: clamp(1.5rem, 2.8vw, 2.1rem); line-height: 1.2; letter-spacing: -0.005em; color: var(--ar-dim); max-width: 28ch; text-wrap: balance; }
:root[data-theme="arcade"][data-page="outposts"] .never-line em { color: var(--ar-text); font-style: italic; }

:root[data-theme="arcade"][data-page="outposts"] .built-tiles li.op-card { max-width: none; }
:root[data-theme="arcade"][data-page="outposts"] .built-tiles b { font-family: var(--font-serif); font-weight: 400; font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1.1; color: var(--ar-text); margin: 0 0 6px; }
:root[data-theme="arcade"][data-page="outposts"] .built-tiles li { color: var(--ar-dim); }
:root[data-theme="arcade"][data-page="outposts"] .built-team { color: var(--ar-dim); }

:root[data-theme="arcade"][data-page="outposts"] .contact::before { display: none; }
:root[data-theme="arcade"][data-page="outposts"] :is(.btn, .status, .eyebrow, .foot strong, .next-link, .num, .yr):not(.contact *) { font-family: var(--font-text); font-weight: 600; letter-spacing: 0; }
:root[data-theme="arcade"][data-page="outposts"] .menu a:not(.contact *) { font-family: var(--font-serif); }

@media (prefers-reduced-motion: reduce) {
  :root[data-theme="arcade"][data-page="outposts"] :is(.beta-call, .beta-go, .film-play-dot, .rail-btn) { transition: none; }
}