/* Studio type and surfaces. Loaded last on every page. */
:root{
  --font-ui: "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-display: "Newsreader", ui-serif, Georgia, serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 1.875rem;
  --text-display: clamp(1.75rem, 1.35rem + 1.8vw, 2.5rem);
  --lh-tight: 1.15;
  --lh-snug: 1.3;
  --lh-body: 1.55;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --tracking-tight: -0.015em;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --gutter-l: max(var(--space-4), env(safe-area-inset-left));
  --gutter-r: max(var(--space-4), env(safe-area-inset-right));
  --tap: 44px;
  --tap-comfy: 48px;
  --measure: 68ch;
  --nav-h: 64px;
  --dock-h: 0px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-pill: 999px;
  --bg: #f4f3ef;
  --surface: #ffffff;
  --surface-2: #f1f5f9;
  --ink: #0f172a;
  --ink-muted: #334155;
  --ink-subtle: #475569;
  --line: #e2e8f0;
  --line-strong: #7c8799;
  --link: #1d4ed8;
  --accent: #0f172a;
  --accent-ink: #ffffff;
  --focus: #2563eb;
  --success: #047857;
  --danger: #b91c1c;
  --warning-bg: #fef3c7;
  --warning-ink: #78350f;
  --overlay: rgb(15 23 42 / .45);
  --nav-bg: color-mix(in srgb, var(--surface) 88%, transparent);
  --paper: var(--surface);
  --muted: var(--ink-muted);
  --chip: var(--surface-2);
  --shadow-1: 0 1px 2px rgb(15 23 42 / .06), 0 1px 1px rgb(15 23 42 / .04);
  --shadow-2: 0 6px 16px -4px rgb(15 23 42 / .12);
  --shadow-3: 0 24px 48px -12px rgb(15 23 42 / .30);
  --dur-1: 120ms;
  --dur-2: 200ms;
  --dur-3: 280ms;
  --ease-out: cubic-bezier(.2,.8,.2,1);
  --ease-in-out: cubic-bezier(.4,0,.2,1);
  accent-color: var(--link);
  scrollbar-color: var(--line-strong) transparent;
}
html{color-scheme: light}
html[data-theme="dark"],
html[data-theme="harbor"]{color-scheme: dark}
html[data-theme="retro"]{--radius-sm:0;--radius-md:0;--radius-lg:0;--radius-xl:0;color-scheme:light}
::selection{background: color-mix(in srgb, var(--link) 28%, transparent); color: inherit}
:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
body{font:var(--fw-regular) var(--text-base)/var(--lh-body) var(--font-ui); font-size-adjust: from-font; -webkit-text-size-adjust:100%; text-size-adjust:100%}
h1{font:var(--fw-semibold) var(--text-xl)/var(--lh-tight) var(--font-display); letter-spacing:var(--tracking-tight)}
h2{font:var(--fw-semibold) var(--text-lg)/var(--lh-snug) var(--font-ui); letter-spacing:var(--tracking-tight)}
h3{font:var(--fw-semibold) var(--text-md)/var(--lh-snug) var(--font-ui)}
@media (min-width:768px){
  h1{font-size:var(--text-2xl)}
  :root{--section-gap: var(--space-8)}
}
.num, time, .price, .lcd, .count-lcd{font-variant-numeric: tabular-nums}
:root {
  --font-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: Newsreader, Georgia, "Times New Roman", serif;
  --font-ui: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --sans: var(--font-sans);
  --display: var(--font-display);
  --mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --studio-bg: #f4f3ef;
  --studio-bg-2: #f8fafc;
  --studio-paper: #ffffff;
  --studio-line: #e2e8f0;
  --studio-ink: #0f172a;
  --studio-muted: #475569;
  --studio-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.06);
  --studio-radius: 14px;
  --ink: #111827;
  --muted: #374151;
  --link: #0b3d91;
  --link-hover: #1d4ed8;
  --on-dark: #f8fafc;
  --on-dark-muted: #e2e8f0;
  --on-dark-soft: #cbd5e1;
  --on-dark-sky: #7dd3fc;
  --on-dark-gold: #fde047;
  --on-dark-mint: #86efac;
}

html,
body,
button,
input,
select,
textarea,
table,
thead,
tbody,
th,
td,
dialog,
nav,
h1, h2, h3, h4, h5, h6,
svg text {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body :where(*):not(
  pre, code, kbd, samp,
  .win98-clock, .mono, .lcd, .count-lcd, .ticker, .ticker *,
  .quote-table, .quote-table *, .tick, .jb-lcd, .wa-lcd, .wa-lcd *,
  .wa-track, .wa-clock, .ch-readout, .radar-caption, .hud, .clock, .bsod, .bsod *,
  .quote-tape, .quote-tape *, .quote-fresh
) {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

pre, code, kbd, samp,
.win98-clock, .mono, .lcd, .count-lcd, .ticker, .ticker *,
.quote-table, .quote-table *, .tick, .jb-lcd, .wa-lcd, .wa-lcd *,
.wa-track, .wa-clock, .ch-readout, .radar-caption, .hud, .clock, .bsod, .bsod *,
.quote-tape, .quote-tape *, .quote-fresh {
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace !important;
}

body {
  font-size: 16px;
  line-height: 1.55;
  letter-spacing: 0.01em;
  color: #111827;
}
body:not(.night) {
  color: #111827;
}
p, li, dd, blockquote, .box-body, .card-body, .detail-inner, .wiki-body, .quote-copy, .toy p {
  line-height: 1.6;
}
h1, h2, h3, h4, h5, h6 {
  line-height: 1.25;
  letter-spacing: 0.01em;
}
.hero h1, .hero p, .profile-head h1, .word-main h1, .wx-hero h1, .ask-intro h1,
.empty, .wiki-h, .credits, .credits h2, .result-count, .mood, .wordart, .sparkle,
.wx-temp, .quote-tape p, .count-lcd, .lcd, .forum-head h1, .tv-hero h1 {
  text-shadow: none;
}

body:not(.chat-page):not(.board-page):not(.night) main.wrap,
.box, .card, .detail, .toy, .quote-owner, .wiki-article, .recipe-sheet {
  background-color: #fff;
  color: #111827;
}
.hero h1, .profile-head h1, .word-main h1, .wx-hero h1, .ask-intro h1,
.hero p, .empty, .wiki-h, .credits, .credits h2, .result-count, .mood,
.quote-copy blockquote, .quote-box .quote-kicker, .deals h2, .deal-ship {
  color: #111827;
}
.brand, .site-header .brand { color: #0b3d91; }
.brand em, .network { color: #374151; }
.meta, .lock-note, .quote-disclaimer, .quote-by, .wiki-h span, .cols ul input:checked + span {
  color: #374151;
}

main a:not(.btn):not(.choice):not(.brand):not(.wiki-row):not(.topic):not(.guestbook):not(.status-card):not(.cat-card):not(.shell-hit):not(.recipe-row):not(.recipe-tile):not(.studio-dock a):not(.ship-callout a),
.site-footer a, .choice, .choice-title, .webring a, .wiki-row, .wiki-row-title,
.hit-title, .hit-title a, .guestbook {
  color: #0b3d91;
  text-decoration: underline;
}
main a:hover:not(.btn):not(.choice):not(.brand):not(.wiki-row):not(.topic):not(.guestbook):not(.status-card):not(.cat-card):not(.shell-hit),
.choice:hover, .choice:hover .choice-title, .webring a:hover, .hit-title a:hover {
  color: #1d4ed8;
}
main a:visited:not(.btn):not(.choice):not(.brand):not(.wiki-row):not(.topic):not(.guestbook):not(.status-card):not(.cat-card):not(.shell-hit),
.choice:visited, .webring a:visited, .guestbook:visited {
  color: #1e3a8a;
}
.choice-text, .about-line, .about-line b { color: #111827; text-decoration: none; }

button, .btn, .site-nav a, .shell-tool, .win98-start, .win98-mute, .file-tab,
.key, .pixel-btn, .jukebox button, .hlp-tabs button, input, select, textarea {
  color: #111827;
}
.shell-tool.is-owner,
.box h2, .quote-box h2, dialog h2, .toybox h2, .hlp-caption, .ask-win h2,
.win h2, .day h2, .marquee, .quote-table th, .deals-table th, .rank,
.quote-card-bar, .quote-card-bar h2, .wx-live {
  color: #ffffff;
}
.mail-banner { background: #0b1f4b; color: #fde047; }
.badge { background: #fde047; color: #111827; border-color: #111827; animation: readable-blink 1s steps(2) infinite; }
.ticker { background: #000; color: #86efac; }
.ticker .hot { background: #991b1b; color: #ffffff; animation: readable-blink 1s steps(2) infinite; }
@keyframes readable-blink { 50% { opacity: .65; } }
.wordart { color: #111827; text-shadow: none; transform: none; letter-spacing: 0.01em; }
.sparkle { color: #991b1b; text-shadow: none; }
.ebay-badge.feat { background: #991b1b; color: #ffffff; }

.choice-locked, .choice-locked:visited, .choice-locked:hover,
.choice-locked .choice-title, .choice-locked .choice-text,
.choice-locked .rank { background: #000; color: #86efac; }
.choice-locked .choice-text { color: #e2e8f0; }
.choice-locked .rank { border-color: #86efac; }

.quote-tape, .quote-tape p, .quote-hero .quote-kicker, .quote-fresh, .quote-table,
.lcd, .count-lcd, .countdown, .radar-caption, .ch-readout, .jb-lcd,
.wa-track, .boombox, .wiki-body pre, .num-up {
  color: #86efac;
  text-shadow: none;
}
.tick { color: #f8fafc; }
.tick small, .quote-table td::before { color: #cbd5e1; }
.num-down { color: #fca5a5; }
.winamp, .wa-title, .wa-btn, .wa-vol, .wa-clock { color: #fde047; }
.cab-title, .overlay h2, #yell, .wx-temp, .wx-day b, .wx-screen-title, .wx-star-top h2 {
  color: #fde047;
  text-shadow: none;
}
.wx-kicker { color: #9a3412; }
html[data-theme]:not([data-theme="classic"]) .wx-kicker { color: var(--th-link); }
.wx-screen { color: #f8fafc; }
.wx-cond { color: #f8fafc; }
.wx-facts { color: #e2e8f0; }
.wx-screen .wx-sub { color: #fde047; }
.wx-alert { color: #111827; background: #fde047; }
.wx-alert.is-warning, .wx-alert.is-clear { color: #ffffff; }
.wx-alert.is-watch { color: #111827; background: #fde047; }
.eight-ball span { color: #f8fafc; text-shadow: none; }
.hud { color: #111827; }
.blink { color: #86efac; }

body.night, body.night .splash p, body.night .ending p, body.night .room-line, body.night .status {
  color: #f8fafc;
}
.splash h1, .ending h1, #roomTitle { color: #fde047; text-shadow: none; }
.kicker, .hint-out { color: #fde047; }
.sconces p, .inv-label, .night-btn.quiet { color: #e2e8f0; }
.night-btn { color: #f8fafc; }
.sheet, .sheet h2, .sheet p, .sheet li { color: #111827; }
.sheet input { color: #f8fafc; background: #111827; }
.mmo-shell, .mmo-shell .hint, .panel, .peek { color: #f8fafc; }
body.fps-page, #play, #matchInfo { color: #f8fafc; }
#playbar { color: #e2e8f0; }
.won, .won h1, .won h2, .won p, .srv-head { color: #111827; }
.slot { color: #fde047; }
.slot .key { color: #e2e8f0; }

@media (max-width: 900px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  select, textarea {
    font-size: 16px !important;
  }
}

/* Professional portal surfaces. */
html, body { background: var(--studio-bg) !important; color: var(--studio-ink); }
.ticker, .era-top, .era-foot, .era-toys, .wordart, .wordart-row, .rainbow-rule, .torch,
.construct, .construction, .winamp, .webring, .webring-table, .microbanners, .geo-badge,
.theme-sky, .btnbar, .toybox, .hazard, .guestbook.atspin, .site-header, .aim-chrome,
.pixel-btn, .sparkle, .network, .mail-banner {
  display: none !important;
}
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.home-visits {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 12px;
  padding: 12px 16px;
  background: #fff;
  color: #0f172a;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
}
.home-visits .counter-label {
  display: block !important;
  margin: 0;
  color: #0f172a;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.home-visits .counter {
  display: inline-flex !important;
  gap: 2px;
  margin: 0;
  padding: 5px 7px;
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px;
}
.home-visits .counter svg { width: 16px; height: 28px; }
.site-footer:has(.home-visits) { padding: 8px 16px 20px; }
.site-footer:has(.home-visits) .studio-footer { margin-top: 4px; }
.site-footer { background: transparent !important; color: var(--studio-muted); border: 0; text-align: center; padding: 28px 16px 12px; }
.box, .card, .quote-box, .gb-box, .hero, .detail, .wiki-article, .recipe-sheet, .panel, .toy,
.word-box, .mystic-shell, .bay-shell, .forum-shell, .ask-shell, .launch-card, .wx-card {
  background: var(--studio-paper) !important;
  color: var(--studio-ink) !important;
  border: 1px solid var(--studio-line) !important;
  border-radius: var(--studio-radius) !important;
  box-shadow: var(--studio-shadow);
}
.box h2, .quote-box h2, .gb-box h2, dialog h2 {
  background: transparent !important;
  color: var(--studio-ink) !important;
  border: 0 !important;
  border-radius: 0;
  padding: 14px 16px 0;
}
.box-body, .quote-body, .gb-form { padding: 8px 16px 16px; }
button, .btn, .key, .file-tab, .night-btn, .mode-tabs button {
  background: #fff !important;
  color: var(--studio-ink) !important;
  border: 1px solid var(--studio-line) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
.btn.primary, button.primary, .studio-account {
  background: #0f172a !important;
  color: #fff !important;
  border-color: #0f172a !important;
}
input, select, textarea, dialog {
  border: 1px solid var(--studio-line) !important;
  border-radius: 10px !important;
  background: #fff;
  color: var(--studio-ink);
}
main h1, .studio-hero h1, .hero h1, .profile-head h1, .wiki-article h1, .recipe-title, body.studio-kitchen h1, body.studio-editorial h1 {
  font-family: Newsreader, Georgia, "Times New Roman", serif !important;
  letter-spacing: -0.02em;
  color: #0f172a;
}
.quote-copy blockquote { font-family: Newsreader, Georgia, serif !important; font-size: 1.35rem; line-height: 1.35; }
.num-up, .tick.up, .delta.up { color: #047857 !important; }
.num-down, .tick.down, .delta.down { color: #b91c1c !important; }
body.studio-telemetry .leaflet-container { border-radius: 14px; overflow: hidden; }
body.studio-game canvas, #view, #world, #lcd, #screen { border-radius: 12px; }
body:not(.chat-page):not(.board-page):not(.fps-live) main.wrap { padding: 22px 16px 40px; }
button, .btn, a.btn, .studio-apps, .studio-account { transition: background .15s ease, color .15s ease, box-shadow .15s ease; }
.box, .card, .quote-box, .status-card, .cat-card { transition: box-shadow .2s ease; }
.studio-hero { padding: 12px 0 8px; }
.studio-hero h1 { margin: 0 0 8px; font-size: clamp(2.4rem, 6vw, 4.2rem); line-height: 1.02; }
.studio-hero p { max-width: 42rem; color: #334155; font-size: 1.05rem; }
.status-grid, .cat-grid { display: grid; gap: 12px; margin: 16px 0; }
.status-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.cat-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.status-card, .cat-card {
  display: block; background: #fff; border: 1px solid #e2e8f0; border-radius: 14px;
  box-shadow: var(--studio-shadow); padding: 16px; text-decoration: none; color: #0f172a;
}
.status-card b, .cat-card h2 { display: block; margin: 0 0 6px; font-size: 1rem; }
.status-card span, .cat-card p { color: #475569; font-size: .95rem; }
.cat-card h2 { font-family: Newsreader, Georgia, serif !important; font-size: 1.45rem; }
.cat-card ul { margin: 8px 0 0; padding-left: 18px; }
.studio-footer { margin-top: 28px; color: var(--ink-subtle, #475569); font-size: .9rem; }
.status-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 160px), 1fr)); }
html[data-theme="light"] {
  --bg: #f4f3ef; --surface: #ffffff; --surface-2: #f1f5f9; --paper: var(--surface);
  --ink: #0f172a; --ink-muted: #334155; --muted: var(--ink-muted); --ink-subtle: #475569;
  --line: #e2e8f0; --line-strong: #7c8799; --link: #1d4ed8;
  --nav: color-mix(in srgb, var(--surface) 88%, transparent); --nav-bg: var(--nav);
  --accent: #0f172a; --accent-ink: #ffffff; --chip: var(--surface-2);
  --focus: #2563eb; --success: #047857; --danger: #b91c1c;
  --warning-bg: #fef3c7; --warning-ink: #78350f; --overlay: rgb(15 23 42 / .45);
  --studio-bg: var(--bg); --studio-paper: var(--surface); --studio-ink: var(--ink); --studio-muted: var(--ink-subtle); --studio-line: var(--line);
}
html[data-theme="dark"] {
  --bg: #0b1220; --surface: #151c2c; --surface-2: #1e293b; --paper: var(--surface);
  --ink: #f8fafc; --ink-muted: #cbd5e1; --muted: var(--ink-muted); --ink-subtle: #94a3b8;
  --line: #334155; --line-strong: #64748b; --link: #93c5fd;
  --nav: color-mix(in srgb, var(--surface) 88%, transparent); --nav-bg: var(--nav);
  --accent: #e2e8f0; --accent-ink: #0f172a; --chip: var(--surface-2);
  --focus: #93c5fd; --success: #86efac; --danger: #fca5a5;
  --warning-bg: #422006; --warning-ink: #fde68a; --overlay: rgb(0 0 0 / .6);
  --shadow-1: 0 0 0 1px rgb(255 255 255 / .04);
  --shadow-2: 0 8px 20px -6px rgb(0 0 0 / .5);
  --shadow-3: 0 24px 56px -12px rgb(0 0 0 / .65);
  --studio-bg: var(--bg); --studio-paper: var(--surface); --studio-ink: var(--ink); --studio-muted: var(--ink-subtle); --studio-line: var(--line);
}
html[data-theme="harbor"] {
  --bg: #0c1a1d; --surface: #14262b; --surface-2: #1b3238; --paper: var(--surface);
  --ink: #f1f5f4; --ink-muted: #cfe0de; --muted: var(--ink-muted); --ink-subtle: #9fbcb8;
  --line: #2a4a50; --line-strong: #5f8a90; --link: #7ddcd0;
  --nav: color-mix(in srgb, var(--surface) 88%, transparent); --nav-bg: var(--nav);
  --accent: #5eead4; --accent-ink: #042f2e; --chip: var(--surface-2);
  --focus: #5eead4; --success: #86efac; --danger: #fca5a5;
  --warning-bg: #422006; --warning-ink: #fde68a; --overlay: rgb(0 0 0 / .6);
  --shadow-1: 0 0 0 1px rgb(255 255 255 / .04);
  --shadow-2: 0 8px 20px -6px rgb(0 0 0 / .5);
  --shadow-3: 0 24px 56px -12px rgb(0 0 0 / .65);
  --studio-bg: var(--bg); --studio-paper: var(--surface); --studio-ink: var(--ink); --studio-muted: var(--ink-subtle); --studio-line: var(--line);
}
html[data-theme="warm"] {
  --bg: #f6f1e7; --surface: #fffaf3; --surface-2: #f3ece1; --paper: var(--surface);
  --ink: #1c1917; --ink-muted: #44403c; --muted: var(--ink-muted); --ink-subtle: #57534e;
  --line: #e7e5e4; --line-strong: #8c847c; --link: #9a3412;
  --nav: color-mix(in srgb, var(--surface) 88%, transparent); --nav-bg: var(--nav);
  --accent: #9a3412; --accent-ink: #fffaf3; --chip: var(--surface-2);
  --focus: #c2410c; --success: #047857; --danger: #b91c1c;
  --warning-bg: #fef3c7; --warning-ink: #78350f; --overlay: rgb(28 25 23 / .45);
  --studio-bg: var(--bg); --studio-paper: var(--surface); --studio-ink: var(--ink); --studio-muted: var(--ink-subtle); --studio-line: var(--line);
}
html[data-theme] body,
html[data-theme] main.wrap {
  background: var(--bg) !important;
  background-image: none !important;
  color: var(--ink) !important;
  border: 0 !important;
}
html[data-theme] .studio-nav {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
html[data-theme] .studio-dock {
  background: var(--nav) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme] .studio-drawer {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme] .studio-brand,
html[data-theme] .studio-links a,
html[data-theme] .studio-dock a,
html[data-theme] .studio-dock button,
html[data-theme] .studio-clock { color: var(--ink) !important; }
html[data-theme] .studio-links a[aria-current="page"],
html[data-theme] .studio-links a:hover { background: var(--chip) !important; }
html[data-theme] .studio-apps,
html[data-theme] .studio-ghost,
html[data-theme] .studio-close,
html[data-theme] button:not(.studio-dock button),
html[data-theme] .btn {
  background: var(--paper) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme] .btn.primary,
html[data-theme] .studio-account {
  background: var(--accent) !important;
  color: var(--accent-ink) !important;
  border-color: var(--accent) !important;
}
html[data-theme] .box,
html[data-theme] .card,
html[data-theme] .quote-box,
html[data-theme] .gb-box,
html[data-theme] .hero,
html[data-theme] .status-card,
html[data-theme] .cat-card,
html[data-theme] .quote-body,
html[data-theme] .counter,
html[data-theme] input,
html[data-theme] select,
html[data-theme] textarea {
  background: var(--paper) !important;
  color: var(--ink) !important;
  border-color: var(--line-strong) !important;
}
html[data-theme] dialog {
  background: var(--paper) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme] .studio-hero h1,
html[data-theme] .studio-hero p,
html[data-theme] .counter-label,
html[data-theme] .hero h1,
html[data-theme] .hero p,
html[data-theme] .mc-brand,
html[data-theme] h1,
html[data-theme] h2,
html[data-theme] h3 { color: var(--ink) !important; }
html[data-theme] .status-card span,
html[data-theme] .cat-card p,
html[data-theme] .studio-footer,
html[data-theme] .quote-by,
html[data-theme] .quote-kicker { color: var(--muted) !important; }
html[data-theme] .quote-copy,
html[data-theme] .quote-copy blockquote,
html[data-theme] .quote-box,
html[data-theme] .quote-box h2 { color: var(--ink) !important; }
html[data-theme] .studio-dock button {
  background: transparent !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .counter svg,
html[data-theme="harbor"] .counter svg { filter: grayscale(1) invert(1) contrast(1.4); }
html[data-theme="dark"] .home-visits,
html[data-theme="harbor"] .home-visits {
  background: var(--paper);
  border-color: var(--line);
}
html[data-theme="dark"] .home-visits .counter-label,
html[data-theme="harbor"] .home-visits .counter-label,
html[data-theme="retro"] .home-visits .counter-label { color: var(--ink) !important; }
html[data-theme="retro"] .home-visits {
  background: #d4d0c8;
  color: #111827;
  border-color: #404040;
  border-radius: 0;
}
html[data-theme] .key[data-state="correct"],
html[data-theme] .tile[data-state="correct"]{background:#3d7a38!important;color:#fff!important;border-color:#214d1e!important}
html[data-theme] .key[data-state="present"]{background:#c9b458!important;color:#111827!important;border-color:#6a5610!important}
html[data-theme] .key[data-state="absent"]{background:#c62828!important;color:#fff!important;border-color:#8e1c1c!important}
html[data-theme] button.conn-tile[data-tier="0"]{background:#f9df6d!important;color:#1c1917!important}
html[data-theme] button.conn-tile[data-tier="1"]{background:#a0c35a!important;color:#1c1917!important}
html[data-theme] button.conn-tile[data-tier="2"]{background:#b0c4ef!important;color:#1c1917!important}
html[data-theme] button.conn-tile[data-tier="3"]{background:#ba81c5!important;color:#1c1917!important}
html[data-theme] .sudo-cell.is-bad{color:#c62828!important}
html[data-theme] main a:not(.btn):not(.choice):not(.brand):not(.status-card):not(.cat-card):not(.shell-hit):not(.recipe-row):not(.recipe-tile):not(.studio-dock a):not(.home-chip):not(.home-app):not(.home-row) { color: var(--link); }
.studio-hero h1, .studio-hero p, .counter-label, .hero h1, .hero p, .mc-brand { color: var(--ink, #0f172a); }
.studio-nav #shellBackup, .studio-nav #shellRestoreBtn { display: none !important; }
.quote-body { background: #fff !important; border: 0 !important; }
.quote-bulb { display: none !important; }
.counter { background: #fff !important; border: 1px solid #e2e8f0 !important; border-radius: 10px; }
.counter svg { filter: grayscale(1) contrast(2); }
.studio-links { scrollbar-width: none; }

html[data-theme="light"],
html[data-theme="warm"] { color-scheme: light; --text: var(--ink); --border: var(--line); }
html[data-theme="dark"],
html[data-theme="harbor"] { color-scheme: dark; --text: var(--ink); --border: var(--line); }
html[data-theme="dark"] ::placeholder,
html[data-theme="harbor"] ::placeholder { color: #e2e8f0; opacity: 1; }
html[data-theme="light"] ::placeholder,
html[data-theme="warm"] ::placeholder { color: #475569; opacity: 1; }
html[data-theme="dark"] ::selection,
html[data-theme="harbor"] ::selection { background: #334155; color: #f8fafc; }
html[data-theme="light"] ::selection,
html[data-theme="warm"] ::selection { background: #bfdbfe; color: #0f172a; }

html[data-theme="dark"] :is(
  .note, .wiki-note, .wiki-h, .recipe-sheet, .chef-note, .archive, .tv-owner,
  .aim-buddies, .aim-buddies h2, .msg, .ask-empty, .hlp-caption, .rules-status,
  .status, .best-line, .day, .day h2, .aisle, .aisle h3, .slot span,
  .wx-crt, .wx-star, .wx-screen-title, .mystic-shell, .bay-shell, .forum-shell,
  .search-shell, .ask-shell, .word-box, .coast-card, .coast-panel, .launch-card,
  .stat, .meta, .lock-note, .sync-banner, .park
),
html[data-theme="harbor"] :is(
  .note, .wiki-note, .wiki-h, .recipe-sheet, .chef-note, .archive, .tv-owner,
  .aim-buddies, .aim-buddies h2, .msg, .ask-empty, .hlp-caption, .rules-status,
  .status, .best-line, .day, .day h2, .aisle, .aisle h3, .slot span,
  .wx-crt, .wx-star, .wx-screen-title, .mystic-shell, .bay-shell, .forum-shell,
  .search-shell, .ask-shell, .word-box, .coast-card, .coast-panel, .launch-card,
  .stat, .meta, .lock-note, .sync-banner, .park
) {
  background: var(--paper) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] :is(.recipe-sheet, .archive, .note, .wiki-note, .aim-buddies, .msg, .day, .aisle, .wx-crt, .chef-note, .tv-owner) :is(h1, h2, h3, p, li, span, time, label, a, small),
html[data-theme="harbor"] :is(.recipe-sheet, .archive, .note, .wiki-note, .aim-buddies, .msg, .day, .aisle, .wx-crt, .chef-note, .tv-owner) :is(h1, h2, h3, p, li, span, time, label, a, small) {
  color: var(--ink) !important;
}
html[data-theme="dark"] :is(.plan-kicker, .launch-kicker, .xw-kicker, .fm-kicker, .ask-kicker, .rules-status, .status, .best-line, .meta, .lock-note, .stat span),
html[data-theme="harbor"] :is(.plan-kicker, .launch-kicker, .xw-kicker, .fm-kicker, .ask-kicker, .rules-status, .status, .best-line, .meta, .lock-note, .stat span) {
  color: var(--link) !important;
}
html[data-theme="dark"] .site-footer,
html[data-theme="dark"] .site-footer .wrap,
html[data-theme="dark"] .site-footer a,
html[data-theme="dark"] .site-footer span,
html[data-theme="harbor"] .site-footer,
html[data-theme="harbor"] .site-footer .wrap,
html[data-theme="harbor"] .site-footer a,
html[data-theme="harbor"] .site-footer span {
  color: var(--muted) !important;
}
html[data-theme="dark"] a:not(.btn):not(.qbadge):not(.rule-chip):not(.status-card):not(.cat-card):not(.shell-hit):not(.recipe-row):not(.recipe-tile):not(.studio-dock a):not(.studio-app):not(.home-chip):not(.home-app):not(.home-row):not(.ship-callout a),
html[data-theme="harbor"] a:not(.btn):not(.qbadge):not(.rule-chip):not(.status-card):not(.cat-card):not(.shell-hit):not(.recipe-row):not(.recipe-tile):not(.studio-dock a):not(.studio-app):not(.home-chip):not(.home-app):not(.home-row):not(.ship-callout a) { color: var(--link) !important; }
html[data-theme="dark"] a.qbadge,
html[data-theme="dark"] a.rule-chip,
html[data-theme="harbor"] a.qbadge,
html[data-theme="harbor"] a.rule-chip { color: #111827 !important; }
html[data-theme="dark"] .num-down,
html[data-theme="harbor"] .num-down { color: #fca5a5 !important; }
html[data-theme="dark"] .num-up,
html[data-theme="harbor"] .num-up { color: #86efac !important; }
html[data-theme="dark"] :is(.deal-badge.is-hot, .qbadge.is-hot, .wx-live),
html[data-theme="harbor"] :is(.deal-badge.is-hot, .qbadge.is-hot, .wx-live) {
  background: #7f1d1d !important;
  color: #fff !important;
}
html[data-theme="dark"] .wx-live.is-forecast,
html[data-theme="harbor"] .wx-live.is-forecast,
html[data-theme="dark"] .wx-track-future,
html[data-theme="harbor"] .wx-track-future {
  background: #7c2d12 !important;
  color: #ffedd5 !important;
}
html[data-theme="dark"] .blink,
html[data-theme="harbor"] .blink { color: #fef3c7 !important; }
html[data-theme="dark"] .ebay-word :is(.c1, .c2, .c3, .c4, .c5, .c6, .c7, .c8),
html[data-theme="harbor"] .ebay-word :is(.c1, .c2, .c3, .c4, .c5, .c6, .c7, .c8),
html[data-theme="dark"] .bay-head,
html[data-theme="dark"] .bay-head *,
html[data-theme="harbor"] .bay-head,
html[data-theme="harbor"] .bay-head * { color: #1c1917 !important; }
html[data-theme="dark"] h1.mystic-word,
html[data-theme="dark"] .mystic-word span,
html[data-theme="harbor"] h1.mystic-word,
html[data-theme="harbor"] .mystic-word span,
html[data-theme="dark"] :is(.answer-line, .odds, .hint),
html[data-theme="harbor"] :is(.answer-line, .odds, .hint) { color: var(--ink) !important; }
html[data-theme="dark"] .meter,
html[data-theme="harbor"] .meter,
html[data-theme="dark"] .meter span,
html[data-theme="harbor"] .meter span { color: var(--ink) !important; }
html[data-theme="dark"] :is(.leaflet-popup-content-wrapper, .leaflet-popup-tip, .leaflet-bar a, .leaflet-control a),
html[data-theme="harbor"] :is(.leaflet-popup-content-wrapper, .leaflet-popup-tip, .leaflet-bar a, .leaflet-control a) {
  background: var(--paper) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .leaflet-popup-content,
html[data-theme="dark"] .leaflet-popup-content a,
html[data-theme="harbor"] .leaflet-popup-content,
html[data-theme="harbor"] .leaflet-popup-content a { color: var(--ink) !important; }
html[data-theme="dark"] .wx-screen-title,
html[data-theme="harbor"] .wx-screen-title,
html[data-theme="dark"] .hlp-caption,
html[data-theme="harbor"] .hlp-caption,
html[data-theme="dark"] .aim-titlebar,
html[data-theme="harbor"] .aim-titlebar,
html[data-theme="dark"] .day h2,
html[data-theme="harbor"] .day h2 {
  background: #0f2744 !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] :is(
  .deals, .deals h2, .deals-lead, .win, .win h2, .card, .sight-list li,
  table.lots, table.lots td, table.lots th, .bay-shell, .bay-bar, .detail-layout, .desc, .qa, .qa-card, .seller-name,
  .forum-shell, .forum-bar, .forum-head, table.board, table.board td, table.board th, .post, .post-head, .empty-board,
  .ask-win, .ask-win h2, .brief-ai, .brief-local, .hit, .wire-list li, .tool-card, .butler-card, .ask-bar,
  .q, .clues, .clues h2, .paint-body, .paint-status, .paint-tools, .paint-titlebar, .quote-card, .quote-disclaimer,
  .quote-watch, .fps-wrap, .hud, .score, .won
),
html[data-theme="harbor"] :is(
  .deals, .deals h2, .deals-lead, .win, .win h2, .card, .sight-list li,
  table.lots, table.lots td, table.lots th, .bay-shell, .bay-bar, .detail-layout, .desc, .qa, .qa-card, .seller-name,
  .forum-shell, .forum-bar, .forum-head, table.board, table.board td, table.board th, .post, .post-head, .empty-board,
  .ask-win, .ask-win h2, .brief-ai, .brief-local, .hit, .wire-list li, .tool-card, .butler-card, .ask-bar,
  .q, .clues, .clues h2, .paint-body, .paint-status, .paint-tools, .paint-titlebar, .quote-card, .quote-disclaimer,
  .quote-watch, .fps-wrap, .hud, .score, .won
) {
  background: var(--paper) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] :is(.deals, .win, .card, .sight-list, table.lots, .forum-shell, .ask-win, .hit, .quote-card, .post) :is(h1, h2, h3, p, li, td, th, span, label, a, small),
html[data-theme="harbor"] :is(.deals, .win, .card, .sight-list, table.lots, .forum-shell, .ask-win, .hit, .quote-card, .post) :is(h1, h2, h3, p, li, td, th, span, label, a, small) {
  color: var(--ink) !important;
}
html[data-theme="dark"] .bay-head,
html[data-theme="harbor"] .bay-head { background: #ffcc00 !important; }
html[data-theme="dark"] .deals-table tr,
html[data-theme="dark"] .deals-table td,
html[data-theme="dark"] .deal-ship,
html[data-theme="dark"] .deal-price,
html[data-theme="dark"] .deals-table td::before,
html[data-theme="harbor"] .deals-table tr,
html[data-theme="harbor"] .deals-table td,
html[data-theme="harbor"] .deal-ship,
html[data-theme="harbor"] .deal-price,
html[data-theme="harbor"] .deals-table td::before,
html[data-theme="dark"] .tag,
html[data-theme="dark"] .sample,
html[data-theme="dark"] .card .cat,
html[data-theme="harbor"] .tag,
html[data-theme="harbor"] .sample,
html[data-theme="harbor"] .card .cat,
html[data-theme="dark"] .lede,
html[data-theme="dark"] .local-stats,
html[data-theme="dark"] .board-status,
html[data-theme="dark"] .won,
html[data-theme="harbor"] .lede,
html[data-theme="harbor"] .local-stats,
html[data-theme="harbor"] .board-status,
html[data-theme="harbor"] .won,
html[data-theme="dark"] .butler-card figcaption,
html[data-theme="harbor"] .butler-card figcaption {
  background: var(--paper) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .deal-badge.is-value,
html[data-theme="harbor"] .deal-badge.is-value {
  background: #14532d !important;
  color: #ecfdf5 !important;
}
html[data-theme="dark"] .ebay-badge.fresh,
html[data-theme="harbor"] .ebay-badge.fresh {
  background: #14532d !important;
  color: #ecfdf5 !important;
}
html[data-theme="dark"] .overlay,
html[data-theme="harbor"] .overlay {
  background: #0b1f4b !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] .overlay :is(p, .blink, .hint, .how, .best-line),
html[data-theme="harbor"] .overlay :is(p, .blink, .hint, .how, .best-line) {
  color: #f8fafc !important;
  background: transparent !important;
}
html[data-theme="dark"] p.hint,
html[data-theme="harbor"] p.hint { color: var(--ink) !important; background: transparent !important; }
html[data-theme="dark"] b,
html[data-theme="dark"] label,
html[data-theme="harbor"] b,
html[data-theme="harbor"] label { color: inherit !important; }
html[data-theme="dark"] .quote-card .why-chip,
html[data-theme="harbor"] .quote-card .why-chip {
  background: var(--chip) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .quote-card .why-chip b,
html[data-theme="harbor"] .quote-card .why-chip b { color: var(--link) !important; }
html[data-theme="dark"] a.qbadge.is-caution,
html[data-theme="harbor"] a.qbadge.is-caution { color: #111827 !important; }
html[data-theme="dark"] .cabinet,
html[data-theme="harbor"] .cabinet { background: var(--paper) !important; color: var(--ink) !important; }
html[data-theme="dark"] .wiki-h span,
html[data-theme="harbor"] .wiki-h span,
html[data-theme="dark"] .odds,
html[data-theme="harbor"] .odds { color: var(--ink) !important; background: transparent !important; }
html[data-theme="dark"] .leaflet-control-attribution,
html[data-theme="harbor"] .leaflet-control-attribution,
html[data-theme="dark"] .leaflet-control-attribution span,
html[data-theme="harbor"] .leaflet-control-attribution span {
  background: rgba(15, 23, 42, .92) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .gb-box,
html[data-theme="dark"] .gb-form,
html[data-theme="dark"] .gb-stamps,
html[data-theme="dark"] .gb-stamps label,
html[data-theme="harbor"] .gb-box,
html[data-theme="harbor"] .gb-form,
html[data-theme="harbor"] .gb-stamps,
html[data-theme="harbor"] .gb-stamps label {
  background: var(--paper) !important;
  color: var(--ink) !important;
}

/* Opt-in 90s skin. Decorative strips stay hidden until this theme is chosen. */
html[data-theme="retro"] {
  color-scheme: light;
  --bg: #008080;
  --paper: #d4d0c8;
  --ink: #111827;
  --muted: #1f2937;
  --line: #404040;
  --link: #000080;
  --nav: #c0c0c0;
  --accent: #000080;
  --accent-ink: #ffffff;
  --chip: #ffffcc;
  --studio-bg: #008080;
  --studio-paper: #d4d0c8;
  --studio-ink: #111827;
  --studio-muted: #1f2937;
  --studio-line: #404040;
  --studio-radius: 0px;
  --studio-shadow: none;
}
html[data-theme="retro"] body {
  background-color: #008080 !important;
  background-image: linear-gradient(#006666 1px, transparent 1px), linear-gradient(90deg, #006666 1px, transparent 1px) !important;
  background-size: 18px 18px !important;
  color: #111827 !important;
}
html[data-theme="retro"] main.wrap {
  background: #d4d0c8 !important;
  color: #111827 !important;
  border: 3px ridge #ffffff !important;
}
html[data-theme="retro"] .ticker,
html[data-theme="retro"] .era-top,
html[data-theme="retro"] .construct,
html[data-theme="retro"] .construction,
html[data-theme="retro"] .rainbow-rule {
  display: block !important;
  max-width: 100%;
  overflow: hidden;
}
html[data-theme="retro"] .wordart-row,
html[data-theme="retro"] .ticker-track {
  display: flex !important;
}
html[data-theme="retro"] .wordart,
html[data-theme="retro"] .torch,
html[data-theme="retro"] .counter-label {
  display: block !important;
}
html[data-theme="retro"] .counter { display: inline-flex !important; }
html[data-theme="retro"] .ticker {
  background: #000 !important;
  color: #86efac !important;
  font-size: 13px !important;
  line-height: 1.35;
}
html[data-theme="retro"] .studio-nav,
html[data-theme="retro"] .studio-dock {
  background: #c0c0c0 !important;
  color: #111827 !important;
  border-color: #404040 !important;
}
html[data-theme="retro"] .studio-brand,
html[data-theme="retro"] .studio-dock a,
html[data-theme="retro"] .studio-dock button {
  color: #111827 !important;
}
html[data-theme="retro"] h1,
html[data-theme="retro"] h2,
html[data-theme="retro"] h3,
html[data-theme="retro"] p,
html[data-theme="retro"] li {
  color: #111827;
}
html[data-theme="retro"] .event-card h3,
html[data-theme="retro"] .chat-head h1 {
  color: #111827 !important;
}

/* iPhone design pass. Modern themes only; Retro keeps its own chrome. */
@media (max-width:768px){
  :root{--nav-h:56px;--dock-h:calc(60px + env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion: no-preference){
  @view-transition { navigation: auto; }
  .studio-nav{view-transition-name: topbar}
  .studio-dock{view-transition-name: dock}
  dialog[open]{animation: sheet-in var(--dur-3) var(--ease-out)}
  @keyframes sheet-in{from{transform:translateY(24px);opacity:0}}
  button:active, .btn:active, .shell-tool:active{transform:scale(.98)}
}
html:not([data-theme="retro"]) dialog h2::after{content:none !important}
html:not([data-theme="retro"]) dialog::backdrop{background:var(--overlay) !important}
html:not([data-theme="retro"]) dialog{
  border:1px solid var(--line) !important;
  border-radius:var(--radius-xl) !important;
  background:var(--surface) !important;
  color:var(--ink) !important;
  box-shadow:var(--shadow-3);
  padding:0;
  width:min(560px, calc(100vw - 24px));
  max-height:min(88dvh, 760px);
}
html:not([data-theme="retro"]) dialog:modal{overscroll-behavior:contain}
html:not([data-theme="retro"]) dialog::backdrop{overflow:hidden;overscroll-behavior:contain}
html:not([data-theme="retro"]) dialog > header,
html:not([data-theme="retro"]) .word-dialog-bar{
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);
  padding:var(--space-4) var(--space-4) var(--space-2);position:sticky;top:0;background:inherit;z-index:2
}
html:not([data-theme="retro"]) dialog > header h2,
html:not([data-theme="retro"]) .word-dialog-bar h2{font-size:var(--text-lg);margin:0;background:none !important;color:var(--ink) !important}
html:not([data-theme="retro"]) .shell-x{
  width:var(--tap);height:var(--tap);min-height:var(--tap);padding:0;
  border:0 !important;border-radius:var(--radius-md) !important;
  background:transparent !important;color:var(--ink) !important;
  font:400 28px/1 var(--font-ui) !important
}
@media (max-width:600px){
  html:not([data-theme="retro"]) dialog{
    margin:auto 0 0;width:100%;max-width:none;
    border-radius:var(--radius-xl) var(--radius-xl) 0 0;
    padding-bottom:env(safe-area-inset-bottom);max-height:92svh
  }
}
html:not([data-theme="retro"]) :is(.win h2,.clues h2,.ask-win h2,.wx-screen-title,.wx-star-top h2,.hlp-caption,.box h2,.gb-box h2,.quote-box h2,.day h2){
  background:none !important;color:var(--ink) !important;border:0 !important;border-left:0 !important;
  font:var(--fw-semibold) var(--text-lg)/var(--lh-snug) var(--font-ui) !important;
  padding:0 0 var(--space-2) !important;margin:0 0 var(--space-3) !important;text-shadow:none !important
}
html:not([data-theme="retro"]) :is(.win,.wx-crt,.wx-star,.hlp-window,.ask-win,.box,.quote-box,.gb-box){
  background:var(--surface) !important;border:1px solid var(--line) !important;
  border-radius:var(--radius-lg) !important;box-shadow:var(--shadow-1) !important;color:var(--ink) !important
}
html:not([data-theme="retro"]) .wx-screen{
  background:var(--surface-2) !important;color:var(--ink) !important;border:1px solid var(--line) !important;box-shadow:none !important
}
html:not([data-theme="retro"]) :is(.wx-screen,.wx-screen *){color:var(--ink)}
html:not([data-theme="retro"]) .wx-temp,
html:not([data-theme="retro"]) .wx-cond,
html:not([data-theme="retro"]) .wx-facts{color:var(--ink) !important}
html:not([data-theme="retro"]) :is(.lcd,.count-lcd,.quote-fresh,.countdown){
  background:var(--surface-2) !important;color:var(--ink) !important;border:1px solid var(--line) !important;
  border-radius:var(--radius-md) !important;text-shadow:none !important;box-shadow:none !important;
  font-family:var(--font-ui) !important
}
html:not([data-theme="retro"]) :is(.lcd,.count-lcd){
  font:var(--fw-semibold) var(--text-xl)/1 var(--font-mono) !important;font-variant-numeric:tabular-nums
}
html:not([data-theme="retro"]) .quote-fresh{font:var(--fw-medium) var(--text-sm)/1.45 var(--font-ui) !important;color:var(--ink-muted) !important}
html:not([data-theme="retro"]) .quote-table,
html:not([data-theme="retro"]) .quote-table tr,
html:not([data-theme="retro"]) .deals-table,
html:not([data-theme="retro"]) .deals-table tr{
  background:var(--surface) !important;color:var(--ink) !important;border-color:var(--line) !important;
  font-family:var(--font-ui) !important
}
html:not([data-theme="retro"]) .quote-table tbody td:first-child,
html:not([data-theme="retro"]) .rules-card,
html:not([data-theme="retro"]) .rules-card summary{
  background:var(--surface) !important;color:var(--ink) !important;border-left:0 !important;box-shadow:none !important
}
html:not([data-theme="retro"]) :is(.quote-table td,.quote-table th,.deals-table td,.deals-table th,.deal-ship,.deal-price){
  background:transparent !important;color:var(--ink) !important;border-color:var(--line) !important
}
html:not([data-theme="retro"]) :is(.quote-table th,.deals-table th){background:var(--surface-2) !important}
html:not([data-theme="retro"]) :is(.quote-table td::before,.deals-table td::before){
  color:var(--ink-muted) !important;font-size:var(--text-xs) !important;font-weight:var(--fw-semibold) !important
}
html:not([data-theme="retro"]) .num-up{color:var(--success) !important}
html:not([data-theme="retro"]) .num-down{color:var(--danger) !important}
html:not([data-theme="retro"]) .hero,
html:not([data-theme="retro"]) .hero.quote-hero{
  border-left:0 !important;background:var(--surface) !important;color:var(--ink) !important;
  padding:var(--space-5) var(--space-4) !important;box-shadow:var(--shadow-1)
}
html:not([data-theme="retro"]) .quote-kicker,
html:not([data-theme="retro"]) .radar-kicker,
html:not([data-theme="retro"]) .mc-brand{display:none !important}
html:not([data-theme="retro"]) .hero .lede,
html:not([data-theme="retro"]) .hero p,
html:not([data-theme="retro"]) .quote-disclaimer{color:var(--ink-muted);font-size:var(--text-sm)}
html:not([data-theme="retro"]) .note{
  background:var(--warning-bg) !important;color:var(--warning-ink) !important;
  border:0 !important;border-radius:var(--radius-md) !important
}
html:not([data-theme="retro"]) .boombox{
  background:var(--surface) !important;color:var(--ink) !important;border:1px solid var(--line) !important;
  border-radius:var(--radius-lg) !important;box-shadow:var(--shadow-1) !important
}
html:not([data-theme="retro"]) :is(.cell){border-color:var(--ink) !important;background:var(--surface) !important;color:var(--ink) !important}
html:not([data-theme="retro"]) .cell.black{background:var(--ink) !important}
html:not([data-theme="retro"]) .cell.active,
html:not([data-theme="retro"]) .cell.is-active{background:color-mix(in srgb, var(--link) 22%, var(--surface)) !important}
html:not([data-theme="retro"]) .board{border-color:var(--ink)}
html:not([data-theme="retro"]) .mode-btn[aria-pressed="true"],
html:not([data-theme="retro"]) .cruise-tabs .btn[aria-selected="true"]{
  background:var(--surface) !important;color:var(--ink) !important;border-color:var(--line) !important;box-shadow:var(--shadow-1)
}
html:not([data-theme="retro"]) .member-dialog{
  box-sizing:border-box;
  overflow:auto;
  max-height:calc(100svh - var(--nav-h, 56px) - var(--dock-h, 0px) - 16px)
}
html:not([data-theme="retro"]) .member-head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin:0 0 8px;padding:12px 12px 0
}
html:not([data-theme="retro"]) .member-head h2{margin:0 !important;min-width:0}
html:not([data-theme="retro"]) .member-dialog .member-close{
  flex:0 0 44px;width:44px !important;height:44px !important;min-height:44px !important;max-width:44px;
  margin:0;padding:0 !important;float:none !important;position:static !important;
  display:inline-flex !important;align-items:center;justify-content:center;
  border:1px solid var(--line-strong,#64748b) !important;border-radius:12px !important;
  background:var(--surface,#fff) !important;color:var(--ink,#0f172a) !important;
  box-shadow:none !important
}
html:not([data-theme="retro"]) .member-dialog .member-close svg{display:block;width:20px;height:20px}
html:not([data-theme="retro"]) .member-dialog form[hidden]{display:none !important}
html:not([data-theme="retro"]) .member-tabs{display:flex;gap:8px;margin:0 12px 12px}
html:not([data-theme="retro"]) .member-tabs button{
  flex:1;min-height:44px;border:1px solid var(--line-strong,#64748b) !important;border-radius:12px !important;
  background:var(--surface,#fff) !important;color:var(--ink,#0f172a) !important;
  font:650 15px/1 var(--font-ui, Inter, sans-serif) !important;box-shadow:none !important
}
html:not([data-theme="retro"]) .member-tabs button[aria-pressed="true"]{
  background:var(--ink,#0f172a) !important;color:var(--surface,#fff) !important;border-color:var(--ink,#0f172a) !important
}
html:not([data-theme="retro"]) .member-dialog input::placeholder{color:var(--ink-muted,#64748b);opacity:1}
html[data-auth="pending"] :is(#shellOwner,#ownerBtn,#owner){visibility:hidden}
.shell-find label.member-stay,
form label.member-stay{
  display:flex !important;flex-direction:row !important;align-items:center !important;
  justify-content:flex-start;gap:10px;min-height:44px;margin:0;width:100%;
  color:var(--ink,#0f172a) !important;cursor:pointer;
  font:600 15px/1.3 var(--font-ui,Inter,system-ui,sans-serif)
}
.member-stay span{display:inline;flex:1 1 auto;min-width:0}
.member-dialog .member-stay input,
.shell-find .member-stay input[type="checkbox"]{
  width:44px !important;height:44px !important;min-width:44px !important;min-height:44px !important;
  max-width:44px;margin:0 !important;flex:0 0 44px;accent-color:var(--ink,#0f172a)
}
@media (max-width:768px){
  html:not([data-theme="retro"]) dialog.member-dialog{
    max-height:calc(100svh - var(--nav-h, 56px) - var(--dock-h, 72px) - 12px) !important;
    margin-top:calc(var(--nav-h, 56px) + 8px) !important;
    margin-bottom:calc(var(--dock-h, 72px) + 8px) !important;
    overflow:auto !important
  }
}
html:not([data-theme="retro"]) :is(.word-modes,.cruise-tabs,.mode-row){
  background:var(--surface-2);border-radius:var(--radius-md);padding:4px
}
.shell-hit{
  display:flex;align-items:center;gap:var(--space-3);min-height:var(--tap-comfy);
  padding:var(--space-2) var(--space-3);border:0 !important;border-radius:var(--radius-md) !important;
  background:transparent !important;color:var(--ink) !important;text-decoration:none !important;
  box-shadow:none !important
}
.shell-hit small,.shell-hit .shell-kind{color:var(--ink-muted) !important}
.shell-hit:is(:hover,:focus-visible,[aria-selected="true"]){background:var(--surface-2) !important}
.shell-results{list-style:none;margin:0;padding:0}
.shell-results li{margin:0;padding:0}
.shell-find{
  background:var(--surface) !important;color:var(--ink) !important;border:1px solid var(--line) !important;border-radius:var(--radius-xl) !important
}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),
select, textarea{
  font:var(--text-base)/1.4 var(--font-ui);
  min-height:var(--tap-comfy);
  background:var(--surface);
  color:var(--ink);
  border:1px solid var(--line-strong);
  border-radius:var(--radius-md)
}
textarea{padding:var(--space-3);min-height:96px}
input::placeholder,textarea::placeholder{color:var(--ink-subtle);opacity:1}
:is(input,select,textarea):focus-visible{outline:2px solid var(--focus);outline-offset:1px;border-color:var(--focus)}
:is(input,select,textarea):user-invalid{border-color:var(--danger)}
label{font:var(--fw-semibold) var(--text-sm)/1.3 var(--font-ui);color:var(--ink)}
.card,.status-card,.cat-card,.box{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-1);padding:var(--space-4)
}
a.status-card,a.cat-card{color:var(--ink) !important;text-decoration:none !important;display:block}
a.status-card :is(b,h2,h3),a.cat-card :is(b,h2,h3){color:var(--ink) !important;text-decoration:none !important;font-size:var(--text-md);margin:0 0 var(--space-1)}
a.status-card p,a.status-card span,a.cat-card p,a.cat-card .cat-apps{color:var(--ink-muted) !important;text-decoration:none !important;margin:0}
a.status-card span,a.cat-card .cat-apps{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}
a.status-card:active,a.cat-card:active{background:var(--surface-2)}
.cat-apps{margin-top:var(--space-2) !important;font-size:var(--text-sm)}
.quote-copy blockquote{
  font-family:var(--font-display) !important;font-weight:500;font-size:var(--text-display);line-height:var(--lh-snug);text-wrap:balance
}
.quote-meta{margin:.4em 0 0;color:var(--ink-muted);font-size:var(--text-sm)}
.home-visits{background:transparent !important;border:0 !important;box-shadow:none !important;color:var(--ink-subtle) !important;padding-bottom:var(--space-6)}
.home-visits .count-lcd,.home-visits .counter{color:var(--ink) !important}
.site-footer,.studio-footer,.site-footer a{color:var(--ink-subtle) !important}
#guestbook{content-visibility:auto;contain-intrinsic-size:auto 600px}
@media (max-width:600px){
  .gb-actions .btn.primary{width:100%}
}
html:not([data-theme="retro"]) .filebox{
  background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important
}
html:not([data-theme="retro"]) .grid:not([data-recipe-layout]):not(.xw-grid){
  grid-template-columns:repeat(auto-fill,minmax(min(100%,160px),1fr)) !important;
  background:transparent !important;border:0 !important;padding:0 !important
}
html:not([data-theme="retro"]) .xw-grid{
  display:grid !important;grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  width:min(100%,calc(100vw - 32px));max-width:360px;background:transparent !important;border:0 !important;padding:0 !important
}
html:not([data-theme="retro"]) .xw-grid .cell{
  aspect-ratio:1;min-height:0 !important;background:var(--surface) !important;color:var(--ink) !important
}
html:not([data-theme="retro"]) .xw-grid .cell input{color:var(--ink) !important;background:transparent !important}
html:not([data-theme="retro"]) .xw-grid .cell.black{background:#111827 !important;color:#f8fafc !important}
html:not([data-theme="retro"]) .grid[data-recipe-layout],
html:not([data-theme="retro"]) #grid.is-grouped{
  background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important
}
html[data-theme] a.recipe-row,
html[data-theme] a.recipe-row .recipe-row-title,
html[data-theme] a.recipe-tile,
html[data-theme] a.recipe-tile .recipe-tile-title{
  background:transparent !important;color:var(--ink) !important
}
html:not([data-theme="retro"]) #grid.is-grouped{
  display:flex !important;flex-direction:column !important;width:100%;max-width:100%;gap:12px;
  grid-template-columns:none !important
}
html:not([data-theme="retro"]) .cuisine-group{width:100%;max-width:100%;box-sizing:border-box}
html:not([data-theme="retro"]) [data-recipe-layout="list"]{
  display:flex !important;flex-direction:column !important;gap:0 !important;width:100%;
  grid-template-columns:none !important
}
html:not([data-theme="retro"]) [data-recipe-layout="grid"]{
  display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important;width:100%
}
html:not([data-theme="retro"]) [data-recipe-layout="cards"]{
  display:grid !important;grid-template-columns:minmax(0,1fr) !important;gap:12px !important;width:100%
}
html:not([data-theme="retro"]) .cuisine-cards .thumb{
  display:block !important;width:100% !important;height:auto !important;aspect-ratio:16/9;overflow:hidden;position:relative
}
html:not([data-theme="retro"]) .cuisine-cards .thumb img{
  position:absolute;inset:0;width:100% !important;height:100% !important;max-width:none !important;object-fit:cover;aspect-ratio:auto
}
html:not([data-theme="retro"]) .cuisine-cards .card,
html:not([data-theme="retro"]) .card.card-chef{width:100%;min-width:0;padding:0 !important;overflow:hidden}
html:not([data-theme="retro"]) .cuisine-cards .card-body,
html:not([data-theme="retro"]) .card.card-chef .card-body{padding:12px 12px 14px}
html:not([data-theme="retro"]) .cuisine-cards .card h3{font-size:1rem !important;line-height:1.3 !important}
html:not([data-theme="retro"]) .list-count{color:var(--ink) !important}
html:not([data-theme="retro"]) .file-tabs,
html:not([data-theme="retro"]) .cuisine-chips{
  display:flex !important;flex-wrap:nowrap !important;overflow-x:auto !important;max-width:100%;
  gap:8px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch
}
html:not([data-theme="retro"]) .file-tabs .file-tab,
html:not([data-theme="retro"]) .cuisine-chips .file-tab{
  flex:0 0 auto;scroll-snap-align:start;min-height:44px;white-space:nowrap;border-radius:999px !important
}
html:not([data-theme="retro"]) .layout-switch{background:var(--surface-2) !important;border:1px solid var(--line-strong) !important}
html:not([data-theme="retro"]) .layout-switch button{background:transparent !important;color:var(--ink) !important;border:0 !important;box-shadow:none !important}
html:not([data-theme="retro"]) .layout-switch button[aria-pressed="true"]{background:var(--ink) !important;color:var(--bg) !important}
html:not([data-theme="retro"]) a.recipe-row,
html:not([data-theme="retro"]) a.recipe-tile{color:var(--ink) !important;text-decoration:none !important}
html:not([data-theme="retro"]) .recipe-row-meta,
html:not([data-theme="retro"]) .recipe-tile-title{color:var(--ink) !important}
html:not([data-theme="retro"]) .recipe-row-meta{color:var(--ink-muted) !important}
html:not([data-theme="retro"]) .cat-pill{background:var(--surface-2) !important;color:var(--ink) !important;border:0 !important}
html:not([data-theme="retro"]) .card:hover{outline:none !important}
html:not([data-theme="retro"]) .recipe-actions{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important}
html:not([data-theme="retro"]) .recipe-actions .btn{width:auto !important;min-height:44px}
html:not([data-theme="retro"]) .card-chef .thumb{height:auto;aspect-ratio:16/9;background:var(--surface-2)}
html:not([data-theme="retro"]) .card-chef .thumb img{width:100%;height:100%;aspect-ratio:16/9;object-fit:cover}
html:not([data-theme="retro"]) .grid > .card:nth-child(n+9){content-visibility:auto;contain-intrinsic-size:auto 260px}
html:not([data-theme="retro"]) .file-tabs,.source-chips{
  flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;
  mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent)
}
.ship-callout .leaflet-popup-content-wrapper{border-radius:var(--radius-md);box-shadow:var(--shadow-2);background:var(--surface);color:var(--ink)}
.ship-callout .leaflet-popup-content{margin:var(--space-2) 32px var(--space-2) var(--space-3);font-size:var(--text-sm);line-height:1.35;max-width:220px}
.ship-callout .leaflet-popup-close-button{
  width:var(--tap) !important;height:var(--tap) !important;top:-6px !important;right:-6px !important;
  font:400 18px/var(--tap) var(--font-ui) !important;color:var(--ink-muted) !important;background:none !important
}
.ship-callout .leaflet-popup-tip{background:var(--surface)}
html:not([data-theme="retro"]) #map{height:min(52svh,480px) !important;min-height:220px}
html:not([data-theme="retro"]) .cruise-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px}
html:not([data-theme="retro"]) .tile{
  background:var(--surface) !important;color:var(--ink) !important;border:2px solid var(--line-strong) !important;
  box-shadow:none !important;border-radius:var(--radius-sm) !important
}
html[data-theme="dark"] .tile,
html[data-theme="harbor"] .tile{border-color:#64748b !important}
html:not([data-theme="retro"]) .tile.is-filled{border-color:var(--ink-muted) !important}
html:not([data-theme="retro"]) .tile[data-state="present"]{background:#c9b458 !important;color:#111827 !important;border-color:#6a5610 !important}
html:not([data-theme="retro"]) .tile[data-state="absent"]{background:#3a3a3a !important;color:#fff !important;border-color:#1c1c1c !important}
html:not([data-theme="retro"]) .word-modes .word-btn{font-size:var(--text-sm) !important}
html:not([data-theme="retro"]) .theme-switch{
  display:flex;align-items:center;gap:8px;margin:0 0 var(--space-3);
  background:transparent !important;border:0 !important;padding:0 !important;color:var(--ink);font-size:var(--text-sm)
}
html:not([data-theme="retro"]) .theme-switch select{
  flex:1;min-height:48px;border:1px solid var(--line-strong) !important;border-radius:var(--radius-md) !important;
  background:var(--surface) !important;color:var(--ink) !important
}
.wiki-body{max-width:var(--measure);font-size:1.0625rem;line-height:1.6}
html:not([data-theme="retro"]) .studio-footer,
html:not([data-theme="retro"]) .site-footer{color:var(--ink-subtle) !important}
@media (max-width:768px){
  body.chat-page .chat-compose{padding-bottom:var(--space-2) !important}
  body.chat-page.chat-keyboard .chat-compose{padding-bottom:calc(var(--space-2) + env(safe-area-inset-bottom)) !important}
}
.chat-name,.msg .who{font-size:var(--text-sm);font-weight:var(--fw-semibold);color:var(--ink)}
.msg time,.chat-time{font-size:var(--text-xs);color:var(--ink-subtle)}
.msg{font-size:var(--text-base)}
html:not([data-theme="retro"]) #wordKeys button.key:not([data-state]){
  background:var(--surface) !important;color:var(--ink) !important;
  border-color:var(--line-strong) !important;
  min-height:var(--key,40px) !important;height:var(--key,40px) !important
}
html:not([data-theme="retro"]) .hero-sub{margin:.2em 0 .4em;color:var(--ink-muted);font-size:var(--text-sm)}
html[data-theme="dark"] .tile:not([data-state]),
html[data-theme="harbor"] .tile:not([data-state]){background:var(--surface) !important;border:2px solid #64748b !important;color:var(--ink) !important}
html:not([data-theme="retro"]) :is(.chat-compose,.chat-head,.chat-menu){
  background:var(--surface) !important;color:var(--ink) !important;border-color:var(--line) !important
}
html:not([data-theme="retro"]) :is(.chat-as,.chat-as strong,.chat-head h1,.chat-status){color:var(--ink) !important}
html:not([data-theme="retro"]) .chat-as{color:var(--ink-muted) !important}
html:not([data-theme="retro"]) .bubble{background:var(--surface-2) !important;color:var(--ink) !important;font-size:var(--text-base)}
html:not([data-theme="retro"]) .bubble.is-mine{background:var(--accent) !important;color:var(--accent-ink) !important}
html:not([data-theme="retro"]) .bubble-name{font-size:var(--text-sm);font-weight:var(--fw-semibold);color:var(--ink)}
html:not([data-theme="retro"]) .bubble time{font-size:var(--text-xs);color:var(--ink-subtle) !important}
html:not([data-theme="retro"]) .bubble.is-mine time{color:inherit !important}
html:not([data-theme="retro"]) .cruise-note,
html:not([data-theme="retro"]) .sync-banner,
html:not([data-theme="retro"]) .deals{
  background:var(--surface-2) !important;color:var(--ink) !important;border:1px solid var(--line) !important;
  border-radius:var(--radius-md) !important;box-shadow:none !important
}
.studio-dock a,.studio-dock button{
  border:0 !important;background:transparent !important;box-shadow:none !important;min-width:0 !important;color:var(--ink-muted) !important
}
.studio-dock [aria-current="page"]{color:var(--link) !important;background:transparent !important}
html[data-theme] .studio-dock a[aria-current="page"],
html[data-theme] .studio-dock button[aria-expanded="true"]{
  color:var(--link) !important;background:transparent !important
}
html[data-theme] .app-tile{
  background:var(--app-bg,#e2e8f0) !important;
  color:var(--app-ink,#0f172a) !important
}
html[data-theme] a.studio-app,
html[data-theme] a.studio-app .app-label{color:var(--ink) !important}
html[data-theme="retro"] .studio-apps-grid{
  grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr));gap:6px
}
html[data-theme="retro"] .studio-app{
  flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;
  min-height:44px;padding:6px 8px;border-radius:0;text-align:left;font-size:16px
}
html:not([data-theme="retro"]) .app-pixel{display:none !important}
html[data-theme="retro"] .app-modern{display:none !important}
html[data-theme="retro"] .app-pixel{display:grid !important;place-items:center}
html[data-theme="retro"] .app-pixel svg{width:16px;height:16px;image-rendering:pixelated}
html[data-theme="retro"] .studio-dock .app-pixel svg{width:22px;height:22px}
html[data-theme="retro"] .app-label{
  min-height:0;font-size:16px;line-height:1.2;text-align:left;-webkit-line-clamp:1
}
html[data-theme="retro"] .studio-app[aria-current="page"]{background:#ffffcc !important;color:#111827 !important}
html[data-theme="retro"] .studio-app[aria-current="page"] .app-label{color:#111827 !important}