.design-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px}.design-choice{display:grid;gap:10px;padding:10px!important;background:var(--d-surface,#fff)!important;color:var(--d-text,#173039)!important;border:2px solid var(--d-border,#c3d4d5)!important;border-radius:12px;font-size:14px}.design-choice[aria-pressed=true]{outline:3px solid var(--d-primary,#087b7d);outline-offset:2px}.design-mini{display:block;height:90px;border-radius:7px;overflow:hidden;background:var(--d-bg);border:1px solid var(--d-border);box-shadow:0 3px 10px #0002}.design-mini-header{display:block;height:19px;background:var(--d-header)}.design-mini-body{display:flex;padding:12px 10px 8px;gap:7px}.design-mini-body i{height:18px;flex:1;border:1px solid var(--d-border);border-radius:3px;background:var(--d-surface)}.design-mini-action{display:block;height:13px;width:35%;margin:0 10px;background:var(--d-primary);border-radius:3px}.home-section-icon svg{width:34px;height:34px;display:block}.nav .symbol svg{width:22px;height:22px;vertical-align:middle}.design-panel .error:empty{display:none}
html[data-design]:not([data-design=classic]) body{background:var(--d-bg);color:var(--d-text)}
html[data-design]:not([data-design=classic]) :is(.panel,.card,.cart,.tile,dialog,.home-section-button,.loginbox){background:var(--d-surface);color:var(--d-text);border-color:var(--d-border);box-shadow:0 5px 22px color-mix(in srgb,var(--d-header) 12%,transparent)}
html[data-design]:not([data-design=classic]) :is(.topbar,.home-topbar,.sidebar,.loginart){background:var(--d-header);color:var(--d-on-header);border-color:var(--d-border)}
html[data-design]:not([data-design=classic]) :is(.topbar,.home-topbar,.sidebar) :is(.muted,.shoplabel,.nav button,.username){color:var(--d-on-header)}
html[data-design]:not([data-design=classic]) :is(button:not(.tile),a.storefront-button){background:var(--d-primary);color:var(--d-on-primary)}
html[data-design]:not([data-design=classic]) :is(button.secondary,.home-section-button){background:var(--d-soft);color:var(--d-text)}
html[data-design]:not([data-design=classic]) .home-section-button:hover{background:var(--d-surface);border-color:var(--d-primary)}
html[data-design]:not([data-design=classic]) .sidebar .nav button{background:transparent;color:var(--d-on-header)}
html[data-design]:not([data-design=classic]) .sidebar .nav button.active{background:color-mix(in srgb,var(--d-on-header) 15%,transparent);border-color:var(--d-primary)}
html[data-design]:not([data-design=classic]) :is(input,select,textarea){background:var(--d-surface);color:var(--d-text);border-color:var(--d-border);color-scheme:light}
html[data-design=night] :is(input,select,textarea),html[data-design=gold] :is(input,select,textarea){color-scheme:dark}
html[data-design]:not([data-design=classic]) :is(.muted,th,label,.label,.heading p,.card small,.tile small){color:var(--d-muted)}
html[data-design]:not([data-design=classic]) :is(td,th){border-color:var(--d-border)}
html[data-design]:not([data-design=classic]) :is(.value,.price,a){color:var(--d-primary)}
html[data-design]:not([data-design=classic]) .card.accent{background:var(--d-primary);color:var(--d-on-primary)}
html[data-design]:not([data-design=classic]) .card.accent :is(.value,.label,small){color:var(--d-on-primary)}
html[data-design]:not([data-design=classic]) .home-user-menu>div{background:var(--d-surface);border-color:var(--d-border)}
html[data-design]:not([data-design=classic]) button.danger{background:#ffeded;color:#9b2020}
html[data-design]:not([data-design=classic]) .home-brand{background:#083c48}
html[data-design]:not([data-design=classic]) :is(.receipt,.range-document){background:white;color:#173039}
html[data-design]:not([data-design=classic]) :is(.receipt,.range-document) :is(td,th,.muted,.value){color:#173039}
html[data-design]:not([data-design=classic]) :is(input,textarea)::placeholder{color:var(--d-muted);opacity:1}
@media(max-width:480px){.design-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.design-choice{min-width:0}.design-panel .actions{flex-wrap:wrap}}

#designError:not(:empty){display:block}html[data-design]:not([data-design=classic]) a.storefront-button{color:var(--d-on-primary)}html[data-design=night] .error,html[data-design=gold] .error{color:#ffb4ad}

html[data-design]:not([data-design=classic]) button.home-brand{background:#083c48}

/* Product choices use the theme surface, not the action-button fill. */
html[data-design]:not([data-design=classic]) button.tile:hover{background:var(--d-surface);border-color:var(--d-border);filter:brightness(.98)}
html[data-design]:not([data-design=classic]) button.tile:focus-visible{outline:2px solid var(--d-text);outline-offset:3px}