/* Shared site palette. Keep this after component styles. */
:root{--bg:#181b20;--panel:#272a33;--ink:#ffffff;--accent:#8077c1;--category-border:#c8bfff}
html,body,body.is-product,#app{background-color:var(--bg);color:var(--ink)}
#header,footer,#mobile-panel{background-color:var(--panel);color:var(--ink)}
#header nav.rubber-nav,#mobile-panel nav.rubber-nav{background:var(--panel)}
#header .rubber-nav .rubber-link,.language,.menu{color:var(--ink)}
#header .rubber-nav .rubber-link.active,#mobile-panel .rubber-link.active{background:var(--accent);color:var(--ink)}
.header-inner .sign-in,.header-inner .sign-in:hover{background:var(--accent);color:var(--ink)}
.language b{color:var(--category-border)}
.language span{color:var(--ink)}
.filters .filter{background:#ffffff;border-color:var(--category-border);color:var(--accent);transition:transform .18s ease}
.filters .filter.active{background:var(--accent);border-color:var(--category-border);color:#ffffff}
.filters button.filter:hover{color:var(--accent)}
.filters button.filter.active:hover{color:#ffffff}
@media(hover:hover) and (pointer:fine){.filters button.filter:hover{transform:scale(1.04)}}
@media(prefers-reduced-motion:reduce){.filters .filter{transition:none}}
.home-contact__headline h2{color:#000000}
.contact h1{color:#ffffff}
.is-home .home-hero,#page-loader{background-color:var(--bg)}
.is-product .product-page{background:var(--bg);color:var(--ink);color-scheme:dark}
.product-page .product-formats{color:var(--ink)}
.product-page .product-back{color:#beb5f6}
.is-product footer,.is-product #header{color:var(--ink)}