:root{
    --tray-cell:#b9866499;
    --accent:#5c1a1f;
    --text-dark:#3a2018;
    --text-light:#f4e9df;
    --text-muted:#6b5248;
    --line:#c4a894;
  }

  html{ scroll-behavior:smooth; }
  *{box-sizing:border-box; margin:0; padding:0;}
  #nabory, #constructor, #stones{ scroll-margin-top: 20px; }

  body{
    font-family:'Georgia','Times New Roman',serif;
    background:#f4efe8;
    color:var(--text-dark);
  }

  .page{
    min-height:100vh;
    position:relative;
  }
  .page::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:
      linear-gradient(180deg, rgba(255,250,244,.42) 0%, rgba(255,248,240,.22) 45%, rgba(248,240,230,.48) 100%),
      url("images/bg-marble.jpg") center / cover no-repeat;
    background-size:cover;
    background-position:center;
  }
  html[data-bg="rose"] .page::before{
    background-image:
      linear-gradient(180deg, rgba(255,252,250,.7) 0%, rgba(255,250,248,.58) 50%, rgba(255,248,246,.66) 100%),
      url("images/bg-option-rose.png");
  }
  html[data-bg="sage"] .page::before{
    background-image:
      linear-gradient(180deg, rgba(252,254,252,.82) 0%, rgba(248,252,248,.74) 50%, rgba(246,250,248,.78) 100%),
      url("images/bg-option-sage.png");
  }
  html[data-bg="champagne"] .page::before{
    background-image:
      linear-gradient(180deg, rgba(255,252,246,.68) 0%, rgba(255,250,244,.56) 50%, rgba(252,246,236,.64) 100%),
      url("images/bg-option-champagne.png");
  }
  .page > *{ position:relative; z-index:1; }
  .page > header{ z-index:50; }

  .container{
    max-width:1240px;
    margin:0 auto;
    padding:0 48px;
  }

  /* ---------- Header ---------- */
  header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:30px 48px;
    position:relative;
    z-index:40;
  }
  .nav-left{
    display:flex;
    align-items:center;
    gap:44px;
  }
  .logo{
    font-size:26px;
    letter-spacing:1px;
    color:var(--text-dark);
    background:none;
    border:none;
    cursor:pointer;
    font-family:'Georgia', serif;
    text-decoration:none;
  }
  nav.links{
    display:flex;
    gap:32px;
  }
  nav.links a, nav.links button{
    background:none;
    border:none;
    color:var(--text-muted);
    font-family:Arial, sans-serif;
    font-size:14px;
    letter-spacing:.3px;
    cursor:pointer;
    position:relative;
    padding:4px 0;
    text-decoration:none;
  }
  nav.links a::after, nav.links button::after{
    content:"";
    position:absolute;
    left:0; right:0; bottom:-2px;
    height:1px;
    background:var(--accent);
    transform:scaleX(0);
    transition:transform .2s ease;
  }
  nav.links a:hover::after, nav.links button:hover::after{ transform:scaleX(1); }
  nav.links a:hover, nav.links button:hover{ color:var(--accent); }

  .nav-right{
    display:flex;
    align-items:center;
    gap:10px;
  }
  .bg-switch{
    display:flex;
    align-items:center;
    gap:6px;
    margin-right:8px;
    padding:4px;
    border:1px solid rgba(58,32,24,.14);
    border-radius:999px;
    background:rgba(255,252,248,.72);
  }
  .bg-switch button{
    width:22px;
    height:22px;
    border-radius:50%;
    border:1px solid rgba(58,32,24,.2);
    cursor:pointer;
    padding:0;
    background-size:cover;
    background-position:center;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);
  }
  .bg-switch button[data-bg="marble"]{ background:#f4efe8; }
  .bg-switch button[data-bg="rose"]{ background:#e8c9c4; }
  .bg-switch button[data-bg="sage"]{ background:#7a846c; }
  .bg-switch button[data-bg="champagne"]{ background:#dcc9a4; }
  .bg-switch button.is-on{
    outline:2px solid var(--accent);
    outline-offset:1px;
  }
  .icon-btn{
    background:none;
    border:none;
    color:var(--text-dark);
    cursor:pointer;
    padding:9px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    transition:background .15s ease, transform .15s ease;
  }
  .icon-btn:hover{ background:rgba(58,32,24,.08); }
  .icon-btn:active{ transform:scale(.92); }
  .icon-btn svg{ width:20px; height:20px; stroke:currentColor; fill:none; }

  /* ---------- Mobile Burger ---------- */
  .burger{
    display:none;
    background:none;
    border:none;
    color:var(--text-dark);
    cursor:pointer;
    padding:9px;
    flex-direction:column;
    gap:5px;
  }
  .burger span{
    display:block;
    width:22px;
    height:2px;
    background:var(--text-dark);
    border-radius:2px;
    transition:all .3s ease;
  }

  /* ---------- Constructor ---------- */
  .hero{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:28px;
    padding:28px 0 24px;
  }
  .ctor-head{
    text-align:center;
  }
  .ctor-title{
    font-size:40px;
    line-height:1.15;
    color:var(--text-dark);
    font-weight:500;
    letter-spacing:.6px;
    text-shadow:0 1px 0 rgba(255,255,255,.45);
  }
  .ctor-head #heroText{
    margin:14px auto 0;
    max-width:560px;
    font-family:Arial, sans-serif;
    font-size:15px;
    line-height:1.6;
    color:var(--text-muted);
  }
  .constructor-stage{
    display:grid;
    grid-template-columns:minmax(320px, 1.12fr) minmax(0, 1fr);
    gap:22px;
    align-items:start;
    min-width:0;
  }
  .stone-case{
    display:flex;
    flex-direction:column;
    min-width:0;
    width:100%;
    min-height:28rem;
    max-height:36rem;
    overflow:hidden;
    background:
      linear-gradient(180deg, rgba(255,252,248,.94) 0%, rgba(245,236,224,.9) 100%);
    border-radius:28px;
    border:1px solid rgba(58,32,24,.12);
    box-shadow:
      0 18px 40px rgba(58,32,24,.12),
      inset 0 1px 0 rgba(255,255,255,.7);
    padding:18px 18px 16px;
    transition:opacity .45s ease, filter .45s ease;
  }
  .stone-case-head h2{
    font-size:22px;
    font-weight:500;
    color:var(--text-dark);
    line-height:1.2;
    letter-spacing:.3px;
  }
  .stone-case-head p{
    margin-top:6px;
    font-family:Arial, sans-serif;
    font-size:12.5px;
    line-height:1.4;
    color:var(--text-muted);
  }
  .stone-case-tabs{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin:14px 0 12px;
  }
  .stone-case-tabs button{
    border-radius:999px;
    border:1px solid rgba(90,60,30,.22);
    background:rgba(255,248,236,.6);
    color:var(--text-dark);
    font-family:Arial, sans-serif;
    font-size:12px;
    letter-spacing:.2px;
    padding:7px 12px;
    cursor:pointer;
  }
  .stone-case-tabs button.is-on{
    background:#4a1216;
    color:#f4e6df;
    border-color:#4a1216;
  }
  .stone-case-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:10px;
    overflow-y:auto;
    flex:1;
    min-height:0;
    padding-right:2px;
    align-content:start;
  }
  .stone-chip{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:7px;
    padding:10px 6px 8px;
    border:1px solid rgba(58,32,24,.1);
    border-radius:14px;
    background:rgba(255,255,255,.62);
    cursor:grab;
    color:inherit;
    font:inherit;
    box-shadow:0 4px 12px rgba(58,32,24,.06);
    user-select:none;
  }
  .stone-chip:active{ cursor:grabbing; }
  .stone-chip.is-held{
    outline:2px solid var(--accent);
    outline-offset:1px;
    background:rgba(255,252,248,.95);
  }
  .stone-chip img{
    width:58px;
    height:58px;
    object-fit:cover;
    border-radius:50%;
    box-shadow:0 4px 10px rgba(58,32,24,.16);
    pointer-events:none;
  }
  .stone-chip span{
    font-family:Arial, sans-serif;
    font-size:12px;
    line-height:1.2;
    text-align:center;
    color:var(--text-dark);
  }
  .slot.drop-ready{
    outline:2px dashed rgba(92,26,31,.45);
    outline-offset:-3px;
  }
  .slot.drop-over{
    outline:2px solid var(--accent);
    outline-offset:-2px;
    filter:brightness(1.08);
  }

    .hero-copy h1{
    font-size:42px;
    line-height:1.14;
    color:var(--text-dark);
    font-weight:500;
    text-shadow:0 1px 0 rgba(255,255,255,.45);
    max-width:520px;
  }
  .hero-copy p{
    margin-top:20px;
    font-family:Arial, sans-serif;
    font-size:15px;
    line-height:1.6;
    color:var(--text-muted);
    max-width:420px;
  }

  .divider{
    display:flex;
    align-items:center;
    gap:10px;
    margin:26px 0 0;
    width:220px;
  }
  .divider .line{
    height:1px;
    flex:1;
    background:linear-gradient(90deg, var(--line), transparent);
  }
  .divider .star{ color:var(--line); font-size:14px; }

  .hero-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px 16px;
    margin-top:18px;
  }
  .set-bar{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-end;
    justify-content:center;
    gap:12px 16px;
    margin:18px auto 0;
    max-width:680px;
  }
  .set-bar-name{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
    flex:1;
    min-width:220px;
    text-align:left;
  }
  .set-bar-name span{
    font-family:Arial, sans-serif;
    font-size:11px;
    letter-spacing:.4px;
    color:var(--text-muted);
  }
  .set-bar-name input{
    width:100%;
    padding:11px 14px;
    border-radius:14px;
    border:1px solid rgba(58,32,24,.18);
    background:rgba(255,252,248,.82);
    font-family:Georgia, serif;
    font-size:16px;
    color:var(--text-dark);
  }
  .set-bar-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
  }
  .set-bar-actions .ghost{
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    padding:10px 16px;
  }
  .set-save{
    font-family:Arial, sans-serif;
    font-size:12px;
    color:var(--text-muted);
  }
  .sets-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:16px;
    flex-wrap:wrap;
    margin:8px 0 4px;
  }
  .sets-head .lead{ margin:6px 0 0; max-width:540px; }
  .sets-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
    gap:16px;
    margin:18px 0 40px;
  }
  .set-card-mine{
    background:rgba(255,252,248,.9);
    border:1px solid rgba(58,32,24,.12);
    border-radius:20px;
    padding:18px;
    box-shadow:0 12px 28px rgba(58,32,24,.08);
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  .set-card-top{
    display:flex;
    justify-content:space-between;
    gap:10px;
    align-items:flex-start;
  }
  .set-card-name{
    width:100%;
    border:none;
    background:transparent;
    font:inherit;
    font-size:20px;
    color:var(--text-dark);
    padding:0 0 4px;
  }
  .set-card-name:focus{
    outline:none;
    border-bottom:1px solid rgba(58,32,24,.25);
  }
  .set-card-meta{
    font-family:Arial, sans-serif;
    font-size:12px;
    line-height:1.4;
    color:var(--text-muted);
    text-align:right;
    white-space:nowrap;
  }
  .set-progress{
    height:4px;
    border-radius:99px;
    background:rgba(58,32,24,.1);
    overflow:hidden;
  }
  .set-progress i{
    display:block;
    height:100%;
    background:linear-gradient(90deg,#6d1f26,#c45);
    border-radius:99px;
  }
  .set-card-status{
    margin:0;
    font-family:Arial, sans-serif;
    font-size:12px;
    letter-spacing:.3px;
    color:var(--accent);
  }
  .set-card-mine .mini-tray{
    margin:0;
    display:grid;
    grid-template-columns:repeat(5, 36px);
    gap:6px;
  }
  .set-card-mine .mini-slot{ width:36px; height:36px; }
  .set-card-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }
  .set-card-actions .cta,
  .set-card-actions .ghost{
    padding:10px 14px;
    font-size:12px;
    letter-spacing:.3px;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
  }
  .set-card-empty{
    grid-column:1 / -1;
    text-align:center;
    padding:36px 18px;
  }
  .cart-row-custom{
    grid-template-columns:96px 1fr 70px auto auto;
    align-items:center;
  }
  .cart-custom-preview{
    width:96px;
  }
  .cart-custom-preview .mini-tray{
    margin:0;
    display:grid;
    grid-template-columns:repeat(4, 20px);
    gap:4px;
    justify-content:start;
  }
  .cart-custom-preview .mini-tray[data-size="4"]{ grid-template-columns:repeat(2, 28px); }
  .cart-custom-preview .mini-tray[data-size="6"]{ grid-template-columns:repeat(3, 22px); }
  .cart-custom-preview .mini-tray[data-size="10"]{ grid-template-columns:repeat(5, 16px); }
  .cart-custom-preview .mini-slot{
    width:20px;
    height:20px;
    font-size:8px;
    border-radius:50%;
    overflow:hidden;
  }
  .cart-custom-preview .mini-tray[data-size="4"] .mini-slot{ width:28px; height:28px; }
  .cart-custom-preview .mini-tray[data-size="6"] .mini-slot{ width:22px; height:22px; }
  .cart-custom-preview .mini-tray[data-size="10"] .mini-slot{ width:16px; height:16px; }
  .cart-custom-preview .mini-slot img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    border-radius:50%;
  }
  .cart-row p{
    font-family:Arial, sans-serif;
    font-size:13px;
    color:var(--text-muted);
    margin:4px 0;
  }
  .cta{
    padding:17px 38px;
    background:linear-gradient(180deg,#6d1f26,#4a1216);
    color:#f4e6df;
    border:none;
    border-radius:40px;
    font-size:13.5px;
    letter-spacing:2px;
    font-family:Arial, sans-serif;
    font-weight:600;
    cursor:pointer;
    box-shadow:0 10px 24px rgba(0,0,0,.35);
    transition:transform .15s ease, filter .15s ease;
  }
  .cta:hover{ filter:brightness(1.1); }
  .cta:active{ transform:scale(.98); }

  .info-pill{
    display:flex;
    align-items:center;
    gap:8px;
    padding:11px 18px;
    border:1px solid rgba(58,32,24,.22);
    background:rgba(255,252,248,.55);
    border-radius:999px;
    color:var(--text-muted);
    font-size:13px;
    font-family:Arial, sans-serif;
    white-space:nowrap;
    flex:0 1 auto;
    width:auto;
    max-width:100%;
  }

  /* ---------- 3D box stage (WebGL) ---------- */
  .box-scroll{
    height:auto;
  }
  .box-sticky{
    padding-bottom:12px;
    overflow:visible;
  }
  .tray-wrap{
    min-width:0;
    align-self:start;
    overflow:visible;
  }
  .box-scene{
    padding:12px 0 4px;
    overflow:visible;
  }
  .box-stage{
    position:relative;
    width:100%;
    aspect-ratio: 1.25 / 1;
  }
  .box-canvas{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    display:block;
  }
  .box-stage .tray-grid{
    position:absolute;
    inset:0;
    display:block;
    gap:0;
    padding:0;
    pointer-events:none;
    transition:opacity .4s ease;
  }
  .box-stage .tray-grid .slot{
    position:absolute;
    width:auto;
    height:auto;
    aspect-ratio:auto;
    pointer-events:auto;
    background:transparent;
    border:none;
    border-radius:7px;
    box-shadow:none;
    padding:0;
    gap:4px;
    transition:background .15s ease, box-shadow .15s ease;
  }
  .box-stage .slot:hover{
    transform:none;
    filter:none;
    background:rgba(255,255,255,.22);
  }
  .box-stage .slot:active{ transform:none; }
  .box-stage .slot .plus-circle{
    width:24px;
    height:24px;
    font-size:14px;
    border-color:rgba(66,88,102,.42);
    color:rgba(66,88,102,.52);
  }
  .box-stage .slot .label{ display:none; }
  .box-stage .slot .slot-bead{
    position:absolute;
    inset:auto;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    width:auto;
    height:76%;
    aspect-ratio:1 / 1;
    object-fit:cover;
    border-radius:50%;
    box-shadow:0 3px 7px rgba(38,50,60,.3);
  }
  .box-stage .slot.filled{
    background:transparent;
    gap:0;
  }
  .box-stage .slot.filled::after{ box-shadow:none; }
  .box-stage .slot.drop-ready{ background:rgba(255,255,255,.18); }
  .box-stage .slot.drop-over{
    background:rgba(255,255,255,.34);
    box-shadow:0 0 0 2px rgba(74,18,22,.45);
  }
  .hero:not(.is-ready) .box-stage .tray-grid{
    opacity:0;
    pointer-events:none;
  }
  .hero:not(.is-ready) .stone-case{
    opacity:.28;
    pointer-events:none;
    filter:blur(1px);
  }
  .hero:not(.is-ready) .box-size{
    pointer-events:none;
    opacity:.55;
  }
  .hero.is-ready .stone-case{
    opacity:1;
    filter:none;
    transition:opacity .45s ease, filter .45s ease;
  }
  .hero.is-ready .box-size{ opacity:1; }
  .hero.no-3d .box-canvas{ display:none; }
  .hero.no-3d .box-stage{
    aspect-ratio:auto;
    min-height:0;
  }
  .hero.no-3d .box-stage .tray-grid{
    position:relative;
    display:grid;
    gap:8px;
    padding:10px 4px 4px;
    pointer-events:auto;
    opacity:1;
  }
  .hero.no-3d .box-stage .tray-grid .slot{
    position:relative;
    width:auto;
    height:auto;
    aspect-ratio:1;
    background:rgba(255,252,248,.72);
    border:1px solid rgba(58,32,24,.12);
    box-shadow:0 8px 18px rgba(58,32,24,.08);
    padding:8px 6px;
  }
  .hero.no-3d .box-stage .slot .label{ display:block; }
  .hero.no-3d .box-stage .slot .slot-bead{
    position:relative;
    left:auto;
    top:auto;
    transform:none;
    width:52px;
    height:52px;
  }

  .tray-card{
    display:none;
  }
  .box-size{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-bottom:16px;
    font-family:Arial, sans-serif;
    font-size:12px;
    letter-spacing:.4px;
    color:rgba(58,32,24,.62);
  }
  .box-size button{
    min-width:36px;
    height:32px;
    padding:0 10px;
    border-radius:999px;
    border:1px solid rgba(90,60,30,.28);
    background:rgba(255,248,236,.55);
    color:rgba(58,32,24,.78);
    cursor:pointer;
    font:inherit;
    font-weight:600;
  }
  .box-size button.is-on{
    background:#4a1216;
    color:#f4e6df;
    border-color:#4a1216;
  }
  .tray-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    grid-auto-rows:auto;
    align-items:start;
    gap:14px;
  }
  .tray-grid[data-size="4"]{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .tray-grid[data-size="4"] .slot{ aspect-ratio:2 / 1.08; }
  .tray-grid[data-size="6"]{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
  .tray-grid[data-size="8"]{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
  .tray-grid[data-size="10"]{
    grid-template-columns:repeat(5, minmax(0, 1fr));
    gap:10px;
  }
  .tray-grid[data-size="10"] .slot .plus-circle{ width:32px; height:32px; font-size:16px; }
  .slot{
    position:relative;
    overflow:hidden;
    width:100%;
    height:auto;
    aspect-ratio:1 / 1.1;
    align-self:start;
    background:linear-gradient(180deg, #f3e6d4, #e2ccae);
    border-radius:16px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    border:none;
    box-shadow:
      inset 0 8px 14px rgba(90,55,30,.18),
      inset 0 -2px 4px rgba(255,255,255,.4);
    transition:transform .15s ease, filter .15s ease, box-shadow .15s ease;
    color:var(--text-dark);
  }
  .slot:hover{ filter:brightness(1.04); transform:translateY(-2px); }
  .slot:active{ transform:scale(.96); }

  .slot .plus-circle{
    width:40px;
    height:40px;
    border-radius:50%;
    border:1.5px dashed rgba(90,64,48,.5);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
    color:rgba(90,64,48,.62);
  }
  .slot .label{
    font-size:13px;
    color:rgba(74,48,32,.7);
    text-align:center;
    line-height:1.25;
    font-family:Arial, sans-serif;
  }
  .slot .slot-bead{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center 48%;
    transform:scale(1.38);
    border-radius:inherit;
    box-shadow:none;
  }
  .slot.filled{
    gap:0;
    justify-content:flex-end;
    background:#2a1812;
  }
  .slot.filled::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    box-shadow:
      inset 0 10px 18px rgba(40,22,12,.42),
      inset 0 -5px 10px rgba(255,240,220,.12);
    pointer-events:none;
    z-index:2;
  }
  .slot.filled .label{
    position:relative;
    z-index:3;
    font-weight:600;
    font-size:11px;
    max-width:none;
    width:100%;
    margin:0;
    padding:28px 6px 10px;
    color:#f7efe6;
    background:linear-gradient(180deg, transparent, rgba(28,14,8,.78));
    text-shadow:0 1px 2px rgba(0,0,0,.45);
  }

  /* ---------- Features ---------- */
  .features{
    margin:56px 0 0;
    padding:22px 30px;
    border:1px solid rgba(58,32,24,.14);
    border-radius:20px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    background:rgba(255,252,248,.55);
  }
  .feature{
    display:flex;
    align-items:center;
    gap:14px;
    color:var(--text-muted);
    font-family:Arial, sans-serif;
    font-size:13.5px;
    background:none;
    border:none;
    cursor:pointer;
    padding:6px;
    text-align:left;
  }
  .feature svg{ width:24px; height:24px; stroke:var(--text-muted); fill:none; flex-shrink:0; }
  .feature:hover{ color:var(--accent); }
  .feature:hover svg{ stroke:var(--accent); }

  /* ---------- Popular stones ---------- */
  .stones-head{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    margin-top:64px;
  }
  .stones-title{
    font-size:30px;
    color:var(--text-dark);
    max-width:780px;
    line-height:1.2;
  }
  .stones-nav{
    display:flex;
    gap:10px;
  }
  .stones-nav button{
    width:36px;
    height:36px;
    border-radius:50%;
    border:1px solid rgba(58,32,24,.22);
    background:rgba(255,252,248,.55);
    color:var(--text-dark);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:background .15s ease;
  }
  .stones-nav button:hover{ background:rgba(58,32,24,.08); }

  .stones-scroll{
    display:flex;
    gap:26px;
    overflow-x:auto;
    padding:28px 4px 10px;
    scrollbar-width:none;
  }
  .stones-scroll::-webkit-scrollbar{ display:none; }

  .stone{
    flex:0 0 auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:12px;
    background:none;
    border:none;
    cursor:pointer;
    color:var(--text-muted);
    font-family:Arial, sans-serif;
    font-size:13px;
    width:110px;
  }
  .stone-photo{
    width:92px;
    height:92px;
    border-radius:50%;
    object-fit:cover;
    box-shadow:0 10px 22px rgba(58,32,24,.22), inset 0 0 0 2px rgba(255,255,255,.35);
    transition:transform .15s ease;
  }
  .stone:hover .stone-photo{ transform:translateY(-4px) scale(1.06); }
  .stone:active .stone-photo{ transform:scale(.95); }

  footer{
    margin-top:80px;
    padding:34px 0 40px;
    border-top:1px solid rgba(58,32,24,.14);
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-family:Arial, sans-serif;
    color:var(--text-muted);
    font-size:12.5px;
  }
  footer .foot-links{
    display:flex;
    gap:24px;
  }
  footer button{
    background:none;
    border:none;
    color:var(--text-muted);
    cursor:pointer;
    font-family:Arial, sans-serif;
    font-size:12.5px;
  }
  footer button:hover{ color:var(--accent); }

  .toast{
    position:fixed;
    left:50%;
    bottom:28px;
    transform:translateX(-50%) translateY(20px);
    background:#2c1b16;
    color:#f4e9df;
    padding:13px 22px;
    border-radius:10px;
    font-family:Arial, sans-serif;
    font-size:13.5px;
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease, transform .25s ease;
    z-index:50;
    box-shadow:0 10px 30px rgba(0,0,0,.4);
  }
  .toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

  /* Desktop: the box stage matches the height of the stone case and borrows the page margins */
  @media (min-width: 769px){
    .constructor-stage{
      align-items:stretch;
    }
    /* Keep the case a constant height so switching categories can't shrink the box stage */
    .stone-case{
      height:36rem;
    }
    .tray-wrap{
      align-self:stretch;
      display:flex;
      flex-direction:column;
      min-height:0;
    }
    .box-scene{
      display:flex;
      flex:1 1 auto;
      min-height:0;
    }
    .box-stage{
      flex:1 1 auto;
      height:100%;
      min-height:0;
      aspect-ratio:auto;
    }
  }
  @media (min-width: 900px){
    .constructor-stage{ margin-inline:-40px; }
  }

  @media (max-width: 1100px){
    .ctor-title{ font-size:34px; }
    .constructor-stage{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
    .stone-case-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
    .stone-chip img{ width:52px; height:52px; }
  }

  /* ============ MOBILE ============ */
  @media (max-width: 768px){
    .container{ padding:0 16px; }
    header{ padding:16px; }
    .nav-left{ gap:0; }
    nav.links{ display:none; }
    .burger{ display:flex; }
    .bg-switch{ margin-right:4px; }
    .bg-switch button{ width:18px; height:18px; }

    .hero{
      gap:20px;
      padding:20px 0;
      text-align:center;
    }
    .ctor-title{ font-size:28px; }
    .constructor-stage{
      grid-template-columns:1fr;
      gap:16px;
    }
    .stone-case{
      min-height:22rem;
      max-height:28rem;
      text-align:left;
      border-radius:20px;
    }
    .stone-case-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
    .ctor-head #heroText{ max-width:100%; font-size:14px; }
    .divider{ margin:16px auto 0; width:160px; }
    .hero-actions{ justify-content:center; flex-wrap:wrap; gap:14px; margin-top:24px; }
    .cta{ padding:14px 30px; font-size:12px; }
    .info-pill{ font-size:11px; padding:9px 16px; }

    .box-scene{ padding:8px 0 0; }
    .tray-card{ max-width:100%; margin-left:0; padding:14px; border-radius:18px; }
    .box-size{ margin-bottom:10px; gap:6px; font-size:11px; }
    .box-size button{ min-width:30px; height:28px; }
    .tray-grid{ gap:6px; }
    .tray-grid[data-size="10"]{ gap:5px; }
    .slot .plus-circle{ width:26px; height:26px; font-size:14px; }
    .slot .label{ font-size:9px; }
    .slot.filled .label{ font-size:10px; }
    .stone-picker{ padding:0; align-items:flex-end; }
    .stone-picker-sheet{ width:100%; border-radius:22px 22px 0 0; }

    .features{ grid-template-columns:1fr 1fr; gap:10px; padding:14px; margin-top:30px; }
    .feature{ font-size:11px; gap:8px; padding:4px; }
    .feature svg{ width:18px; height:18px; }

    .stones-head{ margin-top:36px; }
    .stones-title{ font-size:22px; }
    .stones-scroll{ gap:16px; padding:20px 0 8px; }
    .stone{ width:80px; }
    .stone-photo{ width:64px; height:64px; }

    footer{ flex-direction:column; gap:14px; text-align:center; padding:24px 0 30px; }
  }

  @media (prefers-reduced-motion: reduce){ *{ transition:none !important; } }

  a.logo{ text-decoration:none; display:inline-block; }
  nav.links a{
    background:none;
    border:none;
    color:var(--text-muted);
    font-family:Arial, sans-serif;
    font-size:14px;
    letter-spacing:.3px;
    cursor:pointer;
    position:relative;
    padding:4px 0;
    text-decoration:none;
  }
  nav.links a::after{
    content:"";
    position:absolute;
    left:0; right:0; bottom:-2px;
    height:1px;
    background:var(--accent);
    transform:scaleX(0);
    transition:transform .2s ease;
  }
  nav.links a:hover::after{ transform:scaleX(1); }
  nav.links a:hover{ color:var(--accent); }

  .catalog{
    margin-top:72px;
  }
  .catalog-banner{
    margin:0;
    width:100%;
    min-width:0;
    overflow:hidden;
    background:rgba(255,252,248,.32);
    border-bottom:1px solid rgba(58,32,24,.1);
  }
  .catalog-banner-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:12px 48px 8px;
  }
  .catalog-banner .stones-title{
    font-size:22px;
    max-width:none;
  }
  .catalog-banner .catalog-strip{
    display:flex;
    gap:10px;
    width:100%;
    min-width:0;
    overflow-x:auto;
    padding:0 10px 10px;
    scrollbar-width:none;
    scroll-snap-type:x proximity;
    overscroll-behavior-x:contain;
    cursor:grab;
    touch-action:pan-x;
  }
  .catalog-banner .catalog-strip.is-dragging{
    cursor:grabbing;
    scroll-snap-type:none;
  }
  .catalog-banner .catalog-strip .set-card{
    flex:0 0 clamp(168px, 20vw, 260px);
    width:clamp(168px, 20vw, 260px);
    border-radius:12px;
    border:1px solid rgba(58,32,24,.1);
    box-shadow:none;
    background:rgba(255,252,248,.78);
    scroll-snap-align:start;
  }
  .catalog-banner .catalog-strip .set-card:hover{
    transform:none;
    filter:brightness(1.04);
    z-index:1;
  }
  .catalog-top{
    margin-top:8px;
  }
  .catalog-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:22px;
    margin-top:28px;
  }
  .catalog-title-link{
    text-decoration:none;
    color:inherit;
    cursor:pointer;
  }
  .catalog-title-link:hover{ color:var(--accent); }
  .catalog-strip{
    display:flex;
    gap:14px;
    overflow-x:auto;
    padding:22px 4px 12px;
    scrollbar-width:none;
    scroll-snap-type:x proximity;
  }
  .catalog-strip::-webkit-scrollbar{ display:none; }
  .catalog-strip .set-card{
    flex:0 0 168px;
    width:168px;
    border-radius:14px;
    scroll-snap-align:start;
  }
  .catalog-strip .set-card:hover{ transform:translateY(-2px); }
  .catalog-strip .set-card img{
    height:auto;
    aspect-ratio:3 / 3.38;
    object-fit:cover;
    object-position:center top;
  }
  .catalog-strip .set-body{ padding:10px 12px 12px; }
  .catalog-strip .set-card h3{
    font-size:14px;
    line-height:1.25;
  }
  .catalog-strip .set-sub{ display:none; }
  .catalog-strip .set-price{
    margin-top:8px;
    font-size:13px;
  }
  .catalog-grid-lg{
    grid-template-columns:repeat(3, 1fr);
    gap:16px;
    margin-top:24px;
  }
  .catalog-grid-lg .set-card{
    border-radius:14px;
  }
  .catalog-grid-lg .set-card img{
    height:auto;
    aspect-ratio:3 / 3.38;
    object-fit:cover;
    object-position:center top;
  }
  .catalog-grid-lg .set-body{ padding:12px 14px 14px; }
  .catalog-grid-lg .set-card h3{ font-size:16px; }
  .catalog-grid-lg .set-sub{
    font-size:12px;
    min-height:0;
  }
  .catalog-grid-lg .set-price{ font-size:14px; }
  .catalog-page h1{
    font-size:36px;
    color:var(--text-dark);
    margin:12px 0 0;
    line-height:1.2;
  }
  .set-card{
    display:flex;
    flex-direction:column;
    background:rgba(255,252,248,.72);
    border:1px solid rgba(58,32,24,.12);
    border-radius:18px;
    overflow:hidden;
    text-decoration:none;
    color:inherit;
    box-shadow:0 12px 28px rgba(58,32,24,.1);
    transition:transform .18s ease, box-shadow .18s ease;
  }
  .set-card:hover{ transform:translateY(-4px); box-shadow:0 18px 36px rgba(58,32,24,.16); }
  .set-card img{
    width:100%;
    aspect-ratio:3 / 3.38;
    height:auto;
    display:block;
    object-fit:cover;
    object-position:center top;
    background:#f7f1e8;
  }
  .set-card .set-body{ padding:16px 18px 18px; }
  .set-card h3{
    font-size:20px;
    font-weight:500;
    color:var(--text-dark);
  }
  .set-card .set-sub{
    margin-top:6px;
    font-family:Arial, sans-serif;
    font-size:12.5px;
    line-height:1.45;
    color:var(--text-muted);
    min-height:36px;
  }
  .set-card .set-price{
    margin-top:12px;
    font-family:Arial, sans-serif;
    font-size:15px;
    font-weight:700;
    color:var(--accent);
  }

  .product-wrap{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
    gap:48px;
    align-items:start;
    padding:20px 0 10px;
  }
  .product-gallery{
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  .product-photo{
    border-radius:22px;
    overflow:visible;
    background:#f7f1e8;
    box-shadow:0 24px 48px rgba(58,32,24,.18);
  }
  .product-photo > img{
    width:100%;
    max-width:100%;
    height:auto;
    display:block;
    border-radius:22px;
  }
  .gallery-arrow{
    width:42px; height:42px;
    border:none; border-radius:50%;
    background:var(--accent);
    color:#fff;
    cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 14px rgba(92,26,31,.28);
    flex:none;
  }
  .gallery-arrow:hover{ filter:brightness(1.12); }
  .gallery-count{
    margin:0;
    text-align:center;
    font-family:Arial,sans-serif;
    font-size:12px;
    color:var(--text-muted);
  }
  .gallery-thumbs-wrap{
    display:flex;
    align-items:center;
    gap:8px;
  }
  .gallery-thumbs{
    display:flex;
    gap:8px;
    overflow-x:auto;
    flex:1;
    padding:2px 0;
    scrollbar-width:thin;
  }
  .gallery-scroll{
    flex:none;
    width:30px; height:30px;
    border:1px solid rgba(58,32,24,.2);
    border-radius:50%;
    background:rgba(255,252,248,.95);
    cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    color:var(--text-dark);
  }
  .gallery-thumb{
    flex:none;
    width:64px; height:80px;
    padding:0;
    border:2px solid rgba(58,32,24,.14);
    border-radius:10px;
    overflow:hidden;
    cursor:pointer;
    background:#f7f1e8;
  }
  .gallery-thumb img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
    background:#f7f1e8;
  }
  .gallery-thumb.is-active{ border-color:var(--accent); }
  .gallery-admin{ display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
  .gallery-admin-item{
    width:72px;
    display:flex;
    flex-direction:column;
    gap:4px;
    align-items:center;
  }
  .gallery-admin-item img{
    width:72px; height:72px; object-fit:cover; border-radius:10px; display:block;
  }
  .gallery-admin-item button{ padding:4px 8px; font-size:11px; }
  .product-copy h1{
    font-size:40px;
    line-height:1.15;
    font-weight:500;
  }
  .product-copy .lead{
    margin-top:16px;
    font-family:Arial, sans-serif;
    font-size:15px;
    line-height:1.6;
    color:var(--text-muted);
  }
  .product-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:22px;
  }
  .chip{
    font-family:Arial, sans-serif;
    font-size:12.5px;
    padding:8px 14px;
    border-radius:999px;
    border:1px solid rgba(58,32,24,.18);
    background:rgba(255,252,248,.7);
  }
  .product-price{
    margin-top:26px;
    font-size:28px;
    color:var(--accent);
    font-family:Arial, sans-serif;
    font-weight:700;
  }
  .stone-list{
    margin-top:22px;
    padding-left:18px;
    font-family:Arial, sans-serif;
    font-size:14.5px;
    line-height:1.7;
    color:var(--text-dark);
  }
  .product-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top:28px; align-items:center; }
  a.cta{ display:inline-flex; align-items:center; text-decoration:none; }
  .back-link{
    font-family:Arial, sans-serif;
    font-size:13px;
    color:var(--text-muted);
    text-decoration:none;
  }
  .back-link:hover{ color:var(--accent); }

  @media (max-width: 768px){
    .catalog-grid{ grid-template-columns:1fr 1fr; gap:10px; }
    .catalog-grid .set-card img{ height:auto; aspect-ratio:3 / 3.38; object-fit:cover; object-position:center top; }
    .catalog-grid .set-sub{ display:none; }
    .catalog-grid .set-card h3{ font-size:13px; }
    .catalog-grid .set-body{ padding:8px 10px 10px; }
    .catalog-grid .set-price{ font-size:12px; margin-top:6px; }
    .catalog-grid-lg{ grid-template-columns:1fr 1fr; gap:10px; }
    .catalog-grid-lg .set-card img{ height:auto; }
    .catalog-grid-lg .set-card h3{ font-size:13px; }
    .catalog-grid-lg .set-sub{ display:none; }
    .catalog-page h1{ font-size:22px; }
    .catalog-strip .set-card{ flex-basis:140px; width:140px; }
    .catalog-strip .set-card img{ height:auto; }
    .catalog-banner-bar{ padding:8px 16px 6px; }
    .catalog-banner .stones-title{ font-size:16px; }
    .catalog-banner .catalog-strip .set-card{
      flex-basis:42vw;
      width:42vw;
      min-width:140px;
    }
    .product-wrap{ grid-template-columns:1fr; gap:22px; }
    .product-copy h1{ font-size:28px; }
    .gallery-thumb{ width:56px; height:70px; }
  }

  .admin-page{ max-width:980px; margin:0 auto; padding:32px 20px 80px; }
  .admin-page h1{ font-size:32px; margin-bottom:8px; }
  .admin-lead{ font-family:Arial,sans-serif; color:var(--text-muted); margin-bottom:28px; }
  .admin-card{
    background:rgba(255,252,248,.86);
    border:1px solid rgba(58,32,24,.12);
    border-radius:18px;
    padding:22px;
    box-shadow:0 12px 28px rgba(58,32,24,.1);
  }
  .admin-card label{
    display:block;
    font-family:Arial,sans-serif;
    font-size:12px;
    color:var(--text-muted);
    margin:12px 0 6px;
  }
  .admin-card input, .admin-card textarea{
    width:100%;
    padding:11px 12px;
    border-radius:10px;
    border:1px solid rgba(58,32,24,.2);
    font-family:Arial,sans-serif;
    font-size:14px;
    background:#fff;
    color:var(--text-dark);
  }
  .admin-card textarea{ min-height:90px; resize:vertical; }
  .admin-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .admin-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
  .admin-list{ margin-top:28px; display:flex; flex-direction:column; gap:10px; }
  .admin-item{
    display:grid;
    grid-template-columns:72px 1fr auto;
    gap:14px;
    align-items:center;
    padding:10px;
    background:rgba(255,252,248,.86);
    border-radius:14px;
    border:1px solid rgba(58,32,24,.1);
  }
  .admin-item img{ width:72px; height:72px; object-fit:cover; border-radius:10px; background:#efe6d8; }
  .admin-item h3{ font-size:16px; font-weight:500; }
  .admin-item p{ font-family:Arial,sans-serif; font-size:12px; color:var(--text-muted); }
  .ghost{
    background:none;
    border:1px solid rgba(58,32,24,.25);
    color:var(--text-dark);
    padding:12px 18px;
    border-radius:40px;
    font-family:Arial,sans-serif;
    cursor:pointer;
  }
  a.ghost{ text-decoration:none; display:inline-flex; align-items:center; }
  .danger{ color:#8a1c22; border-color:#8a1c22; }
  .preview-img{ max-width:180px; margin-top:8px; border-radius:10px; display:none; }
  a.feature{
    text-decoration:none;
    color:inherit;
  }
  a.stone{ text-decoration:none; color:inherit; }
  footer a{
    background:none;
    border:none;
    color:var(--text-muted);
    cursor:pointer;
    font-family:Arial, sans-serif;
    font-size:12.5px;
    text-decoration:none;
  }
  footer a:hover{ color:var(--accent); }
  a.icon-btn{ color:inherit; text-decoration:none; }
  .cart-btn{ position:relative; }
  .cart-badge{
    position:absolute;
    top:2px; right:2px;
    min-width:16px;
    height:16px;
    padding:0 4px;
    border-radius:99px;
    background:var(--accent);
    color:#fff;
    font-family:Arial,sans-serif;
    font-size:10px;
    line-height:16px;
    text-align:center;
  }
  nav.links a.is-active, a.icon-btn.is-active{ color:var(--accent); }
  .article-page{ padding-top:10px; }
  .article-page h1{ font-size:36px; margin-bottom:12px; }
  .article-page .lead, .article-body p{
    font-family:Arial,sans-serif;
    font-size:15px;
    line-height:1.65;
    color:var(--text-muted);
    margin-bottom:14px;
  }
  .article-body a{ color:var(--accent); }
  .stone-articles{ display:flex; flex-direction:column; gap:22px; margin:28px 0 10px; }
  .stone-article{
    display:grid;
    grid-template-columns:88px 1fr;
    gap:16px;
    align-items:start;
    background:rgba(255,252,248,.7);
    border:1px solid rgba(58,32,24,.1);
    border-radius:16px;
    padding:14px;
  }
  .stone-article img{ width:88px; height:88px; border-radius:50%; object-fit:cover; }
  .stone-article h3{ font-size:20px; margin-bottom:6px; }
  .stone-article p{ margin:0; }
  .account-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .auth-card{ max-width:520px; margin:0 auto 40px; }
  .auth-switch{
    display:flex;
    gap:8px;
    margin-bottom:18px;
  }
  .auth-switch button{
    flex:1;
    border:1px solid rgba(58,32,24,.18);
    background:rgba(255,248,236,.55);
    border-radius:999px;
    padding:10px 14px;
    font-family:Arial,sans-serif;
    cursor:pointer;
    color:var(--text-dark);
  }
  .auth-switch button.is-on{
    background:#4a1216;
    color:#f4e6df;
    border-color:#4a1216;
  }
  .oauth-label{
    font-family:Arial,sans-serif;
    font-size:12px;
    color:var(--text-muted);
    margin:4px 0 10px;
  }
  .oauth-row{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:18px;
  }
  .oauth-btn{
    border:none;
    border-radius:12px;
    padding:10px 14px;
    font-family:Arial,sans-serif;
    font-size:13px;
    color:#fff;
    cursor:pointer;
  }
  .oauth-vk{ background:#0077ff; }
  .oauth-yandex{ background:#fc3f1d; }
  .oauth-mailru{ background:#005ff9; }
  .oauth-ok{ background:#ee8208; }
  .oauth-btn[data-ready="0"]{ opacity:.55; }
  #vkid-wrap{ margin:4px 0 18px; }
  #vkid-onetap{ min-height:44px; }
  .auth-code-step{
    text-align:center;
    padding:8px 4px 4px;
  }
  .auth-code-step h3{
    font-size:26px;
    font-weight:500;
    margin-bottom:8px;
  }
  .auth-code-step .lead{
    margin-bottom:18px;
  }
  .auth-code-step input[name="code"]{
    text-align:center;
    font-size:28px;
    letter-spacing:.35em;
    padding:16px 12px;
  }
  .auth-code-step .admin-actions{
    justify-content:center;
  }
  .auth-back{
    margin-top:14px;
    border:none;
    background:none;
    color:var(--text-muted);
  }
  .otp-row{
    display:grid;
    grid-template-columns:1fr auto;
    gap:8px;
    align-items:end;
    margin-top:12px;
  }
  .otp-row .ghost{ margin:0; white-space:nowrap; }
  .auth-hint{
    min-height:1.2em;
    margin:8px 0 0;
    font-family:Arial,sans-serif;
    font-size:12.5px;
    color:var(--text-muted);
  }
  .auth-password{ margin-top:14px; }
  .auth-password summary{
    cursor:pointer;
    font-family:Arial,sans-serif;
    font-size:13px;
    color:var(--accent);
  }
  .auth-note{
    margin-top:16px;
    font-family:Arial,sans-serif;
    font-size:12.5px;
    line-height:1.45;
    color:var(--text-muted);
  }
  #oauthCallback{
    display:block;
    padding:10px 12px;
    background:#fff;
    border-radius:10px;
    font-size:13px;
    word-break:break-all;
  }
  #adminGate{ margin-top:22px; }
  .account-tabs{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin:18px 0 24px; }
  .account-tabs a{ color:var(--accent); font-family:Arial,sans-serif; text-decoration:none; }
  .mini-tray{ display:flex; gap:8px; flex-wrap:wrap; margin:16px 0; }
  .mini-slot{
    width:42px; height:42px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:#e2ccae; font-family:Arial,sans-serif; font-size:12px;
    overflow:hidden;
  }
  .mini-slot.filled{ background:#efe6d8; color:#fff; }
  .mini-slot img{ width:100%; height:100%; object-fit:cover; object-position:center; border-radius:50%; display:block; }

  .stone-picker{
    position:fixed;
    inset:0;
    z-index:80;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;
  }
  .stone-picker[hidden]{ display:none !important; }
  .stone-picker-backdrop{
    position:absolute;
    inset:0;
    background:rgba(42,24,16,.48);
  }
  .stone-picker-sheet{
    position:relative;
    z-index:1;
    width:min(560px, 100%);
    max-height:min(88vh, 720px);
    overflow:auto;
    background:#f7f1e8;
    border:1px solid rgba(58,32,24,.14);
    border-radius:22px;
    box-shadow:0 24px 60px rgba(58,32,24,.28);
    padding:20px 20px 18px;
  }
  .stone-picker-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:6px;
  }
  .stone-picker-head h3{
    font-size:22px;
    color:var(--text-dark);
    line-height:1.25;
  }
  .stone-picker-close{
    width:36px;
    height:36px;
    border:none;
    border-radius:50%;
    background:rgba(58,32,24,.08);
    color:var(--text-dark);
    cursor:pointer;
    font-size:22px;
    line-height:1;
  }
  .stone-picker-lead{
    font-family:Arial, sans-serif;
    font-size:13px;
    color:var(--text-muted);
    margin-bottom:16px;
  }
  .stone-picker-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:10px;
  }
  .stone-pick{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
    padding:12px 8px 10px;
    border:1px solid rgba(58,32,24,.12);
    border-radius:16px;
    background:rgba(255,252,248,.9);
    cursor:pointer;
    color:inherit;
    font:inherit;
    box-shadow:0 6px 16px rgba(58,32,24,.08);
    transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  }
  .stone-pick:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(58,32,24,.14); }
  .stone-pick.is-picked{
    border-color:var(--accent);
    box-shadow:0 0 0 2px rgba(92,26,31,.18);
  }
  .stone-pick img{
    width:72px;
    height:72px;
    object-fit:cover;
    border-radius:50%;
  }
  .stone-pick span{
    font-family:Arial, sans-serif;
    font-size:13px;
    text-align:center;
    color:var(--text-dark);
  }
  .stone-picker-clear{
    margin-top:14px;
    width:100%;
  }
  .cart-row{
    display:grid;
    grid-template-columns:72px 1fr 70px auto auto;
    gap:12px;
    align-items:center;
    margin-bottom:12px;
    background:rgba(255,252,248,.75);
    padding:10px;
    border-radius:14px;
  }
  .cart-row > .cart-thumb{
    width:72px;
    height:96px;
    object-fit:contain;
    object-position:center top;
    border-radius:10px;
    background:#f3ebe3;
  }
  .cart-row a{ color:inherit; text-decoration:none; }
  .admin-tabs{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:18px; }
  .admin-tabs button{
    border:1px solid rgba(58,32,24,.2);
    background:rgba(255,252,248,.7);
    border-radius:999px;
    padding:8px 14px;
    cursor:pointer;
    font-family:Arial,sans-serif;
  }
  .admin-tabs button.is-active{ background:var(--accent); color:#fff; border-color:var(--accent); }
  .admin-h{ font-size:18px; margin:22px 0 8px; }
  textarea.tall{ min-height:140px; }
  .feat-row, .stone-row{ margin-bottom:12px; }
  @media (max-width:768px){
    nav.links{
      display:none;
      position:absolute;
      top:calc(100% - 8px);
      left:12px;
      right:12px;
      flex-direction:column;
      gap:0;
      background:#f7f1e8;
      padding:8px;
      border-radius:14px;
      border:1px solid rgba(58,32,24,.14);
      box-shadow:0 16px 40px rgba(58,32,24,.22);
      z-index:50;
    }
    nav.links.open{ display:flex; }
    nav.links a{
      padding:12px 14px;
      font-size:16px;
      line-height:1.3;
      border-radius:10px;
    }
    nav.links a::after{ display:none; }
    nav.links a:hover, nav.links a.is-active{ background:rgba(58,32,24,.08); }
    .burger.open span:nth-child(1){ transform:rotate(45deg) translate(5px,5px); }
    .burger.open span:nth-child(2){ opacity:0; }
    .burger.open span:nth-child(3){ transform:rotate(-45deg) translate(5px,-5px); }
    .account-grid, .cart-row, .cart-row-custom, .stone-article, .admin-row, .admin-item, .cart-set, .chk-layout, .admin-order-grid{ grid-template-columns:1fr; }
    .set-bar{ margin-top:14px; }
    .set-card-actions .cta{ letter-spacing:.4px; }
    .cart-set-stones{ columns:1; }
    .chk-aside{ order:-1; }
    .order-posters .set-poster{ width:100%; }
  }

.set-poster{
  --lid:#6d1f26;
  background:
    linear-gradient(180deg, rgba(109,31,38,.14), transparent 32%),
    linear-gradient(180deg, #f4e6d4, #e2cbb0);
  border-radius:18px;
  padding:12px 12px 14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 14px 30px rgba(58,32,24,.12);
  border:1px solid rgba(58,32,24,.12);
  min-width:0;
}
.set-poster-mark{
  text-align:center;
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#6d1f26;
  margin-bottom:10px;
}
.set-poster-wells{
  display:grid;
  gap:7px;
  padding:10px;
  background:rgba(255,252,248,.55);
  border-radius:14px;
  box-shadow:inset 0 2px 8px rgba(58,32,24,.08);
}
.set-poster-wells[data-size="4"]{ grid-template-columns:repeat(2, 1fr); }
.set-poster-wells[data-size="6"]{ grid-template-columns:repeat(3, 1fr); }
.set-poster-wells[data-size="8"]{ grid-template-columns:repeat(4, 1fr); }
.set-poster-wells[data-size="10"]{ grid-template-columns:repeat(5, 1fr); }
.set-well{
  aspect-ratio:1;
  width:100%;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #fffaf4, #d7c2ab);
  box-shadow:inset 0 3px 6px rgba(58,32,24,.18), 0 1px 0 rgba(255,255,255,.4);
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:Arial,sans-serif;
  font-size:10px;
  color:rgba(58,32,24,.35);
}
.set-well img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.set-poster-foot{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:6px;
  margin-top:10px;
  font-family:Arial,sans-serif;
  font-size:12px;
  color:var(--text-muted);
  align-items:baseline;
}
.set-poster-foot strong{
  font-size:14px;
  color:var(--text-dark);
}
.set-poster-price{
  color:#6d1f26;
  font-weight:700;
}
.set-poster.is-compact{ padding:8px; }
.set-poster.is-compact .set-poster-mark{ font-size:8px; margin-bottom:6px; letter-spacing:.12em; }
.set-poster.is-compact .set-poster-wells{ padding:6px; gap:4px; }
.set-poster.is-compact .set-poster-foot{ margin-top:8px; }
.set-poster.is-compact .set-poster-foot strong{ font-size:12px; }

.cart-sets{ margin-bottom:28px; }
.cart-set{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:20px;
  background:rgba(255,252,248,.9);
  border:1px solid rgba(58,32,24,.1);
  border-radius:22px;
  padding:16px;
  margin-bottom:16px;
  box-shadow:0 12px 28px rgba(58,32,24,.07);
  align-items:start;
}
.cart-set .set-poster{ width:100%; }
.cart-set-body h3{ margin:0 0 4px; }
.cart-set-body .lead{ margin:0 0 8px; }
.cart-set-stones{
  columns:2;
  font-family:Arial,sans-serif;
  font-size:13px;
  margin:8px 0 0;
  padding-left:18px;
  color:var(--text-dark);
}
.cart-set-stones .is-empty{ color:var(--text-muted); }
.cart-set-bar{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  margin-top:14px;
}
.cart-set-qty{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:Arial,sans-serif;
  font-size:13px;
  color:var(--text-muted);
}
.cart-set-qty input{
  width:70px;
  margin:0;
}
.cart-checkout-box{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  flex-wrap:wrap;
  padding:18px 20px;
  border-radius:20px;
  background:linear-gradient(180deg, rgba(109,31,38,.1), rgba(255,252,248,.85));
  border:1px solid rgba(109,31,38,.14);
  margin:8px 0 28px;
}
.cart-checkout-box p{ margin:6px 0 0; max-width:420px; }
.cart-checkout-box .cta{ text-decoration:none; }

.chk-steps{
  display:flex;
  gap:8px;
  margin:0 0 22px;
}
.chk-steps span{
  flex:1;
  text-align:center;
  font-family:Arial,sans-serif;
  font-size:12px;
  letter-spacing:.03em;
  padding:10px 8px;
  border-radius:999px;
  background:rgba(255,252,248,.7);
  color:var(--text-muted);
  border:1px solid rgba(58,32,24,.08);
}
.chk-steps span.is-on{
  background:var(--accent);
  color:#fff;
  border-color:var(--accent);
}
.chk-steps span.is-done{
  background:rgba(109,31,38,.12);
  color:var(--text-dark);
}
.chk-layout{
  display:grid;
  grid-template-columns:minmax(0, 1.15fr) minmax(260px, .85fr);
  gap:28px;
  align-items:start;
  margin-bottom:40px;
}
.chk-form h2{ margin:0 0 8px; }
.chk-legend{
  font-family:Arial,sans-serif;
  font-size:13px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--text-muted);
  margin:18px 0 8px;
}
.chk-choice,
.pay-choice label.chk-choice{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:14px 16px;
  border-radius:16px;
  border:1px solid rgba(58,32,24,.12);
  background:rgba(255,252,248,.9);
  cursor:pointer;
}
.pay-choice{ display:grid; gap:10px; }
.admin-card .chk-choice input,
.admin-card .pay-choice input,
.admin-card .chk-agree input{
  width:auto;
  min-width:18px;
  flex:0 0 auto;
  margin:4px 2px 0 0;
  padding:0;
  border:none;
  background:transparent;
  box-shadow:none;
  accent-color:var(--accent);
}
.chk-choice span{ flex:1; min-width:0; text-align:left; }
.chk-choice small{
  display:block;
  margin-top:4px;
  color:var(--text-muted);
  font-family:Arial,sans-serif;
  font-size:13px;
}
.chk-choice.is-on{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(109,31,38,.12);
}
.chk-agree{
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-family:Arial,sans-serif;
  font-size:14px;
  margin:16px 0;
}
.chk-aside{
  background:rgba(255,252,248,.88);
  border:1px solid rgba(58,32,24,.1);
  border-radius:22px;
  padding:18px;
  box-shadow:0 12px 28px rgba(58,32,24,.07);
}
.chk-aside h3{ margin:0 0 14px; }
.chk-aside .set-poster{ margin-bottom:12px; }
.chk-total{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  margin:14px 0 8px;
  font-family:Arial,sans-serif;
}
.chk-total strong, .chk-total-inline strong{ font-size:22px; color:#6d1f26; }
.chk-total-inline{ margin:8px 0 16px; }
.chk-kicker{
  font-family:Arial,sans-serif;
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#6d1f26;
  margin:0 0 6px;
}
.pay-box{
  margin-top:18px;
  padding:18px;
  border-radius:18px;
  background:linear-gradient(180deg,#fff8f0,#f4e6df);
  border:1px solid rgba(109,31,38,.12);
}
.pay-box h3{ margin:0 0 8px; }
.pay-row{
  display:grid;
  grid-template-columns:120px 1fr auto;
  gap:8px;
  align-items:center;
  padding:8px 0;
  border-bottom:1px solid rgba(58,32,24,.08);
  font-family:Arial,sans-serif;
  font-size:14px;
}
.pay-row b{ font-size:16px; letter-spacing:.02em; }
.pay-row .ghost{ padding:6px 10px; font-size:12px; }

.status-pill{
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  font-family:Arial,sans-serif;
  font-size:11px;
  letter-spacing:.04em;
  white-space:nowrap;
}
.status-new{ background:#ead9c8; color:#3a2018; }
.status-wait_pay{ background:#f3e0b8; color:#6a4a12; }
.status-paid, .status-packing{ background:#dce8c8; color:#2f4a16; }
.status-shipped, .status-done{ background:#d4e4f2; color:#1d3c5a; }
.status-cancelled{ background:#f0d6d6; color:#6d1f26; }

.order-card{
  background:rgba(255,252,248,.9);
  border:1px solid rgba(58,32,24,.1);
  border-radius:20px;
  padding:16px 18px;
  margin:0 0 14px;
  box-shadow:0 10px 24px rgba(58,32,24,.06);
}
.order-card-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
  margin-bottom:12px;
}
.order-card-head .lead{ margin:4px 0 0; }
.order-posters{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:10px;
}
.order-posters .set-poster{ width:150px; }
.admin-order{ margin-bottom:16px; }
.admin-order.is-hot{
  border-color:rgba(109,31,38,.35);
  box-shadow:0 0 0 3px rgba(109,31,38,.08);
}
.admin-order-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.order-alert{
  background:#f3e0b8;
  color:#6a4a12;
  padding:10px 12px;
  border-radius:12px;
  font-family:Arial,sans-serif;
  font-size:14px;
}
.order-filters{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 16px;
}
.order-filters button{
  border:1px solid rgba(58,32,24,.2);
  background:rgba(255,252,248,.7);
  border-radius:999px;
  padding:8px 14px;
  cursor:pointer;
  font-family:Arial,sans-serif;
}
.order-filters button.is-on{
  background:var(--accent);
  color:#fff;
  border-color:var(--accent);
}

.set-card-mine .set-poster{ margin-top:4px; }

.stats-dash{
  background:rgba(255,252,248,.9);
  border:1px solid rgba(58,32,24,.1);
  border-radius:20px;
  padding:16px 18px 18px;
  margin:0 0 16px;
  box-shadow:0 10px 24px rgba(58,32,24,.06);
}
.stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:12px;
  margin-bottom:14px;
}
.stats-periods{ grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); }
.stats-card{
  background:rgba(255,255,255,.55);
  border:1px solid rgba(58,32,24,.08);
  border-radius:16px;
  padding:12px 14px;
}
.stats-card span{
  display:block;
  font-size:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:rgba(58,32,24,.62);
}
.stats-card strong{
  display:block;
  margin:6px 0 4px;
  font-size:22px;
}
.stats-card p{ margin:0; font-size:13px; color:rgba(58,32,24,.7); }
.stats-split{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
}
.stats-split h3{
  margin:0 0 10px;
  font-size:15px;
}
.stats-bar{
  display:grid;
  grid-template-columns:88px 1fr 28px;
  gap:8px;
  align-items:center;
  margin:0 0 8px;
  font-size:13px;
}
.stats-bar i{
  display:block;
  height:8px;
  border-radius:99px;
  background:var(--accent);
  min-width:0;
}
.stats-bar b{ text-align:right; }
.stats-stone{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:6px 0;
  border-bottom:1px solid rgba(58,32,24,.08);
  font-size:14px;
}
@media (max-width:900px){
  .stats-grid, .stats-periods, .stats-split{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .stats-grid, .stats-periods, .stats-split{ grid-template-columns:1fr; }
}

.site-search{
  display:flex;
  align-items:center;
  gap:2px;
  height:38px;
  padding:0 4px 0 14px;
  border-radius:999px;
  border:1px solid rgba(58,32,24,.14);
  background:rgba(255,252,248,.78);
  transition:border-color .15s ease, box-shadow .15s ease;
}
.site-search:focus-within{
  border-color:rgba(92,26,31,.35);
  box-shadow:0 0 0 3px rgba(92,26,31,.08);
}
.site-search input{
  width:168px;
  border:none;
  background:transparent;
  font-family:Arial,sans-serif;
  font-size:13px;
  color:var(--text-dark);
  outline:none;
}
.site-search button{
  width:32px;
  height:32px;
  border:none;
  background:transparent;
  color:var(--text-dark);
  border-radius:50%;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.site-search button:hover{ background:rgba(58,32,24,.08); }

.cat-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:12px 14px;
  align-items:end;
  margin:8px 0 18px;
}
.cat-q{ flex:1 1 220px; min-width:180px; }
.cat-sort{ flex:0 1 260px; min-width:180px; }
.cat-toolbar label span,
.cat-q span{
  display:block;
  font-family:Arial,sans-serif;
  font-size:12px;
  color:var(--text-muted);
  margin-bottom:6px;
}
.cat-toolbar input,
.cat-toolbar select{
  width:100%;
  padding:11px 12px;
  border-radius:12px;
  border:1px solid rgba(58,32,24,.16);
  background:rgba(255,252,248,.9);
  font-family:Arial,sans-serif;
  font-size:14px;
  color:var(--text-dark);
}
.cat-toolbar select{
  appearance:none;
  -webkit-appearance:none;
  padding-right:34px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='none' stroke='%233a2018' stroke-width='1.6' stroke-linecap='round' d='M1.5 1.5L6 6l4.5-4.5'/></svg>");
  background-repeat:no-repeat;
  background-position:right 12px center;
  background-size:12px;
  cursor:pointer;
}
.cat-chips{ display:flex; flex-wrap:wrap; gap:8px; flex:1 1 100%; }
.cat-chip{
  border:1px solid rgba(58,32,24,.18);
  background:rgba(255,252,248,.8);
  border-radius:999px;
  padding:10px 14px;
  cursor:pointer;
  font-family:Arial,sans-serif;
  font-size:13px;
}
.cat-chip.is-on{
  background:var(--accent);
  color:#fff;
  border-color:var(--accent);
}
.cat-count{
  font-family:Arial,sans-serif;
  font-size:13px;
  color:var(--text-muted);
  margin:0 0 14px;
}

.empty-state{
  background:rgba(255,252,248,.88);
  border:1px solid rgba(58,32,24,.1);
  border-radius:22px;
  padding:28px 24px;
  margin:12px 0 40px;
  box-shadow:0 12px 28px rgba(58,32,24,.08);
}
.empty-state h2{ margin:0 0 8px; }
.empty-state .admin-actions{ margin-top:16px; }
.empty-hints{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:12px 0 0; }
.empty-hints .ghost{ padding:8px 14px; }

.order-track{
  list-style:none;
  margin:16px 0 18px;
  padding:0;
}
.order-track li{
  position:relative;
  padding:0 0 16px 22px;
  font-family:Arial,sans-serif;
  font-size:14px;
  color:var(--text-muted);
}
.order-track li:last-child{ padding-bottom:0; }
.order-track li::before{
  content:"";
  position:absolute;
  left:0;
  top:5px;
  width:10px;
  height:10px;
  border-radius:50%;
  border:2px solid rgba(58,32,24,.25);
  background:#fff;
}
.order-track li::after{
  content:"";
  position:absolute;
  left:4px;
  top:17px;
  bottom:0;
  width:2px;
  background:rgba(58,32,24,.12);
}
.order-track li:last-child::after{ display:none; }
.order-track li.is-done{ color:var(--text-dark); }
.order-track li.is-done::before,
.order-track li.is-on::before{
  background:var(--accent);
  border-color:var(--accent);
}
.order-track li.is-on{ color:var(--accent); font-weight:600; }
.order-track.is-cancelled{
  padding:14px 16px;
  border-radius:16px;
  background:rgba(109,31,38,.08);
  border:1px solid rgba(109,31,38,.16);
}
.order-track.is-cancelled p{ margin:6px 0 0; color:var(--text-muted); }

.order-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 16px;
  margin:0 0 18px;
}
.order-facts p{ margin:0; }
.order-facts span{
  display:block;
  font-family:Arial,sans-serif;
  font-size:12px;
  color:var(--text-muted);
}
.pay-note{
  margin:12px 0;
  padding:12px 14px;
  border-radius:14px;
  background:rgba(220,232,200,.55);
  border:1px solid rgba(47,74,22,.12);
}
.track-box{
  margin:14px 0;
  padding:14px 16px;
  border-radius:16px;
  background:rgba(255,252,248,.9);
  border:1px solid rgba(58,32,24,.1);
}
.track-box span{
  display:block;
  font-size:12px;
  font-family:Arial,sans-serif;
  color:var(--text-muted);
}
.track-box b{ display:block; margin:4px 0 8px; letter-spacing:.04em; }

.share-layout{
  display:grid;
  grid-template-columns:minmax(180px,240px) 1fr;
  gap:24px;
  align-items:start;
  margin:12px 0 40px;
}
.auth-forgot{ margin:10px 0 0; }
.auth-forgot .ghost{ border:none; padding:0; color:var(--accent); }

body.is-auth{
  font-family:"Manrope", Arial, sans-serif;
}
body.is-auth header{
  padding:22px 40px;
}
body.is-auth .page::before{
  background:
    radial-gradient(ellipse 70% 50% at 50% 0%, rgba(255,252,246,.95) 0%, rgba(246,241,234,.55) 55%, rgba(239,232,222,.9) 100%),
    url("images/bg-marble.jpg") center / cover no-repeat;
  opacity:1;
}
body.is-auth .bg-switch,
body.is-auth .site-search,
body.is-auth nav.links,
body.is-auth .burger,
body.is-auth #siteFooter .foot-links{ display:none; }
body.is-auth #siteFooter{
  justify-content:center;
  opacity:.55;
  padding-top:8px;
}
body.is-auth .article-page{
  padding:4px 20px 72px;
  max-width:none;
}
body.is-auth .article-page > h1,
body.is-auth .article-page > .lead{ display:none; }
.auth-screen{
  max-width:400px;
  margin:12px auto 0;
  text-align:center;
}
.auth-kicker{
  font-family:"Fraunces", Georgia, serif;
  letter-spacing:.32em;
  font-size:11px;
  color:var(--text-muted);
  margin-bottom:10px;
}
.auth-screen > h1{
  font-family:"Fraunces", Georgia, serif;
  font-weight:400;
  font-size:clamp(44px, 8vw, 62px);
  letter-spacing:-.04em;
  line-height:.9;
  margin:0 0 14px;
}
.auth-screen > h1::after{
  content:"";
  display:block;
  width:36px;
  height:1px;
  margin:16px auto 0;
  background:linear-gradient(90deg, transparent, #c4a070, transparent);
}
.auth-lead{
  color:var(--text-muted);
  font-size:15px;
  line-height:1.5;
  margin:0 auto 26px;
  max-width:26ch;
}
body.is-auth .auth-card{
  text-align:left;
  max-width:none;
  margin:0;
  padding:26px 24px 22px;
  border-radius:28px;
  background:rgba(255,252,248,.94);
  border:1px solid rgba(196,160,112,.28);
  box-shadow:
    0 1px 0 rgba(255,255,255,.8) inset,
    0 28px 70px rgba(58,32,24,.1);
}
body.is-auth .auth-card [hidden]{ display:none !important; }
body.is-auth .auth-switch{
  background:rgba(58,32,24,.05);
  border-radius:999px;
  padding:4px;
  gap:0;
  margin-bottom:18px;
}
body.is-auth .auth-switch button{
  border:0;
  background:transparent;
  color:var(--text-muted);
  font-family:"Manrope", Arial, sans-serif;
  font-size:13px;
  font-weight:500;
  letter-spacing:.04em;
  padding:11px 14px;
}
body.is-auth .auth-switch button.is-on{
  background:#fff;
  color:var(--text-dark);
  box-shadow:0 4px 12px rgba(58,32,24,.08);
}
body.is-auth .chk-agree{
  font-size:13px;
  line-height:1.45;
  margin:18px 0 0;
  color:var(--text-muted);
  font-family:"Manrope", Arial, sans-serif;
}
body.is-auth .chk-agree input{
  width:16px;
  height:16px;
  margin-top:2px;
  flex:none;
  accent-color:var(--accent);
}
body.is-auth .chk-agree a{ color:var(--accent); }
body.is-auth #vkid-wrap{ margin:0 0 4px; }
body.is-auth #vkid-onetap{ min-height:48px; }
body.is-auth #vkid-oauthlist{ margin-top:12px; min-height:44px; }
.auth-or{
  display:flex;
  align-items:center;
  gap:12px;
  margin:16px 0 4px;
  color:var(--text-muted);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.auth-or::before,
.auth-or::after{
  content:"";
  flex:1;
  height:1px;
  background:rgba(58,32,24,.12);
}
body.is-auth .auth-field{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:7px;
  margin:14px 0 0;
  font-family:"Manrope", Arial, sans-serif;
}
body.is-auth .auth-field > span{
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-muted);
}
body.is-auth .auth-card input:not([type="checkbox"]){
  display:block;
  width:100%;
  border:1px solid rgba(58,32,24,.16);
  border-radius:14px;
  padding:13px 14px;
  background:#fff;
  color:var(--text-dark);
  font-family:"Manrope", Arial, sans-serif;
  font-size:15px;
}
body.is-auth .auth-card input:not([type="checkbox"]):focus{
  outline:none;
  border-color:rgba(92,26,31,.45);
  box-shadow:0 0 0 3px rgba(92,26,31,.1);
}
body.is-auth .auth-submit,
body.is-auth .auth-card .cta,
body.is-auth .auth-card .admin-actions .cta,
body.is-auth .auth-card .admin-actions .ghost{
  display:flex;
  width:100%;
  margin-top:6px;
  border-radius:999px;
  justify-content:center;
  text-align:center;
  font-family:"Manrope", Arial, sans-serif;
}
body.is-auth .auth-submit,
body.is-auth .auth-card form > .cta{
  margin-top:18px;
}
body.is-auth .auth-card .admin-actions{
  flex-direction:column;
  gap:8px;
  margin-top:16px;
}
body.is-auth .auth-forgot{
  text-align:center;
  margin-top:12px;
}
body.is-auth .auth-forgot .ghost{
  border:none;
  padding:0;
  color:var(--accent);
  font-family:"Manrope", Arial, sans-serif;
  font-size:13px;
}
body.is-auth .auth-note{
  text-align:center;
  margin:16px 0 0;
  font-size:12px;
  color:var(--text-muted);
}
body.is-auth .auth-code-step h3,
body.is-auth .auth-card h3{
  font-family:"Fraunces", Georgia, serif;
  font-weight:400;
  font-size:26px;
  text-align:center;
  margin:4px 0 8px;
}
body.is-auth .auth-card .lead{
  text-align:center;
  font-size:14px;
}
.seen-block{ margin:36px 0 20px; }

@media (max-width:1180px){
  header{ padding:22px 28px; gap:12px 16px; flex-wrap:wrap; }
  .nav-left{ gap:22px; }
  nav.links{ gap:18px; }
  .nav-right{ margin-left:auto; }
}
@media (max-width:768px){
  header{ flex-wrap:wrap; gap:10px; }
  .nav-right{ width:100%; justify-content:flex-end; flex-wrap:wrap; }
  .site-search{ flex:1 0 100%; }
  .site-search input{ width:100%; }
  .cat-q, .cat-sort{ flex:1 1 100%; }
  .order-facts,
  .share-layout{ grid-template-columns:1fr; }
  .chk-layout{ grid-template-columns:1fr; }
}