/* Website appearance only; extension preferences and product media are separate. */
html[data-theme="light"] {
    --bg: #f5f7f9;
    --bg-2: #edf2f6;
    --panel: #fff;
    --panel-2: #edf2f6;
    --line: #b6c2ce;
    --text: #19232f;
    --muted: #526173;
    --lime: #326a13;
    --cyan: #006b83;
    --gold: #795700;
    --red: #b02b42;
    --shadow: 0 16px 40px rgba(0,0,0,.12);
}
html[data-theme="light"] body { background: var(--bg); }
html[data-theme="light"] body > header { background: #fff; border-color: var(--line); }
html[data-theme="light"] :is(.property-menu,.card,.plan-card,.billing-strip,.premium-band,.stack-list div,.timeline article,.code) { background: var(--panel); border-color: var(--line); }
html[data-theme="light"] :is(.property-menu-toggle,nav a,.code,.footer-links a) { color: var(--text); }
html[data-theme="light"] :is(.form input,.form textarea,.form select,.workspace-bar select,.network-command-search input,.spidertaz-search-form input) { background: #fff; color: var(--text); border-color: #8494a5; }
html[data-theme="light"] :is(input,textarea)::placeholder { color: #526173; opacity: 1; }
html[data-theme="light"] .btn { background: #e7edf3; color: var(--text); border-color: #8494a5; }
html[data-theme="light"] .primary { background: #326a13; color: #fff; border-color: #326a13; }
html[data-theme="light"] .plan-label { background: #d9efb7; color: #244414; }
html[data-theme="light"] .notice { background: #e5f1fb; color: #174d79; }
html[data-theme="light"] .notice.bad { background: #fff0f2; color: #932335; }
html[data-theme="light"] :is(footer,.footer-bottom) { background: #edf2f6; color: var(--muted); border-color: var(--line); }
html[data-theme="light"] .network-command-center { --ncc-bg:#f5f7f9; --ncc-panel:#fff; --ncc-soft:#edf2f6; }
html[data-theme="light"] .network-command-link { background: #fff; }
html[data-theme="light"] .network-command-tab.is-active { background: #326a13; color: #fff; }
/* The browser preview depicts a dark product surface, not the website shell. */
html[data-theme="light"] .browser-card { --lime:#94ef00; --cyan:#61d8ff; color:#f6f8fc; }
:is(a,button,input,select,textarea,summary):focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }
@media (max-width: 400px) {
    body > header .nav { gap: 8px; }
    body > header .brand { font-size: 16px; gap: 6px; }
    body > header .brand-mark { width: 28px; height: 28px; flex: 0 0 28px; }
    body > header .nav-links { gap: 6px; }
    body > header .property-menu-toggle { padding-inline: 8px; }
}