/* site-theme.css — baked from devtools export 2026-05-17
   Served to all visitors. devtools-overlay.js (admin only) runs on top and
   overrides everything here via last-in-document !important wins.        */

/* ── Self-hosted Press Start 2P (eliminates render-blocking Google Fonts request) */
@font-face {
  font-family: 'Press Start 2P';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/resources/fonts/press-start-2p-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Press Start 2P';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/resources/fonts/press-start-2p-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── Accent CSS custom properties ────────────────────────────────────────── */
:root {
  --dw-accent:       hsl(94, 0%, 80%);
  --dw-accent-lo:    hsl(94, 0%, 70%);
  --dw-accent-sub:   hsl(94, 0%, 38%);
  --dw-accent-dim:   hsl(94, 0%, 24%);
  --dw-accent-dark:  hsl(94, 0%, 16%);
  --dw-accent-xdark: hsl(94, 0%, 9%);
}

/* ── Scrollbar (dithered / chunky) ──────────────────────────────────────────
   thumb/track/button get a 1px checkerboard (2px conic tile) instead of a flat
   fill, so the bars read as stippled rather than smooth. Chromium/Edge only. */
::-webkit-scrollbar              { width: 9px; height: 9px; }
::-webkit-scrollbar-track        { background-color: #080808; background-image: conic-gradient(#101010 25%, #050505 0 50%, #101010 0 75%, #050505 0); background-size: 2px 2px; border-radius: 0 !important; }
::-webkit-scrollbar-thumb        { background-color: #606060; background-image: conic-gradient(#6c6c6c 25%, #383838 0 50%, #6c6c6c 0 75%, #383838 0); background-size: 2px 2px; border-radius: 0 !important; border: 0 !important; }
::-webkit-scrollbar-thumb:hover  { background-color: #949494; background-image: conic-gradient(#a6a6a6 25%, #555 0 50%, #a6a6a6 0 75%, #555 0); background-size: 2px 2px; border-radius: 0 !important; }
::-webkit-scrollbar-button       { background-color: #222; background-image: conic-gradient(#2a2a2a 25%, #131313 0 50%, #2a2a2a 0 75%, #131313 0); background-size: 2px 2px; border-radius: 0 !important; width: 9px; height: 9px; border: 0 !important; }
/* hide the double-ended (inner) buttons — keep only one arrow per end */
::-webkit-scrollbar-button:vertical:start:increment,
::-webkit-scrollbar-button:vertical:end:decrement,
::-webkit-scrollbar-button:horizontal:start:increment,
::-webkit-scrollbar-button:horizontal:end:decrement { display: none; }
::-webkit-scrollbar-corner       { background: #080808; }
/* Shrink scrollbars on low-res / retro screens (matches the --dw-res-scale curve) */
@media (max-width: 1200px) { ::-webkit-scrollbar, ::-webkit-scrollbar-button { width: 6px; height: 6px; } }
@media (max-width: 1024px) { ::-webkit-scrollbar, ::-webkit-scrollbar-button { width: 4px; height: 4px; } }
@media (max-width: 800px)  { ::-webkit-scrollbar, ::-webkit-scrollbar-button { width: 3px; height: 3px; } }
/* Firefox */
* { scrollbar-width: thin; scrollbar-color: #606060 #080808; }

/* ── Dithered 1px dividers ──────────────────────────────────────────────────
   A 4×4 checker border-image on every element. The `border` (full) shorthand
   RESETS border-image but the per-side shorthands (border-top/bottom/left/right)
   do NOT — so, kept deliberately non-!important, this only ever lands on
   SINGLE-SIDE 1px dividers. Full-border frames / buttons / inputs override it
   back to none via their own `border` shorthand, so they stay solid. */
* {
  border-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4'%3E%3Crect width='1' height='1' fill='%233a3a3a'/%3E%3Crect x='2' width='1' height='1' fill='%233a3a3a'/%3E%3Crect x='1' y='1' width='1' height='1' fill='%233a3a3a'/%3E%3Crect x='3' y='1' width='1' height='1' fill='%233a3a3a'/%3E%3Crect y='2' width='1' height='1' fill='%233a3a3a'/%3E%3Crect x='2' y='2' width='1' height='1' fill='%233a3a3a'/%3E%3Crect x='1' y='3' width='1' height='1' fill='%233a3a3a'/%3E%3Crect x='3' y='3' width='1' height='1' fill='%233a3a3a'/%3E%3C/svg%3E") 1 repeat;
}
/* keep the admin devtools panel's own separators crisp */
#dw-dev-panel, #dw-dev-panel *, .dw-font-drop, .dw-font-drop * { border-image: none !important; }

/* ── Global image rendering — disable browser smoothing everywhere ─────────── */
img, canvas { image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges; image-rendering: pixelated; }

/* ── Casual-download deterrent — not a real security measure (anyone can still
   pull these from the network tab or view-source), just removes the one-tap/
   one-click "Save Image" affordance for ordinary visitors. Paired with a
   site-wide contextmenu listener in transitions.js that blocks the equivalent
   right-click/long-press menu on these same elements. ── */
img, video, canvas, model-viewer {
  -webkit-touch-callout: none;  /* iOS long-press "Save Image/Copy" callout */
  -webkit-user-drag: none;      /* desktop drag-out-to-save */
  user-drag: none;
  -webkit-user-select: none;
  user-select: none;
}

/* ── Body / Page Scale (Verdana, scale 100%) ─────────────────────────────── */
body {
  font-family: Verdana, Geneva, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.40 !important;
  letter-spacing: 0.060em !important;
}

/* ── Interface Chrome (Press Start 2P, zoom 80%) ─────────────────────────── */
.page-header, .sort-bar, .back, .back-link,
.coords-bar, .tag-bar, .cluster-label, .coords, .info-coords,
.thread-cat, .thread-category, .thread-meta-right .replies, .replies-header,
.analyze-btn, .map-btn, .annot-spectral-btn, .lb-spectral-btn, .fe-embed-spectral-btn, .fe-lb-spectral-btn, .info-link,
.ia-btn, .ia-ov-btn, .ia-blend-btn, .ia-fx-btn, .ia-back-btn, .ia-close-btn,
.ia-ann-item-body, .ia-ann-empty, .ia-focus-lbl,
.ia-annot-popup-meta, .ia-annot-input, .ia-annot-textarea,
.ia-annot-tip-meta, .ia-zoom-val,
.poster-counter-val, .comments-header-count,
.size-btn, .add-to-cart-btn, #dw-cart-btn, #dw-checkout-btn, #introEnter, #dwMetaToggle {
  font-family: 'Press Start 2P', monospace !important;
  line-height: 1.60 !important;
  letter-spacing: 0.120em !important;
  zoom: 0.800;
}
/* Thread context +30% */
.thread-category, .replies-header, .fe-embed-spectral-btn {
  zoom: 1.040 !important;
}
/* Counter labels — no zoom reduction (already at small em sizes) */
.poster-counter-val, .comments-header-count {
  zoom: 1.0 !important;
}

/* ── Post Date / Time (Franklin Gothic, stretchX 125%, stretchY 90%) ──────── */
.poster-date, .meta-date, .comment-meta-date, .info-date, .ia-focus-cmt-date,
.thread-meta-left span:not(.author),
.thread-date, .reply-date {
  font-family: 'Franklin Gothic Medium','Franklin Gothic',Arial,sans-serif !important;
  line-height: 1.50 !important;
  letter-spacing: 0.060em !important;
  transform: scaleX(1.250) scaleY(0.900) !important;
  transform-origin: var(--dw-xorg, left top);
}
.poster-date { transform-origin: var(--dw-xorg, center top); }
.thread-meta-left span:not(.author) { transform-origin: var(--dw-xorg, left top); }
.meta-date { zoom: 0.810 !important; }
.thread-meta-left span:not(.author),
.thread-date, .reply-date { zoom: 1.150 !important; }

/* ── Usernames (Franklin Gothic) ─────────────────────────────────────────── */
.poster-username, .comment-meta-username, .meta-username, .info-username,
.ia-focus-cmt-user, .thread-meta-left .author, .byline-name, .reply-name {
  font-family: 'Franklin Gothic Medium','Franklin Gothic',Arial,sans-serif !important;
  line-height: 1.40 !important;
  letter-spacing: 0.060em !important;
}
.poster-username          { zoom: 1.100 !important; }
.comment-meta-username    { zoom: 1.100 !important; }
.meta-username            { zoom: 0.870 !important; }
.thread-meta-left .author, .byline-name, .reply-name { zoom: 1.400 !important; }

/* ── Coordinates (Franklin Gothic, zoom 117%) ────────────────────────────── */
.meta-coords {
  font-family: 'Franklin Gothic Medium','Franklin Gothic',Arial,sans-serif !important;
  line-height: 1.40 !important;
  letter-spacing: 0.060em !important;
  zoom: 1.170;
}
.meta-coords { zoom: 0.983 !important; }

/* ── Comment Text (Palatino, stretchY 142%) ──────────────────────────────── */
.comment-body, .thread-excerpt, .thread-content, .reply-content,
.fe-cmt .fe-label,
.ia-focus-cmt-body, .ia-annot-tip-body,
.product-name, .spec-tag, .product-desc, .product-price, .price-note,
.size-label, .store-note, .info-text, .sold-out-text, .product-details,
.dw-cart-hd-title, .dw-ci-name, .dw-ci-size, .dw-ci-price,
.dw-cart-total-label, .dw-cart-total-val, .dw-cart-shipping-note,
.dw-cart-empty-msg, .dw-qty-val,
.meta-description {
  font-family: 'Palatino Linotype','Book Antiqua',serif !important;
  line-height: 1.50 !important;
  letter-spacing: 0.090em !important;
  transform: scaleX(1.000) scaleY(1.420) !important;
  transform-origin: var(--dw-xorg, left top);
}
.ia-annot-tip-body { font-style: normal !important; }
/* Counter-transform: embedded images & spectral buttons inside stretched text */
.forum-embed.fe-art, .forum-embed.fe-ann, .forum-embed.fe-cmt,
.fe-embed-spectral-btn {
  transform: scaleX(1.0000) scaleY(0.7042) !important;
  transform-origin: left top !important;
}

/* ── Annotation Titles (Franklin Gothic, zoom 126%, underline) ───────────── */
.thread-title, .annot-cmt-title, .ia-focus-cmt-label, .ia-annot-tip-label {
  font-family: 'Franklin Gothic Medium','Franklin Gothic',Arial,sans-serif !important;
  line-height: 1.40 !important;
  letter-spacing: 0.060em !important;
  zoom: 1.260;
  text-decoration: underline !important;
}

/* ── Annotation Coords (Courier New, zoom 106%, color #8a8a8a) ───────────── */
.annot-cmt-meta, .ia-ann-item-cells, .ia-coord {
  font-family: 'Courier New',Courier,monospace !important;
  line-height: 1.00 !important;
  letter-spacing: 0.060em !important;
  zoom: 1.060;
  transform: scaleX(1.010) scaleY(1.010) !important;
  transform-origin: var(--dw-xorg, left top);
  color: #8a8a8a !important;
}

/* ── Artefact Analysis (Bahnschrift) ─────────────────────────────────────── */
.analysis-panel, .analysis-section-label,
.analysis-key, .analysis-val,
.channel-lbl, .channel-pct,
.palette-tip, .analysis-loading, .minimap-label {
  font-family: Bahnschrift,'DIN Alternate',sans-serif !important;
  line-height: 1.40 !important;
  letter-spacing: 0.060em !important;
}

/* ── Hashtags (Franklin Gothic, 1.34em, stretchX 130%) ──────────────────── */
.meta-hashtags, .meta-tags, .info-tags {
  font-family: 'Franklin Gothic Medium','Franklin Gothic',Arial,sans-serif !important;
  font-size: 1.340em !important;
  line-height: 1.60 !important;
  letter-spacing: 0.120em !important;
  max-width: 76.9% !important;
  transform: scaleX(1.300) scaleY(1.000) !important;
  transform-origin: var(--dw-xorg, left top);
}
.meta-hashtags { zoom: 0.911 !important; }
.meta-tags     { zoom: 0.670 !important; }
.info-tags     { zoom: 0.670 !important; }

/* ── Accent — text & UI elements ─────────────────────────────────────────── */
.page-header, .sort-bar a.active, a.active, .cluster-label { color: hsl(94, 0%, 80%) !important; }
.product-price, .store-header, .product-back                { color: hsl(94, 0%, 80%) !important; }
.dw-cart-hd-title, .dw-ci-price, .dw-cart-total-val        { color: hsl(94, 0%, 80%) !important; }
#dw-cart-count { background: hsl(94, 0%, 80%) !important; color: #080808 !important; }
.meta-coords, .coord-badge, .coords-badge {
  background: hsl(94, 0%, 80%) !important; color: #000 !important;
}
.cluster-pct { color: hsl(94, 0%, 80%) !important; }
input[type="range"], input[type="checkbox"] { accent-color: hsl(94, 0%, 80%) !important; }
#soundToggle svg { color: hsl(94, 0%, 80%) !important; }

/* ── Accent — hover / interactive backgrounds ────────────────────────────── */
.fe-embed-spectral-btn:hover, .annot-spectral-btn:hover,
.fe-lb-spectral-btn:hover, .lb-spectral-btn:hover { background: hsl(94, 0%, 80%) !important; color: #000 !important; }
.add-to-cart-btn:hover:not(:disabled)   { background: rgba(204,204,204,0.10) !important; }
.ia-grid-cell:hover > rect              { fill:        rgba(204,204,204,0.12) !important; }
.ia-sub-cell:hover > rect               { fill:        rgba(204,204,204,0.16) !important; }
.ia-annot-cell:hover                    { fill:        rgba(204,204,204,0.32) !important; }
.ia-selected-region {
  background: rgba(204,204,204,0.55) !important;
  box-shadow: 0 0 18px 4px rgba(204,204,204,0.32) !important;
}

/* ── Accent — spectral panel ────────────────────────────────────────────── */
.ia-btn-primary                            { border-color: hsl(94,0%,80%) !important; color: hsl(94,0%,80%) !important; }
.ia-btn-primary:hover                      { background: hsl(94,0%,80%) !important; color: #000 !important; }
.ia-btn.ia-active                          { border-color: hsl(94,0%,80%) !important; background: hsl(94,0%,80%) !important; color: #000 !important; }
.ia-btn:hover                              { border-color: hsl(94,0%,80%) !important; background: hsl(94,0%,80%) !important; color: #000 !important; }
.ia-toggle-on                              { border-color: hsl(94,0%,24%) !important; color: hsl(94,0%,80%) !important; }
.ia-ov-btn.ia-active, .ia-blend-btn.ia-active, .ia-fx-btn.ia-active {
  border-color: hsl(94,0%,80%) !important; background: hsl(94,0%,80%) !important; color: #000 !important;
}
.ia-ov-btn:hover, .ia-blend-btn:hover, .ia-fx-btn:hover {
  border-color: hsl(94,0%,80%) !important; background: hsl(94,0%,80%) !important; color: #000 !important;
}
.ia-close-btn:hover { background: hsl(94,0%,80%) !important; color: #000 !important; }
.ia-ann-item:hover  { background: rgba(204,204,204,0.08) !important; }
.ia-ann-item-label  { color: hsl(94,0%,80%) !important; }
.ia-annot-popup-hdr { color: hsl(94,0%,80%) !important; border-bottom-color: hsl(94,0%,38%) !important; }
.ia-ann-textarea:focus { border-color: hsl(94,0%,80%) !important; }
.ia-focus-cmt-label, .ia-tip-user, .ia-tip-label, .ia-ann-form-lbl { color: hsl(94,0%,80%) !important; }
.ia-mv-hotspot-lbl  { color: hsl(94,0%,80%) !important; border-color: rgba(204,204,204,0.55) !important; }
.ia-annot-tip-label { color: hsl(94,0%,70%) !important; }

/* Annotation SVG markers */
.ia-annot-tag                               { fill:   hsl(94,0%,38%) !important; }
.ia-annot-outline                           { stroke: hsl(94,0%,38%) !important; }
.ia-annot-group.ia-hovered .ia-annot-tag    { fill:   hsl(94,0%,80%) !important; }
.ia-annot-group.ia-hovered .ia-annot-outline { stroke: hsl(94,0%,80%) !important; }
.ia-annot-group.ia-hovered .ia-annot-cell   { stroke: hsl(94,0%,80%) !important; }

/* ── Accent — artifact & forum buttons ───────────────────────────────────── */
.lb-spectral-btn    { color: hsl(94,0%,80%) !important; border-color: hsl(94,0%,38%) !important; }
.lb-spectral-btn:hover { border-color: hsl(94,0%,80%) !important; background: hsl(94,0%,80%) !important; color: #000 !important; }
.annot-spectral-btn { color: hsl(94,0%,80%) !important; border-color: hsl(94,0%,38%) !important; }
.annot-spectral-btn:hover { border-color: hsl(94,0%,80%) !important; background: hsl(94,0%,80%) !important; color: #000 !important; }
.fe-embed-spectral-btn { color: hsl(94,0%,80%) !important; border-color: hsl(94,0%,38%) !important; }
.fe-embed-spectral-btn:hover { border-color: hsl(94,0%,80%) !important; background: hsl(94,0%,80%) !important; color: #000 !important; }
.fe-embed-spectral-btn:hover > span { color: #000 !important; }
.fe-lb-spectral-btn { color: hsl(94,0%,80%) !important; border-color: hsl(94,0%,38%) !important; }
.fe-lb-spectral-btn:hover { border-color: hsl(94,0%,80%) !important; background: hsl(94,0%,80%) !important; color: #000 !important; }
.fe-lb-spectral-btn:hover > span { color: #000 !important; }
.analyze-btn { color: hsl(94,0%,80%) !important; border-color: hsl(94,0%,24%) !important; }
.analyze-btn:hover { border-color: hsl(94,0%,80%) !important; background: hsl(94,0%,80%) !important; color: #000 !important; }
.annot-cmt-title { color: hsl(94,0%,80%) !important; }
.comment-form-header a { color: hsl(94,0%,80%) !important; }
.comment-form button:hover { border-color: hsl(94,0%,80%) !important; color: hsl(94,0%,80%) !important; }
.edit-form-footer .btn-save:hover { border-color: hsl(94,0%,80%) !important; color: hsl(94,0%,80%) !important; }
.map-btn       { color: hsl(94,0%,80%) !important; border-color: hsl(94,0%,80%) !important; }
.map-btn:hover { background: hsl(94,0%,80%) !important; color: #000 !important; }

/* ── Button structural styles ─────────────────────────────────────────────── */
/* border-radius 0, border-width 1.5px, letter-spacing 0.13em, no glow */
.ia-btn, .ia-btn-primary, .ia-ov-btn, .ia-fx-btn, .ia-close-btn, .ia-back-btn, .ia-blend-btn,
.analyze-btn, .annot-spectral-btn, .lb-spectral-btn, .map-btn,
.fe-embed-spectral-btn, .fe-lb-spectral-btn, .size-btn, .add-to-cart-btn, .info-link,
#dw-cart-btn, #dw-checkout-btn, #introEnter {
  border-radius: 0 !important;
  border-width: 1.5px !important;
  letter-spacing: 0.130em !important;
  box-shadow: none !important;
  filter: none !important;
}
.ia-btn:hover, .ia-btn-primary:hover, .ia-ov-btn:hover, .ia-fx-btn:hover,
.ia-close-btn:hover, .ia-back-btn:hover, .ia-blend-btn:hover,
.analyze-btn:hover, .annot-spectral-btn:hover, .lb-spectral-btn:hover, .map-btn:hover,
.fe-embed-spectral-btn:hover, .fe-lb-spectral-btn:hover, .size-btn:hover,
.add-to-cart-btn:hover, .info-link:hover,
#dw-cart-btn:hover, #dw-checkout-btn:hover, #introEnter:hover {
  box-shadow: none !important;
}
.ia-annot-tip, .ia-annot-popup { filter: none !important; }

/* ── Border contexts ──────────────────────────────────────────────────────── */
/* meta-bar (hashtags + coords bracket) — invisible */
.meta-bar { border: none !important; }

/* artSide — artifact poster sidebar (top + right) */
.artifact-block .poster-sidebar {
  border-top-width:    0.5px !important; border-top-style:    solid !important;
  border-right-width:  0.5px !important; border-right-style:  solid !important;
  border-bottom-width: 0     !important; border-bottom-style: none  !important;
  border-left-width:   0     !important; border-left-style:   none  !important;
  border-color: hsl(94,0%,38%) !important;
}
/* artCmt — artifact comments (top + left) */
.comment {
  border-top-width:    0.5px !important; border-top-style:    solid !important;
  border-right-width:  0     !important; border-right-style:  none  !important;
  border-bottom-width: 0     !important; border-bottom-style: none  !important;
  border-left-width:   0.5px !important; border-left-style:   solid !important;
  border-color: hsl(94,0%,38%) !important;
}
/* forum — thread list (all sides) */
.thread-item {
  border-width: 0.5px !important;
  border-style: solid !important;
  border-color: hsl(94,0%,38%) !important;
  color: #c8c8c8 !important;
  text-decoration: none !important;
}
/* thread — posts & replies (left only, inset emboss) */
.reply-item, .post-block, .post-wrap {
  border-top-width:    0     !important; border-top-style:    none  !important;
  border-right-width:  0     !important; border-right-style:  none  !important;
  border-bottom-width: 0     !important; border-bottom-style: none  !important;
  border-left-width:   0.5px !important; border-left-style:   solid !important;
  border-color: hsl(94,0%,38%) !important;
  box-shadow: inset 0 0 2px rgba(255,255,255,0.46), inset 0 0 1px rgba(0,0,0,0.68) !important;
}
/* specs — analysis panel & minimap (double, 4px, #1c1c1c) */
.analysis-panel, .minimap-wrap {
  border-width: 4px !important;
  border-style: double !important;
  border-color: #1c1c1c !important;
}
/* specTip — hover tooltip (left only, radius 3px) */
.ia-annot-tip, .ia-annot-popup {
  border-top-width:    0     !important; border-top-style:    none  !important;
  border-right-width:  0     !important; border-right-style:  none  !important;
  border-bottom-width: 0     !important; border-bottom-style: none  !important;
  border-left-width:   0.5px !important; border-left-style:   solid !important;
  border-color: hsl(94,0%,38%) !important;
  border-radius: 3px !important;
}

/* ── Global dither overlay (replicates devtools ditherOpacity:25).
   mix-blend-mode:overlay has its STRONGEST effect on mid-tone content (not near-black
   or near-white), and this site's backgrounds are mostly flat mid-gray — 100% opacity
   produced a bold, high-contrast checkerboard rather than a subtle texture (confirmed
   by screenshot A/B testing 2026-07-28); 25% keeps it faint.
   conic-gradient quadrants (matches the scrollbar thumb/track technique above) instead
   of two overlaid 45deg diagonal gradients — the diagonal cut needs sub-pixel
   antialiasing to look even, which read as visibly uneven ("some squares thinner than
   others") at small tile sizes; a conic 4-quadrant split has only hard 90deg
   boundaries, no diagonal antialiasing at all.
   Size is driven by --dw-tex-size (set in transitions.js, same variable body's own
   texture uses) — ONE unified scale for both instead of two independently-tuned
   patterns. Native 2px up to 1360px width, grows proportionally wider than that so it
   doesn't read as denser on a large/high-res screen. Falls back to 2px pre-JS. */
html::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 209000;
  mix-blend-mode: overlay;
  opacity: 0.25;
  background-image: conic-gradient(#d8d8d8 25%, transparent 0 50%, #d8d8d8 0 75%, transparent 0);
  background-size: var(--dw-tex-size, 2px) var(--dw-tex-size, 2px);
}
/* Suppress CSS dither when devtools is active (it applies its own via JS) */
html.dw-active::after { display: none !important; }

/* ── Mobile overrides ─────────────────────────────────────────────────────────
   Served fresh here (site-theme.css is no-cache) so these apply even when a stale,
   still-cached transitions.js carries the old styling. html.dw-phone is set by the
   phone detection. Border COLOUR + dither come from dw-theme's BTN_SEL (also fresh);
   we only force the flat solid border + transparent bg so the old white 0.5px border
   can't win. */
html.dw-phone #soundToggle, html.dw-phone #soundGear { display: none !important; }
html.dw-phone #dwHamburger, html.dw-phone #dwBack, html.dw-phone #dwMetaToggle {
  border: 1.5px solid #bababa !important; background: none !important;
}
html.dw-phone #dwHamburger .dw-bar { background: currentColor !important; }
html.dw-phone #dwHamburger:hover, html.dw-phone #dwBack:hover,
html.dw-phone #dwMetaToggle:hover { background: hsl(94,0%,80%) !important; color: #000 !important; }