  :root{
    --bg:#F6F7F1; --surface:#FFFFFF; --surface-2:#F0EEE3;
    --ink:#182018; --ink-soft:#5B6459;
    --primary:#1E5C46; --primary-dark:#123B2D; --primary-soft:#DCEAE2;
    --accent:#E8912B; --accent-soft:#FBEAD0;
    --danger:#A6402A; --danger-soft:#F5E1DA;
    --line:#E1DFD2;
    --shadow: 0 1px 2px rgba(24,32,24,.06);
  }
  :root:not([data-theme="light"]) {
    @media (prefers-color-scheme: dark) {
      --bg:#11150F; --surface:#181D16; --surface-2:#20261D;
      --ink:#ECEFE6; --ink-soft:#A8B0A0;
      --primary:#5AA783; --primary-dark:#3E7E63; --primary-soft:#1E2F26;
      --accent:#F0A94D; --accent-soft:#332711;
      --danger:#E38266; --danger-soft:#3A2019;
      --line:#2B322A;
    }
  }
  :root[data-theme="dark"]{
    --bg:#11150F; --surface:#181D16; --surface-2:#20261D;
    --ink:#ECEFE6; --ink-soft:#A8B0A0;
    --primary:#5AA783; --primary-dark:#3E7E63; --primary-soft:#1E2F26;
    --accent:#F0A94D; --accent-soft:#332711;
    --danger:#E38266; --danger-soft:#3A2019;
    --line:#2B322A;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--bg); color:var(--ink);
    font-family:'Work Sans',system-ui,sans-serif;
    -webkit-font-smoothing:antialiased;
    min-height:100vh;
  }
  h1,h2,h3,.brandfont{font-family:'Fraunces',serif;}
  a{color:inherit;text-decoration:none;}
  button{font-family:inherit;cursor:pointer;}
  input,select,textarea{font-family:inherit;}
  .container{max-width:1180px;margin:0 auto;padding:0 20px;}
  ::selection{background:var(--accent-soft);}

  /* header */
  .site-header{position:sticky;top:0;z-index:40;background:var(--bg);border-bottom:1px solid var(--line);}
  .header-row{display:flex;align-items:center;gap:18px;padding:14px 0;flex-wrap:wrap;}
  .logo{font-size:26px;font-weight:600;font-style:italic;color:var(--primary-dark);display:flex;align-items:baseline;gap:6px;flex-shrink:0;}
  .logo .dot{color:var(--accent);font-style:normal;}
  .search-wrap{flex:1;min-width:180px;position:relative;}
  .search-wrap input{width:100%;padding:10px 14px 10px 38px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:14px;outline:none;}
  .search-wrap input:focus{border-color:var(--primary);}
  .search-wrap svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);opacity:.55;}
  .nav-actions{display:flex;align-items:center;gap:6px;flex-shrink:0;}
  .nav-btn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 12px;border-radius:10px;border:none;background:transparent;color:var(--ink);font-size:11px;font-weight:500;position:relative;}
  .nav-btn:hover{background:var(--surface-2);}
  .cart-count{position:absolute;top:-2px;right:4px;background:var(--danger);color:#fff;font-size:10px;font-weight:700;border-radius:999px;min-width:16px;height:16px;display:flex;align-items:center;justify-content:center;padding:0 3px;}
  .cat-strip{display:flex;gap:8px;overflow-x:auto;padding:10px 0 14px;scrollbar-width:none;}
  .cat-strip::-webkit-scrollbar{display:none;}
  .chip{white-space:nowrap;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:var(--surface);font-size:13px;font-weight:500;color:var(--ink-soft);flex-shrink:0;}
  .chip.active{background:var(--primary);border-color:var(--primary);color:#fff;}

  /* hero */
  .hero{padding:42px 0 30px;display:flex;gap:34px;align-items:center;flex-wrap:wrap;}
  .hero-copy{flex:1 1 340px;min-width:280px;}
  .hero-copy .eyebrow{color:var(--accent);font-weight:600;font-size:14px;}
  .hero-copy h1{font-size:clamp(32px,5vw,48px);line-height:1.08;margin:8px 0 14px;font-weight:600;}
  .hero-copy p{color:var(--ink-soft);font-size:16px;max-width:46ch;line-height:1.55;margin:0 0 20px;}
  .hero-stats{display:flex;gap:28px;margin-top:22px;flex-wrap:wrap;}
  .hero-stats div b{display:block;font-family:'Fraunces',serif;font-size:22px;color:var(--primary-dark);}
  .hero-stats div span{font-size:12.5px;color:var(--ink-soft);}
  .hero-art{flex:1 1 280px;min-width:260px;max-width:420px;}
  .hero-art svg{width:100%;height:auto;}

  /* sections */
  .section-title{display:flex;align-items:baseline;justify-content:space-between;margin:26px 0 16px;}
  .section-title h2{font-size:24px;font-weight:600;margin:0;}
  .section-title span{font-size:13px;color:var(--ink-soft);}

  .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px;}
  .card{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .15s ease,transform .15s ease;}
  .card:hover{box-shadow:0 6px 18px rgba(20,30,20,.08);transform:translateY(-2px);}
  .card-media{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;padding:14px;position:relative;}
  .card-media svg{width:78%;height:78%;}
  img.pimg{display:none;}
  img.pimg.loaded{display:block;}
  .card-media img.pimg{width:100%;height:100%;object-fit:contain;padding:6px;}
  .cart-line .media img.pimg,.mini img.pimg{width:100%;height:100%;object-fit:contain;border-radius:inherit;}
  .qv-overlay{position:fixed;inset:0;background:#18201880;display:flex;align-items:center;justify-content:center;padding:20px;z-index:200;}
  .qv-panel{background:#fff;border-radius:16px;max-width:520px;width:100%;max-height:88vh;overflow:auto;position:relative;display:flex;flex-direction:column;}
  .qv-media{aspect-ratio:1.4/1;display:flex;align-items:center;justify-content:center;padding:24px;position:relative;}
  .qv-media svg{width:45%;height:45%;}
  .qv-media img.pimg{width:60%;height:60%;object-fit:contain;}
  .qv-body{padding:18px 22px 24px;}
  .qv-close{position:absolute;top:10px;right:12px;border:none;background:#ffffffcc;width:32px;height:32px;border-radius:50%;font-size:20px;line-height:1;cursor:pointer;z-index:2;}
  .badge{position:absolute;top:10px;left:10px;background:var(--danger);color:#fff;font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:6px;}
  .card-body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:4px;flex:1;}
  .card-brand{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);font-weight:600;}
  .card-name{font-size:14.5px;font-weight:600;line-height:1.3;min-height:2.6em;}
  .card-size{font-size:12px;color:var(--ink-soft);}
  .card-price-row{display:flex;align-items:baseline;gap:7px;margin-top:6px;}
  .price{font-size:16px;font-weight:700;color:var(--ink);}
  .mrp{font-size:12.5px;color:var(--ink-soft);text-decoration:line-through;}
  .off{font-size:11.5px;color:var(--primary-dark);font-weight:600;}
  .card-foot{margin-top:10px;}
  .btn{border-radius:9px;border:1px solid var(--primary);background:var(--primary);color:#fff;padding:9px 14px;font-size:13.5px;font-weight:600;width:100%;display:flex;align-items:center;justify-content:center;gap:6px;}
  .btn:hover{background:var(--primary-dark);}
  .btn.outline{background:transparent;color:var(--primary-dark);}
  .btn.outline:hover{background:var(--primary-soft);}
  .btn.ghost{background:transparent;border-color:var(--line);color:var(--ink);}
  .btn.danger{background:var(--danger);border-color:var(--danger);}
  .btn.danger.outline{background:transparent;color:var(--danger);}
  .btn.block{width:100%;}
  .btn.sm{padding:6px 10px;font-size:12.5px;}
  .qty-stepper{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--primary);border-radius:9px;overflow:hidden;width:100%;}
  .qty-stepper button{background:var(--primary-soft);color:var(--primary-dark);border:none;width:32px;height:34px;font-size:16px;font-weight:700;}
  .qty-stepper span{font-weight:700;font-size:14px;}

  /* generic layout helpers */
  .page{padding:28px 0 60px;}
  .panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px;}
  .two-col{display:grid;grid-template-columns:1.6fr 1fr;gap:22px;align-items:start;}
  @media (max-width:860px){.two-col{grid-template-columns:1fr;}}
  .row-between{display:flex;align-items:center;justify-content:space-between;gap:10px;}
  .muted{color:var(--ink-soft);}
  .field{display:flex;flex-direction:column;gap:5px;margin-bottom:13px;}
  .field label{font-size:12.5px;font-weight:600;color:var(--ink-soft);}
  .field input,.field select,.field textarea{padding:10px 12px;border-radius:9px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font-size:14px;outline:none;}
  .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--primary);}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
  @media (max-width:520px){.field-row{grid-template-columns:1fr;}}
  .divider{height:1px;background:var(--line);margin:16px 0;}
  .empty-state{text-align:center;padding:60px 20px;color:var(--ink-soft);}
  .empty-state svg{margin-bottom:14px;opacity:.7;}
  .empty-state h3{margin:0 0 6px;color:var(--ink);}
  .toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--primary-dark);color:#fff;padding:11px 20px;border-radius:999px;font-size:13.5px;font-weight:600;box-shadow:0 6px 20px rgba(0,0,0,.2);z-index:100;opacity:0;pointer-events:none;transition:opacity .25s ease, transform .25s ease;}
  .toast.show{opacity:1;transform:translateX(-50%) translateY(-4px);}

  .cart-line{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);align-items:center;}
  .cart-line:last-child{border-bottom:none;}
  .cart-line .media{width:64px;height:64px;flex-shrink:0;background:var(--surface-2);border-radius:10px;display:flex;align-items:center;justify-content:center;}
  .cart-line .media svg{width:70%;height:70%;}
  .cart-line .info{flex:1;min-width:0;}
  .cart-line .info .nm{font-weight:600;font-size:14.5px;}
  .cart-line .info .sz{font-size:12px;color:var(--ink-soft);}
  .cart-line .qty-mini{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:8px;padding:2px 4px;}
  .cart-line .qty-mini button{border:none;background:none;width:24px;height:24px;font-size:15px;font-weight:700;color:var(--primary-dark);}
  .cart-line .lineprice{width:80px;text-align:right;font-weight:700;font-size:14px;flex-shrink:0;}
  .remove-x{border:none;background:none;color:var(--ink-soft);font-size:12px;text-decoration:underline;padding:0;margin-top:4px;}

  .summary-row{display:flex;justify-content:space-between;font-size:14px;padding:6px 0;color:var(--ink-soft);}
  .summary-row.total{font-weight:700;color:var(--ink);font-size:16px;border-top:1px solid var(--line);margin-top:8px;padding-top:12px;}

  .addr-card{border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:10px;cursor:pointer;position:relative;}
  .addr-card.selected{border-color:var(--primary);background:var(--primary-soft);}
  .addr-card .tag{display:inline-block;font-size:10.5px;font-weight:700;text-transform:uppercase;background:var(--accent-soft);color:var(--accent);padding:2px 8px;border-radius:6px;margin-bottom:6px;}
  .addr-actions{position:absolute;top:12px;right:12px;display:flex;gap:10px;}
  .addr-actions button{border:none;background:none;font-size:12px;color:var(--ink-soft);text-decoration:underline;}

  .order-card{border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin-bottom:14px;background:var(--surface);}
  .order-head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:10px;}
  .status-pill{font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--primary-soft);color:var(--primary-dark);}
  .order-items-preview{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;}
  .order-items-preview .mini{width:44px;height:44px;background:var(--surface-2);border-radius:8px;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
  .order-items-preview .mini svg{width:65%;height:65%;}

  .auth-wrap{max-width:400px;margin:40px auto;}
  .auth-tabs{display:flex;border:1px solid var(--line);border-radius:11px;overflow:hidden;margin-bottom:22px;}
  .auth-tabs button{flex:1;padding:11px;background:var(--surface);border:none;font-weight:600;font-size:14px;color:var(--ink-soft);}
  .auth-tabs button.active{background:var(--primary);color:#fff;}

  footer{border-top:1px solid var(--line);margin-top:50px;padding:34px 0;color:var(--ink-soft);font-size:13px;}
  footer .container{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;}

  .scroller{overflow-x:auto;}
  @media (max-width:640px){
    .header-row{gap:10px;}
    .hero{padding:26px 0 20px;}
  }

  /* --- Laravel conversion additions --- */
  .auth-tabs a{flex:1;padding:11px;background:var(--surface);font-weight:600;font-size:14px;color:var(--ink-soft);text-align:center;}
  .auth-tabs a.active{background:var(--primary);color:#fff;}
  .addr-actions a,.addr-actions button{border:none;background:none;font-size:12px;color:var(--ink-soft);text-decoration:underline;cursor:pointer;padding:0;font-family:inherit;}
  .btn{text-decoration:none;}
  .qv-panel{background:var(--surface);}
  .card-foot form{margin:0;}

  /* --- static pages (privacy / refund / contact) + footer links --- */
  .policy{max-width:820px;margin:28px auto 40px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:28px 30px;line-height:1.65;}
  .policy h1{font-size:30px;margin:0 0 14px;font-weight:600;}
  .policy h2{font-size:20px;margin:26px 0 8px;font-weight:600;}
  .policy h3{font-size:15px;margin:16px 0 6px;font-family:'Work Sans',system-ui,sans-serif;font-weight:700;}
  .policy p,.policy li{font-size:14.5px;color:var(--ink);}
  .policy ul{padding-left:20px;margin:6px 0 10px;}
  .policy a,.contact-card a{color:var(--primary-dark);font-weight:600;}
  .contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;}
  .contact-card{text-align:center;}
  .contact-card svg{color:var(--primary);}
  .contact-card h3{margin:8px 0 6px;}
  .contact-card p{margin:0;font-size:14px;color:var(--ink-soft);line-height:1.5;}
  .footer-links{display:flex;gap:16px;flex-wrap:wrap;margin-top:8px;}
  .footer-links a,.footer-contact a{text-decoration:underline;}
  .footer-contact{margin-top:4px;}
  @media (max-width:600px){.policy{padding:20px 18px;}}
  footer .container{flex-direction:column;gap:6px;}

  /* --- logo image --- */
  .logo-img{height:44px;width:auto;max-width:180px;object-fit:contain;display:block;}
  .footer-logo{height:38px;}

  /* --- product images upload page --- */
  .stat-row{display:flex;flex-wrap:wrap;gap:12px;}
  .stat-box{background:var(--primary-soft);border:1px solid var(--line);border-radius:10px;padding:12px 16px;min-width:150px;font-size:13px;color:var(--ink-soft);}
  .stat-box b{display:block;font-family:'Fraunces',serif;font-size:22px;color:var(--primary-dark);}
  .stat-box.warn b{color:var(--danger);}
  .stat-box.muted b{color:var(--ink-soft);}
  .notfound-list{margin-top:12px;max-height:240px;overflow:auto;font-size:13px;color:var(--danger);}
