
  @import url('https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@600;700;800;900&family=Karla:ital,wght@0,400;0,500;0,600;0,700;1,400&family=JetBrains+Mono:wght@500;700&display=swap');

  :root{
    --paper:#fdf7f0;
    --surface:#ffffff;
    --surface-2:#fdece0;
    --ink:#1a2338;
    --ink-soft:#6b6058;
    --blue-900:#1a2338;
    --blue-800:#233152;
    --blue-700:#e8720f;
    --blue-600:#ff8a1f;
    --blue-500:#ffab5c;
    --blue-100:#fdece0;
    --line:#ecdfd2;
    --line-soft:#f5ebe0;
    --sale:#2e8f3e;
    --sale-soft:#e3f5e6;
    --focus:#e8720f;
    --shadow: 0 1px 2px rgba(26,35,56,.06), 0 8px 24px -12px rgba(26,35,56,.18);
  }

  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --paper:#1c140d;
      --surface:#241a12;
      --surface-2:#2e2013;
      --ink:#f5ece2;
      --ink-soft:#cbb9a8;
      --blue-900:#f5ece2;
      --blue-800:#e8d9c8;
      --blue-700:#ff9331;
      --blue-600:#ffab5c;
      --blue-500:#ffbf85;
      --blue-100:#3a2a18;
      --line:#4a3624;
      --line-soft:#3a2a1c;
      --sale:#7ed88a;
      --sale-soft:#173a1c;
      --shadow: 0 1px 2px rgba(0,0,0,.3), 0 12px 32px -16px rgba(0,0,0,.6);
    }
  }
  :root[data-theme="dark"]{
    --paper:#1c140d;
    --surface:#241a12;
    --surface-2:#2e2013;
    --ink:#f5ece2;
    --ink-soft:#cbb9a8;
    --blue-900:#f5ece2;
    --blue-800:#e8d9c8;
    --blue-700:#ff9331;
    --blue-600:#ffab5c;
    --blue-500:#ffbf85;
    --blue-100:#3a2a18;
    --line:#4a3624;
    --line-soft:#3a2a1c;
    --sale:#7ed88a;
    --sale-soft:#173a1c;
    --shadow: 0 1px 2px rgba(0,0,0,.3), 0 12px 32px -16px rgba(0,0,0,.6);
  }

  *{box-sizing:border-box;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'Karla',ui-sans-serif,system-ui,sans-serif;
    font-size:16px;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit;}
  img{max-width:100%;}
  .num{font-variant-numeric:tabular-nums;}

  h1,h2,h3{
    font-family:'Big Shoulders Display',ui-sans-serif,system-ui,sans-serif;
    text-transform:uppercase;
    text-wrap:balance;
    margin:0;
    color:var(--blue-900);
    letter-spacing:.01em;
  }

  .wrap{max-width:1120px;margin:0 auto;padding:0 24px;}

  /* ---------- announcement bar ---------- */
  .announce-bar{
    background:var(--blue-700);
    color:#fff;
  }
  .announce-inner{
    display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
    gap:6px 18px;
    padding:8px 24px;
    font-family:'Karla',sans-serif; font-size:.84rem; font-weight:600;
    text-align:center;
  }
  .announce-inner a{
    color:#fff; text-decoration:underline; font-weight:800;
  }
  .announce-phone{
    display:inline-flex; align-items:center; gap:6px;
  }
  .announce-phone a{text-decoration:none; font-weight:700;}

  /* ---------- top bar ---------- */
  .topbar{
    position:sticky; top:0; z-index:20;
    background:var(--surface);
    border-bottom:1px solid var(--line);
  }
  .topbar-inner{
    display:flex; align-items:center; justify-content:space-between;
    gap:16px; padding:14px 24px;
  }
  .header-search{
    flex:1; max-width:420px;
    display:flex; align-items:center; gap:8px;
    background:var(--surface-2);
    border:1px solid var(--line);
    border-radius:999px;
    padding:8px 16px;
  }
  .header-search input{
    flex:1; border:none; background:transparent; outline:none;
    font-family:'Karla',sans-serif; font-size:.92rem; color:var(--ink);
  }
  .header-search input::placeholder{color:var(--ink-soft);}
  .header-search svg{flex:none; color:var(--ink-soft);}
  @media (max-width:760px){
    .header-search{order:3; max-width:none; width:100%;}
  }
  .logo{
    display:flex; align-items:center; gap:10px;
    font-family:'Big Shoulders Display',sans-serif;
    font-weight:800; font-size:1.5rem; letter-spacing:.02em;
    color:var(--blue-900); text-decoration:none;
  }
  .logo-mark{
    width:34px; height:34px; border-radius:8px;
    background:var(--blue-700);
    display:flex; align-items:center; justify-content:center;
    color:var(--surface); font-size:1.05rem; font-weight:900;
    flex:none;
  }
  nav{display:flex; gap:4px;}
  nav a{
    font-family:'Karla',sans-serif; font-weight:600; font-size:.92rem;
    text-decoration:none; color:var(--ink-soft);
    padding:8px 12px; border-radius:8px;
  }
  nav a:hover{color:var(--blue-700); background:var(--surface-2);}
  nav a:focus-visible, button:focus-visible, .chip:focus-visible, .card:focus-visible, .back-link:focus-visible, .detail-cta:focus-visible, .swatch:focus-visible, .detail-video:focus-visible{
    outline:2px solid var(--focus); outline-offset:2px;
  }

  /* ---------- hero ---------- */
  .hero{
    background:linear-gradient(135deg, var(--blue-100), var(--surface-2) 75%);
    color:var(--ink);
    padding:56px 0 40px;
    position:relative;
    overflow:clip;
  }
  .hero-grid{
    display:grid; grid-template-columns: 1.3fr 1fr; gap:32px; align-items:end;
  }
  .eyebrow{
    display:inline-flex; align-items:center; gap:8px;
    font-family:'JetBrains Mono',monospace; font-size:.76rem; font-weight:700;
    letter-spacing:.14em; text-transform:uppercase;
    color:var(--blue-700);
    background:rgba(232,114,15,.1);
    border:1px solid rgba(232,114,15,.28);
    padding:5px 10px; border-radius:999px;
    margin-bottom:14px;
  }
  .eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--sale);}
  .hero h1{
    color:var(--blue-900);
    font-size:clamp(2.4rem, 5.4vw, 4.1rem);
    line-height:.94;
    font-weight:900;
  }
  .hero h1 .accent{color:var(--blue-700);}
  .hero p{
    color:var(--ink-soft); max-width:46ch; margin-top:14px; font-size:1.02rem;
  }
  .validity{
    font-family:'JetBrains Mono',monospace; font-size:.82rem;
    color:var(--ink-soft); margin-top:18px;
  }
  .validity b{color:var(--blue-900);}

  .hero-card{
    background:var(--surface);
    color:var(--ink);
    border-radius:14px;
    padding:22px;
    box-shadow:var(--shadow);
    border:1px solid var(--line);
    justify-self:end;
    width:100%;
    max-width:300px;
  }
  .hero-card .k{
    font-family:'JetBrains Mono',monospace; font-size:.72rem; font-weight:700;
    text-transform:uppercase; letter-spacing:.1em; color:var(--ink-soft);
  }
  .hero-card ul{list-style:none; margin:12px 0 0; padding:0; display:grid; gap:10px;}
  .hero-card li{display:flex; justify-content:space-between; gap:10px; font-size:.92rem; border-bottom:1px dashed var(--line); padding-bottom:10px;}
  .hero-card li:last-child{border-bottom:none; padding-bottom:0;}
  .hero-card .price{font-family:'JetBrains Mono',monospace; font-weight:700; color:var(--blue-700);}

  /* ---------- filter toolbar ---------- */
  .toolbar{
    display:flex; flex-wrap:wrap; align-items:center; gap:10px;
    padding:22px 0 4px;
  }
  .toolbar .label{font-size:.84rem; color:var(--ink-soft); font-weight:600; margin-right:4px;}
  .chip{
    font-family:'Karla',sans-serif; font-weight:700; font-size:.86rem;
    border:1px solid var(--line); background:var(--surface); color:var(--ink-soft);
    padding:8px 16px; border-radius:999px; cursor:pointer;
    transition:background .15s ease, color .15s ease, border-color .15s ease;
  }
  .chip:hover{border-color:var(--blue-500); color:var(--blue-700);}
  .chip[aria-pressed="true"]{
    background:var(--blue-700); border-color:var(--blue-700); color:#fff;
  }

  /* ---------- section heading ---------- */
  .section-head{
    display:flex; align-items:baseline; justify-content:space-between;
    gap:16px; padding:34px 0 18px; border-bottom:1px solid var(--line);
    margin-bottom:26px;
  }
  .section-head h2{font-size:1.9rem;}
  .section-head span{font-family:'JetBrains Mono',monospace; font-size:.78rem; color:var(--ink-soft);}

  /* ---------- product grid ---------- */
  .grid{
    display:grid; grid-template-columns:repeat(auto-fill, minmax(230px,1fr));
    gap:20px; padding-bottom:56px;
  }
  .card{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:12px;
    padding:18px 18px 16px;
    position:relative;
    box-shadow:var(--shadow);
    display:flex; flex-direction:column; gap:10px;
    transition:transform .15s ease, box-shadow .15s ease;
  }
  .card::before{
    content:"";
    position:absolute; left:14px; right:14px; top:0;
    height:1px;
    background-image:linear-gradient(to right, var(--line) 60%, transparent 0%);
    background-size:9px 1px; background-repeat:repeat-x;
  }
  .card[hidden]{display:none;}
  .card:hover{transform:translateY(-2px); box-shadow:0 4px 10px rgba(11,28,61,.08), 0 16px 32px -16px rgba(11,28,61,.28);}

  .badges{position:absolute; top:-9px; right:14px; display:flex; gap:6px;}
  .card-media{
    margin:2px -2px 2px; border-radius:8px; overflow:hidden;
    aspect-ratio:4/3; background:var(--surface-2);
  }
  .card-media img{width:100%; height:100%; object-fit:cover; display:block;}
  .card-media.placeholder{
    background:linear-gradient(160deg, var(--blue-100), var(--surface-2));
    display:flex; align-items:center; justify-content:center;
    border:1px dashed var(--line);
  }
  .card-media.placeholder span{
    font-family:'Big Shoulders Display',sans-serif; font-weight:800;
    font-size:1.15rem; color:var(--blue-700); text-transform:uppercase;
    opacity:.55; text-align:center; padding:0 14px; line-height:1.15;
  }
  .badge{
    font-family:'JetBrains Mono',monospace; font-weight:700; font-size:.68rem;
    letter-spacing:.04em; text-transform:uppercase;
    padding:4px 8px; border-radius:6px; color:#fff;
    box-shadow:0 2px 6px rgba(11,28,61,.25);
  }
  .badge.new{background:var(--blue-900);}
  .badge.sale{background:var(--sale);}
  .badge.best{background:#c9880a;}

  .cat{
    font-family:'JetBrains Mono',monospace; font-size:.68rem; font-weight:700;
    text-transform:uppercase; letter-spacing:.1em; color:var(--ink-soft);
  }
  .name{font-size:1.06rem; font-weight:700; color:var(--ink); line-height:1.3;}
  .unit{font-size:.82rem; color:var(--ink-soft);}

  .price-row{
    margin-top:auto; padding-top:8px; border-top:1px dashed var(--line);
    display:flex; align-items:baseline; justify-content:space-between; gap:8px;
  }
  .price{
    font-family:'JetBrains Mono',monospace; font-weight:700; color:var(--blue-700);
    font-size:1.5rem;
  }
  .price sup{font-size:.85rem; font-weight:700;}
  .price.was{
    font-size:.85rem; font-weight:500; color:var(--ink-soft);
    text-decoration:line-through; margin-right:6px;
  }
  .card.on-sale .price{color:var(--sale);}
  .per{font-family:'JetBrains Mono',monospace; font-size:.72rem; color:var(--ink-soft);}

  .card{text-decoration:none;}

  /* ---------- product detail ---------- */
  .detail{padding:8px 0 56px;}
  .back-link{
    display:inline-flex; align-items:center; gap:6px;
    font-family:'Karla',sans-serif; font-weight:700; font-size:.9rem;
    color:var(--blue-700); text-decoration:none; margin-bottom:22px;
  }
  .back-link:hover{text-decoration:underline;}
  .detail-grid{
    display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start;
  }
  .detail-media{
    border-radius:14px; overflow:hidden; aspect-ratio:4/3;
    box-shadow:var(--shadow);
  }
  .detail-media img{width:100%; height:100%; object-fit:cover; display:block;}
  .detail-media.placeholder{
    background:linear-gradient(160deg, var(--blue-100), var(--surface-2));
    display:flex; align-items:center; justify-content:center;
    border:1px dashed var(--line);
  }
  .detail-media.placeholder span{
    font-family:'Big Shoulders Display',sans-serif; font-weight:800;
    font-size:2.4rem; color:var(--blue-700); text-transform:uppercase;
    opacity:.55; text-align:center; padding:0 20px;
  }
  .detail-badges{display:flex; gap:8px; margin-bottom:12px;}
  .detail-cat{
    font-family:'JetBrains Mono',monospace; font-size:.74rem; font-weight:700;
    text-transform:uppercase; letter-spacing:.1em; color:var(--ink-soft);
  }
  .detail-title{font-size:clamp(1.8rem,3.6vw,2.6rem); margin-top:8px;}
  .detail-unit{color:var(--ink-soft); margin-top:8px; font-size:.98rem;}
  .detail-price-row{
    display:flex; align-items:baseline; gap:10px; margin-top:20px;
    padding-top:18px; border-top:1px dashed var(--line);
  }
  .detail-price{
    font-family:'JetBrains Mono',monospace; font-weight:700; color:var(--blue-700);
    font-size:2.2rem;
  }
  .detail-price sup{font-size:1.1rem;}
  .detail.on-sale .detail-price{color:var(--sale);}
  .detail-price-was{
    font-family:'JetBrains Mono',monospace; font-size:1rem; color:var(--ink-soft);
    text-decoration:line-through;
  }
  .detail-per{font-family:'JetBrains Mono',monospace; font-size:.8rem; color:var(--ink-soft);}
  .detail-desc{margin-top:22px; font-size:1.02rem; max-width:52ch;}
  .detail-points{list-style:none; margin:18px 0 0; padding:0; display:grid; gap:10px; max-width:52ch;}
  .detail-points li{
    display:flex; gap:10px; font-size:.95rem; color:var(--ink);
  }
  .detail-points li::before{
    content:"✓"; color:var(--blue-600); font-weight:700; flex:none;
  }
  .detail-note{
    margin-top:24px; font-size:.86rem; color:var(--ink-soft);
    border-left:2px solid var(--line); padding-left:12px;
  }
  .detail-cta{
    display:inline-flex; margin-top:26px; text-decoration:none;
    background:var(--blue-700); color:#fff; font-weight:700; font-size:.92rem;
    padding:12px 20px; border-radius:8px;
  }
  .detail-cta:hover{background:var(--blue-600);}
  .swatch-row{display:flex; gap:10px; margin-top:14px; flex-wrap:wrap;}
  .swatch{
    width:56px; height:56px; padding:0; border-radius:10px;
    border:2px solid var(--line); background:var(--surface); overflow:hidden;
    cursor:pointer; flex:none;
  }
  .swatch img{width:100%; height:100%; object-fit:cover; display:block;}
  .swatch:hover{border-color:var(--blue-500);}
  .swatch.selected{border-color:var(--blue-700); box-shadow:0 0 0 2px var(--blue-100);}

  .detail-specs, .detail-box{margin-top:26px; max-width:52ch;}
  .detail-specs h3, .detail-box h3{
    font-family:'JetBrains Mono',monospace; font-size:.74rem; font-weight:700;
    text-transform:uppercase; letter-spacing:.1em; color:var(--ink-soft);
    margin:0 0 10px;
  }
  .detail-specs dl{margin:0; display:grid; gap:0;}
  .spec-row{
    display:flex; justify-content:space-between; gap:14px;
    padding:8px 0; border-bottom:1px dashed var(--line); font-size:.92rem;
  }
  .spec-row dt{color:var(--ink-soft); margin:0;}
  .spec-row dd{margin:0; text-align:right; font-weight:600;}
  .detail-box ul{list-style:none; margin:0; padding:0; display:grid; gap:8px;}
  .detail-box li{
    font-size:.92rem; padding-left:16px; position:relative;
  }
  .detail-box li::before{
    content:"–"; position:absolute; left:0; color:var(--blue-500);
  }
  .detail-video-wrap{margin-top:22px;}
  .detail-video{
    display:inline-flex; align-items:center; gap:6px; text-decoration:none;
    color:var(--blue-700); font-weight:700; font-size:.9rem;
  }
  .detail-video:hover{text-decoration:underline;}

  @media (max-width:760px){
    .detail-grid{grid-template-columns:1fr;}
  }

  /* ---------- info strip ---------- */
  .info{
    background:var(--surface-2);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    padding:36px 0;
  }
  .info-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
  }
  .info-grid h3{font-size:1.1rem; color:var(--blue-800); margin-bottom:6px;}
  .info-grid p{margin:0; color:var(--ink-soft); font-size:.92rem;}

  /* ---------- footer ---------- */
  footer{padding:40px 0 48px;}
  .footer-grid{
    display:flex; flex-wrap:wrap; justify-content:space-between; gap:24px;
    padding-bottom:22px; border-bottom:1px solid var(--line);
  }
  .foot-brand{font-family:'Big Shoulders Display',sans-serif; font-weight:800; font-size:1.3rem; color:var(--blue-900);}
  .foot-cols{display:flex; gap:56px; flex-wrap:wrap;}
  .foot-col h4{
    font-family:'JetBrains Mono',monospace; font-size:.7rem; font-weight:700;
    text-transform:uppercase; letter-spacing:.1em; color:var(--ink-soft);
    margin:0 0 10px;
  }
  .foot-col p, .foot-col a{
    display:block; color:var(--ink); text-decoration:none; font-size:.92rem;
    margin-bottom:6px;
  }
  .foot-col a:hover{color:var(--blue-700);}
  .barcode{
    margin-top:18px; height:34px; display:flex; align-items:flex-end; gap:2px;
  }
  .barcode span{width:2px; background:var(--ink-soft); opacity:.55;}
  .fine{padding-top:18px; font-size:.78rem; color:var(--ink-soft); display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;}

  @media (max-width:760px){
    .hero-grid{grid-template-columns:1fr;}
    .hero-card{justify-self:start; max-width:100%;}
    .info-grid{grid-template-columns:1fr;}
    .topbar-inner{flex-wrap:wrap;}
  }

  @media (prefers-reduced-motion: reduce){
    .card{transition:none;}
  }

  /* ---------- consent popup ---------- */
  .consent-overlay{
    position:fixed; inset:0; z-index:100;
    background:rgba(26,35,56,.55);
    display:flex; align-items:center; justify-content:center;
    padding:20px;
  }
  .consent-overlay[hidden]{display:none;}
  .consent-modal{
    position:relative;
    background:var(--surface);
    color:var(--ink);
    border-radius:16px;
    padding:30px 28px 24px;
    max-width:420px; width:100%;
    box-shadow:0 20px 60px -20px rgba(0,0,0,.45);
    max-height:90vh; overflow-y:auto;
  }
  .consent-close{
    position:absolute; top:14px; right:14px;
    width:32px; height:32px; border-radius:50%;
    border:1px solid var(--line); background:var(--surface-2);
    color:var(--ink-soft); font-size:.95rem; line-height:1;
    cursor:pointer;
  }
  .consent-close:hover{color:var(--ink); border-color:var(--blue-500);}
  .consent-badge{
    display:inline-flex; align-items:center; gap:6px;
    font-family:'JetBrains Mono',monospace; font-size:.72rem; font-weight:700;
    letter-spacing:.08em; text-transform:uppercase;
    color:var(--blue-700); background:rgba(232,114,15,.1);
    border:1px solid rgba(232,114,15,.28);
    padding:5px 10px; border-radius:999px; margin-bottom:12px;
  }
  .consent-badge.success{color:var(--sale); background:var(--sale-soft); border-color:transparent;}
  .consent-modal h3{
    font-size:1.4rem; margin-bottom:8px; padding-right:20px;
  }
  .consent-sub{
    color:var(--ink-soft); font-size:.92rem; margin:0 0 18px; max-width:40ch;
  }
  .consent-field{
    display:block; margin-bottom:14px;
  }
  .consent-field span{
    display:block; font-size:.82rem; font-weight:700; color:var(--ink-soft);
    margin-bottom:5px;
  }
  .consent-field input{
    width:100%; padding:10px 12px; border-radius:8px;
    border:1px solid var(--line); background:var(--paper);
    color:var(--ink); font-family:'Karla',sans-serif; font-size:.94rem;
  }
  .consent-field input:focus-visible{outline:2px solid var(--focus); outline-offset:1px;}
  .consent-checkbox{
    display:flex; gap:10px; align-items:flex-start;
    margin:16px 0 18px; cursor:pointer;
  }
  .consent-checkbox input{margin-top:3px; flex:none;}
  .consent-checkbox span{font-size:.8rem; color:var(--ink-soft); line-height:1.4;}
  .consent-submit{
    width:100%; padding:12px; border:none; border-radius:8px;
    background:var(--blue-700); color:#fff; font-weight:700; font-size:.94rem;
    cursor:pointer; font-family:'Karla',sans-serif;
  }
  .consent-submit:hover{background:var(--blue-600);}
  .consent-submit:disabled{opacity:.6; cursor:default;}
  .consent-skip{
    display:block; width:100%; text-align:center; margin-top:10px;
    background:none; border:none; color:var(--ink-soft); font-size:.84rem;
    text-decoration:underline; cursor:pointer; font-family:'Karla',sans-serif;
  }
  .consent-fine{
    font-size:.72rem; color:var(--ink-soft); margin:16px 0 0; line-height:1.5;
  }
  .consent-fine a{color:var(--blue-700);}
  #consent-success h3{margin-top:4px;}

/* ==================== SKLEP: koszyk, konto, checkout ==================== */

.nav-cart{
  position:relative; display:inline-flex; align-items:center; gap:6px;
}
.cart-badge{
  position:absolute; top:-8px; right:-14px;
  background:var(--blue-700); color:#fff; font-size:.68rem; font-weight:700;
  border-radius:999px; min-width:17px; height:17px; padding:0 4px;
  display:flex; align-items:center; justify-content:center; line-height:1;
}

.shop-wrap{ max-width:1180px; margin:0 auto; padding:32px 24px 64px; }
.shop-header{ margin-bottom:24px; }
.shop-header h1{
  font-family:'Big Shoulders Display', sans-serif; text-transform:uppercase;
  font-size:2rem; color:var(--blue-900); letter-spacing:.01em; margin:0 0 6px;
}
.breadcrumbs{ font-size:.82rem; color:var(--ink-soft); margin-bottom:18px; }
.breadcrumbs a{ color:var(--ink-soft); }

.flash{
  padding:12px 16px; border-radius:10px; font-size:.9rem; margin-bottom:20px;
  border:1px solid var(--line);
}
.flash.success{ background:var(--sale-soft); border-color:var(--sale); color:var(--ink); }
.flash.error{ background:#fdeaea; border-color:#d9534f; color:#7a2622; }
:root:not([data-theme="light"]) .flash.error{ background:#3a1f1f; color:#f5c6c3; }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:11px 20px; border-radius:8px; border:none; cursor:pointer;
  font-family:'Karla',sans-serif; font-weight:700; font-size:.92rem;
  text-decoration:none; line-height:1.2;
}
.btn-primary{ background:var(--blue-700); color:#fff; }
.btn-primary:hover{ background:var(--blue-600); }
.btn-secondary{ background:var(--surface); color:var(--ink); border:1px solid var(--line); }
.btn-secondary:hover{ border-color:var(--blue-500); color:var(--blue-700); }
.btn-danger{ background:none; color:#b34440; border:1px solid #e3b8b5; }
:root:not([data-theme="light"]) .btn-danger{ color:#f2a29c; border-color:#6b3230; }
.btn:disabled{ opacity:.55; cursor:default; }
.btn-block{ width:100%; }

.auth-card, .checkout-card{
  max-width:440px; margin:0 auto; background:var(--surface);
  border:1px solid var(--line); border-radius:14px; padding:28px 26px;
  box-shadow:var(--shadow);
}
.checkout-card{ max-width:560px; }
.form-field{ margin-bottom:16px; }
.form-field label{
  display:block; font-size:.82rem; font-weight:700; color:var(--ink);
  margin-bottom:6px;
}
.form-field input, .form-field textarea{
  width:100%; padding:11px 13px; border-radius:8px; border:1px solid var(--line);
  background:var(--paper); color:var(--ink); font-family:'Karla',sans-serif; font-size:.94rem;
}
.form-field input:focus-visible, .form-field textarea:focus-visible{
  outline:2px solid var(--focus); outline-offset:1px;
}
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:520px){ .form-row{ grid-template-columns:1fr; } }
.form-hint{ font-size:.78rem; color:var(--ink-soft); margin-top:22px; text-align:center; }
.form-hint a{ color:var(--blue-700); font-weight:700; text-decoration:none; }

.cart-table{ width:100%; border-collapse:collapse; }
.cart-table th{
  text-align:left; font-size:.74rem; text-transform:uppercase; letter-spacing:.04em;
  color:var(--ink-soft); padding:0 8px 10px; border-bottom:1px solid var(--line);
}
.cart-table td{ padding:16px 8px; border-bottom:1px solid var(--line-soft); vertical-align:middle; }
.cart-product{ display:flex; align-items:center; gap:14px; }
.cart-product img{ width:64px; height:64px; object-fit:cover; border-radius:8px; border:1px solid var(--line); }
.cart-product a{ color:var(--ink); text-decoration:none; font-weight:700; font-size:.92rem; }
.qty-form{ display:inline-flex; align-items:center; gap:6px; }
.qty-form input{
  width:52px; text-align:center; padding:7px 4px; border-radius:6px;
  border:1px solid var(--line); background:var(--paper); color:var(--ink);
}
.qty-form button{
  width:30px; height:30px; border-radius:6px; border:1px solid var(--line);
  background:var(--surface); color:var(--ink); cursor:pointer; font-size:1rem;
}
.cart-remove{ background:none; border:none; color:var(--ink-soft); text-decoration:underline; cursor:pointer; font-size:.8rem; }
.cart-summary{
  margin-top:24px; padding-top:20px; border-top:2px solid var(--ink);
  display:flex; justify-content:flex-end; align-items:center; gap:18px;
}
.cart-summary .total-label{ color:var(--ink-soft); font-size:.9rem; }
.cart-summary .total-value{ font-family:'JetBrains Mono',monospace; font-weight:700; font-size:1.4rem; color:var(--ink); }
.cart-empty{ text-align:center; padding:60px 20px; color:var(--ink-soft); }

.order-summary-box{
  background:var(--surface-2); border:1px solid var(--line); border-radius:10px;
  padding:16px 18px; margin-bottom:22px; font-size:.88rem;
}
.order-summary-box .row{ display:flex; justify-content:space-between; padding:4px 0; }
.order-summary-box .row.total{ font-weight:700; border-top:1px solid var(--line); margin-top:6px; padding-top:10px; }

.status-pill{
  display:inline-block; padding:4px 10px; border-radius:999px; font-size:.72rem; font-weight:700;
  background:var(--surface-2); color:var(--blue-700); border:1px solid var(--line);
}

.account-grid{ display:grid; grid-template-columns:220px 1fr; gap:28px; }
@media (max-width:720px){ .account-grid{ grid-template-columns:1fr; } }
.account-nav{ display:flex; flex-direction:column; gap:4px; }
.account-nav a{
  padding:10px 14px; border-radius:8px; color:var(--ink); text-decoration:none; font-size:.88rem; font-weight:600;
}
.account-nav a:hover, .account-nav a.active{ background:var(--surface-2); }
.order-row{
  border:1px solid var(--line); border-radius:10px; padding:14px 16px; margin-bottom:12px;
  display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap;
}
