/* GEGENEREERD door tools/maak-os-avond.js uit os.css — niet met de hand bewerken.
   Avond (donker): lichte vlakken/tekst/randen uit de oude os.css-laag naar het Avond-palet.
   442 regels, 582 declaraties. Handwerk staat in os-strak.css (§ Avond-afwerking). */

/* tokens uit os.css die os-strak.css nog niet hermapt */
html[data-thema="avond"] {
  color-scheme: dark;
  --paneel: rgba(21, 27, 30, .97);
  --paneel-zwaar: #151B1E;
  --mist-rose: #3A2A33; --ocean-mint: #1F3A31; --sky-blue: #22303F; --dream-violet: #2F2840;
  --bio-surface: linear-gradient(135deg, rgba(26,34,37,.92) 0%, rgba(21,27,30,.88) 100%);
}

:where(html[data-thema="avond"]) body {
  background: radial-gradient(1100px 700px at 80% -10%, rgba(26, 48, 50, 0.18), transparent 60%),
    radial-gradient(900px 650px at -10% 110%, rgba(44, 22, 32, 0.22), transparent 55%),
    radial-gradient(700px 500px at 50% 50%, rgba(20, 38, 28, 0.14), transparent 60%),
    var(--bg);
}
:where(html[data-thema="avond"]) .iri::before {
  background: linear-gradient(120deg, rgba(44, 22, 32, 0.35), rgba(20, 38, 28, 0.35), rgba(22, 32, 43, 0.35), rgba(33, 23, 45, 0.35));
}
:where(html[data-thema="avond"]) .bio-glass {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.7) 0%, rgba(22, 28, 31, 0.5) 100%);
  border: 1px solid rgba(36, 43, 46, 0.8);
  box-shadow: 0 8px 32px rgba(31,38,135,.05), inset 0 0 15px rgba(255, 255, 255, 0.048);
}
:where(html[data-thema="avond"]) .login-card {
  border: 1px solid rgba(36, 43, 46, 0.6);
}
:where(html[data-thema="avond"]) .login-card input:focus-visible {
  border-color: rgba(255, 255, 255, 0.14);
  background: #141a1c;
}
:where(html[data-thema="avond"]) .menubar {
  background: linear-gradient(180deg, rgba(20, 26, 28, 0.55), rgba(20, 26, 28, 0.3));
}
:where(html[data-thema="avond"]) .menubar-right {
  background: var(--bio-surface) padding-box,
    linear-gradient(120deg, rgba(44, 22, 32, 0.7), rgba(20, 38, 28, 0.7), rgba(22, 32, 43, 0.7), rgba(33, 23, 45, 0.7)) border-box;
  box-shadow: 0 2px 10px rgba(31,38,135,.05), inset 0 0 10px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .topbar-credits.cr-low {
  color: #edb25b;
}
:where(html[data-thema="avond"]) .topbar-credits.cr-unlimited {
  color: #8755dd;
}
:where(html[data-thema="avond"]) .cp-bal.cp-unlimited .cp-bal-num {
  color: #8755dd;
}
:where(html[data-thema="avond"]) .cp-bal.cp-unlimited .cp-bal-eur {
  color: #8755dd;
}
:where(html[data-thema="avond"]) .credits-pop .cp-bal.cp-low .cp-bal-num {
  color: #edb25b;
}
:where(html[data-thema="avond"]) .credits-pop .cp-warn-amber {
  color: #eeb162;
}
:where(html[data-thema="avond"]) .credits-pop .cp-pack {
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .credits-pop .cp-ar {
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .credits-pop .cp-ar-err {
  color: var(--warn, #d0786f);
}
:where(html[data-thema="avond"]) .credits-pop .cp-ar-actions button,
:where(html[data-thema="avond"]) .credits-pop .cp-ar-on-btn {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: var(--glass-strong, #141a1c);
}
:where(html[data-thema="avond"]) .credits-pop .cp-ar-off:hover {
  color: var(--warn, #d0786f);
}
:where(html[data-thema="avond"]) .page-dot {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .live-rail-toggle {
  background: var(--bio-surface) padding-box,
    linear-gradient(160deg, rgba(44, 22, 32, 0.75), rgba(20, 38, 28, 0.75), rgba(22, 32, 43, 0.75), rgba(33, 23, 45, 0.75)) border-box;
  box-shadow: 0 2px 12px rgba(31,38,135,.06), inset 0 0 10px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .live-rail-toggle:hover,
:where(html[data-thema="avond"]) .live-rail.open .live-rail-toggle {
  box-shadow: 0 4px 18px rgba(0,106,102,.12), inset 0 0 14px rgba(255, 255, 255, 0.051);
}
:where(html[data-thema="avond"]) .live-rail-list {
  background: var(--bio-surface) padding-box,
    linear-gradient(120deg, rgba(44, 22, 32, 0.7), rgba(20, 38, 28, 0.7), rgba(22, 32, 43, 0.7), rgba(33, 23, 45, 0.7)) border-box;
  box-shadow: 0 8px 32px rgba(31,38,135,.08), inset 0 0 14px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .live-link:hover {
  background: rgba(20, 26, 28, 0.75);
}
:where(html[data-thema="avond"]) .app-tile .app-icon {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.7) 0%, rgba(22, 28, 31, 0.5) 100%) !important;
  border: 1px solid rgba(36, 43, 46, 0.8);
  box-shadow: 0 8px 32px rgba(31,38,135,.05), inset 0 0 15px rgba(255, 255, 255, 0.048);
}
:where(html[data-thema="avond"]) .app-tile:hover .app-icon {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.9) 0%, rgba(19, 36, 34, 0.7) 100%) !important;
  box-shadow: 0 8px 32px rgba(0,106,102,.1), inset 0 0 20px rgba(255, 255, 255, 0.054);
}
:where(html[data-thema="avond"]) .app-tile:focus-visible .app-icon {
  box-shadow: 0 0 0 2px var(--accent-bright), inset 0 0 15px rgba(255, 255, 255, 0.048);
}
:where(html[data-thema="avond"]) .app-tile-name {
  background: var(--bio-surface) padding-box,
    linear-gradient(120deg, rgba(20, 26, 28, 0.85), rgba(20, 26, 28, 0.85)) border-box;
  box-shadow: 0 1px 4px rgba(31,38,135,.05), inset 0 0 6px rgba(255, 255, 255, 0.036);
}
:where(html[data-thema="avond"]) .app-tile:hover .app-tile-name,
:where(html[data-thema="avond"]) .app-tile:focus-visible .app-tile-name {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.92) 0%, rgba(22, 28, 31, 0.8) 100%) padding-box,
    linear-gradient(120deg, var(--mist-rose), var(--ocean-mint), var(--sky-blue), var(--dream-violet)) border-box;
  box-shadow: 0 3px 12px rgba(0,106,102,.08), inset 0 0 8px rgba(255, 255, 255, 0.051);
}
:where(html[data-thema="avond"]) .app-tile .held-bubble {
  background: rgba(20, 26, 28, 0.92);
  border: 1px solid rgba(36, 43, 46, 0.9);
}
:where(html[data-thema="avond"]) .window {
  background: rgba(20, 26, 28, 0.85);
  border: 1px solid rgba(36, 43, 46, 0.6);
}
:where(html[data-thema="avond"]) .window.focused {
  box-shadow: 0 40px 80px rgba(0,0,0,.1), 0 0 50px rgba(0,106,102,.05), inset 0 0 20px rgba(255, 255, 255, 0.054);
}
:where(html[data-thema="avond"]) .window.maximized .window-bar {
  background: linear-gradient(180deg, rgba(20, 26, 28, 0.62), rgba(20, 26, 28, 0.42));
}
:where(html[data-thema="avond"]) .window.maximized .win-peek-handle {
  background: rgba(20, 26, 28, 0.55);
}
:where(html[data-thema="avond"]) .window-bar {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .window-title {
  color: rgba(117, 232, 240, 0.85);
}
:where(html[data-thema="avond"]) .window-btns button {
  background: rgba(20, 26, 28, 0.8);
}
:where(html[data-thema="avond"]) .window-body {
  background: #141a1c;
}
:where(html[data-thema="avond"]) .window-body iframe {
  background: #141a1c;
}
:where(html[data-thema="avond"]) .tabbar {
  background: linear-gradient(180deg, rgba(20, 26, 28, 0.3), rgba(20, 26, 28, 0.15));
}
:where(html[data-thema="avond"]) .tab {
  background: rgba(20, 26, 28, 0.35);
  border: 1px solid rgba(36, 43, 46, 0.45);
}
:where(html[data-thema="avond"]) .tab.active {
  background: rgba(20, 26, 28, 0.82);
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow: 0 2px 8px rgba(0,0,0,.04), inset 0 0 8px rgba(255, 255, 255, 0.036);
}
:where(html[data-thema="avond"]) .tab:hover:not(.active) {
  background: rgba(20, 26, 28, 0.55);
}
:where(html[data-thema="avond"]) .dock {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.72) 0%, rgba(22, 28, 31, 0.55) 100%) padding-box,
    linear-gradient(120deg, rgba(44, 22, 32, 0.75), rgba(20, 38, 28, 0.75), rgba(22, 32, 43, 0.75), rgba(33, 23, 45, 0.75)) border-box;
  box-shadow: 0 10px 30px rgba(0,0,0,.05), 0 0 20px rgba(255, 255, 255, 0.048), inset 0 0 14px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .dock-item {
  border: 1px solid rgba(36, 43, 46, 0.6);
  box-shadow: 0 2px 8px rgba(0,0,0,.05), inset 0 0 8px rgba(255, 255, 255, 0.036);
}
:where(html[data-thema="avond"]) .dock-item:hover {
  border-color: rgba(33, 46, 62, 0.9);
  box-shadow: 0 8px 20px rgba(0,106,102,.12), inset 0 0 10px rgba(255, 255, 255, 0.048);
}
:where(html[data-thema="avond"]) .mia-fab {
  border: 1px solid rgba(36, 43, 46, 0.35);
  box-shadow: 0 10px 30px rgba(0,106,102,.3), inset 0 0 12px rgba(255, 255, 255, 0.011);
}
:where(html[data-thema="avond"]) .mia-fab:hover {
  box-shadow: 0 14px 36px rgba(0,106,102,.35), 0 0 24px rgba(255, 255, 255, 0.036), inset 0 0 12px rgba(255, 255, 255, 0.015);
}
:where(html[data-thema="avond"]) .mia-panel {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.88) 0%, rgba(22, 28, 31, 0.78) 100%) padding-box,
    var(--iri-spectrum) border-box;
}
:where(html[data-thema="avond"]) .mia-panel-bar {
  background: rgba(20, 26, 28, 0.45);
}
:where(html[data-thema="avond"]) .mia-panel-kicker {
  color: rgba(117, 232, 240, 0.7);
}
:where(html[data-thema="avond"]) .mia-panel-close {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .mia-body select:focus-visible,
:where(html[data-thema="avond"]) .mia-body textarea:focus-visible {
  border-color: rgba(255, 255, 255, 0.14);
  background: #141a1c;
}
:where(html[data-thema="avond"]) .builder-delete {
  background: rgba(20, 26, 28, 0.8);
}
:where(html[data-thema="avond"]) .builder-spinner {
  border: 2px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .builder-live button {
  background: rgba(20, 26, 28, 0.8);
}
:where(html[data-thema="avond"]) ::-webkit-scrollbar-thumb {
  background: rgba(35, 44, 48, 0.6);
}
:where(html[data-thema="avond"]) ::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .ai-canvas {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.86) 0%, rgba(22, 28, 31, 0.78) 100%) padding-box,
    var(--iri-spectrum) border-box;
}
:where(html[data-thema="avond"]) .ai-canvas-bar {
  background: rgba(20, 26, 28, 0.45);
}
:where(html[data-thema="avond"]) .phase {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .phase.warnphase {
  color: #e5bf64;
  background: rgba(37, 33, 19, 0.6);
}
:where(html[data-thema="avond"]) .ai-canvas-tabs button {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .ai-canvas-min {
  background: rgba(20, 26, 28, 0.8);
}
:where(html[data-thema="avond"]) .ai-canvas-stop {
  background: rgba(20, 26, 28, 0.8);
}
:where(html[data-thema="avond"]) .ai-canvas-stop:hover {
  color: #d0786f;
}
:where(html[data-thema="avond"]) .ai-canvas-code {
  background: linear-gradient(160deg, rgba(24, 31, 33, 0.55) 0%, rgba(20, 26, 28, 0.4) 100%);
}
:where(html[data-thema="avond"]) .ai-canvas-activity .act.warn {
  color: #cfac73;
}
:where(html[data-thema="avond"]) .think-label {
  color: var(--accent, #6ee7ef);
}
:where(html[data-thema="avond"]) .think-sublabel {
  color: #adc3c1;
}
:where(html[data-thema="avond"]) .think-rate {
  color: var(--accent-bright, #5ae5ed);
}
:where(html[data-thema="avond"]) .think-collapse {
  background: rgba(255, 255, 255, 0.098);
  color: var(--accent, #6ee7ef);
}
:where(html[data-thema="avond"]) .think-collapse:hover {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .ai-canvas-think-stream {
  color: #b3c7c5;
}
:where(html[data-thema="avond"]) .think-frag.now {
  color: #92cecb;
}
:where(html[data-thema="avond"]) .think-frag.now::after {
  color: var(--accent-bright, #5ae5ed);
}
:where(html[data-thema="avond"]) .think-frag.question {
  color: #92cecb;
}
:where(html[data-thema="avond"]) .think-frag.decision {
  color: #92cecb;
}
:where(html[data-thema="avond"]) .think-frag.listitem::before {
  color: var(--accent, #6ee7ef);
}
:where(html[data-thema="avond"]) .think-divider {
  color: var(--accent, #6ee7ef);
}
:where(html[data-thema="avond"]) .think-divider::after {
  background: linear-gradient(to right, rgba(255, 255, 255, 0.12), transparent);
}
:where(html[data-thema="avond"]) .think-summary {
  color: #adc3c1;
  background: rgba(255, 255, 255, 0.054);
  border-top: 1px solid rgba(255, 255, 255, 0.116);
}
:where(html[data-thema="avond"]) .ai-canvas-code pre {
  color: #92c5c2;
}
:where(html[data-thema="avond"]) .ai-canvas-right {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.92) 0%, rgba(23, 29, 32, 0.78) 100%);
}
:where(html[data-thema="avond"]) .ai-canvas-foot {
  background: rgba(20, 26, 28, 0.55);
}
:where(html[data-thema="avond"]) .overlay {
  background: rgba(24, 30, 33, 0.55);
}
:where(html[data-thema="avond"]) .overlay-card {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.9) 0%, rgba(22, 28, 31, 0.8) 100%) padding-box,
    var(--iri-spectrum) border-box;
}
:where(html[data-thema="avond"]) .overlay-close {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .btn-ghost {
  background: rgba(20, 26, 28, 0.55);
}
:where(html[data-thema="avond"]) .iq-field input[type="text"],
:where(html[data-thema="avond"]) .iq-field textarea {
  background: rgba(20, 26, 28, 0.65);
}
:where(html[data-thema="avond"]) .chip {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .swatch {
  border: 2px solid rgba(36, 43, 46, 0.9);
}
:where(html[data-thema="avond"]) .iq-sumrow {
  background: rgba(20, 26, 28, 0.55);
}
:where(html[data-thema="avond"]) .iq-note {
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .builder-setup-open {
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .builder-setup-open:hover {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .setup-item {
  background: rgba(20, 26, 28, 0.55);
}
:where(html[data-thema="avond"]) .setup-field input {
  background: rgba(20, 26, 28, 0.7);
}
:where(html[data-thema="avond"]) .iq-react {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.82), rgba(22, 28, 31, 0.65)) padding-box,
    var(--iri-spectrum) border-box;
}
:where(html[data-thema="avond"]) .quick-menu {
  box-shadow: 0 24px 60px rgba(31,38,135,.16), 0 0 40px rgba(0,106,102,.05), inset 0 0 18px rgba(255, 255, 255, 0.045);
}
:where(html[data-thema="avond"]) .qm-blob {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.8) 0%, rgba(22, 28, 31, 0.6) 100%);
  border: 1px solid rgba(36, 43, 46, 0.85);
  box-shadow: inset 0 0 10px rgba(255, 255, 255, 0.048), 0 4px 14px rgba(31,38,135,.07);
}
:where(html[data-thema="avond"]) .ai-canvas-recycle-banner {
  border-bottom: 1px solid rgba(255, 255, 255, 0.116);
  background: linear-gradient(90deg, rgba(34,139,34,.06), rgba(20, 38, 28, 0.18));
  background-color: rgba(20, 26, 28, 0.82);
  color: #84d4a4;
}
:where(html[data-thema="avond"]) .ai-canvas-recycle-banner.done {
  background: linear-gradient(90deg, rgba(15,157,119,.06), rgba(20, 38, 28, 0.2));
  background-color: rgba(20, 26, 28, 0.82);
  color: #70e5bd;
}
:where(html[data-thema="avond"]) .recycle-cap {
  color: #84d4a4;
}
:where(html[data-thema="avond"]) .recycle-tool {
  background: rgba(255, 255, 255, 0.098);
  color: #70efea;
}
:where(html[data-thema="avond"]) .ai-canvas-verify-banner {
  border-bottom: 1px solid rgba(255, 255, 255, 0.116);
}
:where(html[data-thema="avond"]) .ai-canvas-verify-banner.checking {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.054), rgba(22, 32, 43, 0.2));
  background-color: rgba(20, 26, 28, 0.82);
  color: #6ee7ef;
}
:where(html[data-thema="avond"]) .ai-canvas-verify-banner.issues {
  background: linear-gradient(90deg, rgba(220,160,40,.06), rgba(37, 33, 19, 0.25));
  background-color: rgba(20, 26, 28, 0.82);
  color: #dcbf75;
}
:where(html[data-thema="avond"]) .ai-canvas-verify-banner.fixing {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.065), rgba(20, 38, 28, 0.2));
  background-color: rgba(20, 26, 28, 0.82);
  color: #6ee7ef;
}
:where(html[data-thema="avond"]) .ai-canvas-verify-banner.passed,
:where(html[data-thema="avond"]) .ai-canvas-verify-banner.fixed {
  background: linear-gradient(90deg, rgba(15,157,119,.06), rgba(20, 38, 28, 0.2));
  background-color: rgba(20, 26, 28, 0.82);
  color: #70e5bd;
}
:where(html[data-thema="avond"]) .ai-canvas-verify-banner.partial,
:where(html[data-thema="avond"]) .ai-canvas-verify-banner.fix_failed,
:where(html[data-thema="avond"]) .ai-canvas-verify-banner.fix_error {
  background: linear-gradient(90deg, rgba(200,60,40,.05), rgba(42, 26, 22, 0.2));
  background-color: rgba(20, 26, 28, 0.82);
  color: #d58472;
}
:where(html[data-thema="avond"]) .ai-canvas-retry {
  color: #5fedbe;
}
:where(html[data-thema="avond"]) .think-frag.code {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .think-frag.code code {
  color: #d0d6dc;
}
:where(html[data-thema="avond"]) .think-frag.header {
  color: var(--accent, #70efea);
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .code-section-marker {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(22, 32, 43, 0.2));
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: var(--accent, #70efea);
}
:where(html[data-thema="avond"]) .code-section-marker[data-section="ADMIN"]::before {
  background: #422d57;
}
:where(html[data-thema="avond"]) .files-empty {
  color: #a6acaf;
}
:where(html[data-thema="avond"]) .files-folder {
  color: #d0d6dc;
}
:where(html[data-thema="avond"]) .files-folder-icon::before {
  background: linear-gradient(135deg, #16202b, #14261c);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .files-folder-icon::after {
  background: linear-gradient(135deg, #16202b, #14261c);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .files-file {
  background: rgba(20, 26, 28, 0.55);
  color: #d0d6dc;
}
:where(html[data-thema="avond"]) .files-file:hover:not(.disabled) {
  background: rgba(20, 26, 28, 0.85);
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .file-icon.html {
  color: #6de1c2;
}
:where(html[data-thema="avond"]) .file-icon.js {
  color: #9a7aba;
}
:where(html[data-thema="avond"]) .files-file-meta {
  color: #a6acaf;
}
:where(html[data-thema="avond"]) .file-status.server {
  background: #422d57;
}
:where(html[data-thema="avond"]) .files-viewer-head {
  border-bottom: 1px solid rgba(255, 255, 255, 0.116);
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .files-viewer-name {
  color: var(--accent, #70efea);
}
:where(html[data-thema="avond"]) .files-viewer-close {
  color: #a6acaf;
}
:where(html[data-thema="avond"]) .files-viewer-close:hover {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .files-viewer-code {
  color: #d0d6dc;
}
:where(html[data-thema="avond"]) .ai-canvas-tabs button#canvas-tab-files.active {
  color: var(--accent, #70efea);
}
:where(html[data-thema="avond"]) .ai-canvas-think-stream::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.12);
}
@media (max-width: 759px) {
:where(html[data-thema="avond"]) .ai-canvas.tab-files .ai-canvas-files {
  background: var(--bg, #161c1e);
}
}
:where(html[data-thema="avond"]) .ai-canvas-preview-overlay {
  background: rgba(20, 26, 28, 0.97);
}
:where(html[data-thema="avond"]) .preview-overlay-bar button {
  background: rgba(20, 26, 28, 0.8);
}
:where(html[data-thema="avond"]) .ai-canvas-preview-overlay iframe {
  background: #141a1c;
}
:where(html[data-thema="avond"]) .ai-canvas-preview-wait {
  background: rgba(20, 26, 28, 0.9);
}
:where(html[data-thema="avond"]) .ai-canvas-preview-btn {
  background: rgba(20, 26, 28, 0.7);
}
:where(html[data-thema="avond"]) .ai-canvas-retry {
  background: rgba(20, 26, 28, 0.8);
}
:where(html[data-thema="avond"]) .think-frag.code {
  background: rgba(255, 255, 255, 0.076);
  color: #92c5c2;
}
:where(html[data-thema="avond"]) .chat-fab {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.88) 0%, rgba(22, 28, 31, 0.78) 100%) padding-box,
    var(--iri-spectrum) border-box;
  box-shadow: 0 8px 28px rgba(0,106,102,.15), inset 0 0 12px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .chat-fab:hover {
  box-shadow: 0 12px 36px rgba(0,106,102,.2), 0 0 20px rgba(255, 255, 255, 0.03), inset 0 0 14px rgba(255, 255, 255, 0.048);
}
:where(html[data-thema="avond"]) .chat-panel {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.92) 0%, rgba(22, 28, 31, 0.82) 100%) padding-box,
    var(--iri-spectrum) border-box;
  box-shadow: 0 30px 60px rgba(0,0,0,.06), 0 0 40px rgba(0,106,102,.04), inset 0 0 20px rgba(255, 255, 255, 0.051);
}
:where(html[data-thema="avond"]) .chat-sidebar {
  background: linear-gradient(180deg, rgba(20, 26, 28, 0.6) 0%, rgba(22, 28, 31, 0.4) 100%);
}
:where(html[data-thema="avond"]) .chat-sidebar-btn {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .chat-sidebar-btn:hover {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-sidebar-search input {
  background: rgba(20, 26, 28, 0.7);
}
:where(html[data-thema="avond"]) .chat-sidebar-search input:focus {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-sidebar-list::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .chat-sidebar-item:hover {
  background: rgba(20, 26, 28, 0.7);
}
:where(html[data-thema="avond"]) .chat-sidebar-item.active {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-panel-bar {
  background: rgba(20, 26, 28, 0.5);
}
:where(html[data-thema="avond"]) .chat-kicker {
  color: rgba(117, 232, 240, 0.6);
}
:where(html[data-thema="avond"]) .chat-header-btn {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .chat-header-btn:hover {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-header-btn.active {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-panel-close {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .chat-convos {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.96), rgba(22, 28, 31, 0.92));
}
:where(html[data-thema="avond"]) .chat-convos-close-btn {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .chat-convos-close-btn:hover {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-convos-list::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .chat-convo-item:hover {
  background: rgba(20, 26, 28, 0.7);
}
:where(html[data-thema="avond"]) .chat-convo-item.active {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-messages::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .chat-suggestion {
  background: rgba(20, 26, 28, 0.7);
}
:where(html[data-thema="avond"]) .chat-suggestion:hover {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-msg.assistant .chat-msg-bubble {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.85), rgba(22, 28, 31, 0.7));
  border: 1px solid rgba(36, 43, 46, 0.6);
  box-shadow: 0 2px 12px rgba(31,38,135,.04), inset 0 0 10px rgba(255, 255, 255, 0.036);
}
:where(html[data-thema="avond"]) .chat-msg.assistant .chat-msg-bubble code {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .chat-msg.assistant .chat-msg-bubble pre {
  background: rgba(255, 255, 255, 0.054);
}
:where(html[data-thema="avond"]) .chat-block-tool {
  background: rgba(255, 255, 255, 0.054);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-block-tool:hover {
  background: rgba(255, 255, 255, 0.098);
}
:where(html[data-thema="avond"]) .chat-block-think {
  border: 1px solid rgba(255, 255, 255, 0.116);
  background: rgba(22, 28, 31, 0.5);
}
:where(html[data-thema="avond"]) .chat-block-think-head:hover {
  background: rgba(255, 255, 255, 0.054);
}
:where(html[data-thema="avond"]) .chat-code-copy {
  background: rgba(20, 26, 28, 0.8);
}
:where(html[data-thema="avond"]) .chat-code-copy:hover {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-tool-indicator {
  background: rgba(20, 26, 28, 0.5);
}
:where(html[data-thema="avond"]) .chat-tool-spinner {
  border: 1.5px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-input-area {
  background: rgba(20, 26, 28, 0.5);
}
:where(html[data-thema="avond"]) .chat-input-area textarea:focus-visible {
  border-color: rgba(255, 255, 255, 0.14);
  background: #141a1c;
}
:where(html[data-thema="avond"]) .chat-attach-btn {
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .chat-attach-btn:hover {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-attach-item {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.85), rgba(22, 28, 31, 0.7));
}
:where(html[data-thema="avond"]) .chat-attach-item-thumb {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .chat-attach-item-icon {
  background: rgba(255, 255, 255, 0.098);
}
:where(html[data-thema="avond"]) .chat-msg-attachment {
  background: rgba(255, 255, 255, 0.054);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .chat-msg-attachment:hover {
  background: rgba(255, 255, 255, 0.098);
}
:where(html[data-thema="avond"]) .chat-messages.drag-over::after {
  background: rgba(22, 28, 31, 0.9);
}
:where(html[data-thema="avond"]) .mia-ctx {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.95) 0%, rgba(22, 28, 31, 0.9) 100%) padding-box,
    var(--iri-spectrum) border-box;
  box-shadow: 0 16px 48px rgba(0,0,0,.1), 0 0 24px rgba(0,106,102,.06),
    inset 0 0 12px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .mia-ctx-mia-input textarea {
  background: rgba(20, 26, 28, 0.7);
}
:where(html[data-thema="avond"]) .mia-ctx-mia-input textarea:focus {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .clipboard-indicator {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.95), rgba(22, 28, 31, 0.9));
}
:where(html[data-thema="avond"]) .clipboard-indicator-clear {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .mia-undo-toast {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.95), rgba(22, 28, 31, 0.9));
}
:where(html[data-thema="avond"]) .mia-add-dialog {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.95) 0%, rgba(22, 28, 31, 0.9) 100%) padding-box,
    var(--iri-spectrum) border-box;
  box-shadow: 0 16px 48px rgba(0,0,0,.1), 0 0 24px rgba(0,106,102,.06),
    inset 0 0 12px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .mia-add-dialog textarea {
  background: rgba(20, 26, 28, 0.7);
}
:where(html[data-thema="avond"]) .mia-add-dialog textarea:focus {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .shortcut-badge {
  border: 2px solid rgba(36, 43, 46, 0.9);
}
:where(html[data-thema="avond"]) #home.drop-highlight::after {
  background: rgba(20, 26, 28, 0.85);
}
:where(html[data-thema="avond"]) .chat-ctx-save-inner {
  background: var(--glass-strong, rgba(20, 26, 28, 0.92));
  border: 1px solid var(--line-soft, rgba(48, 58, 62, 0.3));
}
:where(html[data-thema="avond"]) .chat-ctx-save-label {
  color: var(--text-dim, #aeb4b6);
}
:where(html[data-thema="avond"]) .chat-ctx-close {
  color: var(--text-dim, #aeb4b6);
}
:where(html[data-thema="avond"]) .chat-ctx-close:hover {
  color: var(--warn, #cb6d67);
}
:where(html[data-thema="avond"]) .qm-input {
  background: rgba(20, 26, 28, 0.5);
}
:where(html[data-thema="avond"]) .qm-color-btn.active {
  border-color: #242b2e;
  box-shadow: 0 0 8px rgba(255, 255, 255, 0.018);
}
:where(html[data-thema="avond"]) .mia-media-prompt {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .mia-media-skip {
  background: rgba(20, 26, 28, 0.5);
}
:where(html[data-thema="avond"]) .mia-media-skip:hover {
  background: rgba(20, 26, 28, 0.8);
}
:where(html[data-thema="avond"]) .qm-upload-btn {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .qm-upload-btn:hover {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .queue-manager {
  background: var(--bio-surface,rgba(24, 30, 33, 0.85));
  border: 1px solid var(--line-soft,rgba(255, 255, 255, 0.116));
}
:where(html[data-thema="avond"]) .qm-win-bar {
  border-bottom: 1px solid var(--line-soft,rgba(255, 255, 255, 0.092));
}
:where(html[data-thema="avond"]) .qm-win-bar-left {
  color: var(--accent,#6ee7ef);
}
:where(html[data-thema="avond"]) .qm-win-btn {
  color: var(--text,#d0dbdc);
}
:where(html[data-thema="avond"]) .qm-win-btn:hover {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .qm-tab {
  color: var(--text-dim,#afb5b7);
}
:where(html[data-thema="avond"]) .qm-tab.active {
  background: rgba(255, 255, 255, 0.098);
  color: var(--accent,#6ee7ef);
}
:where(html[data-thema="avond"]) .qm-tab:hover:not(.active) {
  background: rgba(255, 255, 255, 0.043);
}
:where(html[data-thema="avond"]) .qm-force-stop {
  color: var(--warn,#d96559);
}
:where(html[data-thema="avond"]) .qm-job {
  border: 1px solid var(--line-soft,rgba(255, 255, 255, 0.092));
  background: rgba(20, 26, 28, 0.4);
}
:where(html[data-thema="avond"]) .qm-job:hover {
  background: rgba(20, 26, 28, 0.7);
}
:where(html[data-thema="avond"]) .qm-job-error {
  color: var(--warn,#d96559);
}
:where(html[data-thema="avond"]) .qm-job-stop {
  color: #d96559;
}
:where(html[data-thema="avond"]) .qm-job-retry {
  background: rgba(255, 255, 255, 0.098);
}
:where(html[data-thema="avond"]) .qm-job.qm-open:hover {
  background: rgba(20, 26, 28, 0.85);
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .qm-job-view {
  background: rgba(255, 255, 255, 0.098);
  color: var(--accent,#6ee7ef);
}
:where(html[data-thema="avond"]) .qm-input {
  color: var(--text,#d0dbdc) !important;
}
:where(html[data-thema="avond"]) .worklog-panel {
  background: rgba(22, 28, 30, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .wl-bar {
  border-bottom: 1px solid rgba(255, 255, 255, 0.116);
}
:where(html[data-thema="avond"]) .wl-btn:hover {
  background: rgba(255, 255, 255, 0.098);
}
:where(html[data-thema="avond"]) .wl-date-label {
  background: rgba(22, 28, 30, 0.95);
}
:where(html[data-thema="avond"]) .wl-entry {
  background: rgba(255, 255, 255, 0.043);
  border: 1px solid rgba(255, 255, 255, 0.092);
}
:where(html[data-thema="avond"]) .wl-entry:hover {
  background: rgba(255, 255, 255, 0.076);
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .wl-entry-err {
  color: #c96d6d;
}
:where(html[data-thema="avond"]) .wl-entry-actions button {
  background: rgba(255, 255, 255, 0.076);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .wl-entry-actions button:hover {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .wl-entry-del:hover {
  color: #c96d6d !important;
}
:where(html[data-thema="avond"]) .wl-ask {
  border-top: 1px solid rgba(255, 255, 255, 0.116);
}
:where(html[data-thema="avond"]) .wl-ask-input textarea {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .wl-note-form {
  background: rgba(255, 255, 255, 0.054);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .wl-note-input {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(20, 26, 28, 0.6);
}
:where(html[data-thema="avond"]) .wl-note-actions button {
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .wl-resize::after {
  border-right: 2px solid rgba(255, 255, 255, 0.14);
  border-bottom: 2px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .window-btns .debug-console-btn.has-errors {
  color: #d26161;
}
:where(html[data-thema="avond"]) .dbg-sidebar {
  background: rgba(22, 28, 30, 0.95);
  border-left: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .dbg-sidebar-resize:hover,
:where(html[data-thema="avond"]) .dbg-sidebar-resize:active {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .dbg-detached-panel {
  background: rgba(22, 28, 30, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .dbg-head {
  border-bottom: 1px solid rgba(255, 255, 255, 0.116);
}
:where(html[data-thema="avond"]) .dbg-btn:hover {
  background: rgba(255, 255, 255, 0.098);
}
:where(html[data-thema="avond"]) .dbg-filters {
  border-bottom: 1px solid rgba(255, 255, 255, 0.092);
}
:where(html[data-thema="avond"]) .dbg-filter-btn {
  background: rgba(255, 255, 255, 0.054);
  border: 1px solid rgba(255, 255, 255, 0.116);
}
:where(html[data-thema="avond"]) .dbg-filter-btn:hover {
  background: rgba(255, 255, 255, 0.098);
}
:where(html[data-thema="avond"]) .dbg-filter-btn.active {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .dbg-entry:hover {
  background: rgba(255, 255, 255, 0.054);
}
:where(html[data-thema="avond"]) .dbg-log {
  border-left-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .dbg-dot-log {
  background: #2d383d;
}
:where(html[data-thema="avond"]) .dbg-entry-fix {
  background: rgba(255, 255, 255, 0.098);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .dbg-entry-fix:hover {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .dbg-error .dbg-entry-msg {
  color: #c96d6d;
}
:where(html[data-thema="avond"]) .dbg-warn  .dbg-entry-msg {
  color: #e5bf64;
}
:where(html[data-thema="avond"]) .dbg-info  .dbg-entry-msg {
  color: #64caee;
}
:where(html[data-thema="avond"]) .dbg-entry-stack {
  background: rgba(255, 255, 255, 0.054);
}
:where(html[data-thema="avond"]) .dbg-actions-bar {
  border-top: 1px solid rgba(255, 255, 255, 0.116);
}
:where(html[data-thema="avond"]) .dbg-fix-all {
  background: rgba(255, 255, 255, 0.076);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .dbg-fix-all:hover {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .dbg-resize::after {
  border-right: 2px solid rgba(255, 255, 255, 0.14);
  border-bottom: 2px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .files-panel-close {
  color: var(--text-dim, #a6acaf);
}
:where(html[data-thema="avond"]) .files-panel-close:hover {
  background: rgba(255, 255, 255, 0.076);
  color: var(--accent, #70efea);
}
:where(html[data-thema="avond"]) .live-settings {
  background: rgba(20, 26, 28, 0.45);
}
:where(html[data-thema="avond"]) .live-settings:hover {
  background: #141a1c;
}
:where(html[data-thema="avond"]) .aps-overlay {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .aps {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.94) 0%, rgba(22, 28, 31, 0.88) 100%) padding-box,
    var(--iri-spectrum) border-box;
}
:where(html[data-thema="avond"]) .aps-close {
  background: rgba(20, 26, 28, 0.5);
}
:where(html[data-thema="avond"]) .aps-close:hover {
  background: #141a1c;
}
:where(html[data-thema="avond"]) .aps-btn.ghost {
  background: rgba(20, 26, 28, 0.5);
}
:where(html[data-thema="avond"]) .aps-btn.ghost.danger {
  color: #d7746e;
}
:where(html[data-thema="avond"]) .aps-btn.ghost.danger:hover {
  background: #141a1c;
  color: #d7746e;
}
:where(html[data-thema="avond"]) .aps-dns-h {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .aps-err {
  color: #d7746e;
}
:where(html[data-thema="avond"]) .aps-slider {
  background: rgba(53, 67, 73, 0.35);
}
:where(html[data-thema="avond"]) .aps-slider::before {
  background: #141a1c;
}
:where(html[data-thema="avond"]) .cr-toast {
  border: 1px solid rgba(36, 43, 46, 0.12);
}
:where(html[data-thema="avond"]) .wa-banner {
  background: linear-gradient(90deg, rgba(37,211,102,.16), rgba(255, 255, 255, 0.12));
  color: var(--ink, #a2c4c7);
}
:where(html[data-thema="avond"]) .wa-banner-ico {
  color: #71d697;
}
:where(html[data-thema="avond"]) .wa-banner-later,
:where(html[data-thema="avond"]) .wa-banner-stop {
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .wa-banner-later:hover,
:where(html[data-thema="avond"]) .wa-banner-stop:hover {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .pwa-update {
  border: 1px solid rgba(36, 43, 46, 0.65);
}
:where(html[data-thema="avond"]) .pwa-install {
  border: 1px solid rgba(36, 43, 46, 0.65);
}
:where(html[data-thema="avond"]) .pwa-install-x:hover {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .pwa-push-ask {
  border: 1px solid rgba(36, 43, 46, 0.65);
}
:where(html[data-thema="avond"]) #pwa-push-no {
  background: rgba(255, 255, 255, 0.065);
}
:where(html[data-thema="avond"]) #pwa-push-no:hover {
  background: rgba(255, 255, 255, 0.109);
}
:where(html[data-thema="avond"]) .pwa-ios-sheet {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) body::before {
  background: radial-gradient(circle at 40% 40%, rgba(0,191,201,.13), rgba(22, 32, 43, 0.1) 45%, transparent 70%);
}
:where(html[data-thema="avond"]) body::after {
  background: radial-gradient(circle at 60% 60%, rgba(44, 22, 32, 0.14), rgba(20, 38, 28, 0.1) 50%, transparent 72%);
}
:where(html[data-thema="avond"]) .menubar {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.72) 0%, rgba(22, 28, 31, 0.55) 100%) padding-box,
    linear-gradient(120deg, rgba(44, 22, 32, 0.55), rgba(20, 38, 28, 0.55), rgba(22, 32, 43, 0.55), rgba(33, 23, 45, 0.55)) border-box;
  box-shadow: 0 10px 30px rgba(31,38,135,.07), inset 0 0 14px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .menubar-home svg {
  box-shadow: 0 4px 12px rgba(0,106,102,.25), inset 0 0 6px rgba(255, 255, 255, 0.018);
}
:where(html[data-thema="avond"]) .menubar-right {
  background: rgba(20, 26, 28, 0.4);
  box-shadow: inset 0 0 8px rgba(255, 255, 255, 0.036);
}
:where(html[data-thema="avond"]) .tab {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.62) 0%, rgba(22, 28, 31, 0.45) 100%);
  border: 1px solid rgba(36, 43, 46, 0.7);
  box-shadow: 0 4px 14px rgba(31,38,135,.05), inset 0 0 8px rgba(255, 255, 255, 0.033);
}
:where(html[data-thema="avond"]) .tab.active {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.92) 0%, rgba(22, 28, 31, 0.82) 100%) padding-box,
    var(--iri-spectrum) border-box;
  box-shadow: 0 6px 18px rgba(0,106,102,.1), inset 0 0 10px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .app-tile .app-icon::after {
  background: conic-gradient(from 210deg,
    transparent 0 62%, rgba(44, 22, 32, 0.28) 70%, rgba(22, 32, 43, 0.3) 78%,
    rgba(20, 38, 28, 0.26) 86%, transparent 94%);
}
:where(html[data-thema="avond"]) .app-tile-name {
  text-shadow: 0 1px 6px rgba(255, 255, 255, 0.054), 0 0 12px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .app-tile:hover .app-tile-name,
:where(html[data-thema="avond"]) .app-tile:focus-visible .app-tile-name {
  background: rgba(20, 26, 28, 0.55);
}
:where(html[data-thema="avond"]) .page-dot {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .wa-banner {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.9), rgba(23, 30, 32, 0.85));
}
@media (hover: none) {
:where(html[data-thema="avond"]) .app-tile:active .app-icon {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.9) 0%, rgba(19, 36, 34, 0.7) 100%) !important;
  box-shadow: 0 8px 32px rgba(0,106,102,.1), inset 0 0 20px rgba(255, 255, 255, 0.054);
}
}
@media (hover: none) {
:where(html[data-thema="avond"]) .dock-item:active {
  border-color: rgba(33, 46, 62, 0.9);
}
}
@media (hover: none) {
:where(html[data-thema="avond"]) .tab:active:not(.active) {
  background: rgba(20, 26, 28, 0.7);
}
}
@media (hover: none) {
:where(html[data-thema="avond"]) .live-link:active {
  background: rgba(20, 26, 28, 0.8);
}
}
:where(html[data-thema="avond"]) .cc-sheet {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .cc-card {
  background: linear-gradient(180deg, rgba(20, 26, 28, 0.94), rgba(22, 28, 31, 0.9)) padding-box,
    var(--iri-spectrum) border-box;
}
:where(html[data-thema="avond"]) .cc-grab {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .cc-stat {
  background: rgba(20, 26, 28, 0.6);
  border: 1px solid rgba(36, 43, 46, 0.8);
  box-shadow: inset 0 0 10px rgba(255, 255, 255, 0.042), 0 2px 8px rgba(31,38,135,.04);
}
:where(html[data-thema="avond"]) .cc-actions button {
  background: rgba(20, 26, 28, 0.7);
}
:where(html[data-thema="avond"]) .cc-actions button:active {
  background: rgba(20, 26, 28, 0.95);
}
:where(html[data-thema="avond"]) .chat-panel-bar {
  background: rgba(20, 26, 28, 0.4);
}
:where(html[data-thema="avond"]) .chat-input-area {
  background: rgba(20, 26, 28, 0.42);
}
:where(html[data-thema="avond"]) .chat-msg.assistant .chat-msg-bubble {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.85), rgba(22, 28, 31, 0.7));
  border: 1px solid rgba(36, 43, 46, 0.8);
  box-shadow: 0 4px 14px rgba(31,38,135,.05), inset 0 0 10px rgba(255, 255, 255, 0.036);
}
@media (max-width: 759px) {
:where(html[data-thema="avond"]) .chat-panel {
  background: linear-gradient(165deg, rgba(20, 26, 28, 0.97) 0%, rgba(22, 28, 31, 0.94) 100%);
}
}
@media (hover: none) {
:where(html[data-thema="avond"]) .chat-header-btn:active,
:where(html[data-thema="avond"]) .chat-attach-btn:active,
:where(html[data-thema="avond"]) .chat-convos-close-btn:active {
  border-color: rgba(255, 255, 255, 0.14);
}
}
@media (hover: none) {
:where(html[data-thema="avond"]) .chat-suggestion:active {
  border-color: rgba(255, 255, 255, 0.14);
}
}
@media (max-width: 759px) {
:where(html[data-thema="avond"]) .window.maximized .window-bar {
  background: linear-gradient(180deg, rgba(20, 26, 28, 0.97), rgba(22, 28, 30, 0.94));
}
}
@media (max-width: 759px) {
:where(html[data-thema="avond"]) .window.maximized {
  background: #171d1f;
}
}
:where(html[data-thema="avond"]) .lang-sw {
  background: rgba(255, 255, 255, 0.065);
}
:where(html[data-thema="avond"]) .menubar-right #btn-logout::before {
  background: rgba(255, 255, 255, 0.109);
}
:where(html[data-thema="avond"]) .mia-launcher-fab {
  border: 1px solid rgba(36, 43, 46, 0.35);
  box-shadow: 0 12px 30px rgba(0,106,102,.32), inset 0 0 12px rgba(255, 255, 255, 0.011);
}
:where(html[data-thema="avond"]) .mia-launcher-fab:hover {
  box-shadow: 0 16px 38px rgba(0,106,102,.4), 0 0 24px rgba(255, 255, 255, 0.036);
}
:where(html[data-thema="avond"]) .mia-launcher-item {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.93) 0%, rgba(22, 28, 31, 0.83) 100%) padding-box,
    var(--iri-spectrum) border-box;
  box-shadow: 0 8px 24px rgba(0,106,102,.14), inset 0 0 12px rgba(255, 255, 255, 0.042);
}
:where(html[data-thema="avond"]) .mia-li-ic {
  box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.018);
}
@media (max-width: 759px) {
:where(html[data-thema="avond"]) .ai-canvas.preview-open .ai-canvas-preview-overlay {
  background: #141a1c;
}
}
@media (max-width: 759px) {
:where(html[data-thema="avond"]) .ai-canvas.preview-open .preview-overlay-bar button {
  background: rgba(20, 26, 28, 0.82);
  border-color: rgba(48, 58, 62, 0.6);
}
}
:where(html[data-thema="avond"]) .connect-panel {
  background: rgba(20, 26, 28, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #96b4d2;
}
:where(html[data-thema="avond"]) .connect-panel .cn-title {
  color: #70efea;
}
:where(html[data-thema="avond"]) .connect-panel .cn-back,
:where(html[data-thema="avond"]) .connect-panel .cn-x {
  background: rgba(255, 255, 255, 0.098);
  color: #75d7f0;
}
:where(html[data-thema="avond"]) .connect-panel .cn-back:hover,
:where(html[data-thema="avond"]) .connect-panel .cn-x:hover {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .connect-panel .cn-lead {
  color: #b4bec7;
}
:where(html[data-thema="avond"]) .connect-panel .cn-foot {
  color: #9da4a6;
}
:where(html[data-thema="avond"]) .connect-panel .cn-ro {
  color: #a9b4bf;
}
:where(html[data-thema="avond"]) .connect-panel .cn-id {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .connect-panel .cn-id-label {
  color: #a3a9ac;
}
:where(html[data-thema="avond"]) .connect-panel .cn-handle {
  color: #72efea;
}
:where(html[data-thema="avond"]) .connect-panel .cn-ghost {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: #141a1c;
  color: #75d7f0;
}
:where(html[data-thema="avond"]) .connect-panel .cn-ghost:hover {
  background: #171e20;
}
:where(html[data-thema="avond"]) .connect-panel .cn-item:hover {
  background: rgba(255, 255, 255, 0.087);
}
:where(html[data-thema="avond"]) .connect-panel .cn-sub {
  color: #9da4a6;
}
:where(html[data-thema="avond"]) .connect-panel .cn-empty {
  border: 1px dashed rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .connect-panel .cn-empty b {
  color: #75d7f0;
}
:where(html[data-thema="avond"]) .connect-panel .cn-empty p {
  color: #a4aaad;
}
:where(html[data-thema="avond"]) .connect-panel .cn-btn-sec {
  background: rgba(255, 255, 255, 0.12);
  color: #75d7f0;
}
:where(html[data-thema="avond"]) .connect-panel .cn-btn-sec:hover {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .connect-panel input {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: #141a1c;
}
:where(html[data-thema="avond"]) .connect-panel .cn-code-box {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .connect-panel .cn-code {
  color: #72efea;
}
:where(html[data-thema="avond"]) .connect-panel .cn-steps {
  color: #a9b4bf;
}
:where(html[data-thema="avond"]) .connect-panel .cn-pill.ok {
  color: #79e4cd;
}
:where(html[data-thema="avond"]) .connect-panel .cn-pill.off {
  background: rgba(54, 70, 75, 0.15);
  color: #aeb3b5;
}
:where(html[data-thema="avond"]) .connect-panel .cn-block {
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .connect-panel .cn-block-t {
  color: #a3a9ac;
}
:where(html[data-thema="avond"]) .connect-panel .cn-sw:hover {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .connect-panel .cn-sw-txt span {
  color: #9da4a6;
}
:where(html[data-thema="avond"]) .connect-panel .cn-knob {
  background: rgba(53, 67, 73, 0.28);
}
:where(html[data-thema="avond"]) .connect-panel .cn-knob::after {
  background: #141a1c;
}
:where(html[data-thema="avond"]) .connect-panel .cn-danger {
  background: #141a1c;
  color: #d08076;
}
:where(html[data-thema="avond"]) .connect-panel .cn-msg {
  color: #70efea;
}
:where(html[data-thema="avond"]) .connect-panel .cn-msg.bad {
  color: #d08076;
}
:where(html[data-thema="avond"]) .connect-panel select,
:where(html[data-thema="avond"]) .connect-panel textarea {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: #141a1c;
}
:where(html[data-thema="avond"]) .connect-panel .cb-item {
  border-left: 2px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .connect-panel .cb-item-res {
  color: #9da4a6;
}
:where(html[data-thema="avond"]) .connect-panel .cb-item-upd {
  border-left: 2px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .connect-panel .cb-item-res.bad {
  color: #d08076;
}
:where(html[data-thema="avond"]) .connect-panel .cb-preview {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: #141a1c;
}
:where(html[data-thema="avond"]) .connect-panel .cb-preview #cb-empty {
  background: rgba(255, 255, 255, 0.054);
}
:where(html[data-thema="avond"]) .connect-panel #cb-frame {
  background: #141a1c;
}
:where(html[data-thema="avond"]) .app-tile .app-icon {
  background: linear-gradient(135deg, rgba(20, 26, 28, 0.92) 0%, rgba(22, 28, 31, 0.86) 100%) !important;
}
:where(html[data-thema="avond"]) .pw-spot:focus-visible {
  outline: 2px solid #39331f;
}
:where(html[data-thema="avond"]) .pw-naam {
  color: #d0ccd9;
  background: rgba(24, 30, 33, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) #btn-pixelview.active {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) #pw-volg {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(24, 30, 33, 0.9);
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) #pw-volg:hover {
  background: #252113;
}
:where(html[data-thema="avond"]) .pw-stad {
  background: rgba(24, 30, 33, 0.88);
}
:where(html[data-thema="avond"]) .pw-stad:hover,
:where(html[data-thema="avond"]) .pw-stad:focus-visible {
  background: #141a1c;
  outline: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .pw-stad strong {
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) .pw-stad span {
  color: rgba(208, 204, 217, 0.65);
}
:where(html[data-thema="avond"]) .pw-stad span.bezig {
  color: #eec069;
  background: #252113;
}
:where(html[data-thema="avond"]) .pw-stad span.week {
  color: #8acad0;
  background: rgba(44, 86, 80, 0.16);
}
:where(html[data-thema="avond"]) .pw-greep-rb::before {
  border-right: 2px solid rgba(255, 255, 255, 0.14);
  border-bottom: 2px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .pw-greep-r:hover,
:where(html[data-thema="avond"]) .pw-greep-b:hover,
:where(html[data-thema="avond"]) .pw-greep-rb:hover {
  background: rgba(44, 86, 80, 0.14);
}
:where(html[data-thema="avond"]) #pw-stadhuis {
  background: rgba(24, 30, 33, 0.98);
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) .pw-sh-kpi {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .pw-sh-kpi span {
  color: rgba(208, 204, 217, 0.6);
}
:where(html[data-thema="avond"]) .pw-sh-kopje {
  color: rgba(208, 204, 217, 0.55);
}
:where(html[data-thema="avond"]) .pw-sh-leeg {
  color: rgba(208, 204, 217, 0.7);
}
:where(html[data-thema="avond"]) .pw-sh-uitleg {
  color: rgba(208, 204, 217, 0.7);
}
:where(html[data-thema="avond"]) .pw-sh-wet {
  background: #141a1c;
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) .pw-sh-wet:focus {
  outline: 2px solid rgba(53, 98, 91, 0.5);
}
:where(html[data-thema="avond"]) .pw-sh-opslaan {
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .pw-sh-status {
  color: #8acad0;
}
:where(html[data-thema="avond"]) .pw-k-art {
  background: rgba(44, 86, 80, 0.12);
  border-color: rgba(53, 98, 91, 0.4);
}
:where(html[data-thema="avond"]) .pw-quest {
  background: rgba(24, 30, 33, 0.82);
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) .pw-quest.bezig {
  background: #252113;
}
:where(html[data-thema="avond"]) .pw-quest:hover {
  background: #141a1c;
}
:where(html[data-thema="avond"]) .pw-stip:hover,
:where(html[data-thema="avond"]) .pw-stip:focus-visible {
  outline: 2px solid rgba(57, 51, 31, 0.9);
}
:where(html[data-thema="avond"]) .pw-bubbel {
  background: #141a1c;
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) .pw-bubbel::after {
  background: #141a1c;
}
:where(html[data-thema="avond"]) #pw-kaartje {
  background: rgba(24, 30, 33, 0.98);
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) .pw-k-status {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .pw-k-status.st-ok {
  background: rgba(46, 89, 56, 0.16);
  color: #85d2a7;
}
:where(html[data-thema="avond"]) .pw-k-status.st-aandacht {
  background: #252113;
  color: #eec069;
}
:where(html[data-thema="avond"]) .pw-k-status.st-vraag {
  color: #7b93cc;
}
:where(html[data-thema="avond"]) .pw-k-status.st-bezig {
  background: #252113;
  color: #eec069;
}
:where(html[data-thema="avond"]) .pw-k-dicht {
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) .pw-k-meta {
  color: rgba(208, 204, 217, 0.7);
}
:where(html[data-thema="avond"]) .pw-k-intro {
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) .pw-k-uitkomst {
  border-left: 3px solid #3f4c50;
  background: rgba(255, 255, 255, 0.065);
}
:where(html[data-thema="avond"]) .pw-k-uitkomst.st-ok {
  border-left-color: #366341;
  background: rgba(46, 89, 56, 0.09);
}
:where(html[data-thema="avond"]) .pw-k-uitkomst-kop {
  color: rgba(208, 204, 217, 0.55);
}
:where(html[data-thema="avond"]) .pw-k-stap {
  background: rgba(255, 255, 255, 0.098);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .pw-k-tl::before {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .pw-tl-kop {
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) .pw-tl-kop:hover {
  background: rgba(255, 255, 255, 0.065);
}
:where(html[data-thema="avond"]) .pw-tl-mk {
  background: #181e21;
  border: 2px solid #3f4c50;
}
:where(html[data-thema="avond"]) .pw-tl.mia .pw-tl-mk {
  background: #2c5650;
}
:where(html[data-thema="avond"]) .pw-tl.stap .pw-tl-mk {
  border-color: rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .pw-tl-tm {
  color: rgba(208, 204, 217, 0.5);
}
:where(html[data-thema="avond"]) .pw-tl-chip {
  background: rgba(255, 255, 255, 0.098);
  color: rgba(208, 204, 217, 0.75);
}
:where(html[data-thema="avond"]) .pw-tl.mia .pw-tl-chip {
  background: rgba(44, 86, 80, 0.18);
  color: #8acad0;
}
:where(html[data-thema="avond"]) .pw-tl-cv {
  color: rgba(208, 204, 217, 0.45);
}
:where(html[data-thema="avond"]) .pw-tl-body {
  background: rgba(20, 26, 28, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
:where(html[data-thema="avond"]) .pw-tl-stap {
  color: rgba(208, 204, 217, 0.85);
}
:where(html[data-thema="avond"]) .pw-tl-stap.aanpassing {
  color: #8acad0;
}
:where(html[data-thema="avond"]) .pw-tl-laden {
  color: rgba(208, 204, 217, 0.6);
}
:where(html[data-thema="avond"]) .pw-kroniek::before {
  background: rgba(255, 255, 255, 0.12);
}
:where(html[data-thema="avond"]) .pw-kr-dag {
  color: rgba(208, 204, 217, 0.5);
}
:where(html[data-thema="avond"]) .pw-kr-rij {
  color: #d0ccd9;
}
:where(html[data-thema="avond"]) .pw-kr-rij:hover {
  background: rgba(255, 255, 255, 0.076);
}
:where(html[data-thema="avond"]) .pw-kr-mk {
  background: #181e21;
  border: 2px solid #3f4c50;
}
:where(html[data-thema="avond"]) .pw-kr-rij.st-ok .pw-kr-mk {
  border-color: #366341;
  background: #2e5938;
}
:where(html[data-thema="avond"]) .pw-kr-rij.st-bezig .pw-kr-mk {
  background: #2e2718;
}
:where(html[data-thema="avond"]) .pw-kr-tm {
  color: rgba(208, 204, 217, 0.5);
}
:where(html[data-thema="avond"]) .pw-kr-rij.wet .pw-kr-tt {
  color: #9a86c0;
}
@media (pointer: coarse) {
:where(html[data-thema="avond"]) .pw-stip:active {
  outline: 2px solid rgba(57, 51, 31, 0.95);
  background: rgba(37, 33, 19, 0.16);
}
}
@media (pointer: coarse) {
:where(html[data-thema="avond"]) .pw-quest:active {
  background: #141a1c;
}
}