@import url('./site-pink.css');
@import url('./site-chrome.css');
@import url('./reveal-viewport.css');
/* Only Traits visual themes.
   Classic deliberately has no visual overrides. Alternative themes live under
   one root data attribute so new themes can be added without branching pages. */

:root {
  /* Paired semantic tokens. A component must consume both surface and ink. */
  --ot-ui-surface: #101713;
  --ot-ui-inset: #0b1711;
  --ot-ui-ink: #f0f3f1;
  --ot-ui-muted: #b4c1b8;
  --ot-ui-line: #496357;
  --ot-ui-accent: #a8ebbf;
  --ot-ui-danger: #ffaaa5;
  --ot-ui-radius: 12px;
  --ot-ui-shadow: 0 24px 80px #0009;
  --site-font-display: var(--site-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  --site-font-body: var(--site-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  --site-font-ui: var(--site-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  --site-font-data: var(--site-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
}

/* Alternative component display rules must never unhide inactive actions. */
html[data-ot-theme] [hidden] { display: none !important; }

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) {
  --ot-ui-surface: #fffef8;
  --ot-ui-inset: #fff3bf;
  --ot-ui-ink: #101010;
  --ot-ui-muted: #4d4a43;
  --ot-ui-line: #101010;
  --ot-ui-accent: #f7eb39;
  --ot-ui-danger: #a30d25;
  --ot-ui-radius: 0px;
  --ot-ui-shadow: 6px 6px 0 #101010;
  --neo-ink: #101010;
  --neo-paper: #fff8e7;
  --neo-white: #fffef8;
  --neo-yellow: #f7eb39;
  --neo-pink: #ff65bd;
  --neo-blue: #7195ff;
  --neo-mint: #72e8b4;
  --neo-orange: #ff7657;
  --neo-red: #ef3946;
  --neo-shadow: 6px 6px 0 var(--neo-ink);
  --site-bg: var(--neo-paper);
  --site-panel: var(--neo-white);
  --site-panel-2: #fff3bf;
  --site-line: var(--neo-ink);
  --site-text: var(--neo-ink);
  --site-muted: #4d4a43;
  --site-green: #087d57;
  --site-gold: #9a6100;
  --site-rare: #245bd8;
  --site-epic: #bc176f;
  --site-radius: 0px;
  --site-mono: "Courier New", Courier, monospace;
  --site-font-display: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
  --site-font-body: Arial, Helvetica, sans-serif;
  --site-font-ui: "Arial Black", "Arial Bold", Gadget, sans-serif;
  --site-font-data: "Courier New", Courier, monospace;
  --bg: var(--site-bg);
  --panel: var(--site-panel);
  --panel-2: var(--site-panel-2);
  --line: var(--site-line);
  --text: var(--site-text);
  --muted: var(--site-muted);
  --green: var(--site-green);
  --gold: var(--site-gold);
  --rare: var(--site-rare);
  --epic: var(--site-epic);
  --legendary: var(--site-gold);
  --accent: var(--neo-pink);
  --commission-gold: #9a6100;
  --commission-green: #087d57;
  --commission-red: #b31828;
  --commission-panel: var(--neo-white);
  --commission-line: var(--neo-ink);
  color-scheme: light;
  background: var(--neo-paper);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body {
  color: var(--neo-ink) !important;
  background:
    linear-gradient(90deg, rgb(16 16 16 / .055) 1px, transparent 1px) 0 0 / 36px 36px,
    linear-gradient(rgb(16 16 16 / .055) 1px, transparent 1px) 0 0 / 36px 36px,
    var(--neo-paper) !important;
  font-family: var(--site-font-body) !important;
  font-weight: 650;
  text-shadow: none !important;
  -webkit-font-smoothing: antialiased;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body * {
  font-family: var(--site-font-body);
  text-shadow: none;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(h1, h2, h3, h4, h5, h6, .site-nav__brand, .pencil-title, .commission-hero h1) {
  font-family: var(--site-font-display) !important;
  font-weight: 400 !important;
  letter-spacing: -.025em;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(button, [role="button"], .site-nav__link, .site-nav__button, .site-nav__menu-item, .eyebrow, label, summary) {
  font-family: var(--site-font-ui) !important;
  letter-spacing: .02em;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(code, pre, kbd, samp, output, time, small, input, textarea, select, [class*="wallet"], [class*="status"], [class*="meta"]) {
  font-family: var(--site-font-data) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body > main {
  position: relative;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :focus-visible {
  outline: 3px solid var(--neo-blue) !important;
  outline-offset: 3px !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) a {
  color: #174dca;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(button, select, input, textarea):not(.swatch) {
  border: 2px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
  background-color: var(--neo-white) !important;
  box-shadow: 3px 3px 0 var(--neo-ink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(button, [role="button"], summary) {
  transition: transform 110ms ease, box-shadow 110ms ease, background-color 110ms ease;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) button:hover:not(:disabled):not(.swatch),
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) [role="button"]:hover,
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) summary:hover {
  border-color: var(--neo-ink) !important;
  background-color: var(--neo-yellow) !important;
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 var(--neo-ink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) button:disabled {
  color: #777169 !important;
  background: #ddd6c6 !important;
  box-shadow: none;
}

/* Disabled creation choices must still explain the next step. The inherited
   pale gold title was unreadable on the light themes before a Canvas V1/V2
   selection unlocks the cards. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .create-mode-option:disabled {
  opacity: 1 !important;
  border-color: var(--ot-ui-line) !important;
  background: var(--ot-ui-inset) !important;
  color: var(--ot-ui-muted) !important;
  box-shadow: none !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .create-mode-option:disabled strong {
  color: var(--ot-ui-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .create-mode-option:disabled span,
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .create-mode-option:disabled small {
  color: var(--ot-ui-muted) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(button.primary, .primary, .commission-button:not(.secondary):not(.danger), .reveal-wallet-button) {
  color: var(--neo-ink) !important;
  background: var(--neo-yellow) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.panel, .card, article, [class$="-panel"], [class$="-card"], [class$="-shell"], [class$="-notice"], [class$="-banner"]):not([class*="backdrop"]):not(.preview-animation-image) {
  border-color: var(--neo-ink) !important;
  border-radius: 0 !important;
  background-color: var(--neo-white) !important;
  box-shadow: 5px 5px 0 var(--neo-ink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.reveal-head, .page-head, .commission-hero) {
  position: relative;
  padding: clamp(20px, 4vw, 44px) !important;
  border: 3px solid var(--neo-ink) !important;
  background:
    linear-gradient(135deg, var(--neo-yellow) 0 18%, transparent 18% 100%),
    var(--neo-white) !important;
  box-shadow: var(--neo-shadow);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.reveal-head, .page-head, .commission-hero) h1 {
  color: var(--neo-ink) !important;
  font-size: clamp(45px, 7vw, 92px) !important;
  line-height: .86 !important;
  text-transform: uppercase;
  /* Display fonts and translated words can exceed the mobile content box. */
  overflow-wrap: anywhere;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.reveal-head, .page-head, .commission-hero) p {
  color: #282722 !important;
  font-size: clamp(12px, 1.2vw, 17px);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .eyebrow {
  width: max-content;
  max-width: 100%;
  padding: 5px 8px;
  border: 2px solid var(--neo-ink);
  color: var(--neo-ink) !important;
  background: var(--neo-pink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav {
  top: 8px;
  border: 3px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
  background: var(--neo-white) !important;
  box-shadow: 5px 5px 0 var(--neo-ink);
  backdrop-filter: none;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__brand {
  color: var(--neo-ink) !important;
  font-size: 17px;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.site-nav__link-icon, .site-nav__trigger-icon, .site-nav__menu-icon, .site-nav__language-icon, .organization-proof__compact-icon) {
  color: inherit;
  opacity: 1;
}

/* Pair foreground and background on status surfaces, including late-mounted
   notices. Their colors must not depend on class order or loading order. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .ot-canvas-maintenance-banner {
  border: 2px solid var(--neo-ink);
  border-radius: 0;
  color: var(--neo-ink);
  background: var(--neo-yellow) !important;
  box-shadow: 3px 3px 0 var(--neo-ink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .preview-state {
  border: 2px solid var(--neo-ink);
  border-radius: 0;
  color: var(--neo-ink);
  background: var(--neo-white);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__brand .dot {
  width: 14px;
  height: 14px;
  border: 2px solid var(--neo-ink);
  border-radius: 0;
  background: var(--neo-pink);
  box-shadow: 3px 3px 0 var(--neo-ink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.site-nav__link, .site-nav__button, .site-nav__language-trigger, .site-nav__profile-shortcut) {
  border: 2px solid transparent !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
  background: transparent !important;
  box-shadow: none;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.site-nav__link, .site-nav__button, .site-nav__language-trigger, .site-nav__profile-shortcut):hover,
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__link.is-active {
  border-color: var(--neo-ink) !important;
  background: var(--neo-yellow) !important;
  transform: none;
  box-shadow: 2px 2px 0 var(--neo-ink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.site-nav__menu-popover, .site-nav__language-menu) {
  border: 3px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
  background: var(--neo-white) !important;
  box-shadow: var(--neo-shadow) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__menu-item:hover,
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__language-option:hover,
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__language-option.is-active {
  background: var(--neo-mint) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__language-option b {
  color: var(--neo-ink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__identity {
  border: 2px solid var(--neo-ink);
  border-radius: 0;
  background: var(--neo-blue);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__wallet .reveal-wallet-button {
  border: 2px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
  background: var(--neo-yellow) !important;
  box-shadow: 2px 2px 0 var(--neo-ink);
}

.site-nav__theme-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 10px;
}

.site-nav__theme-swatch {
  display: grid;
  grid-template-columns: repeat(2, 6px);
  grid-template-rows: repeat(2, 6px);
  gap: 1px;
  flex: 0 0 auto;
}

.site-nav__theme-swatch i { display: block; border: 1px solid currentColor; }
.site-nav__theme-swatch i:nth-child(1) { background: #f7eb39; }
.site-nav__theme-swatch i:nth-child(2) { background: #ff65bd; }
.site-nav__theme-swatch i:nth-child(3) { background: #72e8b4; }
.site-nav__theme-swatch i:nth-child(4) { background: #7195ff; }
.site-nav__theme-label { white-space: nowrap; }

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__theme-trigger {
  border-color: var(--neo-ink) !important;
  background: var(--neo-pink) !important;
  box-shadow: 3px 3px 0 var(--neo-ink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.preview-shell, .trait-choice, .inventory-card, .artist-work, .nft-card) {
  border: 3px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  box-shadow: 4px 4px 0 var(--neo-ink) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.preview-shell, .trait-choice-art, .artist-work img, .inventory-card img) {
  background-color: #e7e9e6 !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.slot-tab.active, .trait-choice.active, [aria-selected="true"], [aria-pressed="true"]):not(.swatch) {
  border-color: var(--neo-ink) !important;
  background-color: var(--neo-mint) !important;
  box-shadow: 3px 3px 0 var(--neo-ink) !important;
}

/* Creation is UI, not an NFT thumbnail. Replace every painted legacy layer,
   including hover/loading/locked/error; never recolor an existing SVG preview. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice {
  --create-trait-shadow: 2px 2px 0 var(--ot-ui-line);
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border: 2px solid var(--ot-ui-line) !important;
  border-radius: min(12px, var(--ot-ui-radius)) !important;
  box-shadow: var(--create-trait-shadow) !important;
}
html[data-ot-theme="pink-pop"] body.reveal-page .create-trait-choice {
  --create-trait-shadow: 0 3px 0 #eeb4d3;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice.active {
  background: var(--ot-ui-inset) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice .create-trait-art:not(:has(svg)) {
  background: var(--ot-ui-inset) !important;
  color: var(--ot-ui-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice .create-trait-art :is(strong,span) {
  color: var(--ot-ui-ink) !important;
  font-family: var(--site-font-ui) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice > span > strong { color: var(--ot-ui-ink) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice > span > small { color: var(--ot-ui-muted) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice .create-trait-actions button {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
  box-shadow: var(--create-trait-shadow) !important;
  animation: none !important;
  white-space: normal;
  overflow-wrap: anywhere;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice .create-trait-actions button:first-child { background: var(--ot-ui-accent) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice .create-trait-actions button:is(:hover,:focus-visible,:disabled) { background: var(--ot-ui-inset) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice.is-pencil-locked .create-trait-actions button:first-child { background: var(--ot-ui-surface) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice .custom-check-spinner {
  border-color: var(--ot-ui-surface);
  border-top-color: var(--ot-ui-line);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .create-trait-choice.is-onchain-error { border-color: var(--ot-ui-danger) !important; }

/* Chain-read feedback is interface chrome too. Keep state/ARIA semantics in
   the renderer while pairing each surface, text and spinner with theme ink. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .custom-read-status {
  background: var(--ot-ui-inset) !important;
  color: var(--ot-ui-ink) !important;
  border: 2px solid var(--ot-ui-line) !important;
  border-radius: min(12px, var(--ot-ui-radius)) !important;
  box-shadow: none !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .custom-read-status-copy :is(strong,span) {
  color: var(--ot-ui-ink) !important;
  overflow-wrap: anywhere;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .custom-read-status-icon {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page :is(.custom-read-status-spinner,.token-loading-state i) {
  border-color: var(--ot-ui-inset);
  border-top-color: var(--ot-ui-line);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .custom-read-status[data-state="error"] {
  border-color: var(--ot-ui-danger) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .custom-read-status[data-state="error"] .custom-read-status-icon {
  color: var(--ot-ui-danger) !important;
  border-color: var(--ot-ui-danger) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .custom-read-status button {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
  white-space: normal;
  overflow-wrap: anywhere;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page :is(.token-loading-state,.awaiting-token-loading) {
  color: var(--ot-ui-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .token-loading-state {
  white-space: normal;
  overflow-wrap: anywhere;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.reveal-page .token-loading-state i { flex-shrink: 0; }

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.status.ok, .is-success, [data-tone="success"]) { color: #075c3f !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.status.warn, .is-warn, [data-tone="warn"]) { color: #784800 !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.status.error, .is-error, [data-tone="error"]) { color: #a30d25 !important; }

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(dialog, [role="dialog"]):not(.ot-theme-dialog) {
  border-color: var(--neo-ink) !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(dialog, [role="dialog"]):not(.ot-theme-dialog) :is(h1, h2, h3, h4, h5, h6) {
  color: var(--neo-ink) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.inventory-modal-backdrop, .modal-backdrop, [class*="-backdrop"]) {
  background-color: rgb(16 16 16 / .76) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .organization-proof {
  border: 3px solid var(--neo-ink);
  border-radius: 0;
  background: var(--neo-blue);
  box-shadow: 5px 5px 0 var(--neo-ink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .organization-proof :is(strong, span, a) { color: var(--neo-ink) !important; }

/* Links and the Report button are one component visually. Styling just the
   button tag leaves Report boxed while the adjacent footer actions float. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .organization-proof .organization-proof__compact-link {
  box-sizing: border-box;
  min-height: 34px;
  padding: 0 9px;
  border: 2px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
  background: var(--neo-white) !important;
  box-shadow: 3px 3px 0 var(--neo-ink);
  font-family: var(--site-font-ui) !important;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .02em;
  line-height: 1.25;
  text-decoration: none;
  transition: transform 110ms ease, box-shadow 110ms ease, background-color 110ms ease;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .organization-proof .organization-proof__compact-link span {
  font: inherit;
  letter-spacing: inherit;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .organization-proof .organization-proof__compact-link:is(:hover, :focus-visible) {
  background: var(--neo-yellow) !important;
  box-shadow: 1px 1px 0 var(--neo-ink);
  transform: translate(2px, 2px);
  text-decoration: none;
}

/* Component/state coverage, including DOM inserted after initial paint.
   Never recolor canvas pixels, NFT images or Three.js render targets. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.batch-reveal-progress,.create-canvas-choice,.profile-app-manual-code,.profile-app-device-management,.nft-detail-grid > span,.toast) {
  color: var(--ot-ui-ink);
  background: var(--ot-ui-inset);
  border: 2px solid var(--ot-ui-line);
  border-radius: var(--ot-ui-radius);
  box-shadow: 3px 3px 0 var(--ot-ui-line);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.create-canvas-choice > strong,.profile-app-device-head > strong,.profile-app-code,.nft-detail-grid b) { color: var(--ot-ui-ink); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.profile-app-manual-code > span,.profile-app-device-management > p,.profile-app-dialog-card > p,.nft-detail-grid small) { color: var(--ot-ui-muted); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .toast { background: var(--ot-ui-surface); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .toast.warn { border-left: 6px solid #9a6100; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .toast.error { border-left: 6px solid var(--ot-ui-danger); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .animation-safe-preset :is(p,small,span,em) { color: var(--ot-ui-muted); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .animation-safe-preset-mark { color: #075c3f; }

/* Injected wallet safety UI cannot inherit only half of a theme. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .ot-wallet-safety,
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .ot-wallet-safety :is(header,footer,.ot-wallet-safety-card,.ot-wallet-safety-check) {
  color: var(--ot-ui-ink); background: var(--ot-ui-surface); border-color: var(--ot-ui-line); border-radius: 0;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .ot-wallet-safety :is(h2,p,small,strong,span,b,ul,li,a) { color: var(--ot-ui-ink); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .ot-wallet-safety .ot-wallet-safety-card { box-shadow: none; background: var(--ot-ui-inset) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .ot-wallet-safety .ot-wallet-safety-danger { background: #ffe1dc !important; border: 2px solid var(--ot-ui-danger) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .ot-wallet-safety .ot-wallet-safety-danger :is(small,li) { color: #7a1022; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .ot-wallet-safety .ot-wallet-safety-check { background: var(--ot-ui-inset); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .ot-wallet-safety .ot-wallet-safety-tools a { border: 2px solid var(--ot-ui-line); border-radius: 0; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .ot-wallet-safety input[type="checkbox"] { accent-color: var(--neo-ink); box-shadow: none; }

/* A reusable confirmation surface for every theme. Content is always text,
   cancel is the initial focus, and no action is approved by opening it. */
.ot-action-dialog {
  width: min(560px,calc(100vw - 28px)); max-height: calc(100dvh - 28px); overflow: auto;
  padding: 24px; border: 2px solid var(--ot-ui-line); border-radius: var(--ot-ui-radius);
  color: var(--ot-ui-ink); background: var(--ot-ui-surface); box-shadow: var(--ot-ui-shadow);
  font-family: var(--site-font-body);
}
.ot-action-dialog::backdrop { background: #020403c9; backdrop-filter: blur(6px); }
.ot-action-dialog h2 { margin: 0 0 16px; color: var(--ot-ui-ink); font: 700 24px/1.15 var(--site-font-display); }
.ot-action-dialog p { white-space: pre-wrap; overflow-wrap: anywhere; color: var(--ot-ui-ink); font: 14px/1.6 var(--site-font-body); }
.ot-action-dialog footer { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.ot-action-dialog button { padding: 12px 18px; min-height: 44px; border: 2px solid var(--ot-ui-line); border-radius: var(--ot-ui-radius); background: var(--ot-ui-inset); color: var(--ot-ui-ink); font: 700 12px/1.3 var(--site-font-ui); cursor: pointer; }
.ot-action-dialog button[data-confirm] { background: var(--ot-ui-accent); color: #101010; }
.ot-action-dialog[data-danger="true"] button[data-confirm] { border: 2px solid var(--ot-ui-danger) !important; }
.ot-action-dialog [role="alert"] { color: var(--ot-ui-danger); }
.ot-action-dialog input { width: 100%; box-sizing: border-box; min-height: 44px; padding: 10px; color: var(--ot-ui-ink); background: var(--ot-ui-inset); border: 1px solid var(--ot-ui-line); }
.ot-action-dialog :focus-visible { outline: 3px solid var(--ot-ui-accent); outline-offset: 3px; }

/* Auxiliary pages inherit Home's choice, without gaining a second selector. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.hero-copy,.hero-card,.hero-card :is(span,strong,small),.muted,.tool-link) { color: var(--ot-ui-ink); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.tool-link,.social-required-link) { background: var(--ot-ui-inset); border-color: var(--ot-ui-line); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.ot-access-page > main { background: var(--ot-ui-surface); color: var(--ot-ui-ink); border: 3px solid var(--ot-ui-line); border-radius: 0; box-shadow: var(--ot-ui-shadow); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.ot-access-page :is(p,small,.contract,span) { color: var(--ot-ui-muted); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.ot-access-page #status { color: var(--ot-ui-danger); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.ot-access-page a { color: var(--ot-ui-ink); background: var(--ot-ui-accent); border: 2px solid var(--ot-ui-line); border-radius: 0; }

/* Canvas keeps its geometry and interactions, while inheriting the chosen
   palette and the alternative typography. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.canvas-v2-card-header,.tool-category,.onchain-capacity,.rarity-lane-head,.dropzone-title,.disclaimer) {
  background: var(--ot-ui-inset) !important; color:var(--ot-ui-ink); border-color:var(--ot-ui-line);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.canvas-v2-card-title,.tool-category h4,.onchain-capacity b,.rarity-lane-head strong,.rarity-lane-head span,.trait-label-text,.dropzone-title strong,.admin-locked p,.checker-shell .lead,.checker-shell .disclaimer strong,.hotkey-guide-group h3) { color:var(--ot-ui-ink) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .onchain-capacity b { background:var(--ot-ui-inset) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.canvas-v2-active :is(button#paint-tool,button#finish-trait,.brush-row button,.canvas-v2-save-panel-actions button) { color:var(--ot-ui-ink) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.animation-safe-preset,.advanced-animation-copy,.image-import-preset) :is(small,p) { color:var(--ot-ui-ink) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .image-import-preset .animation-safe-preset-mark { color:#fff !important; background:#075c3f !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.admin-card,.rarity-lane-options label,.trait-label-text,.hotkey-guide-group,.image-import-advanced > summary,.editor-advanced-tools > summary) {
  background:var(--ot-ui-surface) !important; color:var(--ot-ui-ink) !important; border-color:var(--ot-ui-line) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.disclaimer p,.admin-card h2,.commission-choice-empty,.canvas-v2-eye,.image-import-advanced summary small,.image-import-advanced summary strong) { color:var(--ot-ui-ink) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .checker-shell .nav-actions a { color:var(--ot-ui-ink); background:var(--ot-ui-inset); border-color:var(--ot-ui-line); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .checker-shell .form-status { color:var(--ot-ui-ink); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .checker-shell .form-status.error { color:var(--ot-ui-danger); }
.rarity-empty { color:#c1cbc5 !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .rarity-empty { color:var(--ot-ui-muted) !important; }
/* OBS retains transparency outside its text plates. */
.obs-countdown > :is(.eyebrow,.deadline),.obs-countdown .timer > i { background:#07100a; padding:6px; border-radius:6px; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .obs-countdown :is(.eyebrow,.deadline,.timer > i,.timer div) { background:var(--ot-ui-surface); color:var(--ot-ui-ink); border-color:var(--ot-ui-line); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .obs-countdown .timer :is(output,span) { color:var(--ot-ui-ink); }

/* Canvas keeps its geometry and interactions, while inheriting the chosen
   palette and the alternative typography. */
html.embedded-editor-boot:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) {
  --bg: var(--neo-paper);
  --panel: var(--neo-white);
  --panel-2: #fff3bf;
  --line: var(--neo-ink);
  --text: var(--neo-ink);
  --muted: #4d4a43;
  --paper: #e7e9e6;
  --ink: #505456;
  --soft: #232323;
  --ok: #087d57;
  --danger: #b31828;
  --gold: #9a6100;
  --dark: #ded7c7;
}

html.embedded-editor-boot:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body {
  background: var(--bg) !important;
}

/* Resolve aliases at the component scope: root aliases otherwise keep the
   original dark --panel value even after the editor changes body tokens. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.canvas-v2-active {
  --canvas-v2-panel:var(--ot-ui-surface);
  --canvas-v2-panel-raised:var(--ot-ui-inset);
  --canvas-v2-surface:var(--ot-ui-inset);
  --canvas-v2-border:var(--ot-ui-line);
  --canvas-v2-border-soft:var(--ot-ui-line);
  --canvas-v2-text:var(--ot-ui-ink);
  --canvas-v2-muted:var(--ot-ui-muted);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.canvas-v2-active .canvas-v2-topbar { background:var(--ot-ui-surface) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.canvas-v2-active .tool-category h4 { font:800 10px/1.3 var(--site-font-ui) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.canvas-v2-card,.canvas-tour-invite,.canvas-tour-card) {
  background:var(--ot-ui-surface) !important; color:var(--ot-ui-ink) !important;
  border-color:var(--ot-ui-line) !important; border-radius:var(--ot-ui-radius) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.canvas-tour-invite,.canvas-tour-card) :is(h2,p,span,strong) { color:var(--ot-ui-ink) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .canvas-tour-task { background:var(--ot-ui-inset); border-color:var(--ot-ui-line); }

html.embedded-editor-boot:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(button, select, input, textarea):not(.swatch) {
  border-width: 1px !important;
  border-radius: 4px !important;
  background-color: var(--panel-2) !important;
  box-shadow: none !important;
  transform: none !important;
}

html.embedded-editor-boot:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.canvas-v2-shell, .canvas-v2-panel, .canvas-v2-toolbar, .modal, dialog, [class*="-panel"]):not([class*="backdrop"]) {
  border-color: var(--neo-ink) !important;
  border-radius: 0 !important;
  background-color: var(--neo-white) !important;
  box-shadow: none !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .ot-canvas-maintenance-gate {
  color: var(--neo-ink) !important;
  background:
    linear-gradient(90deg, rgb(16 16 16 / .055) 1px, transparent 1px) 0 0 / 36px 36px,
    linear-gradient(rgb(16 16 16 / .055) 1px, transparent 1px) 0 0 / 36px 36px,
    var(--neo-paper) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .ot-canvas-maintenance-gate section {
  border: 3px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
  background: var(--neo-white) !important;
  box-shadow: 7px 7px 0 var(--neo-ink) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .ot-canvas-maintenance-gate :is(h1, p) {
  color: var(--neo-ink) !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .ot-canvas-maintenance-gate small {
  color: #9f1830 !important;
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .ot-canvas-maintenance-gate :is(a, button) {
  border: 2px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
  background: var(--neo-yellow) !important;
  box-shadow: 3px 3px 0 var(--neo-ink) !important;
}

/* Complete semantic components, including anchors that act as CTAs. Do not
   restyle ordinary inline links, artwork pixels or Canvas color swatches. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.ot-maintenance-actions, .pencil-success-actions, .about-actions, .about-link-grid, .site-community-switcher, .commission-modal-footer, .profile-actions) > a,
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body a:is(.primary, .commission-button, .mint-link, .pencil-opensea-link) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 8px 14px;
  border: 2px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
  background: var(--neo-white) !important;
  box-shadow: 3px 3px 0 var(--neo-ink);
  font-family: var(--site-font-ui) !important;
  text-decoration: none;
  transition: transform 110ms ease, box-shadow 110ms ease, background-color 110ms ease;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.ot-maintenance-actions, .pencil-success-actions, .about-actions, .about-link-grid, .site-community-switcher, .commission-modal-footer, .profile-actions) > a:is(:hover, :focus-visible),
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body a:is(.primary, .commission-button, .mint-link, .pencil-opensea-link):is(:hover, :focus-visible) {
  background: var(--neo-yellow) !important;
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 var(--neo-ink);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(a.primary, [data-pencil-get]) {
  background: var(--neo-yellow) !important;
  color: var(--neo-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-community-switcher a.is-active {
  background: var(--neo-mint) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-community-switcher a span { color: inherit; font: inherit; }

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.ot-pencil-access-modal section, .about-business-identity__record, .about-steps li, .faq-list details, .commission-request-modal, .commission-modal-head, .commission-modal-footer, .commission-history-row, .commission-request-summary, .commission-completion-receipt > dl > div, .commission-progress li) {
  border: 2px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  background: var(--neo-white) !important;
  color: var(--neo-ink) !important;
  box-shadow: 3px 3px 0 var(--neo-ink);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.ot-pencil-access-modal section, .commission-request-modal, .commission-completion-receipt) :is(h2, h3, p, small, strong, span, label) {
  color: var(--neo-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.about-live-card strong, .about-live-card strong span, .about-rules strong, .about-live__foot span, .about-contracts__network, .about-contract-card__verified, .artist-identity-copy h2, .artist-verified, .artist-wallet, .artist-stats span, .artist-work-meta strong, .commission-page-status, .contest-power-main strong, .contest-power-countdown b, .ot-report-kicker) {
  color: var(--neo-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.about-final-source, .reveal-safety-warning, .commission-notice, .commission-fee-note, .commission-inline-note, .ot-site-update-alert) {
  color: var(--neo-ink) !important;
  background: var(--ot-ui-inset) !important;
  border-color: var(--neo-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.reveal-safety-warning, .commission-notice, .ot-site-update-alert) :is(strong, p, span) { color: inherit !important; }

/* Authenticated commission dashboards are not covered by entry-page shells.
   Use class tokens, not [class$="-card"]: template whitespace and modifiers
   must never opt an account balance out of the selected theme. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .commission-page {
  color: var(--ot-ui-ink);
  --commission-gold: var(--ot-ui-ink);
  --commission-green: var(--ot-ui-ink);
  --commission-red: var(--ot-ui-danger);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-claim-card,.commission-notification-panel,.commission-role-dashboard,.commission-pilot-locked,.commission-holder-locked) {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border: 2px solid var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
  box-shadow: var(--ot-ui-shadow) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-claim-card,.commission-notification-panel,.commission-role-dashboard,.commission-pilot-locked,.commission-holder-locked) :is(h2,strong,span,p) {
  color: var(--ot-ui-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-empty,.commission-role-dashboard .artist-card-head p,.commission-notification-panel [role="status"],.commission-payment-clarity) {
  color: var(--ot-ui-muted) !important;
  border-color: var(--ot-ui-line);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-role-tabs button {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-role-tabs button.is-active {
  background: var(--ot-ui-accent) !important;
  box-shadow: inset 4px 0 0 var(--ot-ui-line);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-role-tabs :is(span,b,small) { color: var(--ot-ui-ink) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-claim-card button:disabled {
  background: var(--ot-ui-inset) !important;
  color: var(--ot-ui-muted) !important;
  opacity: 1;
  box-shadow: none !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-update-toast {
  background: var(--ot-ui-surface) !important; color: var(--ot-ui-ink) !important;
  border: 2px solid var(--ot-ui-line); border-radius: var(--ot-ui-radius);
  box-shadow: var(--ot-ui-shadow);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-update-toast :is(p,a,strong) { color: var(--ot-ui-ink) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-pending-indicator,.commission-live-status,.commission-order-details > summary) { color: var(--ot-ui-muted); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-unread-dot { background: var(--ot-ui-danger); box-shadow: 0 0 0 2px var(--ot-ui-surface); }

/* Populated orders: pair nested backgrounds with their text. A light outer
   dashboard cannot recolor legacy green notices, history or app gradients. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-history-panel,.artist-app-connect-card,.artist-app-manager,.artist-app-manager-grid>section,.artist-app-device,.artist-app-inbox-card) {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-complete-summary,.commission-status,.commission-history-panel>summary,.artist-app-pair-card) {
  background: var(--ot-ui-inset) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-complete-summary,.commission-history-panel,.artist-app-connect-card,.artist-app-manager) :is(h2,h3,strong,span,small,p,b) {
  color: var(--ot-ui-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-order dt,.commission-history-row-title small,.commission-history-row-status,.commission-history-pagination>span,.artist-app-connect-card p,.artist-app-manager p,.artist-app-device span,.artist-app-inbox-copy>span) {
  color: var(--ot-ui-muted) !important;
  opacity: 1;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-history-panel>summary :is(b,span)::before {
  color: var(--ot-ui-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-history-panel>summary b {
  border-color: var(--ot-ui-line) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-history-row:is(:hover,:focus-visible) {
  background: var(--ot-ui-inset) !important;
  color: var(--ot-ui-ink) !important;
}
/* Active commission steps are rendered outside the role dashboard on direct
   request links and in admin. Do not rely on a light parent to fix their ink. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-order,.commission-request-summary) {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-order,.commission-request-summary) :is(p,strong,span) {
  color: var(--ot-ui-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-more-actions>summary {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border: 2px solid var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-actions .commission-button {
  background: var(--ot-ui-accent) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-actions .commission-button.secondary {
  background: var(--ot-ui-surface) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-actions .commission-button.danger {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-danger) !important;
  border-color: var(--ot-ui-danger) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-actions .commission-button:disabled {
  background: var(--ot-ui-inset) !important;
  color: var(--ot-ui-muted) !important;
  box-shadow: none !important;
}
/* The populated NFT picker and file uploader need the same surface/ink pair
   as the form. Never recolor reference images, video or NFT artwork. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-nft-choice i {
  color: var(--ot-ui-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-reference-upload,.commission-reference-upload-head label.commission-button) {
  background: var(--ot-ui-surface) !important;
  background-image: none !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-reference-upload-head :is(strong,small) {
  color: var(--ot-ui-ink) !important;
}

/* Direct order links render a different shell than the dashboard. Pair every
   painted delivery surface with its ink; keep NFT/reference pixels untouched. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-public-order,.commission-progress,.commission-completed-panel,.commission-completion-receipt,.commission-revision) {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
  box-shadow: var(--ot-ui-shadow) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-public-offer,.commission-public-identity,.commission-public-facts,.commission-public-brief,.commission-public-meta>div,.commission-order-details>summary,.commission-progress li,.commission-progress li i,.commission-completion-receipt>header>strong,.commission-completion-receipt>dl>div,.commission-completion-receipt>footer,.commission-inline-note,.commission-private-access) {
  background: var(--ot-ui-inset) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-public-order,.commission-progress,.commission-completion-receipt,.commission-revision) :is(h2,h3,p,small,strong,span,dt,dd) {
  color: var(--ot-ui-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body :is(.commission-public-mini-actions button,.commission-public-mini-actions a,.commission-public-avatar:not(img)) {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border-color: var(--ot-ui-line) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body .commission-public-facts>div+div {
  border-color: var(--ot-ui-line) !important;
}
body .commission-public-facts strong {
  white-space: normal;
  overflow-wrap: anywhere;
  font-size: .875rem;
  line-height: 1.4;
}
body .commission-progress :is(.commission-pending-indicator,.commission-live-status) {
  display: inline-flex;
  margin: .625rem .75rem 0 0;
  font-size: .8125rem;
  line-height: 1.5;
}
/* Keep status and support copy readable at normal zoom, including Classic. */
body .commission-complete-summary { font-size: .875rem; line-height: 1.6; }
body .commission-history-compact>summary { font-size: .9375rem; }
body .commission-history-row-title small,
body .commission-history-row-status,
body .commission-history-pagination>span { font-size: .8125rem; line-height: 1.5; }
body .artist-app-connect-card h2 { font-size: clamp(1.125rem,2vw,1.5rem); line-height: 1.3; }
body .artist-app-connect-card p { font-size: .9375rem; line-height: 1.6; }

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) {
  --business-panel: var(--neo-white);
  --business-panel-2: var(--neo-paper);
  --business-green: #075c3f;
  --business-gold: var(--neo-yellow);
  --business-ink: var(--neo-ink);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.ot-tour-card,.ot-tour-onboarding,.identity-record,.artist-work-meta,.mint-box,.mint-artwork-card,.mint-info-card,.mint-step,.mint-check,.reveal-safety-panel,.site-nav__playground-confirm,.site-nav__playground-choice-body,.site-nav__playground-requirements li) {
  background: var(--neo-white) !important;
  border-color: var(--neo-ink) !important;
  color: var(--neo-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.ot-tour-card,.site-nav__art-notice-card,.site-nav__playground-confirm-card,.about-business-identity__record,.business-page,.mint-step,.mint-info-card,.mint-artwork-card,.mint-check) :is(h1,h2,h3,p,small,span,strong,b,dt,dd) {
  color: var(--neo-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.mint-kicker,.mint-lead,.pencil-artwork-credit,.event-title,.event-copy,.toolbar h2,.panel h2) { color: var(--neo-ink) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.business-contact a,.identity-record a) { color: #174dca; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.about-links,.about-business-identity__links,.business-actions) a {
  border: 2px solid var(--neo-ink) !important;
  border-radius: 0 !important;
  color: var(--neo-ink) !important;
  background: var(--neo-white) !important;
  box-shadow: 3px 3px 0 var(--neo-ink);
  font-family: var(--site-font-ui) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.about-links,.about-business-identity__links,.business-actions) a:is(:hover,:focus-visible) { background: var(--neo-yellow) !important; }
/* About's hero has multiple classes and an inline background-image. Replace
   the whole painted surface, not only background-color or the heading ink. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.about-page .about-panel.about-hero__main {
  background: var(--ot-ui-surface) !important;
  color: var(--ot-ui-ink) !important;
  border: 2px solid var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
  box-shadow: var(--ot-ui-shadow) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.about-page .about-hero__main :is(h1,p) {
  color: var(--ot-ui-ink) !important;
}
/* The initial registry placeholder and failure message share this class.
   They can outlive the card renderer; pair their own surface and text. */
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .about-contracts__error {
  background: var(--ot-ui-inset);
  color: var(--ot-ui-ink);
  border-color: var(--ot-ui-line);
  border-radius: var(--ot-ui-radius);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.about-page .about-hero__main::after {
  border-color: var(--ot-ui-accent);
  opacity: .35;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.about-page .about-proof li {
  background: var(--ot-ui-inset) !important;
  color: var(--ot-ui-ink) !important;
  border: 2px solid var(--ot-ui-line) !important;
  border-radius: var(--ot-ui-radius) !important;
  font-family: var(--site-font-ui) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body.about-page :is(.about-links,.about-business-identity__links) a {
  border-radius: min(12px, var(--ot-ui-radius)) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .business-hero {
  border: 3px solid var(--neo-ink);
  border-radius: 0;
  background: linear-gradient(135deg, var(--neo-yellow) 0 18%, transparent 18%), var(--neo-white) !important;
  box-shadow: 5px 5px 0 var(--neo-ink);
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .business-hero::after { border-color: var(--neo-ink); opacity: .1; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.artist-work-meta small,.mint-choice-copy span,.mint-note b,.mint-note span) { color: var(--ot-ui-muted) !important; }

/* Small readable labels in the unchanged Classic palette. */
html[data-ot-theme="classic"] .artist-meta-separator { color: var(--site-muted); }
html[data-ot-theme="classic"] .mint-submit { color: #fff7f7; background: #bc2634; }
html[data-ot-theme="classic"] .mint-submit:hover:not(:disabled) { background: #b0202e; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.mint-fact,.pencil-live-status,.pencil-success-modal,.pencil-success-benefits li) {
  border: 2px solid var(--neo-ink);
  border-radius: 0;
  background: var(--neo-white) !important;
  color: var(--neo-ink) !important;
}
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.mint-fact,.pencil-success-copy) :is(small,strong,h2,p,li) { color: var(--neo-ink) !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .mint-kicker::before { background: var(--neo-pink); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .pencil-hero { background: var(--neo-white) !important; border: 3px solid var(--neo-ink); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .pencil-live-status.warn { background: var(--ot-ui-inset) !important; color: #784800 !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .pencil-live-status.error { background: #ffe1e6 !important; color: #a30d25 !important; }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .pencil-live-status.ok { background: var(--neo-mint) !important; color: #075c3f !important; }

/* Theme chooser */
.ot-theme-dialog {
  width: min(1120px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--site-green, #8ebc9a);
  border-radius: 14px;
  color: var(--site-text, #f0f3f1);
  background: var(--site-bg, #090b0c);
  box-shadow: 0 28px 100px rgb(0 0 0 / .84);
}

.ot-theme-dialog::backdrop {
  background: rgb(1 4 3 / .88);
  backdrop-filter: blur(9px) saturate(.65);
}

.ot-theme-dialog-card {
  position: relative;
  display: grid;
  gap: 20px;
  max-height: calc(100dvh - 32px);
  padding: 26px;
  overflow-y: auto;
  background:
    radial-gradient(circle at 82% 0%, color-mix(in srgb, var(--site-green, #8ebc9a) 10%, transparent), transparent 38%),
    var(--site-bg, #090b0c);
}

.ot-theme-dialog-heading {
  display: grid;
  gap: 8px;
  padding-right: 54px;
}

.ot-theme-dialog-heading small {
  color: var(--site-gold, #dfc878);
  font: 900 10px/1.2 var(--site-font-data);
  letter-spacing: .12em;
}

.ot-theme-dialog-heading h2 {
  margin: 0;
  color: var(--site-text, #f0f3f1);
  font: 400 clamp(30px, 5vw, 54px)/.92 var(--site-font-display);
}

.ot-theme-dialog-heading p {
  max-width: 790px;
  margin: 0;
  color: var(--site-muted, #8f999c);
  font: 650 13px/1.55 var(--site-font-body);
}

.ot-theme-dialog-close {
  position: absolute;
  z-index: 2;
  top: 20px;
  right: 20px;
  width: 42px;
  height: 42px;
  padding: 0;
  font-size: 24px !important;
}

.ot-theme-choices {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(250px,100%), 1fr));
  gap: 18px;
}

.ot-theme-choice {
  display: grid;
  grid-template-rows: auto 1fr;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--site-line, #2b3336);
  border-radius: 12px;
  background: var(--site-panel, #131719);
  box-shadow: none;
}

.ot-theme-choice.is-active { border-color: var(--site-green, #8ebc9a); }

.ot-theme-preview {
  position: relative;
  width: 100%;
  min-width: 0;
  aspect-ratio: 16 / 8;
  min-height: 200px;
  overflow: hidden;
  border-bottom: 1px solid var(--site-line, #2b3336);
}

.ot-theme-preview--classic {
  padding: 18px;
  color: #f0f3f1;
  background:
    linear-gradient(90deg, rgb(142 188 154 / .08) 1px, transparent 1px) 0 0 / 24px 24px,
    linear-gradient(rgb(142 188 154 / .08) 1px, transparent 1px) 0 0 / 24px 24px,
    #090b0c;
  font-family: ui-monospace, monospace;
}

.ot-theme-preview-bar { display: flex; align-items: center; gap: 8px; padding: 8px; border: 1px solid #2b3336; background: #131719; font: 800 9px ui-monospace, monospace; }
.ot-theme-preview-bar i { width: 8px; height: 8px; background: #8ebc9a; box-shadow: 0 0 10px #8ebc9a; }
.ot-theme-preview-bar b { margin-left: auto; color: #dfc878; }
.ot-theme-preview-classic-grid { display: grid; grid-template-columns: 1.3fr .7fr .7fr; gap: 8px; margin-top: 22px; }
.ot-theme-preview-classic-grid span { height: 56px; border: 1px solid #2b3336; background: #0e1112; }
.ot-theme-preview-classic-grid span:first-child { border-color: #8ebc9a; }
.ot-theme-preview-classic-lines { display: grid; gap: 5px; width: 72%; margin-top: 18px; }
.ot-theme-preview-classic-lines i { height: 4px; background: #2b3336; }
.ot-theme-preview-classic-lines i:first-child { width: 55%; background: #dfc878; }

.ot-theme-preview--neo-brutal {
  padding: 15px;
  color: #101010;
  background:
    linear-gradient(90deg, rgb(16 16 16 / .08) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(rgb(16 16 16 / .08) 1px, transparent 1px) 0 0 / 22px 22px,
    #fff8e7;
  font-family: Arial, sans-serif;
}

.ot-theme-preview-neo-top { display: flex; align-items: stretch; width: max-content; border: 3px solid #101010; box-shadow: 4px 4px 0 #101010; font: 900 17px Arial Black, sans-serif; }
.ot-theme-preview-neo-top b { padding: 7px 9px; background: #f7eb39; }
.ot-theme-preview-neo-top span { padding: 7px 9px; border-left: 3px solid #101010; background: #ff65bd; }
.ot-theme-preview-neo-grid { position: relative; display: grid; grid-template-columns: 1fr 28px 28px 28px; align-items: end; gap: 5px; margin-top: 12px; }
/* Miniatures retain their own identity even when another theme is selected. */
html[data-ot-theme] .ot-theme-preview-neo-grid strong { font: 900 32px/.86 Impact, "Arial Narrow", sans-serif !important; letter-spacing: -.06em; white-space: nowrap; color: #101010; }
.ot-theme-preview-neo-grid i { height: 54px; border: 3px solid #101010; box-shadow: 3px 3px 0 #101010; }
.ot-theme-preview-neo-grid i:nth-of-type(1) { background: #7195ff; }
.ot-theme-preview-neo-grid i:nth-of-type(2) { height: 70px; background: #72e8b4; }
.ot-theme-preview-neo-grid i:nth-of-type(3) { height: 44px; background: #ff7657; }
.ot-theme-preview-neo-foot { display: flex; align-items: center; margin-top: 13px; border-top: 3px solid #101010; font: 900 9px Courier New, monospace; }
.ot-theme-preview-neo-foot b { margin-left: auto; padding: 5px 8px; color: #fff; background: #101010; }

.ot-theme-choice-copy {
  display: grid;
  grid-template-rows: auto auto 1fr auto auto;
  gap: 9px;
  padding: 18px;
}

.ot-theme-choice-copy small { color: var(--site-gold, #dfc878); font: 900 9px var(--site-font-data); letter-spacing: .1em; }
.ot-theme-choice-copy h3 { margin: 0; color: var(--site-text, #f0f3f1); font: 400 27px/.95 var(--site-font-display); }
.ot-theme-choice-copy p { margin: 0; color: var(--site-muted, #8f999c); font: 650 12px/1.5 var(--site-font-body); }
.ot-theme-choice-copy > span { color: var(--site-green, #8ebc9a); font: 900 9px var(--site-font-data); letter-spacing: .06em; }
.ot-theme-choice-action { width: 100%; min-height: 46px; margin-top: 4px; }
.ot-theme-choice.is-active .ot-theme-choice-action { border-color: var(--site-green, #8ebc9a) !important; }

.ot-theme-dialog-card > footer {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 2px;
  color: var(--site-muted, #8f999c);
  font: 700 10px/1.45 var(--site-font-data);
}

.ot-theme-dialog-card > footer i { width: 9px; height: 9px; flex: 0 0 9px; background: var(--site-green, #8ebc9a); }

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .ot-theme-dialog {
  border: 4px solid var(--neo-ink);
  border-radius: 0;
  background: var(--neo-paper);
  box-shadow: 12px 12px 0 var(--neo-ink);
}

html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .ot-theme-dialog-card { background: var(--neo-paper); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .ot-theme-choice { border: 3px solid var(--neo-ink) !important; border-radius: 0; box-shadow: 6px 6px 0 var(--neo-ink); }
html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .ot-theme-choice.is-active { background: var(--ot-ui-inset) !important; transform: rotate(-.35deg); }

.ot-theme-transition {
  position: fixed;
  z-index: 10000;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #f0f3f1;
  background: #090b0c;
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
}

.ot-theme-transition[hidden] { display: none; }
.ot-theme-transition.is-visible { opacity: 1; pointer-events: auto; }
.ot-theme-transition[data-next-theme="neo-brutal"] { color: #101010; background: #fff8e7; }
.ot-theme-transition-grid { position: absolute; inset: 0; opacity: .24; background: linear-gradient(90deg, currentColor 1px, transparent 1px) 0 0 / 32px 32px, linear-gradient(currentColor 1px, transparent 1px) 0 0 / 32px 32px; }
.ot-theme-transition section { position: relative; display: grid; justify-items: center; gap: 12px; width: min(560px, calc(100vw - 40px)); padding: 28px; text-align: center; }
.ot-theme-transition section > span { display: grid; place-items: center; width: 58px; height: 58px; border: 3px solid currentColor; background: #8ebc9a; box-shadow: 6px 6px 0 currentColor; font: 900 22px var(--site-font-ui); }
.ot-theme-transition[data-next-theme="neo-brutal"] section > span { background: #ff65bd; font-family: Arial Black, sans-serif; }
.ot-theme-transition strong { font: 400 clamp(30px, 6vw, 62px)/.9 var(--site-font-display); letter-spacing: -.03em; }
.ot-theme-transition small { max-width: 490px; color: inherit; opacity: .68; font: 700 11px/1.5 var(--site-font-data); }
.ot-theme-transition section > div { display: flex; gap: 7px; margin-top: 8px; }
.ot-theme-transition section > div i { width: 34px; height: 8px; border: 1px solid currentColor; background: #8ebc9a; animation: ot-theme-loader 720ms steps(2, end) infinite; }
.ot-theme-transition section > div i:nth-child(2) { animation-delay: 90ms; background: #dfc878; }
.ot-theme-transition section > div i:nth-child(3) { animation-delay: 180ms; background: #7195ff; }
.ot-theme-transition section > div i:nth-child(4) { animation-delay: 270ms; background: #ff65bd; }
.ot-theme-transition section > div i:nth-child(5) { animation-delay: 360ms; background: #72e8b4; }
.ot-theme-transition.is-applied section > div i { animation: none; transform: scaleY(1.55); }
@keyframes ot-theme-loader { 50% { transform: translateY(-7px); } }

.ot-theme-toast {
  position: fixed;
  z-index: 10001;
  right: 18px;
  bottom: 18px;
  max-width: min(430px, calc(100vw - 36px));
  padding: 13px 16px;
  border: 2px solid var(--site-line, #2b3336);
  color: var(--site-text, #f0f3f1);
  background: var(--site-panel, #131719);
  box-shadow: 4px 4px 0 color-mix(in srgb, var(--site-line, #2b3336) 80%, transparent);
  font: 800 11px/1.4 var(--site-font-data);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 160ms ease, transform 160ms ease;
}
.ot-theme-toast.is-visible { opacity: 1; transform: translateY(0); }
.ot-theme-toast[data-tone="warn"] { border-color: #c38324; }

@media (max-width: 720px) {
  html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) body > main { width: min(100% - 20px, 680px) !important; }
  html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.reveal-head, .page-head, .commission-hero) { margin-top: 12px; padding: 24px 18px !important; box-shadow: 5px 5px 0 var(--neo-ink); }
  html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(.reveal-head, .page-head, .commission-hero) h1 { font-size: clamp(42px, 15vw, 68px) !important; }
  .ot-theme-dialog { width: calc(100vw - 18px); max-height: calc(100dvh - 18px); }
  .ot-theme-dialog-card { max-height: calc(100dvh - 18px); padding: 18px; }
  .ot-theme-dialog-heading { padding-right: 42px; }
  .ot-theme-choices { grid-template-columns: 1fr; }
  .ot-theme-preview { aspect-ratio: 16 / 7.5; }
}

@media (max-width: 640px) {
  /* The extra theme control needs real space; do not squeeze the wallet
     over the brand or truncate the bottom navigation destinations. */
  .site-nav { flex-wrap: wrap; gap: 8px; }
  .site-nav__actions { flex: 1 0 100%; width: 100%; justify-content: space-between; }
  .site-nav__links > .site-nav__link {
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    height: 44px;
    min-height: 44px;
    font-size: 8px;
    padding: 3px;
  }
  .site-nav__links .site-nav__playground-label { min-width: 0; }
  .site-nav__theme-trigger { width: 32px; min-height: 30px; padding: 0; }
  .site-nav__theme-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .site-nav__theme-swatch { grid-template-columns: repeat(2, 5px); grid-template-rows: repeat(2, 5px); }
  html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav { top: 4px; box-shadow: 3px 3px 0 var(--neo-ink); }
  html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) .site-nav__links { border-top: 3px solid var(--neo-ink); color: var(--neo-ink); background: var(--neo-white); box-shadow: 0 -4px 0 var(--neo-ink); }
}

@media (prefers-reduced-motion: reduce) {
  .ot-theme-transition,
  .ot-theme-toast,
  html:is([data-ot-theme="neo-brutal"],[data-ot-theme="pink-pop"],[data-ot-theme="chrome-dream"]) :is(button, [role="button"], summary) { transition-duration: 1ms !important; }
  .ot-theme-transition section > div i { animation: none; }
}

@media print {
  .site-nav__theme-trigger,
  .ot-theme-dialog,
  .ot-theme-transition,
  .ot-theme-toast { display: none !important; }
}