/**
 * TROSQA UI — design tokens + component language (v1).
 *
 * Loaded LAST. Active only under the two product themes (data-anachrist-theme
 * "tq-dark" / "tq-light", see js/ui/theme-engine.js); legacy themes keep their
 * old look. Surface colours are NOT redefined here: they come from the Theme
 * Engine's --theme-* variables so Dark, Light and imported custom themes share
 * one geometry. This file owns everything else: spacing, type, radii, control
 * heights, elevation, motion, and the shell (command bar, tool dock, inspector,
 * floating panels).
 *
 * Specificity note: older sheets use `!important` heavily. Rules here are
 * prefixed `html[data-anachrist-theme^="tq-"] body` so they win by specificity
 * without raising the !important arms race.
 */

/* ───────────────────────── 1. Tokens ───────────────────────── */
:root[data-anachrist-theme^="tq-"]{
  /* geometry */
  --tq-s1:4px;--tq-s2:8px;--tq-s3:12px;--tq-s4:16px;--tq-s5:24px;
  --tq-r-ctl:8px;--tq-r-panel:12px;--tq-r-pill:999px;
  --tq-h-dense:28px;--tq-h-ctl:32px;--tq-h-dock:36px;--tq-bar-h:48px;
  --tq-ico:18px;--tq-ico-sm:16px;
  /* type */
  --tq-font:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  --tq-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --tq-fs-xs:11px;--tq-fs-sm:12px;--tq-fs-md:13px;--tq-fs-lg:15px;
  /* motion */
  --tq-ease:cubic-bezier(.2,.8,.2,1);--tq-t-fast:120ms;--tq-t-panel:180ms;
  /* semantic colours (surfaces come from the theme engine) */
  --tq-bg:var(--theme-app-bg);--tq-stage:var(--theme-canvas-surround);--tq-surface:var(--theme-surface);
  --tq-raised:var(--theme-surface-2);--tq-elev:var(--theme-surface-3);--tq-field:var(--theme-input-bg);
  --tq-fg:var(--theme-text);--tq-fg2:var(--theme-muted);
  --tq-accent:var(--theme-accent);--tq-accent-strong:var(--theme-accent-strong);--tq-accent-soft:var(--theme-accent-soft);
  --tq-ok:var(--theme-success);--tq-warn:var(--theme-warning);--tq-err:var(--theme-danger);
  --tq-line:color-mix(in srgb,var(--theme-text) 9%,transparent);
  --tq-line-strong:color-mix(in srgb,var(--theme-text) 18%,transparent);
  --tq-hover:color-mix(in srgb,var(--theme-text) 7%,transparent);
  --tq-press:color-mix(in srgb,var(--theme-text) 12%,transparent);
  --tq-ring:color-mix(in srgb,var(--theme-accent) 60%,transparent);
  --tq-on-accent:#0F1405;
  --tq-sh-panel:0 16px 44px var(--theme-shadow),0 0 0 1px var(--tq-line);
  --tq-sh-pop:0 8px 24px var(--theme-shadow),0 0 0 1px var(--tq-line);
  /* bridge to the legacy --ui-* vocabulary so older rules follow the new sizes */
  --ui-radius:var(--tq-r-ctl);--ui-control-height:var(--tq-h-ctl);--ui-toolbar-height:var(--tq-bar-h);
  --ui-side-panel-width:332px;--ui-border-width:1px;--ui-control-font-size:var(--tq-fs-sm);
  --ui-font-body:var(--tq-font);--ui-font-heading:var(--tq-font);--ui-font-control:var(--tq-font);
  --ui-motion-duration:var(--tq-t-fast);--ui-shadow-panel:var(--tq-sh-panel);
  --header-height:var(--tq-bar-h);--inspector-width:332px;
}
:root[data-anachrist-theme="tq-light"]{--tq-on-accent:#FFFFFF}

@media (prefers-reduced-motion:reduce){:root[data-anachrist-theme^="tq-"]{--tq-t-fast:.01ms;--tq-t-panel:.01ms}}
html.ui-reduce-motion{--tq-t-fast:.01ms!important;--tq-t-panel:.01ms!important}

/* ───────────────────────── 2. Base ───────────────────────── */
html[data-anachrist-theme^="tq-"] body{font-family:var(--tq-font);font-size:var(--tq-fs-md);background:var(--tq-bg)!important;color:var(--tq-fg)!important;-webkit-font-smoothing:antialiased}
html[data-anachrist-theme^="tq-"] body ::selection{background:var(--tq-accent-soft);color:var(--tq-fg)}
html[data-anachrist-theme^="tq-"] body *{scrollbar-width:thin;scrollbar-color:var(--tq-line-strong) transparent}
html[data-anachrist-theme^="tq-"] body ::-webkit-scrollbar{width:10px;height:10px}
html[data-anachrist-theme^="tq-"] body ::-webkit-scrollbar-thumb{background:var(--tq-line-strong);border-radius:8px;border:3px solid transparent;background-clip:content-box}
html[data-anachrist-theme^="tq-"] body :where(button,input,select,textarea,a,[tabindex]):focus-visible{outline:2px solid var(--tq-ring)!important;outline-offset:1px!important}
html[data-anachrist-theme^="tq-"] body .tq-ico{width:var(--tq-ico);height:var(--tq-ico);flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}

/* ───────────────────────── 3. Controls ───────────────────────── */
/* Generic chrome button: quiet by default, no per-feature colours. */
html[data-anachrist-theme^="tq-"] body :where(#main-toolbar,#settings-container,.modifier-panel,.layers-panel,.timeline-panel,.settings-hub-panel,.theme-engine-panel,.workspace-panel-switcher) :where(button,[role="button"],label[for]):not(.tq-keep){
  min-height:var(--tq-h-ctl);border-radius:var(--tq-r-ctl)!important;border:1px solid transparent!important;background:transparent!important;color:var(--tq-fg)!important;
  font:500 var(--tq-fs-sm)/1 var(--tq-font)!important;display:inline-flex;align-items:center;justify-content:center;gap:var(--tq-s2);padding:0 var(--tq-s3);
  transition:background var(--tq-t-fast) var(--tq-ease),color var(--tq-t-fast) var(--tq-ease),border-color var(--tq-t-fast) var(--tq-ease),transform var(--tq-t-fast) var(--tq-ease)}
html[data-anachrist-theme^="tq-"] body :where(#main-toolbar,#settings-container,.modifier-panel,.layers-panel,.timeline-panel,.settings-hub-panel,.theme-engine-panel) :where(button,[role="button"],label[for]):not(.tq-keep):hover{background:var(--tq-hover)!important;border-color:transparent!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body :where(#main-toolbar,#settings-container,.modifier-panel,.layers-panel,.timeline-panel,.settings-hub-panel,.theme-engine-panel) :where(button,[role="button"],label[for]):not(.tq-keep):active{background:var(--tq-press)!important;transform:translateY(.5px)}
html[data-anachrist-theme^="tq-"] body :where(button,input,select,textarea):disabled{opacity:.4!important;cursor:not-allowed}

/* Bordered "field" buttons inside panels (Preset, Add keyframe …) keep a visible edge. */
html[data-anachrist-theme^="tq-"] body :where(#settings-container,.modifier-panel,.layers-panel,.timeline-panel,.settings-hub-panel) :where(button):not(.tq-keep):not(.modifier-icon-btn):not(.properties-accordion-toggle):not([id^="btn-"][id$="-close"]):not(.panel-sheet-close){
  background:var(--tq-raised)!important;border-color:var(--tq-line)!important}
html[data-anachrist-theme^="tq-"] body :where(#settings-container,.modifier-panel,.layers-panel,.timeline-panel,.settings-hub-panel) :where(button):not(.tq-keep):not(.modifier-icon-btn):not(.properties-accordion-toggle):not([id^="btn-"][id$="-close"]):not(.panel-sheet-close):hover{background:var(--tq-elev)!important;border-color:var(--tq-line-strong)!important}

/* Selected / pressed state: soft accent surface + accent glyph (never a solid white slab). */
html[data-anachrist-theme^="tq-"] body :where(button,[role="button"]):is(.is-active,[aria-pressed="true"],[aria-selected="true"],[data-toolbar-active="true"]):not(.tq-keep){
  background:var(--tq-accent-soft)!important;color:var(--tq-accent)!important;border-color:transparent!important;box-shadow:none!important}

/* Primary action (Preview, confirm buttons) */
html[data-anachrist-theme^="tq-"] body :is(#btn-preview-mode,.tq-primary,.tb-btn-primary){background:var(--tq-accent)!important;color:var(--tq-on-accent)!important;border-color:transparent!important;font-weight:600!important}
html[data-anachrist-theme^="tq-"] body :is(#btn-preview-mode,.tq-primary,.tb-btn-primary):hover{background:var(--tq-accent-strong)!important;color:var(--tq-on-accent)!important}
html[data-anachrist-theme^="tq-"] body :is(.tb-btn-danger,.tq-danger):hover{background:color-mix(in srgb,var(--tq-err) 16%,transparent)!important;color:var(--tq-err)!important}

/* Text fields / selects / numbers */
html[data-anachrist-theme^="tq-"] body :where(#settings-container,.modifier-panel,.layers-panel,.timeline-panel,.settings-hub-panel,.theme-engine-panel,#main-toolbar,.mobile-tool-picker) :where(input:not([type=range]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color]),select,textarea){
  min-height:var(--tq-h-dense);height:var(--tq-h-dense);border-radius:6px!important;border:1px solid var(--tq-line)!important;background:var(--tq-field)!important;color:var(--tq-fg)!important;
  padding:0 var(--tq-s2);font:400 var(--tq-fs-sm)/1 var(--tq-font)!important;font-variant-numeric:tabular-nums;transition:border-color var(--tq-t-fast) var(--tq-ease),box-shadow var(--tq-t-fast) var(--tq-ease)}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container,.layers-panel,.timeline-panel) textarea{height:auto;padding:var(--tq-s2)}
html[data-anachrist-theme^="tq-"] body :where(input:not([type=range]):not([type=checkbox]):not([type=radio]),select,textarea):hover{border-color:var(--tq-line-strong)!important}
html[data-anachrist-theme^="tq-"] body :where(input:not([type=range]):not([type=checkbox]):not([type=radio]),select,textarea):focus{border-color:var(--tq-accent)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--tq-accent) 22%,transparent)!important;outline:none!important}
html[data-anachrist-theme^="tq-"] body select{appearance:none;-webkit-appearance:none;padding-right:26px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239AA1AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 6px center!important;background-size:14px!important}

/* Sliders: thin track, small round thumb, accent fill via --tq-fill (set by tq-shell.js). */
html[data-anachrist-theme^="tq-"] body input[type=range]{-webkit-appearance:none;appearance:none;height:18px;min-height:0!important;padding:0!important;border:0!important;background:transparent!important;accent-color:var(--tq-accent)!important}
html[data-anachrist-theme^="tq-"] body input[type=range]::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(to right,var(--tq-accent) var(--tq-fill,50%),var(--tq-line-strong) var(--tq-fill,50%))}
html[data-anachrist-theme^="tq-"] body input[type=range]::-moz-range-track{height:3px;border-radius:3px;background:var(--tq-line-strong)}
html[data-anachrist-theme^="tq-"] body input[type=range]::-moz-range-progress{height:3px;border-radius:3px;background:var(--tq-accent)}
html[data-anachrist-theme^="tq-"] body input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;margin-top:-4.5px;border-radius:50%;background:var(--tq-fg);border:2px solid var(--tq-surface);box-shadow:0 0 0 1px var(--tq-line-strong);transition:transform var(--tq-t-fast) var(--tq-ease)}
html[data-anachrist-theme^="tq-"] body input[type=range]::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:var(--tq-fg);border:2px solid var(--tq-surface)}
html[data-anachrist-theme^="tq-"] body input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.15)}
html[data-anachrist-theme^="tq-"] body input[type=range]:active::-webkit-slider-thumb{transform:scale(1.25);background:var(--tq-accent)}
html[data-anachrist-theme^="tq-"] body input[type=checkbox],html[data-anachrist-theme^="tq-"] body input[type=radio]{accent-color:var(--tq-accent)!important;min-height:0!important;width:14px;height:14px}

/* ───────────────────────── 4. Command bar ───────────────────────── */
html[data-anachrist-theme^="tq-"] body #main-toolbar{height:var(--tq-bar-h)!important;min-height:var(--tq-bar-h)!important;background:var(--tq-surface)!important;border:0!important;border-bottom:1px solid var(--tq-line)!important;box-shadow:none!important;padding:0 var(--tq-s3)!important;gap:var(--tq-s3)!important}
html[data-anachrist-theme^="tq-"] body #main-toolbar h1.app-title{font:600 14px/1 var(--tq-font)!important;letter-spacing:.16em!important;color:var(--tq-fg)!important;margin:0}
html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-brand{gap:var(--tq-s2)!important}
html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-brand>.h-6{display:none}
html[data-anachrist-theme^="tq-"] body #main-toolbar #project-name-label{height:var(--tq-h-dense)!important;min-height:0!important;max-width:220px;padding:0 var(--tq-s2)!important;border:1px solid transparent!important;border-radius:6px!important;background:transparent!important;color:var(--tq-fg2)!important;font:500 var(--tq-fs-sm)/1 var(--tq-font)!important;transition:background var(--tq-t-fast) var(--tq-ease),color var(--tq-t-fast) var(--tq-ease)}
html[data-anachrist-theme^="tq-"] body #main-toolbar #project-name-label:hover{background:var(--tq-hover)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body #main-toolbar #project-name-label:not([readonly]){background:var(--tq-field)!important;border-color:var(--tq-accent)!important;color:var(--tq-fg)!important}

@media (min-width:901px){
  html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-actions{gap:2px!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-actions>button,
  html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-actions>label,
  html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-actions .toolbar-transport>button{height:var(--tq-h-ctl)!important;min-height:var(--tq-h-ctl)!important;min-width:var(--tq-h-ctl);padding:0 var(--tq-s2)!important;border-radius:var(--tq-r-ctl)!important;border:1px solid transparent!important;background:transparent!important;color:var(--tq-fg2)!important;box-shadow:none!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-actions>button:hover,
  html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-actions .toolbar-transport>button:hover{background:var(--tq-hover)!important;color:var(--tq-fg)!important;border-color:transparent!important}
  /* labels only where they earn their space */
  html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-actions>button>span:not(#vid-indicator):not(#vid-timer){display:none!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-file-menu>span,
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-applications>span,
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-settings-hub>span{display:inline!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-file-menu,
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-applications{color:var(--tq-fg)!important}
  /* zones (order + divider before each new zone) */
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-undo{order:1}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-redo{order:2}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-clear{order:3}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-file-menu{order:10;margin-left:var(--tq-s3)!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-mode-canvas{order:11}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-world-presets{order:12}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-symmetry-menu{order:13}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-applications{order:14}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-properties-panel{order:15;display:none!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #toolbar-zoom{order:30;margin-left:var(--tq-s3)!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-transport{order:40;margin-left:var(--tq-s3)!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-export-png{order:50;margin-left:var(--tq-s3)!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-export-vid{order:51}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-settings-hub{order:60}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-preview-mode{order:99;margin-left:var(--tq-s3)!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-preview-mode>span{display:inline!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-preview-mode{padding:0 var(--tq-s3)!important;color:var(--tq-on-accent)!important;background:var(--tq-accent)!important;gap:6px}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-preview-mode:hover{background:var(--tq-accent-strong)!important;color:var(--tq-on-accent)!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-clear:hover{color:var(--tq-err)!important}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-export-vid.is-recording,html[data-anachrist-theme^="tq-"] body #main-toolbar #toolbar-record.is-recording{color:var(--tq-err)!important}
}
/* vertical hairline between zones */
html[data-anachrist-theme^="tq-"] body #main-toolbar :is(#btn-file-menu,#toolbar-zoom,.toolbar-transport,#btn-export-png){position:relative}
html[data-anachrist-theme^="tq-"] body #main-toolbar :is(#btn-file-menu,#toolbar-zoom,.toolbar-transport,#btn-export-png)::before{content:"";position:absolute;left:calc(var(--tq-s3) / -2 - 1px);top:8px;bottom:8px;width:1px;background:var(--tq-line)}

/* zoom cluster */
html[data-anachrist-theme^="tq-"] body #toolbar-zoom{height:var(--tq-h-ctl)!important;min-height:var(--tq-h-ctl)!important;padding:0 2px!important;gap:0!important;border:1px solid var(--tq-line)!important;border-radius:var(--tq-r-ctl)!important;background:var(--tq-field)!important;box-shadow:none!important;display:inline-flex;align-items:center}
html[data-anachrist-theme^="tq-"] body #toolbar-zoom>span{display:none}
html[data-anachrist-theme^="tq-"] body #toolbar-zoom>button{width:26px!important;min-width:26px!important;height:26px!important;min-height:26px!important;padding:0!important;border:0!important;background:transparent!important;color:var(--tq-fg2)!important;border-radius:6px!important}
html[data-anachrist-theme^="tq-"] body #toolbar-zoom>button:hover{background:var(--tq-hover)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body #toolbar-zoom #btn-zoom-reset{width:auto!important;min-width:44px!important;padding:0 4px!important;font:500 var(--tq-fs-xs)/1 var(--tq-mono)!important;font-variant-numeric:tabular-nums;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body #toolbar-zoom #sl-zoom{width:72px!important}

/* transport */
html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-transport{display:inline-flex;align-items:center;gap:2px}
html[data-anachrist-theme^="tq-"] body #main-toolbar #toolbar-record{padding:0 var(--tq-s2)!important;gap:6px;font:600 var(--tq-fs-xs)/1 var(--tq-font)!important;letter-spacing:.06em}
html[data-anachrist-theme^="tq-"] body #main-toolbar #toolbar-record{color:var(--tq-err)!important}
html[data-anachrist-theme^="tq-"] body #main-toolbar #toolbar-play .tq-ico{width:14px;height:14px}
html[data-anachrist-theme^="tq-"] body .autosave-status{font:400 var(--tq-fs-xs)/1 var(--tq-font)!important;color:var(--tq-fg2)!important;background:transparent!important;border:0!important}

/* ───────────────────────── 5. Tool dock ───────────────────────── */
@media (min-width:901px){
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher{left:12px!important;top:calc(var(--tq-bar-h) + 14px)!important;width:44px!important;min-width:44px!important;padding:var(--tq-s1)!important;gap:2px!important;
    background:var(--tq-surface)!important;border:0!important;border-radius:var(--tq-r-panel)!important;box-shadow:var(--tq-sh-panel)!important;overflow:visible!important;z-index:30;
    display:flex;flex-direction:column;align-items:center}
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher button{position:relative;width:36px!important;min-width:36px!important;height:var(--tq-h-dock)!important;min-height:var(--tq-h-dock)!important;padding:0!important;display:grid!important;place-items:center;
    border:0!important;border-radius:var(--tq-r-ctl)!important;background:transparent!important;color:var(--tq-fg2)!important;box-shadow:none!important;
    transition:background var(--tq-t-fast) var(--tq-ease),color var(--tq-t-fast) var(--tq-ease),transform var(--tq-t-fast) var(--tq-ease)}
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher button>small{display:none!important}
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher button>span{display:grid!important;place-items:center;font-size:0!important}
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher button .tq-ico{width:20px;height:20px}
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher button:hover{background:var(--tq-hover)!important;color:var(--tq-fg)!important}
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher button:active{transform:scale(.94)}
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher button.is-active{background:var(--tq-accent-soft)!important;color:var(--tq-accent)!important;box-shadow:none!important}
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher button.is-active::before{content:"";position:absolute;left:-4px;top:9px;bottom:9px;width:2px;border-radius:2px;background:var(--tq-accent)}
  /* open floating panel: lighter cue than an active tool */
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher button.is-panel-open{background:var(--tq-hover)!important;color:var(--tq-fg)!important;box-shadow:inset 0 0 0 1px var(--tq-line-strong)!important}
  /* groups: tools | transform | panels | hide */
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher :is([data-mode-target="gravity"],[data-panel-target="modifier-panel"],.panel-switcher-hide){margin-top:var(--tq-s2)!important}
  html[data-anachrist-theme^="tq-"] body .workspace-panel-switcher :is([data-mode-target="gravity"],[data-panel-target="modifier-panel"],.panel-switcher-hide)::after{content:"";position:absolute;top:-5px;left:8px;right:8px;height:1px;background:var(--tq-line)}
}

/* ───────────────────────── 6. Tooltip ───────────────────────── */
.tq-tip{position:fixed;z-index:100000;pointer-events:none;display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:6px;background:var(--theme-surface-3,#2A2F39);color:var(--theme-text,#E6E9EF);box-shadow:var(--tq-sh-pop);font:500 12px/1 var(--tq-font,system-ui);opacity:0;transform:translateY(2px);transition:opacity 120ms var(--tq-ease,ease),transform 120ms var(--tq-ease,ease);white-space:nowrap}
.tq-tip.is-on{opacity:1;transform:none}
.tq-tip kbd{font:500 11px/1 var(--tq-mono,monospace);padding:2px 5px;border-radius:4px;background:color-mix(in srgb,var(--theme-text,#fff) 12%,transparent);color:var(--theme-muted,#9AA1AE)}

/* ───────────────────────── 7. Inspector (Properties & FX) ───────────────────────── */
html[data-anachrist-theme^="tq-"] body .modifier-panel{width:var(--inspector-width,332px)!important;background:var(--tq-surface)!important;border:0!important;border-radius:var(--tq-r-panel)!important;box-shadow:var(--tq-sh-panel)!important;overflow:hidden;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .modifier-head{background:transparent!important;border:0!important;border-bottom:1px solid var(--tq-line)!important;padding:var(--tq-s3) var(--tq-s3) var(--tq-s3) var(--tq-s4)!important;min-height:48px}
html[data-anachrist-theme^="tq-"] body .modifier-head h2{font:600 var(--tq-fs-lg)/1.2 var(--tq-font)!important;margin:0;letter-spacing:0}
html[data-anachrist-theme^="tq-"] body .modifier-kicker{font:500 10px/1 var(--tq-font)!important;letter-spacing:.08em;text-transform:uppercase;color:var(--tq-fg2)!important;margin-bottom:4px}
html[data-anachrist-theme^="tq-"] body .modifier-icon-btn,
html[data-anachrist-theme^="tq-"] body .layers-icon-btn,
html[data-anachrist-theme^="tq-"] body .panel-sheet-close{width:28px!important;min-width:28px!important;height:28px!important;min-height:28px!important;padding:0!important;display:inline-grid!important;place-items:center;border-radius:6px!important;border:0!important;background:transparent!important;color:var(--tq-fg2)!important;font-size:0}
html[data-anachrist-theme^="tq-"] body .modifier-icon-btn:hover{background:var(--tq-hover)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .modifier-icon-btn .tq-ico{width:16px;height:16px}
html[data-anachrist-theme^="tq-"] body .modifier-empty{padding:var(--tq-s4);color:var(--tq-fg2)!important;font-size:var(--tq-fs-sm)}
html[data-anachrist-theme^="tq-"] body .modifier-empty em{font-style:normal}

/* accordion: flat sections separated by hairlines instead of boxed cards */
html[data-anachrist-theme^="tq-"] body .properties-accordion{border:0!important;border-bottom:1px solid var(--tq-line)!important;border-radius:0!important;background:transparent!important;padding:0!important;margin:0!important;gap:0!important}
html[data-anachrist-theme^="tq-"] body .properties-accordion-toggle{width:100%;height:36px;min-height:36px!important;padding:0 var(--tq-s4)!important;justify-content:space-between!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--tq-fg)!important;font:600 var(--tq-fs-xs)/1 var(--tq-font)!important;letter-spacing:.06em;text-transform:uppercase;text-align:left}
html[data-anachrist-theme^="tq-"] body .properties-accordion-toggle:hover{background:var(--tq-hover)!important}
html[data-anachrist-theme^="tq-"] body .properties-accordion-chevron{font-size:0!important;width:14px;height:14px;color:var(--tq-fg2);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239AA1AE' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E") center/14px no-repeat;transition:transform var(--tq-t-panel) var(--tq-ease)}
html[data-anachrist-theme^="tq-"] body .properties-accordion-toggle[aria-expanded="true"] .properties-accordion-chevron{transform:rotate(180deg)}
html[data-anachrist-theme^="tq-"] body .properties-accordion-body{padding:var(--tq-s1) var(--tq-s4) var(--tq-s4)!important;display:flex;flex-direction:column;gap:var(--tq-s3)}
html[data-anachrist-theme^="tq-"] body .properties-accordion-body[hidden]{display:none!important}

/* inner modules: strip the nested boxes so only one level of structure remains */
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) :where(.properties-inline-module){border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) :where(.tb-surface,.tb-border){background:transparent!important;border-color:var(--tq-line)!important}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) :where(label,.tb-label,.tb-label-strong){color:var(--tq-fg2)!important;font:400 var(--tq-fs-sm)/1.25 var(--tq-font)!important}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) :where(.tb-label-strong){color:var(--tq-fg)!important;font-weight:500!important}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) :where(h3,h4,.text-xs.font-bold){letter-spacing:0}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) :where(span,small,div)[class*="text-"]{color:inherit}
html[data-anachrist-theme^="tq-"] body .modifier-card{border:1px solid var(--tq-line)!important;border-radius:var(--tq-r-ctl)!important;background:var(--tq-raised)!important;padding:var(--tq-s3)!important}

/* property rows rendered by the Inspector SDK / app.js */
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) .inspector-row,
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) .property-row{display:grid;grid-template-columns:minmax(72px,92px) 1fr auto;align-items:center;gap:var(--tq-s2);min-height:var(--tq-h-dense)}

/* Properties applications (Modules) cards */
html[data-anachrist-theme^="tq-"] body .properties-application{border:1px solid var(--tq-line)!important;border-radius:var(--tq-r-ctl)!important;background:var(--tq-raised)!important;padding:var(--tq-s3)!important;transition:border-color var(--tq-t-fast) var(--tq-ease),background var(--tq-t-fast) var(--tq-ease)}
html[data-anachrist-theme^="tq-"] body .properties-application:hover{border-color:var(--tq-line-strong)!important;background:var(--tq-elev)!important}

/* Legacy purple/gray Tailwind chips that remain inside chrome: fall back to quiet neutrals */
html[data-anachrist-theme^="tq-"] body :where(#settings-container,.modifier-panel,.layers-panel,.timeline-panel) :where([class*="bg-violet-"],[class*="bg-purple-"],[class*="bg-emerald-"],[class*="bg-cyan-"],[class*="bg-amber-"],[class*="bg-rose-"],[class*="bg-fuchsia-"],[class*="bg-indigo-"],[class*="bg-blue-"],[class*="bg-slate-"],[class*="bg-gray-"],[class*="bg-white"],[class*="bg-yellow-"],[class*="bg-red-"]):not(button):not(input):not(select){background:transparent!important}

/* ───────────────────────── 8. Floating panels ───────────────────────── */
html[data-anachrist-theme^="tq-"] body :is(.layers-panel,.settings-hub-panel,.theme-engine-panel){background:var(--tq-surface)!important;border:0!important;border-radius:var(--tq-r-panel)!important;box-shadow:var(--tq-sh-panel)!important;color:var(--tq-fg)!important;overflow:hidden}
html[data-anachrist-theme^="tq-"] body :is(.layers-head,.settings-hub-head,.theme-engine-head){background:transparent!important;border:0!important;border-bottom:1px solid var(--tq-line)!important;padding:var(--tq-s3) var(--tq-s4)!important;min-height:48px}
html[data-anachrist-theme^="tq-"] body :is(.layers-head,.settings-hub-head,.theme-engine-head) :is(h2,strong){font:600 var(--tq-fs-lg)/1.2 var(--tq-font)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body :is(.layers-head,.settings-hub-head,.theme-engine-head) small{font:500 10px/1 var(--tq-font)!important;letter-spacing:.08em;text-transform:uppercase;color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body :is(.layers-head,.settings-hub-head,.theme-engine-head) button{width:28px;min-width:28px;height:28px;min-height:28px!important;padding:0!important;border-radius:6px!important;border:0!important;background:transparent!important;color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body :is(.layers-head,.settings-hub-head,.theme-engine-head) button:hover{background:var(--tq-hover)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .layer-item{border:0!important;border-radius:var(--tq-r-ctl)!important;background:transparent!important;padding:var(--tq-s2)!important}
html[data-anachrist-theme^="tq-"] body .layer-item:hover{background:var(--tq-hover)!important}
html[data-anachrist-theme^="tq-"] body .layer-item.is-selected,html[data-anachrist-theme^="tq-"] body .layer-item.selected,html[data-anachrist-theme^="tq-"] body .layer-item.active{background:var(--tq-accent-soft)!important}
html[data-anachrist-theme^="tq-"] body .settings-hub-nav button{height:32px;border-radius:6px!important;color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body .settings-hub-nav button[aria-selected="true"]{background:var(--tq-accent-soft)!important;color:var(--tq-accent)!important;border:0!important}
html[data-anachrist-theme^="tq-"] body .settings-hub-controls{border:0!important;background:transparent!important;padding:0!important}
html[data-anachrist-theme^="tq-"] body .settings-hub-body section h3{font:600 var(--tq-fs-xs)/1 var(--tq-font)!important;letter-spacing:.08em;text-transform:uppercase;color:var(--tq-fg2)!important;margin:0 0 var(--tq-s2)}

/* Timeline dock */
html[data-anachrist-theme^="tq-"] body .timeline-panel{background:var(--tq-surface)!important;border:0!important;border-top:1px solid var(--tq-line)!important;box-shadow:0 -8px 28px var(--theme-shadow)!important;color:var(--tq-fg)!important;border-radius:0!important}
html[data-anachrist-theme^="tq-"] body .timeline-panel :is(.timeline-head,.timeline-controls,.timeline-toolbar){gap:var(--tq-s2)!important;align-items:center}
html[data-anachrist-theme^="tq-"] body .timeline-panel button#timeline-play,
html[data-anachrist-theme^="tq-"] body .timeline-panel button#timeline-stop{width:32px;padding:0!important;color:var(--tq-fg)!important;background:var(--tq-raised)!important}
html[data-anachrist-theme^="tq-"] body .timeline-panel button#timeline-record{color:var(--tq-err)!important}
html[data-anachrist-theme^="tq-"] body .timeline-panel .timeline-title strong{font:600 var(--tq-fs-md)/1 var(--tq-font)}
html[data-anachrist-theme^="tq-"] body .timeline-panel .timeline-title span,html[data-anachrist-theme^="tq-"] body .timeline-panel .timeline-status{color:var(--tq-fg2)!important;font:500 var(--tq-fs-xs)/1 var(--tq-font);letter-spacing:.04em}
html[data-anachrist-theme^="tq-"] body .timeline-panel :is(#timeline-time-label,#timeline-value){font-variant-numeric:tabular-nums;font-family:var(--tq-mono)}

/* ───────────────────────── 9. Canvas chrome ───────────────────────── */

/* Dialogs / popovers / menus opened from the top bar */
html[data-anachrist-theme^="tq-"] body :is(#panel-toolbar-file,#panel-canvas,#panel-toolbar-worldpresets,#panel-draw,#panel-select,#panel-grav,#panel-palec,#panel-text){background:var(--tq-surface)!important;border-color:var(--tq-line)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body :is(.canvas-fx-drawer,.mobile-tool-picker,.map-studio-panel){background:var(--tq-surface)!important;border:0!important;border-radius:var(--tq-r-panel)!important;box-shadow:var(--tq-sh-panel)!important;color:var(--tq-fg)!important}

@media (prefers-reduced-motion:reduce){html[data-anachrist-theme^="tq-"] body *{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* ───────────────────────── 10. Legacy surfaces → tokens ─────────────────────────
   editor.css hard-codes a slate/violet palette for the timeline, layer rows and
   some inspector cards. Re-point those to tokens so both schemes stay legible. */
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,.layers-panel,.timeline-panel,#settings-container,.settings-hub-panel) :where(h1,h2,h3,h4,h5,p,span,small,div,label,strong,em,b,i,li,td,th,legend,summary){color:inherit!important}
html[data-anachrist-theme^="tq-"] body .modifier-head h2,html[data-anachrist-theme^="tq-"] body .layers-head h2{color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,.layers-panel,.timeline-panel){color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) :where(label,.modifier-field-label,.modifier-field>span:first-child,small,.tb-label){color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body .timeline-clean-controls{border:1px solid var(--tq-line)!important;background:transparent!important;border-radius:var(--tq-r-ctl)!important}
html[data-anachrist-theme^="tq-"] body .timeline-tracks{border:1px solid var(--tq-line)!important;background:var(--tq-field)!important;border-radius:var(--tq-r-ctl)!important}
html[data-anachrist-theme^="tq-"] body .timeline-object-group{border-bottom:1px solid var(--tq-line)!important}
html[data-anachrist-theme^="tq-"] body .timeline-object-head{background:var(--tq-raised)!important;color:var(--tq-fg)!important;font-weight:600!important}
html[data-anachrist-theme^="tq-"] body .timeline-object-head:hover{background:var(--tq-elev)!important}
html[data-anachrist-theme^="tq-"] body .timeline-object-type,html[data-anachrist-theme^="tq-"] body .timeline-track-count{color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body .timeline-track-row{border-top:1px solid var(--tq-line)!important}
html[data-anachrist-theme^="tq-"] body .timeline-track-meta,html[data-anachrist-theme^="tq-"] body .timeline-track-row.is-transform .timeline-track-meta,html[data-anachrist-theme^="tq-"] body .timeline-track-row.is-project-control .timeline-track-meta{background:var(--tq-surface)!important;border-right:1px solid var(--tq-line)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .timeline-track-row.is-active .timeline-track-meta,html[data-anachrist-theme^="tq-"] body .timeline-track-row.is-transform.is-active .timeline-track-meta,html[data-anachrist-theme^="tq-"] body .timeline-track-row.is-project-control.is-active .timeline-track-meta{background:var(--tq-accent-soft)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .timeline-track-lane{background-image:linear-gradient(90deg,var(--tq-line) 1px,transparent 1px)!important}
html[data-anachrist-theme^="tq-"] body .timeline-track-lane::before{background:var(--tq-accent)!important}
html[data-anachrist-theme^="tq-"] body .timeline-lane-key{background:var(--tq-warn)!important;border:1px solid var(--tq-surface)!important}
html[data-anachrist-theme^="tq-"] body .timeline-lane-key.is-current{background:var(--tq-err)!important}
html[data-anachrist-theme^="tq-"] body .timeline-track-diamond{color:var(--tq-warn)!important}
html[data-anachrist-theme^="tq-"] body .timeline-transform-editor,html[data-anachrist-theme^="tq-"] body .timeline-project-editor{background:var(--tq-raised)!important;border-top:1px solid var(--tq-line)!important;color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body .timeline-transform-editor input,html[data-anachrist-theme^="tq-"] body .timeline-transform-editor select{background:var(--tq-field)!important;border:1px solid var(--tq-line)!important;color:var(--tq-fg)!important;border-radius:6px!important}
html[data-anachrist-theme^="tq-"] body .timeline-transform-editor button{background:var(--tq-raised)!important;border:1px solid var(--tq-line)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .timeline-transform-editor button:first-of-type{background:var(--tq-accent-soft)!important;border-color:transparent!important;color:var(--tq-accent)!important}
html[data-anachrist-theme^="tq-"] body .timeline-top #timeline-auto-key.is-active,html[data-anachrist-theme^="tq-"] body .timeline-top button.is-recording{background:var(--tq-accent-soft)!important;border-color:transparent!important;color:var(--tq-accent)!important;box-shadow:none!important}
html[data-anachrist-theme^="tq-"] body .timeline-top button.is-recording{background:color-mix(in srgb,var(--tq-err) 16%,transparent)!important;color:var(--tq-err)!important}
html[data-anachrist-theme^="tq-"] body .timeline-clean-controls button.active{background:var(--tq-accent-soft)!important;border-color:transparent!important;color:var(--tq-accent)!important}
html[data-anachrist-theme^="tq-"] body .timeline-panel .timeline-top{gap:var(--tq-s2)}
html[data-anachrist-theme^="tq-"] body .timeline-chooser-card{background:var(--tq-surface)!important;color:var(--tq-fg)!important;border-radius:var(--tq-r-panel)!important;box-shadow:var(--tq-sh-panel)!important}
html[data-anachrist-theme^="tq-"] body .layers-toolbar button+button{background:var(--tq-raised)!important}
html[data-anachrist-theme^="tq-"] body .layer-lock,html[data-anachrist-theme^="tq-"] body .layer-group-lock,html[data-anachrist-theme^="tq-"] body .layer-item.is-locked{background:var(--tq-raised)!important;border-color:var(--tq-line)!important}
html[data-anachrist-theme^="tq-"] body .layer-group-row{background:var(--tq-raised)!important;border:1px solid var(--tq-line)!important;border-radius:var(--tq-r-ctl)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .layer-group-row.is-selected{border-color:var(--tq-accent)!important;box-shadow:none!important}
html[data-anachrist-theme^="tq-"] body .hard-select-toggle{background:var(--tq-raised)!important;border:1px solid var(--tq-line)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .layers-empty,html[data-anachrist-theme^="tq-"] body .timeline-empty{color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body .modifier-kicker+*,html[data-anachrist-theme^="tq-"] body .modifier-object-name{color:var(--tq-fg)!important}
/* small status chips inside the inspector (MÉDIUM / PRO …) */
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) :where([class*="rounded-full"],[class*="uppercase"])[class*="bg-"]{background:var(--tq-elev)!important;color:var(--tq-fg2)!important;border:0!important}
html[data-anachrist-theme^="tq-"] body #main-toolbar .toolbar-brand{min-width:210px}
html[data-anachrist-theme^="tq-"] body #main-toolbar #project-name-label{width:clamp(110px,14vw,220px)}

/* ───────────────────────── 11. Timeline layout ───────────────────────── */
@media (min-width:901px){
  html[data-anachrist-theme^="tq-"] body .timeline-panel{left:68px!important;right:calc(16px + var(--tq-insp-w,0px))!important;bottom:12px!important;border:0!important;border-radius:var(--tq-r-panel)!important;box-shadow:var(--tq-sh-panel)!important;padding:var(--tq-s2) var(--tq-s3) var(--tq-s3)!important;transition:right var(--tq-t-panel) var(--tq-ease)}
}
html[data-anachrist-theme^="tq-"] body .timeline-top.tq-tl{display:flex;flex-direction:column;align-items:stretch;gap:var(--tq-s2);position:static}
html[data-anachrist-theme^="tq-"] body .tq-tl-row{display:flex;align-items:center;gap:var(--tq-s2);flex-wrap:wrap;min-width:0}
html[data-anachrist-theme^="tq-"] body .tq-tl-head .timeline-title{display:flex;flex-direction:column;gap:3px;margin-right:var(--tq-s3)}
html[data-anachrist-theme^="tq-"] body .tq-tl-transport{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:var(--tq-r-ctl);background:var(--tq-field);border:1px solid var(--tq-line)}
html[data-anachrist-theme^="tq-"] body .tq-tl-transport button{height:28px!important;min-height:28px!important;border:0!important;background:transparent!important;padding:0 var(--tq-s2)!important;font-size:var(--tq-fs-xs)!important;letter-spacing:.04em}
html[data-anachrist-theme^="tq-"] body .tq-tl-transport button#timeline-play,html[data-anachrist-theme^="tq-"] body .tq-tl-transport button#timeline-stop{width:30px;padding:0!important}
html[data-anachrist-theme^="tq-"] body .tq-tl-transport button#timeline-play{color:var(--tq-accent)!important}
html[data-anachrist-theme^="tq-"] body .tq-tl-transport button:hover{background:var(--tq-hover)!important}
html[data-anachrist-theme^="tq-"] body .tq-tl-spacer{flex:1 1 auto}
html[data-anachrist-theme^="tq-"] body .tq-tl-row .tq-ico{width:16px;height:16px}
html[data-anachrist-theme^="tq-"] body .tq-tl-keys{padding-top:var(--tq-s2);border-top:1px solid var(--tq-line)}
html[data-anachrist-theme^="tq-"] body .tq-tl-keys select,html[data-anachrist-theme^="tq-"] body .tq-tl-keys input{width:auto;min-width:96px;max-width:200px}
html[data-anachrist-theme^="tq-"] body .tq-tl-keys input#timeline-value{width:84px;min-width:0}
html[data-anachrist-theme^="tq-"] body .tq-tl-keys #timeline-add-key{background:var(--tq-accent-soft)!important;color:var(--tq-accent)!important;border-color:transparent!important}
html[data-anachrist-theme^="tq-"] body .tq-tl-keys #timeline-delete-key,html[data-anachrist-theme^="tq-"] body .tq-tl-keys #timeline-delete-track,html[data-anachrist-theme^="tq-"] body .tq-tl-keys #timeline-clear-range{background:transparent!important;border-color:transparent!important;color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body .tq-tl-keys #timeline-delete-key:hover,html[data-anachrist-theme^="tq-"] body .tq-tl-keys #timeline-delete-track:hover{color:var(--tq-err)!important;background:color-mix(in srgb,var(--tq-err) 14%,transparent)!important}
html[data-anachrist-theme^="tq-"] body .tq-tl-keys #timeline-status{margin-left:auto}
html[data-anachrist-theme^="tq-"] body .tq-tl-options{width:32px;padding:0!important;color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body .tq-tl-options[aria-expanded="true"]{background:var(--tq-hover)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .tq-tl-pop{position:absolute;right:var(--tq-s3);top:48px;z-index:5;display:flex;flex-direction:column;gap:var(--tq-s3);min-width:280px;max-width:min(380px,90vw);padding:var(--tq-s3);border-radius:var(--tq-r-panel);background:var(--tq-elev);box-shadow:var(--tq-sh-pop);animation:tq-pop var(--tq-t-panel) var(--tq-ease)}
html[data-anachrist-theme^="tq-"] body .tq-tl-pop.hidden{display:none}
html[data-anachrist-theme^="tq-"] body .tq-tl-pop label,html[data-anachrist-theme^="tq-"] body .tq-tl-field{display:flex;align-items:center;justify-content:space-between;gap:var(--tq-s3);color:var(--tq-fg2)!important;font-size:var(--tq-fs-sm)}
html[data-anachrist-theme^="tq-"] body .tq-tl-pop .timeline-clean-controls{flex-direction:column;align-items:stretch;gap:var(--tq-s2);padding:var(--tq-s3)!important}
html[data-anachrist-theme^="tq-"] body .tq-tl-pop .timeline-clean-controls.hidden{display:none}
html[data-anachrist-theme^="tq-"] body .tq-tl-pop input[type=number]{width:72px}
@keyframes tq-pop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
html[data-anachrist-theme^="tq-"] body .timeline-ruler-wrap{margin-top:var(--tq-s2)}
html[data-anachrist-theme^="tq-"] body #timeline-time-label{color:var(--tq-fg2)!important;font:500 var(--tq-fs-xs)/1 var(--tq-mono)!important}

/* ───────────────────────── 12. Inspector leftovers ───────────────────────── */
html[data-anachrist-theme^="tq-"] body :where(.properties-accordion-body,.modifier-panel) .border-r,html[data-anachrist-theme^="tq-"] body :where(.properties-accordion-body,.modifier-panel) .border-l{border-right:0!important;border-left:0!important;padding-right:0}

/* ───────────────────────── 13. Top-bar drawers (Draw / File / Canvas / World / Symmetry…) ───────────────────────── */
html[data-anachrist-theme^="tq-"] body #settings-container{background:var(--tq-surface)!important;border:0!important;box-shadow:none!important}
html[data-anachrist-theme^="tq-"] body #settings-container :where([id^="panel-"]){background:var(--tq-surface)!important;border-color:var(--tq-line)!important}
html[data-anachrist-theme^="tq-"] body #settings-container :where([id^="panel-"]) :where([class*="rounded"]):is(label,div,span){border-color:var(--tq-line)!important;border-radius:var(--tq-r-ctl)!important;background:var(--tq-raised)!important}
html[data-anachrist-theme^="tq-"] body #btn-new-project{background:var(--tq-accent)!important;color:var(--tq-on-accent)!important;border-color:transparent!important}

/* ───────────────────────── 14. Modules cards, dialogs ───────────────────────── */
html[data-anachrist-theme^="tq-"] body .properties-application :is(h3,h4,strong){font:600 var(--tq-fs-md)/1.2 var(--tq-font)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .properties-application :is(p,small,span){color:var(--tq-fg2)!important;font-size:var(--tq-fs-sm)}
html[data-anachrist-theme^="tq-"] body .project-modal{background:color-mix(in srgb,var(--tq-bg) 70%,transparent)!important;backdrop-filter:blur(6px)}
html[data-anachrist-theme^="tq-"] body .project-dialog,html[data-anachrist-theme^="tq-"] body .canvas-preset-dialog{background:var(--tq-surface)!important;color:var(--tq-fg)!important;border:0!important;border-radius:var(--tq-r-panel)!important;box-shadow:var(--tq-sh-panel)!important}
html[data-anachrist-theme^="tq-"] body .project-dialog-kicker{font:500 10px/1 var(--tq-font)!important;letter-spacing:.08em;text-transform:uppercase;color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body .project-dialog h2{font:600 var(--tq-fs-lg)/1.2 var(--tq-font)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .project-label,html[data-anachrist-theme^="tq-"] body .project-file-preview,html[data-anachrist-theme^="tq-"] body .project-save-destination{color:var(--tq-fg2)!important;font-size:var(--tq-fs-sm)}
html[data-anachrist-theme^="tq-"] body .project-name-input{height:36px;border-radius:var(--tq-r-ctl)!important;border:1px solid var(--tq-line)!important;background:var(--tq-field)!important;color:var(--tq-fg)!important;padding:0 var(--tq-s3)}
html[data-anachrist-theme^="tq-"] body .project-btn{height:34px;padding:0 var(--tq-s4);border-radius:var(--tq-r-ctl)!important;border:1px solid var(--tq-line)!important;background:var(--tq-raised)!important;color:var(--tq-fg)!important;font:500 var(--tq-fs-sm)/1 var(--tq-font)}
html[data-anachrist-theme^="tq-"] body .project-btn:hover{background:var(--tq-elev)!important}
html[data-anachrist-theme^="tq-"] body .project-btn-primary{background:var(--tq-accent)!important;color:var(--tq-on-accent)!important;border-color:transparent!important;font-weight:600}
html[data-anachrist-theme^="tq-"] body .project-btn-primary:hover{background:var(--tq-accent-strong)!important}
html[data-anachrist-theme^="tq-"] body .project-dialog-close{border:0!important;background:transparent!important;color:var(--tq-fg2)!important;border-radius:6px!important}
html[data-anachrist-theme^="tq-"] body .canvas-preset-card{background:var(--tq-raised)!important;border:1px solid var(--tq-line)!important;border-radius:var(--tq-r-ctl)!important;color:var(--tq-fg2)!important}
html[data-anachrist-theme^="tq-"] body .canvas-preset-card.is-selected{border-color:var(--tq-accent)!important;background:var(--tq-accent-soft)!important;color:var(--tq-fg)!important}

/* ───────────────────────── 15. Tool-SDK inspector sections ───────────────────────── */
html[data-anachrist-theme^="tq-"] body .inspector-section{border:0!important;border-top:1px solid var(--tq-line)!important;border-radius:0!important;background:transparent!important;padding:var(--tq-s3) 0 var(--tq-s1)!important;min-width:0!important;width:100%;flex-wrap:wrap;position:static}
html[data-anachrist-theme^="tq-"] body .inspector-section:first-of-type{border-top:0!important;padding-top:0!important}
html[data-anachrist-theme^="tq-"] body .inspector-section legend{position:static!important;float:none;width:100%;margin:0 0 var(--tq-s2);padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--tq-fg2)!important;font:600 10px/1 var(--tq-font)!important;letter-spacing:.08em;text-transform:uppercase}
html[data-anachrist-theme^="tq-"] body .inspector-separator{background:var(--tq-line)!important}
html[data-anachrist-theme^="tq-"] body .inspector-label{color:var(--tq-fg2)!important;font:400 var(--tq-fs-sm)/1.3 var(--tq-font)!important}
html[data-anachrist-theme^="tq-"] body .inspector-color-value{color:var(--tq-fg2)!important;font:400 var(--tq-fs-xs)/1 var(--tq-mono)!important}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) input[type=color]{height:28px;width:100%;padding:2px;border:1px solid var(--tq-line)!important;border-radius:6px!important;background:var(--tq-field)!important;cursor:pointer}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) input[type=color]::-webkit-color-swatch-wrapper{padding:0}
html[data-anachrist-theme^="tq-"] body :where(.modifier-panel,#settings-container) input[type=color]::-webkit-color-swatch{border:0;border-radius:4px}

/* ───────────────────────── 16. Mobile shell ───────────────────────── */
html[data-anachrist-theme^="tq-"] body .mobile-bottom-nav{background:var(--tq-surface)!important;border-top:1px solid var(--tq-line)!important;box-shadow:none!important}
html[data-anachrist-theme^="tq-"] body .mobile-bottom-nav button{background:transparent!important;color:var(--tq-fg2)!important;border:0!important;border-radius:var(--tq-r-ctl)!important;gap:3px}
html[data-anachrist-theme^="tq-"] body .mobile-bottom-nav button small{color:inherit!important;font:500 10px/1 var(--tq-font)!important}
html[data-anachrist-theme^="tq-"] body .mobile-bottom-nav button .tq-ico{width:20px;height:20px}
html[data-anachrist-theme^="tq-"] body .mobile-bottom-nav button:is([data-toolbar-active="true"],.is-active){background:var(--tq-accent-soft)!important;color:var(--tq-accent)!important}
html[data-anachrist-theme^="tq-"] body .mobile-bottom-nav button:is([data-toolbar-active="true"],.is-active)::after{background:var(--tq-accent)!important;box-shadow:none!important}
html[data-anachrist-theme^="tq-"] body .mobile-bottom-nav button>*::after,html[data-anachrist-theme^="tq-"] body .mobile-bottom-nav button::before{background:var(--tq-accent)!important}
html[data-anachrist-theme^="tq-"] body .mobile-zoom-pill{background:var(--tq-surface)!important;border:1px solid var(--tq-line)!important;border-radius:var(--tq-r-pill)!important;box-shadow:var(--tq-sh-pop)!important}
html[data-anachrist-theme^="tq-"] body .mobile-zoom-pill button{background:transparent!important;color:var(--tq-fg)!important;border:0!important}
html[data-anachrist-theme^="tq-"] body .mobile-tool-picker{background:var(--tq-surface)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body .mobile-tool-actions button,html[data-anachrist-theme^="tq-"] body .mobile-brush-list button{background:var(--tq-raised)!important;color:var(--tq-fg)!important;border:1px solid var(--tq-line)!important;border-radius:var(--tq-r-ctl)!important}
html[data-anachrist-theme^="tq-"] body .mobile-brush-list button:is(.is-active,[aria-pressed="true"],[aria-selected="true"]){background:var(--tq-accent-soft)!important;color:var(--tq-accent)!important;border-color:transparent!important}

/* ───────────────────────── 17. Native dropdown lists ───────────────────────── */
html[data-anachrist-theme^="tq-"] body select option,html[data-anachrist-theme^="tq-"] body select optgroup{background:var(--tq-surface)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body select option:checked,html[data-anachrist-theme^="tq-"] body select option:hover{background:var(--tq-accent-soft)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] body select:disabled option{color:var(--tq-fg2)!important}

/* ───────────────────────── 18. Happy Little Accidents panel → tokens ───────────────────────── */
html[data-anachrist-theme^="tq-"] .hla-root{--hla-ink:var(--tq-fg);--hla-paper:var(--tq-surface);--hla-paper-2:var(--tq-raised);--hla-line:var(--tq-line);--hla-accent:var(--tq-accent);--hla-accent-2:var(--tq-accent);--hla-accent-3:var(--tq-warn);--hla-accent-4:var(--tq-accent);--hla-danger:var(--tq-err);--hla-shadow:var(--tq-sh-panel);font-family:var(--tq-font)}
html[data-anachrist-theme^="tq-"] .hla-panel-shell{border:0!important;border-radius:var(--tq-r-panel)!important;box-shadow:var(--tq-sh-panel)!important;background:var(--tq-surface)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] .hla-panel-head{border-bottom:1px solid var(--tq-line)!important}
html[data-anachrist-theme^="tq-"] .hla-panel-head h2{font:600 var(--tq-fs-lg)/1.2 var(--tq-font)!important}
html[data-anachrist-theme^="tq-"] .hla-panel-close{width:28px;height:28px;min-height:0!important;border:0!important;background:transparent!important;color:var(--tq-fg2)!important;border-radius:6px!important}
html[data-anachrist-theme^="tq-"] .hla-panel-close:hover{background:var(--tq-hover)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] .hla-root :is(button,[role="button"]){border-radius:var(--tq-r-ctl)!important;border:1px solid var(--tq-line)!important;background:var(--tq-raised)!important;color:var(--tq-fg)!important}
html[data-anachrist-theme^="tq-"] .hla-root :is(button,[role="button"]):hover{background:var(--tq-elev)!important}
html[data-anachrist-theme^="tq-"] .hla-root :is(button,[role="button"]):is(.is-active,.active,[aria-pressed="true"],[aria-selected="true"]){background:var(--tq-accent-soft)!important;color:var(--tq-accent)!important;border-color:transparent!important}
html[data-anachrist-theme^="tq-"] .hla-root .hla-generate-btn{background:var(--tq-accent)!important;color:var(--tq-on-accent)!important;border-color:transparent!important;font-weight:600}
html[data-anachrist-theme^="tq-"] .hla-root :is(input,textarea,select){background:var(--tq-field)!important;color:var(--tq-fg)!important;border:1px solid var(--tq-line)!important;border-radius:6px!important}
html[data-anachrist-theme^="tq-"] .hla-root :is(input,textarea)::placeholder{color:var(--tq-fg2)!important;opacity:1}
html[data-anachrist-theme^="tq-"] .hla-section-label{color:var(--tq-fg2)!important;letter-spacing:.08em}

/* ───────────────────────── 19. Mobile quick groups ───────────────────────── */
@media (max-width:900px){
  html[data-anachrist-theme^="tq-"] body .mobile-quick-group{gap:2px;align-items:center}
  html[data-anachrist-theme^="tq-"] body .mobile-quick-group button,html[data-anachrist-theme^="tq-"] body #mobile-quick-right #btn-preview-mode{min-width:36px;height:36px;min-height:36px;padding:0 8px!important;border-radius:var(--tq-r-ctl)!important;border:0!important;background:transparent!important;color:var(--tq-fg2)!important}
  html[data-anachrist-theme^="tq-"] body #mobile-quick-right #btn-preview-mode{background:var(--tq-accent)!important;color:var(--tq-on-accent)!important}
  html[data-anachrist-theme^="tq-"] body #mobile-quick-right #btn-preview-mode .tq-ico{display:none}
  html[data-anachrist-theme^="tq-"] body #mobile-quick-right #btn-preview-mode::after{content:""!important;display:block;width:18px;height:18px;font-size:0!important;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='2.8'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='2.8'/%3E%3C/svg%3E") center/contain no-repeat}
  html[data-anachrist-theme^="tq-"] body #main-toolbar #btn-mobile-actions-menu{width:36px;height:36px;border-radius:var(--tq-r-ctl)!important;background:transparent!important;border:0!important;color:var(--tq-fg)!important}
}
html[data-anachrist-theme^="tq-"] .hla-root .hla-type-card,
html[data-anachrist-theme^="tq-"] .hla-root .hla-control,
html[data-anachrist-theme^="tq-"] .hla-root .hla-thumb,
html[data-anachrist-theme^="tq-"] .hla-root .hla-dropzone,
html[data-anachrist-theme^="tq-"] .hla-root .hla-panel-mode-note,
html[data-anachrist-theme^="tq-"] .hla-root .hla-seed-badge,
html[data-anachrist-theme^="tq-"] .hla-root .hla-lock-chip,
html[data-anachrist-theme^="tq-"] .hla-root .hla-reveal-toggle,
html[data-anachrist-theme^="tq-"] .hla-root .hla-btn,
html[data-anachrist-theme^="tq-"] .hla-root .hla-field textarea,
html[data-anachrist-theme^="tq-"] .hla-root .hla-field input[type=text],
html[data-anachrist-theme^="tq-"] .hla-root .circuit-color-field input[type=color]
{background:var(--hla-paper)!important;color:var(--hla-ink)!important;border-color:var(--hla-line)!important}
html[data-anachrist-theme^="tq-"] .hla-root .hla-type-card.is-selected,html[data-anachrist-theme^="tq-"] .hla-root .hla-type-card[aria-pressed="true"]{background:var(--hla-paper-2)!important;border-color:var(--hla-accent)!important}
html[data-anachrist-theme^="tq-"] .hla-root :is(.hla-control label,.hla-control .hla-control-label,.hla-field label,.hla-control span,.hla-control small){color:var(--hla-ink)!important}
html[data-anachrist-theme^="tq-"] .hla-root .hla-control input[type=range]::-webkit-slider-thumb{background:var(--hla-paper)!important;border-color:var(--hla-accent)!important}

/* ───────────────────────── 20. Tooltip: self-contained, high-contrast (inverse of the scheme) ───────────────────────── */
.tq-tip{background:#14171C!important;color:#F4F6FA!important;border:1px solid rgba(255,255,255,.14)}
html[data-tq-scheme="dark"] .tq-tip,html[data-anachrist-theme="tq-dark"] .tq-tip{background:#F4F6FA!important;color:#14171C!important;border:1px solid rgba(0,0,0,.12)}
html[data-tq-scheme="light"] .tq-tip,html[data-anachrist-theme="tq-light"] .tq-tip{background:#14171C!important;color:#F4F6FA!important;border:1px solid rgba(255,255,255,.14)}
.tq-tip kbd{background:color-mix(in srgb,currentColor 14%,transparent)!important;color:inherit!important;opacity:.8}
/* Always dark: stays legible over the white artboard and over dark chrome alike. */
html[data-tq-scheme="dark"] .tq-tip,html[data-anachrist-theme="tq-dark"] .tq-tip,html[data-tq-scheme="light"] .tq-tip,html[data-anachrist-theme="tq-light"] .tq-tip,.tq-tip{background:#14171C!important;color:#F4F6FA!important;border:1px solid rgba(255,255,255,.16)!important;box-shadow:0 6px 20px rgba(0,0,0,.35)!important}