/* Shared vector artwork and phone-aware Kainos brand themes. */
:root,[data-theme="light"]{--paper:#faf8f4;--ink:#20201e;--muted:#68645e;--line:#e2dcd2;--k-surface:#fff;--k-soft:#f0ebe2;--k-accent:#806022;--k-field:#fff;--k-focus:#8a6422;--k-shadow:#221a0b12}
[data-theme="dark"]{--paper:#111214;--ink:#f3eee5;--muted:#bbb3a7;--line:#3c3a35;--k-surface:#1c1d20;--k-soft:#252527;--k-accent:#e2c58c;--k-field:#252629;--k-focus:#e2c58c;--k-shadow:#0004}
.k-svg{width:22px;height:22px;display:inline-block;flex:none;vertical-align:middle}
a .k-svg,button .k-svg{width:17px;height:17px;vertical-align:-3px}
.k-feature .k-svg{width:27px;height:27px}
.k-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
body{background:var(--paper);color:var(--ink)}
header{background:var(--k-surface);color:var(--ink);border-color:var(--line)}
.brand small,.nav .sell{color:var(--k-accent)}
.nav{border-color:var(--line);color:var(--ink)}
.nav button:hover,.nav a:hover{color:var(--k-accent)}
.search{background:var(--k-soft);border-color:var(--line)}
.search input{color:var(--ink)}
.search input::placeholder{color:var(--muted)}
.k-appearance{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:24px;padding:3px 10px;color:var(--ink);flex-shrink:0}
.k-appearance .k-svg{width:18px;height:18px}
.k-appearance select{background:transparent;border:0;color:inherit;min-height:36px;max-width:118px;font-size:12px;cursor:pointer}
.k-appearance select option{background:var(--k-surface);color:var(--ink)}
.k-appearance:focus-within{outline:2px solid var(--k-focus);outline-offset:3px}
.k-appearance select:focus{outline:none}
:is(button,a,input,select,textarea):focus-visible{outline-color:var(--k-focus)}
input,select,textarea{color:var(--ink);accent-color:#b58d49}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
#shippingEstimator .shipping-status{color:var(--muted)}
.panel,.stat,.dialog,.k-preview-dialog,.admin-search,.policy-layout article{background:var(--k-surface);color:var(--ink);border-color:var(--line)}
.panel[style*="background"],.demo-bar,.form-state,.catalog-empty{background:var(--k-soft)!important;color:var(--ink)}
.field input,.field select,.field textarea,.admin-search input,.admin-filters select,.admin-filter-label select,.shop-tools input,.shop-tools select{background:var(--k-field);color:var(--ink);border-color:var(--line)}
.secondary,.table-actions button{border-color:var(--line)}
.fine,.benefit small,.k-feature small,.k-preview-dialog p,.k-preview-dialog ul,.product-modal-grid p,.k-pay-method small,.category-label,.rating,.admin-pager{color:var(--muted)}
.dialog-brand,.k-preview-close{color:var(--ink)}
.dialog-brand img{background:transparent}
.admin-shortcuts a,.admin-shortcuts button{background:var(--k-soft);color:var(--ink);border-color:var(--line)}
#admin tr{background:var(--k-surface);border-color:var(--line)}
#admin td:before{color:var(--k-accent)}
#shop .benefits,.k-feature{background:var(--k-soft);border-color:var(--line)}
#shop .benefits .benefit>span,#shop .section-kicker,.k-feature .k-icon,.section-kicker{color:var(--k-accent)}
#shop .category{background:var(--k-soft);border-color:var(--line)}
#shop .category.selected{background:var(--k-soft);border-color:var(--k-accent);box-shadow:inset 0 0 0 1px var(--k-accent)}
#shop .category .symbol{background:var(--k-soft);color:var(--k-accent)}
#shop .category img{mix-blend-mode:normal}
#shop .card{background:var(--k-surface);border-color:var(--line)}
#shop .card .product-img{background:var(--k-soft)}
#shop .card .seller{color:var(--k-accent)}
.heart{background:var(--k-surface);color:var(--ink)}
.heart.saved{color:var(--k-accent)}
.collection-tabs button{color:var(--muted)}
.collection-tabs button.current{color:var(--ink)}
.toast{background:var(--ink);color:var(--paper);z-index:120}
/* The gold-lit hero is an intentional brand panel in both appearances. */
#shop .hero{padding-top:0;min-height:490px;grid-template-columns:1.04fr .96fr}
#shop .hero-copy{background:linear-gradient(90deg,#0d0e10 72%,#0d0e10dd);padding:54px 42px 65px}
#shop .hero h1{font-size:clamp(42px,4.6vw,68px);line-height:1.06;letter-spacing:-2px}
#shop .hero h1 br:last-of-type{display:block}
#shop .hero-photo{position:absolute;inset:0;height:100%;border-radius:0}
#shop .hero-photo>img{height:100%;width:100%;inset:0;object-fit:cover;object-position:center;filter:brightness(.85)}
#shop .hero-actions{flex-wrap:wrap;gap:18px}
#shop .hero .primary{gap:18px}
.newsletter,footer{background:var(--k-surface);color:var(--ink);border-top:1px solid var(--line)}
.newsletter p,.footer-col a,.footer-col button{color:var(--muted)}
.newsletter input{background:var(--k-field);color:var(--ink);border-color:var(--line)}
.footer-grid .brand{color:var(--ink)}
.footer-col strong{color:var(--k-accent)}
.footer-bottom{border-color:var(--line);color:var(--muted)}
[data-theme="dark"] .preview-note{background:#29241b;color:#e4cfaa;border-color:#4d402c}
[data-theme="dark"] .status{background:#3d3320;color:#ebd09c}
[data-theme="dark"] .form-error{color:#ffaaa0}
[data-theme="dark"] .k-preview-notice,[data-theme="dark"] .k-cod-warning,[data-theme="dark"] .k-pay-method:has(input:checked){background:#332b1e;color:#eed7ad}
[data-theme="dark"] .k-pay-method{border-color:var(--line)}
[data-theme="dark"] .k-pay-method:has(input:checked){border-color:#b79354}
@media(max-width:1100px){.header{gap:15px;flex-wrap:wrap}.search{order:3;flex-basis:100%}.brand{margin-right:auto}.k-appearance{margin-left:auto}}
@media(max-width:700px){
  .header{gap:10px}.brand{min-width:0;flex:1}.brand strong{font-size:17px;letter-spacing:3px}.brand small{font-size:7px;letter-spacing:1.5px}
  .header>.navbtn{display:none}.k-appearance{margin-left:0;padding:3px 8px}.k-appearance select{font-size:12px;max-width:108px}
  #shop .hero{min-height:0;display:block;margin-top:16px}
  #shop .hero-copy{padding:32px 24px 66px;border-radius:8px;background:#0d0e10}
  #shop .hero h1{font-size:clamp(36px,10.3vw,49px);line-height:1.09;letter-spacing:-1.3px;margin:22px 0}
  #shop .hero h1 em{display:inline-block;margin-top:5px}
  #shop .hero-copy p{font-size:13px;max-width:100%;line-height:1.8}
  #shop .hero .primary{padding:15px 18px;font-size:11px;letter-spacing:.6px;margin-top:0}
  #shop .hero-actions{align-items:center;gap:18px 22px;margin-top:22px}
  #shop .hero .text-link{font-size:12px}
  #shop .hero-caption{font-size:7px;letter-spacing:1.5px;right:24px;left:24px;bottom:22px;line-height:1.7}
  #shop .hero-pagination{margin-top:26px}
  .k-mobile-bottom,body:has(#shop.visible) .k-mobile-bottom{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;z-index:80;background:var(--k-surface);color:var(--ink);border-top:1px solid var(--line);padding:7px 8px max(8px,env(safe-area-inset-bottom));gap:4px;box-shadow:0 -5px 25px var(--k-shadow)}
  .k-mobile-bottom button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:49px;padding:5px 3px;border-radius:9px;font-size:11px;font-weight:500;line-height:1.1;color:var(--muted)}
  .k-mobile-bottom button>span{display:flex;align-items:center;justify-content:center;font-size:0}
  .k-mobile-bottom .k-svg{width:23px;height:23px;stroke-width:1.7}
  .k-mobile-bottom button[aria-current="page"]{color:var(--k-accent);background:var(--k-soft)}
  .k-mobile-bottom button:hover{color:var(--k-accent)}
  body,body:has(#shop.visible){padding-bottom:calc(73px + env(safe-area-inset-bottom))}
  .toast{bottom:calc(85px + env(safe-area-inset-bottom))}
  .dialog,.k-preview-dialog{max-height:85dvh;overflow-y:auto}
  .field input,.field select,.field textarea,.search input{font-size:16px}
}