/* WUMETAX HTML Lab design: reference assets/css/brand.css from wumetax-html-lab */
:root{--s-panel:#fff;--s-soft:#f9fafb;--s-ink:#111827;--s-muted:#4b5563;--s-line:#e5e7eb;--s-line2:#d1d5db;--s-blue:#3b82f6;--s-blue2:#2563eb}
html.dark{--s-panel:#1f2937;--s-soft:#253144;--s-ink:#f9fafb;--s-muted:#d1d5db;--s-line:#374151;--s-line2:#4b5563}
html,body,html.dark body{background:var(--s-panel)!important;color:var(--s-ink)!important;font-family:Outfit,"Noto Sans TC",system-ui,sans-serif!important}
button,input,textarea,select{font:inherit}
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #60a5fa!important;outline-offset:2px}
#top-bar{display:grid!important;grid-template-columns:auto minmax(210px,1fr) auto;grid-template-rows:70px 56px;grid-template-areas:"brand project utilities" "actions actions actions";height:126px!important;min-height:126px!important;width:100%;padding:0!important;gap:0 10px!important;background:#111827!important;border-bottom:3px solid #3b82f6!important;color:#fff!important;box-shadow:none!important;align-items:center!important}
#wb-brand{grid-area:brand;min-width:0!important;margin:0 0 0 18px!important;display:flex!important;align-items:center!important;gap:10px;color:white!important;text-decoration:none!important}
.wb-brand-symbol{width:44px!important;height:44px!important;min-width:44px;border-radius:6px!important;background:#3b82f6!important;color:#fff!important;display:grid;place-items:center;box-shadow:none!important;font-size:25px!important;font-weight:700}
.wb-brand-copy{min-width:0;display:flex;flex-direction:column;gap:3px;line-height:1.1}
.wb-brand-overline{font-size:10px!important;color:#93c5fd!important;font-weight:600;letter-spacing:.08em;white-space:nowrap}
.wb-brand-copy strong{font-size:16px!important;color:white!important;font-weight:700;white-space:nowrap}
#wb-projectbar{grid-area:project;display:flex!important;align-items:center!important;gap:9px!important;min-width:0!important}
#wb-utilities{grid-area:utilities;justify-self:end;display:flex!important;align-items:center!important;gap:5px!important;min-width:0!important;padding-right:14px}
#wb-actionbar{grid-area:actions;display:flex!important;align-items:center!important;gap:8px!important;justify-content:flex-start!important;width:100%;height:56px;padding:7px 18px;background:var(--s-soft)!important;color:var(--s-ink)!important;border-top:1px solid #374151;border-bottom:1px solid var(--s-line)}
#wb-actionbar:before{content:"WORKSPACE TOOLS";font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--s-muted);margin-right:9px;white-space:nowrap}
#top-bar .tool-btn,#top-bar .wb-search-trigger{display:inline-flex;align-items:center!important;justify-content:center!important;gap:6px!important;min-width:38px!important;min-height:38px!important;height:38px!important;padding:7px 10px!important;border-radius:6px!important;border:1px solid var(--s-line2)!important;background:var(--s-panel)!important;color:var(--s-ink)!important;box-shadow:none!important;font-size:12px!important}
#top-bar .tool-btn:hover,#top-bar .wb-search-trigger:hover{background:#eff6ff!important;color:#2563eb!important}
#top-bar .tool-btn:disabled{opacity:.4!important}
#wb-utilities .tool-btn,#wb-utilities .wb-search-trigger,#btn-open-projects{background:#1f2937!important;border-color:#374151!important;color:#fff!important}
#wb-utilities .tool-btn:hover,#wb-utilities .wb-search-trigger:hover{background:#374151!important;color:white!important}
#btn-open-smart,#btn-open-export{background:#3b82f6!important;border-color:#3b82f6!important;color:#fff!important}
#btn-open-smart svg,#btn-open-export svg{color:white!important;stroke:currentColor!important}
#btn-open-projects{white-space:nowrap!important}
#btn-open-projects svg{color:#93c5fd!important}
#project-name-input,#project-name-input:hover,#project-name-input:focus{width:clamp(130px,16vw,210px)!important;min-width:120px!important;font-size:15px!important;font-weight:700!important;color:#fff!important;opacity:1!important;background:transparent!important;border-color:transparent!important;letter-spacing:0!important}
#save-status-badge{border-radius:6px!important;background:#1f2937!important;border:1px solid #374151!important;color:#fff!important;min-width:0}
#save-text{display:inline!important;color:#fff!important;font-size:11px!important}
#save-dot{background:#60a5fa!important}
.wb-search-trigger kbd{display:none!important}
#left-toolbar,#right-inspector,#bottom-bar,html.dark #left-toolbar,html.dark #right-inspector,html.dark #bottom-bar{background:var(--s-panel)!important;color:var(--s-ink)!important;border-color:var(--s-line)!important;box-shadow:none!important}
#left-toolbar{width:106px!important;padding:12px 8px!important;gap:8px!important;align-items:stretch!important}
#left-toolbar .wb-toolbar-section{width:100%;display:flex!important;flex-direction:column!important;gap:4px!important;padding-bottom:9px!important;border-color:var(--s-line)!important}
#left-toolbar .wb-toolbar-label{color:var(--s-muted)!important;text-align:center!important;font-size:11px!important;font-weight:600}
#left-toolbar .wb-tool-entry{width:100%!important;min-height:56px!important;padding:7px 4px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:4px!important;flex-direction:column!important;background:transparent!important;border:1px solid transparent!important;border-radius:6px!important;color:var(--s-ink)!important;box-shadow:none!important}
#left-toolbar .wb-tool-entry:hover{background:var(--s-soft)!important;border-color:var(--s-line)!important;color:var(--s-blue2)!important}
#left-toolbar .wb-tool-entry.active{background:#eff6ff!important;color:#2563eb!important;border-color:#93c5fd!important;box-shadow:none!important}
#left-toolbar .wb-tool-entry svg,#left-toolbar .wb-tool-entry.active svg{width:19px!important;height:19px!important;color:currentColor!important;stroke:currentColor!important}
#left-toolbar .wb-tool-caption{font-size:12px!important;font-weight:600!important;color:inherit!important;white-space:normal!important;text-align:center!important}
#canvas-container{background:var(--s-soft)!important}
#wb-canvas-floating{left:14px!important;right:14px!important;top:14px!important;gap:8px!important;align-items:flex-start!important}
.wb-canvas-mode,.wb-canvas-shortcuts,#onboarding-toast,#floating-timer,#presentation-bar{background:var(--s-panel)!important;border:1px solid var(--s-line)!important;border-radius:6px!important;color:var(--s-ink)!important;box-shadow:none!important}
.wb-canvas-mode{padding:9px 12px!important;font-size:12px!important}
.wb-canvas-mode strong{font-size:13px!important;color:var(--s-ink)!important}
.wb-canvas-mode span:last-child{font-size:12px!important;color:var(--s-muted)!important}
.wb-mode-indicator{background:#3b82f6!important}
.wb-canvas-shortcuts{gap:4px!important;padding:5px!important}
.wb-canvas-shortcuts button{border-radius:6px!important;padding:7px 9px!important;font-size:12px!important;background:var(--s-soft)!important;color:var(--s-ink)!important;border:1px solid var(--s-line)!important}
.wb-canvas-shortcuts button:first-child{background:#3b82f6!important;color:#fff!important;border-color:#3b82f6!important}
#onboarding-toast{top:68px!important;padding:9px 12px!important;max-width:min(600px,90vw)!important}
#onboarding-toast span{font-size:12px!important;font-weight:600!important;color:var(--s-ink)!important}
#empty-state-guide>div{max-width:550px!important;padding:24px!important;border-radius:6px!important;background:var(--s-panel)!important;border:1px solid var(--s-line)!important;box-shadow:none!important}
#empty-state-guide h2{color:var(--s-ink)!important;font-size:22px!important;font-weight:700}
#empty-state-guide h2:before{content:"QUICK START";display:block;color:#2563eb;font-size:10px;letter-spacing:.1em}
#empty-state-guide p{font-size:13px!important;line-height:1.7!important;color:var(--s-muted)!important}
#empty-state-guide [data-empty-action]{border-radius:6px!important;background:var(--s-soft)!important;border:1px solid var(--s-line)!important;color:var(--s-ink)!important;box-shadow:none!important}
#empty-state-guide [data-empty-action] span{color:var(--s-ink)!important;font-weight:600!important}
#right-inspector{width:310px!important}
#right-inspector>div:first-child{background:var(--s-soft)!important;border-color:var(--s-line)!important}
#right-inspector h3{color:var(--s-ink)!important;font-size:15px!important;font-weight:700!important;letter-spacing:0!important;text-transform:none!important}
#right-inspector h3:before{content:"WHITEBOARD SETTINGS";display:block;font-size:10px;letter-spacing:.08em;color:#2563eb}
.wb-inspector-tabs,.wb-smart-tabs{background:var(--s-soft)!important;border-color:var(--s-line)!important;gap:4px!important;padding:8px!important}
.wb-inspector-tabs button,.wb-smart-tabs button{background:transparent!important;color:var(--s-muted)!important;border-radius:6px!important;border:1px solid transparent!important;font-size:11px!important;font-weight:600!important}
.wb-inspector-tabs button.wb-tab-active,.wb-smart-tabs button.wb-tab-active{background:var(--s-panel)!important;color:var(--s-blue2)!important;border:1px solid var(--s-line2)!important;box-shadow:none!important}
#wb-inspector-hint{border-radius:6px!important;background:#eff6ff!important;color:#374151!important;border:1px solid #dbeafe!important;font-size:12px!important}
#right-inspector .font-semibold,#right-inspector span,#right-inspector label,#right-inspector .text-gray-500{color:var(--s-ink)!important;opacity:1!important}
#right-inspector input[type=range],#right-inspector input[type=checkbox]{accent-color:#3b82f6!important}
#right-inspector button,#right-inspector select{border-radius:6px!important;color:var(--s-ink)!important}
#bottom-bar{height:52px!important;padding:0 12px!important}
#bottom-bar button{border-radius:6px!important;color:var(--s-ink)!important}
#btn-add-page{background:#eff6ff!important;color:#2563eb!important}
#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help,.wb-command-overlay{background:rgba(17,24,39,.5)!important;backdrop-filter:none!important}
#modal-projects>div,#modal-smart>div,#modal-templates>div,#modal-export>div,#modal-help>div,.wb-command-panel,html.dark #modal-projects>div,html.dark #modal-smart>div,html.dark #modal-templates>div,html.dark #modal-export>div,html.dark #modal-help>div{background:var(--s-panel)!important;color:var(--s-ink)!important;border-radius:6px!important;border:1px solid var(--s-line)!important;box-shadow:none!important}
#modal-projects h2,#modal-smart h2,#modal-templates h2,#modal-export h2,#modal-help h2,#modal-projects h3,#modal-smart h3,#modal-templates h3,#modal-export h3{color:var(--s-ink)!important;font-weight:700!important}
#modal-projects p,#modal-smart p,#modal-templates p,#modal-export p,#modal-help p,#modal-projects span,#modal-smart span,#modal-templates span,#modal-export span{color:var(--s-muted)!important;opacity:1!important}
#modal-projects button,#modal-smart button,#modal-templates button,#modal-export button,#modal-help button{border-radius:6px!important}
#modal-projects .bg-blue-600,#modal-projects .bg-emerald-600,#modal-smart [id^="btn-run-"],#modal-export .bg-blue-600{background:#3b82f6!important;color:#fff!important;border-color:#3b82f6!important}
#projects-list-container .font-semibold,#projects-list-container .font-bold{color:var(--s-ink)!important}
#projects-list-container [class*="rounded-2xl"]{background:var(--s-soft)!important;border:1px solid var(--s-line)!important}
@media(max-width:1200px){#top-bar{grid-template-columns:auto minmax(150px,1fr) auto;gap:0 6px!important}#wb-brand{margin-left:8px!important}#wb-utilities{padding-right:8px!important}#top-bar .tool-btn,#top-bar .wb-search-trigger{padding:6px 8px!important}#project-name-input{width:140px!important}}
@media(max-width:980px){#save-text{display:none!important}#wb-utilities #btn-toggle-timer,#wb-utilities #btn-start-present,#wb-utilities #btn-focus-mode{display:none!important}#right-inspector{width:284px!important}}
@media(max-width:760px){#top-bar{height:154px!important;min-height:154px!important;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:56px 44px 54px;grid-template-areas:"brand utilities" "project project" "actions actions"}#wb-utilities #btn-open-help,#wb-utilities #btn-toggle-theme,#wb-utilities #btn-mobile-inspector{display:none!important}#wb-actionbar{height:54px;padding:6px 10px!important}#wb-actionbar:before{display:none}#wb-projectbar{padding:0 8px!important;justify-content:space-between!important}#project-name-input{width:min(39vw,200px)!important;min-width:0!important;font-size:13px!important}#left-toolbar{width:70px!important;padding:8px 5px!important}#left-toolbar .wb-tool-caption{font-size:11px!important}#wb-canvas-floating{left:7px!important;right:7px!important;top:7px!important;flex-direction:column!important}.wb-canvas-mode,.wb-canvas-shortcuts{width:100%!important}#onboarding-toast{top:112px!important;left:7px!important;right:7px!important;max-width:none!important;transform:none!important}#empty-state-guide>div{padding:14px!important;max-width:95vw!important}#empty-state-guide h2{font-size:17px!important}#right-inspector{width:min(92vw,310px)!important}#wb-utilities .wb-search-trigger span{display:none!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* Header/action hierarchy: keep primary actions visible on dark nav. */
#wb-utilities #btn-open-export,
#wb-utilities #btn-open-export:hover,
#wb-actionbar #btn-open-smart,
#wb-actionbar #btn-open-smart:hover{
  background:#3b82f6!important;
  border-color:#3b82f6!important;
  color:#fff!important;
}
#wb-utilities #btn-open-export svg,
#wb-actionbar #btn-open-smart svg{color:#fff!important;stroke:currentColor!important}
#modal-smart button[id^="btn-run-"] span,
#modal-projects button.bg-blue-600 span,
#modal-export button.bg-blue-600 span{color:#fff!important}
/* Keep disabled controls clear, without hiding their text. */
#top-bar button:disabled,#right-inspector button:disabled{opacity:.45!important}


/* v2.2.1 — HTML Lab typography / navigation polish.
   The page-tab state is semantic, not a generic Tailwind .bg-blue-600 class,
   because legacy.css globally repurposes that utility as green. */
#page-tabs-container .wb-page-tab {
  appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  min-height:32px;
  margin:0;
  padding:5px 11px;
  border:1px solid var(--s-line2)!important;
  border-radius:6px!important;
  background:var(--s-soft)!important;
  color:var(--s-ink)!important;
  font-size:12px;
  font-weight:500!important;
  line-height:1.3;
  white-space:nowrap;
  box-shadow:none!important;
  transition:background-color .12s ease, border-color .12s ease;
}
#page-tabs-container .wb-page-tab:hover:not(.is-active){
  background:#eff6ff!important;
  color:var(--s-blue2)!important;
  border-color:#93c5fd!important;
}
#page-tabs-container .wb-page-tab.is-active,
#page-tabs-container .wb-page-tab.is-active:hover,
#page-tabs-container .wb-page-tab[aria-current="page"]{
  background:#3b82f6!important;
  border-color:#3b82f6!important;
  color:#fff!important;
  font-weight:600!important;
}
#bottom-bar #btn-add-page {
  background:#eff6ff!important;
  border:1px solid #bfdbfe!important;
  color:#1d4ed8!important;
  font-weight:500!important;
}
#bottom-bar #btn-add-page:hover {background:#dbeafe!important;color:#1d4ed8!important;}
#bottom-bar #btn-dup-page,#bottom-bar #btn-del-page,
#bottom-bar #btn-fit-all,#bottom-bar #btn-focus-selection,
#bottom-bar #btn-zoom-reset {font-weight:500!important;}

/* A consistent hierarchy: normal controls 500, headings 600, major headings 700. */
#wb-brand .wb-brand-copy strong {font-weight:700!important;}
#project-name-input,#wb-projectbar #btn-open-projects {font-weight:600!important;}
#wb-actionbar:before {font-weight:600!important;}
#top-bar .tool-btn,#top-bar .wb-search-trigger,
#left-toolbar .wb-tool-caption,#left-toolbar .wb-toolbar-label {
  font-weight:500!important;
}
#left-toolbar .wb-toolbar-label {font-weight:600!important;}
#wb-canvas-floating .wb-canvas-mode strong,
#wb-canvas-floating .wb-canvas-shortcuts button,
#onboarding-toast span,#empty-state-guide [data-empty-action] span {
  font-weight:500!important;
}
#empty-state-guide h2 {font-weight:600!important;}
#right-inspector h3,#right-inspector .font-semibold,
#right-inspector .wb-inspector-tabs button,
#right-inspector .wb-panel-section span.font-semibold {font-weight:600!important;}
#right-inspector .wb-panel-section label,
#right-inspector .wb-panel-section button,
#right-inspector .wb-panel-section select {font-weight:500!important;}
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help) h2,
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help) h3,
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help) h4,
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help) .font-bold {
  font-weight:600!important;
}
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help) button {
  font-weight:500!important;
}

/* Command search: remove previous green theme and keep readable gray/blue labels. */
.wb-command-panel,.dark .wb-command-panel {
  background:#fff!important;
  border:1px solid #d1d5db!important;
  border-radius:6px!important;
  color:#111827!important;
  box-shadow:0 15px 45px rgba(17,24,39,.14)!important;
}
.wb-command-heading span {
  color:#2563eb!important;
  font-weight:600!important;
}
.wb-command-heading h2,.dark .wb-command-heading h2 {
  color:#111827!important;
  font-weight:600!important;
  font-size:20px!important;
}
.wb-command-heading p {color:#4b5563!important;}
#wb-command-close {color:#6b7280!important;}
#wb-command-close:hover {color:#111827!important;}
.wb-command-input-row {
  background:#f9fafb!important;
  border:1px solid #d1d5db!important;
  color:#2563eb!important;
  border-radius:6px!important;
}
#wb-feature-input {background:transparent!important;color:#111827!important;}
#wb-feature-input::placeholder {color:#6b7280!important;opacity:1!important;}
.wb-command-input-row kbd{
  border-color:#d1d5db!important;
  background:#fff!important;
  color:#6b7280!important;
}
.wb-command-result,.dark .wb-command-result {color:#111827!important;border-radius:6px!important;}
.wb-command-result strong {font-weight:600!important;color:#111827!important;}
.wb-command-result small {font-weight:400!important;color:#6b7280!important;}
.wb-command-result:hover,.wb-command-result:focus-visible {
  background:#eff6ff!important;
  border-color:#bfdbfe!important;
}
.wb-command-result > span:last-child{
  background:#eff6ff!important;
  color:#1d4ed8!important;
  font-weight:500!important;
  border-radius:6px!important;
}
.wb-command-foot {background:#f9fafb!important;border-color:#e5e7eb!important;color:#4b5563!important;}
.wb-command-empty {color:#6b7280!important;}

/* Dialogs and testing panels share the same white, gray and blue UI tokens. */
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help)>div,
html.dark :is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help)>div{
  background:#fff!important;
  color:#111827!important;
  border-color:#d1d5db!important;
}
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help) h2,
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help) h3,
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help) h4{
  color:#111827!important;
}
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help) p {
  color:#4b5563!important;
}
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help)
:is(button.bg-blue-600,button.bg-indigo-600,button.bg-emerald-600,
    button.bg-purple-600,button.bg-amber-600,button.bg-green-600),
#modal-help #btn-stress-300,
#modal-help #btn-run-self-tests,
#modal-projects #btn-create-new-project,
#modal-smart button[id^="btn-run-"] {
  background:#3b82f6!important;
  border:1px solid #3b82f6!important;
  color:#fff!important;
  font-weight:500!important;
}
:is(#modal-projects,#modal-smart,#modal-templates,#modal-export,#modal-help)
:is(button.bg-blue-600,button.bg-indigo-600,button.bg-emerald-600,
    button.bg-purple-600,button.bg-amber-600,button.bg-green-600):hover,
#modal-help #btn-stress-300:hover,
#modal-help #btn-run-self-tests:hover,
#modal-smart button[id^="btn-run-"]:hover{
  background:#2563eb!important;
  border-color:#2563eb!important;
  color:#fff!important;
}
#modal-projects .wb-project-card,#modal-projects .wb-project-card.is-current {
  background:#fff!important;
  border:1px solid #d1d5db!important;
  box-shadow:none!important;
  color:#111827!important;
}
#modal-projects .wb-project-card.is-current{
  background:#eff6ff!important;
  border-color:#93c5fd!important;
}
#modal-projects .wb-project-name {color:#111827!important;font-weight:600!important;}
#modal-projects .wb-project-current {
  background:#dbeafe!important;color:#1d4ed8!important;
  border-radius:6px!important;font-weight:500!important;
}
#modal-projects .wb-project-action-primary,
#modal-projects .wb-project-action-primary:hover {
  background:#3b82f6!important;border-color:#3b82f6!important;color:#fff!important;
}
#modal-projects .wb-dialog-secondary {
  background:#f9fafb!important;border-color:#d1d5db!important;color:#374151!important;
}
#modal-help #self-test-report {
  background:#111827!important;color:#f9fafb!important;
}
#modal-help > div > div:nth-child(2) > div:first-child{
  background:#eff6ff!important;border-color:#bfdbfe!important;color:#111827!important;
}
#modal-smart .wb-smart-tabs {background:#f9fafb!important;}
#modal-smart .wb-smart-tabs button {color:#374151!important;font-weight:500!important;}
#modal-smart .wb-smart-tabs button.wb-tab-active {
  background:#3b82f6!important;
  border-color:#3b82f6!important;
  color:#fff!important;
  font-weight:600!important;
}
#modal-smart .wb-smart-panel {
  background:#f9fafb!important;
  border-color:#e5e7eb!important;
}
#modal-smart .wb-smart-panel h3 {color:#111827!important;font-weight:600!important;}
#modal-smart :is(input,textarea,select){
  color:#111827!important;
  background:#fff!important;
  border-color:#d1d5db!important;
}
#modal-templates > div > div:nth-child(2) {background:#f9fafb!important;color:#374151!important;}
#modal-templates #templates-grid > * {background:#fff!important;color:#111827!important;border-color:#e5e7eb!important;}
#modal-templates #templates-grid h3 {color:#111827!important;}

/* Neutral dark mode: no inherited forest green. Active blue controls always use white type. */
.dark #left-toolbar,.dark #right-inspector,.dark #bottom-bar {
  background:#1f2937!important;
  color:#f9fafb!important;
  border-color:#374151!important;
}
.dark #right-inspector > div:first-child {background:#111827!important;border-color:#374151!important;}
.dark #right-inspector > div:first-child h3 {color:#fff!important;}
.dark #right-inspector .font-semibold,.dark #right-inspector label,
.dark #right-inspector .wb-panel-section span{color:#f9fafb!important;}
.dark #right-inspector .wb-inspector-tabs,.dark #right-inspector .wb-smart-tabs{
  background:#111827!important;
  border-color:#374151!important;
}
.dark #right-inspector .wb-inspector-tabs button,
.dark #right-inspector .wb-smart-tabs button {color:#d1d5db!important;}
#right-inspector .wb-inspector-tabs button.wb-tab-active,
.dark #right-inspector .wb-inspector-tabs button.wb-tab-active {
  background:#3b82f6!important;
  border:1px solid #3b82f6!important;
  color:#fff!important;
  font-weight:600!important;
}
.dark #right-inspector #wb-inspector-hint{
  background:#253144!important;color:#e5e7eb!important;border-color:#374151!important;
}
.dark #right-inspector .wb-panel-section{border-color:#374151!important;}
.dark #left-toolbar .wb-tool-entry{color:#e5e7eb!important;}
.dark #left-toolbar .wb-tool-entry.active{
  background:#3b82f6!important;border-color:#3b82f6!important;color:#fff!important;
}
.dark .wb-canvas-mode,.dark .wb-canvas-shortcuts{
  background:#1f2937!important;color:#f9fafb!important;border-color:#374151!important;
}
.dark .wb-canvas-mode strong,.dark .wb-canvas-mode span:last-child{color:#f9fafb!important;}
.dark .wb-canvas-shortcuts button{background:#253144!important;color:#fff!important;border-color:#374151!important;}
.dark .wb-canvas-shortcuts button:first-child{
  background:#3b82f6!important;border-color:#3b82f6!important;color:#fff!important;
}
/* Buttons with blue backgrounds must keep white readable labels. */
#top-bar #btn-open-smart,#top-bar #btn-open-export,
#wb-canvas-floating .wb-canvas-shortcuts button:first-child,
#right-inspector .wb-inspector-tabs button.wb-tab-active,
#page-tabs-container .wb-page-tab.is-active{
  color:#fff!important;
}
@media (prefers-reduced-motion:reduce) {
  #page-tabs-container .wb-page-tab{transition:none;}
}