/* Opt-in only. Classic UI keeps its existing stylesheet and interactions. */
html[data-interface=modern]{--ui-brand:var(--company-primary,var(--company-primary));--ui-paper:var(--surface-soft);--ui-ink:var(--ink);--ui-line:var(--surface-line);--ui-soft:color-mix(in srgb,var(--ui-brand) 9%,white)}
html[data-interface=modern] body:not(.tech-analysis){background:var(--ui-paper);color:var(--ui-ink)}
html[data-interface=modern] body:not(.tech-analysis) :is(.panel,.stat,.hub-card,.mobile-card,.shop-card,.customer-center-card,.dashboard-review){border:1px solid var(--ui-line);border-radius:5px;box-shadow:none;backdrop-filter:none;background:#fff}
html[data-interface=modern] body:not(.tech-analysis) :is(h1,h2,h3){letter-spacing:0;font-weight:750;color:var(--ui-ink)}
html[data-interface=modern] .page-heading{border-bottom:1px solid var(--ui-line);padding-bottom:18px}
html[data-interface=modern] body:not(.tech-analysis) :is(.stat strong,.metric-value,.dashboard-value){font-variant-numeric:tabular-nums;letter-spacing:-.025em}
html[data-interface=modern] body:not(.tech-analysis) :is(.primary,button.primary,a.primary){background:var(--ui-brand);color:#fff;border-color:var(--ui-brand);border-radius:0;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%);padding-inline:18px}
html[data-interface=modern] body:not(.tech-analysis) :is(input:not([type=checkbox]):not([type=radio]),select,textarea){border-radius:5px;border-color:var(--ui-line);background:#fff;color:var(--ui-ink)}
html[data-interface=modern] body:not(.tech-analysis) :is(thead,th){background:var(--ui-soft);color:var(--ui-ink)}
html[data-interface=modern] body:not(.tech-analysis) :is(td,th){border-color:var(--ui-line)}
html[data-interface=modern] #sidebar{background:var(--ink);color:var(--surface-soft);box-shadow:none}
html[data-interface=modern] #sidebar :is(.brand,summary,a){color:var(--surface-line)}
html[data-interface=modern] #sidebar a.selected{background:var(--ui-brand);color:white;border-radius:0}
html[data-interface=modern] body:not(.tech-analysis) :is(header,.glass-header){background:#fff;border-bottom:1px solid var(--ui-line);backdrop-filter:none}
html[data-interface=modern] body:not(.tech-analysis) :is(.glass-card,.glass-metric,.glass-panel){background:white;box-shadow:none;border:1px solid var(--ui-line);border-radius:5px;backdrop-filter:none}
html[data-interface=modern] body:not(.tech-analysis) :is(.glass-workbench,.glass-dashboard){background:var(--ui-paper)}
html[data-interface=modern] body:not(.tech-analysis) :is(.glass-heading,.glass-hero){background:none}
html[data-interface=modern] #mobile-navigation{background:#fff;border:1px solid var(--ui-line);box-shadow:0 3px 16px var(--brand-shadow)}
html[data-interface=modern] #mobile-navigation a{clip-path:none}
html[data-interface=modern] dialog[open]:not(.unified-upload){animation:hf-interface-dialog 220ms cubic-bezier(.16,1,.3,1)}
html[data-interface=modern] body:not(.tech-analysis) :is(.review-tabs button,.page-tabs a,.smooth-switch-indicator){transition-duration:280ms}
.appearance-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:20px 0}.appearance-option{display:block;padding:20px;border:1px solid var(--surface-line);background:white;cursor:pointer}.appearance-option:has(input:checked){outline:2px solid var(--company-primary,var(--company-primary))}.appearance-option strong{display:block;font-size:18px;margin:8px 0}.appearance-option small{display:block}.appearance-colors{display:flex;gap:8px;margin-top:12px}.appearance-colors i{width:22px;height:6px;background:var(--company-primary)}.appearance-colors i:nth-child(2){background:#bd3540}.appearance-colors i:nth-child(3){background:#286dc6}
@keyframes hf-interface-dialog{from{opacity:.2;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.appearance-choices{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html[data-interface=modern] dialog[open]{animation:none}}
html[data-interface-motion=reduced] dialog[open]{animation:none!important}

html[data-interface=modern] body:not(.tech-analysis) .dashboard-metrics .stat strong{color:var(--ui-brand)!important}
html[data-interface=modern] body:not(.tech-analysis) :is(.hf-metric-icon,.glass-icon,.glass-task-icon){color:var(--ui-brand)!important;background:var(--ui-soft)!important}
html[data-interface=modern] :is(.glass-surface,.glass-task){background:#fff;border:1px solid var(--ui-line);border-radius:5px;box-shadow:none;backdrop-filter:none}
