/* =========================================================
   DESIGN TOKENS — change colours here to re-theme the site
   Brand: Navy #0E2230 + Blue #075E98 (calm, easy on the eyes)
   ========================================================= */
:root{
  --navy:#0E2230;  --navy-2:#163349; --navy-3:#21465f;
  --blue:#075E98;  --blue-2:#0a6db0; --blue-3:#4f97cc;
  --sky:#eaf3fa;   --sky-2:#d6e8f5;
  --bg:#f7f9fb;    --paper:#ffffff;  --cream:#fbf8f3; --cream-2:#f2ebe0;
  --gold:#d99a2b;  --gold-l:#fbf0dc;
  --rose:#cf5a45;  --rose-l:#fbebe7;
  --green:#2f8a5b; --green-l:#e4f4ea;
  --text:#2a3b4b;  --muted:#677a8c;  --muted-2:#9eacb9;
  --line:rgba(14,34,48,.09); --line-2:rgba(14,34,48,.16);
  --sh-sm:0 1px 2px rgba(14,34,48,.05),0 2px 8px rgba(14,34,48,.05);
  --sh:0 8px 28px rgba(14,34,48,.09);
  --sh-lg:0 22px 60px rgba(14,34,48,.18);
  --r-sm:10px;--r:14px;--r-lg:20px;--r-xl:28px;--pill:999px;
  --fd:'Fraunces',Georgia,serif;--fb:'Manrope',system-ui,sans-serif;
  --ease:cubic-bezier(.4,0,.2,1);--t:.25s;--nav-h:72px;--bot-nav:64px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--fb);background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden;padding-bottom:var(--bot-nav);-webkit-font-smoothing:antialiased}
@media(min-width:1024px){body{padding-bottom:0}}
body.lock{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit;-webkit-tap-highlight-color:transparent}
input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.i{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.i-sm{width:16px;height:16px}.i-xs{width:13px;height:13px}.i-lg{width:26px;height:26px}
.i-fill{fill:currentColor;stroke:none}
.wrap{max-width:1240px;margin:0 auto;padding:0 18px}
@media(min-width:768px){.wrap{padding:0 32px}}
.hide{display:none!important}

/* ---------- type ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin-bottom:12px}
.eyebrow::before{content:'';width:20px;height:2px;border-radius:2px;background:currentColor}
.h2{font-family:var(--fd);font-weight:500;font-size:clamp(1.85rem,4.2vw,2.9rem);line-height:1.1;color:var(--navy);letter-spacing:-.015em}
.h2 em{font-style:italic;color:var(--blue);font-weight:400}
.lead{color:var(--muted);font-size:1rem;line-height:1.75;max-width:480px;margin-top:12px}
.sec{padding:72px 0}
@media(min-width:900px){.sec{padding:96px 0}}
.sec-white{background:var(--paper)}
.sec-cream{background:var(--cream)}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:36px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 22px;border-radius:var(--pill);font-size:.9rem;font-weight:700;border:1.5px solid transparent;white-space:nowrap;transition:background var(--t),color var(--t),border-color var(--t),transform var(--t),box-shadow var(--t)}
.btn:active{transform:scale(.97)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{background:var(--blue);color:#fff}
.btn-dark{background:var(--navy);color:#fff}
.btn-outline{border-color:var(--line-2);color:var(--navy);background:var(--paper)}
.btn-light{background:var(--sky);color:var(--blue)}
.btn-ghost-w{border-color:rgba(255,255,255,.3);color:#fff}
.btn-white{background:#fff;color:var(--navy)}
.btn-wa{background:#1f9d55;color:#fff}
@media(hover:hover){
  .btn-primary:hover{background:var(--blue-2);box-shadow:0 8px 22px rgba(7,94,152,.28);transform:translateY(-1px)}
  .btn-dark:hover{background:var(--navy-2)}
  .btn-outline:hover{border-color:var(--blue);color:var(--blue)}
  .btn-light:hover{background:var(--sky-2)}
  .btn-ghost-w:hover{background:rgba(255,255,255,.1)}
  .btn-white:hover{background:var(--sky)}
  .btn-wa:hover{background:#178246}
}
.btn-sm{min-height:38px;padding:0 16px;font-size:.8rem}
.btn-lg{min-height:54px;padding:0 28px;font-size:.95rem}
.btn-block{width:100%}
.link{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.88rem;color:var(--blue)}
.link .i{transition:transform var(--t)}
@media(hover:hover){.link:hover .i{transform:translateX(3px)}}

.tag{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:var(--pill);font-size:.66rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.tag-white{background:rgba(255,255,255,.95);color:var(--navy)}
.tag-blue{background:var(--sky);color:var(--blue)}
.tag-green{background:var(--green-l);color:var(--green)}
.tag-gold{background:var(--gold-l);color:#93620f}
.tag-rose{background:var(--rose);color:#fff}
.tag-navy{background:var(--navy);color:#fff}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ---------- form fields ---------- */
.lbl{display:block;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--text);margin-bottom:8px}
.field{width:100%;min-height:48px;padding:12px 16px;border-radius:var(--r-sm);border:1.5px solid var(--line-2);background:var(--paper);font-size:.92rem;color:var(--navy);outline:none;transition:border-color var(--t),box-shadow var(--t)}
.field:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(7,94,152,.1)}
.field::placeholder{color:var(--muted-2)}
textarea.field{resize:vertical;min-height:84px}
select.field{appearance:none;padding-right:38px;background:var(--paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23677a8c' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip-opt{min-height:40px;padding:0 16px;border-radius:var(--pill);border:1.5px solid var(--line-2);background:var(--paper);font-size:.84rem;font-weight:700;color:var(--text);transition:all var(--t);display:inline-flex;align-items:center;gap:6px}
.chip-opt small{font-weight:600;color:var(--muted);font-size:.72rem}
@media(hover:hover){.chip-opt:hover{border-color:var(--blue)}}
.chip-opt.on{background:var(--blue);border-color:var(--blue);color:#fff}
.chip-opt.on small{color:rgba(255,255,255,.75)}
.chip-opt:disabled{opacity:.4;cursor:not-allowed}
.switch{width:46px;height:27px;border-radius:99px;background:var(--line-2);position:relative;flex-shrink:0;transition:background var(--t)}
.switch::after{content:'';position:absolute;top:3px;left:3px;width:21px;height:21px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:left var(--t)}
.switch.on{background:var(--blue)}
.switch.on::after{left:22px}

/* ---------- announcement ---------- */
.announce{background:var(--navy);color:#dbe7f1;font-size:.78rem;position:relative;z-index:910}
.ann-track{position:relative;height:38px;overflow:hidden}
.ann-msg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 44px;text-align:center;opacity:0;transform:translateY(100%);transition:opacity .5s,transform .5s}
.ann-msg.on{opacity:1;transform:none}
.ann-msg.out{opacity:0;transform:translateY(-100%)}
.ann-msg b{color:#fff;font-weight:800}
.ann-msg .i{color:var(--blue-3)}
.ann-x{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;color:rgba(255,255,255,.55)}
@media(hover:hover){.ann-x:hover{background:rgba(255,255,255,.1);color:#fff}}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:900;height:var(--nav-h);display:flex;align-items:center;background:rgba(247,249,251,.9);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color var(--t),box-shadow var(--t)}
.nav.scrolled{border-bottom-color:var(--line);box-shadow:0 4px 20px rgba(14,34,48,.05)}
.nav-row{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%}
.logo{display:flex;align-items:center;gap:10px;flex-shrink:0}
.logo-mark{width:40px;height:40px;border-radius:12px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-style:italic;font-size:1.3rem;font-weight:500;position:relative}
.logo-mark::after{content:'';position:absolute;right:-3px;bottom:-3px;width:12px;height:12px;border-radius:50%;background:var(--blue);border:2.5px solid var(--bg)}
.logo-txt{font-family:var(--fd);font-size:1.18rem;color:var(--navy);line-height:1;font-weight:600;letter-spacing:-.01em}
.logo-txt small{display:block;font-family:var(--fb);font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-top:4px}
.nav-links{display:none;gap:28px}
@media(min-width:1080px){.nav-links{display:flex}}
.nav-links a{font-size:.88rem;font-weight:600;color:var(--text);position:relative;padding:6px 0}
.nav-links a::after{content:'';position:absolute;left:0;bottom:0;height:2px;width:0;border-radius:2px;background:var(--blue);transition:width var(--t)}
@media(hover:hover){.nav-links a:hover{color:var(--navy)}.nav-links a:hover::after{width:100%}}
.nav-right{display:flex;align-items:center;gap:4px}
.icon-btn{position:relative;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--navy);transition:background var(--t)}
@media(hover:hover){.icon-btn:hover{background:var(--sky)}}
.count{position:absolute;top:3px;right:1px;min-width:18px;height:18px;padding:0 4px;border-radius:var(--pill);background:var(--blue);color:#fff;font-size:.6rem;font-weight:800;display:none;align-items:center;justify-content:center;border:2px solid var(--bg)}
.hide-sm{display:none}
@media(min-width:1024px){.hide-sm{display:flex}}
.search-box{display:none;align-items:center;gap:8px;height:42px;padding:0 14px;border-radius:var(--pill);background:var(--paper);border:1.5px solid var(--line);width:220px;color:var(--muted);transition:border-color var(--t),width var(--t)}
.search-box:focus-within{border-color:var(--blue);width:260px}
.search-box input{border:none;outline:none;background:none;flex:1;min-width:0;font-size:.86rem;color:var(--navy)}
@media(min-width:768px){.search-box{display:flex}}
.search-mob{display:flex}
@media(min-width:768px){.search-mob{display:none}}
.nav-signin{display:none}
@media(min-width:560px){.nav-signin{display:inline-flex}}
.avatar{width:40px;height:40px;border-radius:50%;background:var(--blue);color:#fff;font-size:.78rem;font-weight:800;display:none;align-items:center;justify-content:center;border:2px solid var(--paper);box-shadow:0 0 0 1.5px var(--blue)}
.avatar.show{display:flex}
.burger{display:flex}
@media(min-width:1080px){.burger{display:none}}
.search-drawer{position:fixed;top:0;left:0;right:0;z-index:960;background:var(--bg);padding:14px 16px;box-shadow:var(--sh-lg);transform:translateY(-110%);transition:transform .3s var(--ease)}
.search-drawer.open{transform:none}
.sd-row{display:flex;gap:10px;align-items:center}
.sd-field{flex:1;display:flex;align-items:center;gap:10px;background:var(--paper);border:1.5px solid var(--line-2);border-radius:var(--pill);padding:0 16px;height:48px;color:var(--muted)}
.sd-field input{flex:1;border:none;outline:none;background:none;font-size:.95rem;color:var(--navy)}
.sd-cancel{font-size:.88rem;font-weight:700;color:var(--blue);padding:0 4px}
.mmenu{position:fixed;inset:0;z-index:950;background:var(--navy);color:#fff;display:flex;flex-direction:column;padding:22px 24px 36px;opacity:0;pointer-events:none;transition:opacity .3s;overflow-y:auto}
.mmenu.open{opacity:1;pointer-events:auto}
.mmenu-top{display:flex;justify-content:space-between;align-items:center}
.mmenu .logo-txt{color:#fff}.mmenu .logo-txt small{color:rgba(255,255,255,.55)}
.mmenu .logo-mark{background:var(--blue)}.mmenu .logo-mark::after{border-color:var(--navy);background:#fff}
.mmenu-close{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center}
.mmenu nav{flex:1;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:28px 0}
.mmenu nav a{font-family:var(--fd);font-size:1.9rem;font-weight:400;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;align-items:center}
.mmenu nav a .i{opacity:.4}
.mmenu-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bot-nav{position:fixed;left:0;right:0;bottom:0;z-index:899;height:var(--bot-nav);background:rgba(255,255,255,.97);backdrop-filter:blur(14px);border-top:1px solid var(--line);display:flex;padding:0 6px env(safe-area-inset-bottom)}
@media(min-width:1024px){.bot-nav{display:none}}
.bn-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--muted);font-size:.62rem;font-weight:700;letter-spacing:.03em}
.bn-item.on{color:var(--blue)}
.bn-ic{position:relative}
.bn-ic .count{top:-6px;right:-10px;border-color:#fff}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding:40px 0 64px;background:radial-gradient(1100px 500px at 85% -10%,var(--sky) 0%,transparent 60%),var(--bg)}
@media(min-width:900px){.hero{padding:56px 0 92px}}
.hero-grid{display:grid;gap:44px;align-items:center}
@media(min-width:900px){.hero-grid{grid-template-columns:1.05fr .95fr;gap:60px}}
.status-pill{display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 10px;border-radius:var(--pill);background:var(--paper);border:1px solid var(--line);font-size:.78rem;font-weight:600;color:var(--text);margin-bottom:24px;box-shadow:var(--sh-sm)}
.dot-live{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px var(--green-l);animation:pulse 2s infinite}
.dot-live.closed{background:var(--rose);box-shadow:0 0 0 4px var(--rose-l);animation:none}
.hero h1{font-family:var(--fd);font-weight:400;font-size:clamp(2.6rem,6.8vw,5.1rem);line-height:1.02;letter-spacing:-.03em;color:var(--navy)}
.hero h1 em{font-style:italic;color:var(--blue)}
.hero-p{margin:22px 0 28px;font-size:1.05rem;color:var(--muted);line-height:1.75;max-width:480px}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.zone-check{margin-top:28px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px;box-shadow:var(--sh-sm);max-width:480px}
.zone-check .lbl{display:flex;align-items:center;gap:8px;margin-bottom:10px;color:var(--navy)}
.zone-check .lbl .i{color:var(--blue)}
.zc-row{display:flex;gap:8px}
.zc-row .field{min-height:44px}
.zc-row .btn{min-height:44px}
.zc-res{font-size:.84rem;margin-top:10px;display:none;align-items:center;gap:8px}
.zc-res.show{display:flex}
.zc-res.ok{color:var(--green)}.zc-res.no{color:var(--rose)}
.hero-proof{display:flex;align-items:center;gap:24px;margin-top:32px;flex-wrap:wrap}
.proof-num{font-family:var(--fd);font-size:1.9rem;color:var(--navy);line-height:1;font-weight:500}
.proof-lbl{font-size:.76rem;color:var(--muted);margin-top:6px}
.proof-div{width:1px;height:36px;background:var(--line-2)}
.hero-art{position:relative;max-width:520px;width:100%;margin:0 auto}
.arch{border-radius:240px 240px var(--r-xl) var(--r-xl);overflow:hidden;aspect-ratio:.84;background:var(--sky);box-shadow:var(--sh-lg)}
.arch img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
@media(hover:hover){.hero-art:hover .arch img{transform:scale(1.04)}}
.float-card{position:absolute;background:var(--paper);border-radius:var(--r);padding:12px 14px;display:flex;align-items:center;gap:12px;box-shadow:var(--sh-lg)}
.fc-1{left:-18px;bottom:40px;animation:float 5s ease-in-out infinite}
.fc-2{right:-14px;top:36px;animation:float 6s ease-in-out infinite .8s}
@media(max-width:560px){.fc-1{left:8px;bottom:14px}.fc-2{right:8px;top:14px}}
.fc-ic{width:42px;height:42px;border-radius:12px;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center}
.float-card strong{display:block;font-size:.86rem;color:var(--navy);line-height:1.3}
.float-card small{font-size:.74rem;color:var(--muted)}
.fc-stars{color:var(--gold);display:flex;gap:1px}

/* ---------- category strip ---------- */
.cats{padding:8px 0 0}
.cat-row{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;padding:6px 2px 10px}
.cat-row::-webkit-scrollbar{display:none}
@media(min-width:1024px){.cat-row{display:grid;grid-template-columns:repeat(7,1fr)}}
.cat-chip{flex:0 0 120px;display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 10px;border-radius:var(--r-lg);background:var(--paper);border:1.5px solid var(--line);transition:all var(--t);text-align:center}
@media(hover:hover){.cat-chip:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:var(--sh)}}
.cat-chip.on{border-color:var(--blue);background:var(--sky)}
.cat-img{width:68px;height:68px;border-radius:50%;overflow:hidden;background:var(--sky);display:flex;align-items:center;justify-content:center;color:var(--blue)}
.cat-img img{width:100%;height:100%;object-fit:cover}
.cat-chip strong{font-size:.84rem;color:var(--navy);display:block;line-height:1.2}
.cat-chip small{font-size:.72rem;color:var(--muted)}

/* ---------- promos ---------- */
.promo-row{display:grid;gap:16px;margin-top:28px}
@media(min-width:760px){.promo-row{grid-template-columns:repeat(3,1fr)}}
.promo{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:190px;display:flex;align-items:flex-end;background:var(--navy);color:#fff}
.promo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.promo::after{content:'';position:absolute;inset:0;background:linear-gradient(200deg,rgba(14,34,48,.05) 10%,rgba(14,34,48,.88) 95%)}
@media(hover:hover){.promo:hover img{transform:scale(1.06)}}
.promo-bd{position:relative;z-index:1;padding:20px}
.promo-bd strong{display:block;font-family:var(--fd);font-weight:500;font-size:1.35rem;line-height:1.15}
.promo-bd small{display:block;opacity:.8;font-size:.82rem;margin:4px 0 12px}
.promo-bd span{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:800;padding:7px 14px;border-radius:var(--pill);background:rgba(255,255,255,.16);backdrop-filter:blur(6px)}

/* ---------- flash deal ---------- */
.deal{background:var(--navy);color:#fff;border-radius:var(--r-xl);overflow:hidden;display:grid;position:relative}
@media(min-width:860px){.deal{grid-template-columns:1.1fr .9fr}}
.deal::before{content:'';position:absolute;left:-120px;top:-160px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(79,151,204,.35),transparent 65%)}
.deal-bd{padding:34px 26px;position:relative;z-index:1}
@media(min-width:860px){.deal-bd{padding:52px}}
.deal .eyebrow{color:var(--blue-3)}
.deal h3{font-family:var(--fd);font-weight:400;font-size:clamp(1.8rem,3.6vw,2.6rem);line-height:1.1}
.deal h3 em{color:var(--blue-3)}
.deal p{color:rgba(255,255,255,.7);margin:10px 0 22px;max-width:420px}
.cd{display:flex;gap:10px;margin-bottom:24px}
.cd div{min-width:64px;padding:10px 6px;border-radius:var(--r);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);text-align:center}
.cd b{display:block;font-family:var(--fd);font-size:1.8rem;font-weight:500;line-height:1}
.cd small{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;opacity:.6;font-weight:700}
.deal-price{display:flex;align-items:baseline;gap:12px;margin-bottom:22px}
.deal-price b{font-family:var(--fd);font-size:2.2rem;font-weight:500}
.deal-price s{color:rgba(255,255,255,.45)}
.deal-img{position:relative;min-height:260px}
.deal-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.deal-off{position:absolute;top:20px;right:20px;width:84px;height:84px;border-radius:50%;background:var(--blue);display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:800;line-height:1;box-shadow:var(--sh-lg);z-index:1}
.deal-off b{font-size:1.5rem}
.deal-off small{font-size:.62rem;letter-spacing:.1em}

/* ---------- shop ---------- */
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.pills{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0;padding-bottom:2px}
.pills::-webkit-scrollbar{display:none}
.pill{flex-shrink:0;min-height:40px;padding:0 18px;border-radius:var(--pill);border:1.5px solid var(--line-2);background:var(--paper);font-size:.83rem;font-weight:700;color:var(--text);transition:all var(--t)}
@media(hover:hover){.pill:hover{border-color:var(--blue)}}
.pill.on{background:var(--navy);border-color:var(--navy);color:#fff}
.tools{display:flex;align-items:center;gap:8px}
.tools select.field{min-height:40px;border-radius:var(--pill);font-size:.82rem;font-weight:700;padding:0 38px 0 16px;width:auto;border-color:var(--line)}
.view-tg{display:none;background:var(--paper);border:1.5px solid var(--line);border-radius:var(--pill);padding:3px}
@media(min-width:700px){.view-tg{display:flex}}
.vbtn{width:34px;height:32px;border-radius:var(--pill);display:flex;align-items:center;justify-content:center;color:var(--muted)}
.vbtn.on{background:var(--navy);color:#fff}
.diet-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.diet-row>span{font-size:.76rem;font-weight:700;color:var(--muted);margin-right:4px}
.dchip{min-height:34px;padding:0 13px;border-radius:var(--pill);background:var(--paper);border:1.5px dashed var(--line-2);font-size:.78rem;font-weight:700;color:var(--text);display:inline-flex;align-items:center;gap:6px}
.dchip.on{border-style:solid;border-color:var(--blue);color:var(--blue);background:var(--sky)}
.pcount{font-size:.8rem;color:var(--muted);margin-left:auto}
.pgrid{display:grid;gap:14px;grid-template-columns:1fr 1fr}
@media(min-width:768px){.pgrid{grid-template-columns:repeat(3,1fr);gap:20px}}
@media(min-width:1100px){.pgrid{grid-template-columns:repeat(4,1fr)}}
.pcard{background:var(--paper);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--line);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
@media(hover:hover){.pcard:hover{transform:translateY(-5px);box-shadow:var(--sh-lg)}}
.p-media{position:relative;aspect-ratio:1;overflow:hidden;background:var(--sky);margin:8px 8px 0;border-radius:calc(var(--r-lg) - 6px);cursor:pointer}
.p-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
@media(hover:hover){.pcard:hover .p-media img{transform:scale(1.06)}}
.p-tags{position:absolute;top:10px;left:10px;display:flex;flex-direction:column;gap:5px;align-items:flex-start}
.p-wl{position:absolute;top:8px;right:8px;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.95);display:flex;align-items:center;justify-content:center;color:var(--navy);transition:all var(--t)}
.p-wl.on{color:var(--rose)}
.p-wl.on .i{fill:currentColor}
.p-qv{position:absolute;left:10px;right:10px;bottom:10px;min-height:38px;border-radius:var(--pill);background:rgba(14,34,48,.86);backdrop-filter:blur(6px);color:#fff;font-size:.78rem;font-weight:700;display:flex;align-items:center;justify-content:center;gap:6px;opacity:0;transform:translateY(8px);transition:all var(--t)}
@media(hover:hover){.pcard:hover .p-qv{opacity:1;transform:none}}
@media(hover:none){.p-qv{display:none}}
.sold{position:absolute;inset:0;background:rgba(247,249,251,.72);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:var(--navy)}
.p-body{padding:12px 14px 16px;display:flex;flex-direction:column;flex:1}
@media(min-width:768px){.p-body{padding:14px 18px 18px}}
.p-meta{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:5px}
.p-cat{font-size:.64rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.p-rate{display:inline-flex;align-items:center;gap:4px;font-size:.74rem;font-weight:800;color:var(--navy)}
.p-rate .i{color:var(--gold)}
.p-rate small{color:var(--muted-2);font-weight:600}
.p-name{font-family:var(--fd);font-size:1.04rem;font-weight:500;color:var(--navy);line-height:1.25;cursor:pointer}
@media(min-width:768px){.p-name{font-size:1.16rem}}
.p-sub{font-size:.78rem;color:var(--muted);line-height:1.5;margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.p-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:12px}
.p-price{font-weight:800;font-size:1rem;color:var(--navy);line-height:1.2}
.p-price small{display:block;font-size:.66rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.p-price s{font-weight:600;font-size:.76rem;color:var(--muted-2);margin-left:4px}
.p-add{width:40px;height:40px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;transition:background var(--t),transform var(--t);flex-shrink:0}
.p-add:active{transform:scale(.9)}
@media(hover:hover){.p-add:hover{background:var(--navy)}}
.p-add:disabled{background:var(--line-2);cursor:not-allowed}
.stock-low{font-size:.7rem;font-weight:700;color:var(--rose);margin-top:6px}
.pgrid.list{grid-template-columns:1fr!important}
.pgrid.list .pcard{flex-direction:row}
.pgrid.list .p-media{width:140px;flex-shrink:0;margin:8px;aspect-ratio:1}
@media(min-width:640px){.pgrid.list .p-media{width:190px}}
.pgrid.list .p-body{justify-content:center}
.more-wrap{display:flex;justify-content:center;margin-top:36px}
.empty{text-align:center;padding:60px 20px;display:none}
.empty.show{display:block}
.empty-ic{width:64px;height:64px;border-radius:50%;background:var(--sky);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;color:var(--blue)}
.empty h3{font-family:var(--fd);font-weight:500;font-size:1.4rem;color:var(--navy);margin-bottom:6px}
.empty p{color:var(--muted);font-size:.9rem;margin-bottom:16px}
.recent{margin-top:40px;display:none}
.recent.show{display:block}
.recent h4{font-size:.74rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.recent-row{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none}
.recent-row::-webkit-scrollbar{display:none}
.rv{flex:0 0 220px;display:flex;align-items:center;gap:10px;padding:8px;border-radius:var(--r);background:var(--paper);border:1px solid var(--line);text-align:left}
.rv img{width:52px;height:52px;border-radius:10px;object-fit:cover}
.rv strong{display:block;font-size:.82rem;color:var(--navy);line-height:1.3}
.rv small{font-size:.76rem;color:var(--muted)}

/* ---------- oven schedule ---------- */
.bake-row{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
.bake{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px;position:relative;overflow:hidden}
.bake.now{border-color:var(--blue);box-shadow:0 0 0 3px rgba(7,94,152,.1)}
.bake-time{font-family:var(--fd);font-size:1.6rem;color:var(--navy);line-height:1}
.bake strong{display:block;font-size:.88rem;color:var(--navy);margin:10px 0 2px}
.bake small{font-size:.76rem;color:var(--muted);display:block;margin-bottom:12px}
.bake .i-lg{position:absolute;right:14px;top:14px;color:var(--sky-2)}

/* ---------- combos ---------- */
.combo-grid{display:grid;gap:18px}
@media(min-width:760px){.combo-grid{grid-template-columns:repeat(3,1fr)}}
.combo{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow var(--t),transform var(--t)}
@media(hover:hover){.combo:hover{box-shadow:var(--sh-lg);transform:translateY(-4px)}}
.combo-img{position:relative;height:190px;background:var(--sky)}
.combo-img img{width:100%;height:100%;object-fit:cover}
.combo-img .tag{position:absolute;top:12px;left:12px}
.combo-bd{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1}
.combo-bd h3{font-family:var(--fd);font-weight:500;font-size:1.3rem;color:var(--navy)}
.combo-bd p{font-size:.84rem;color:var(--muted);margin:6px 0 16px;flex:1}
.combo-ft{display:flex;align-items:center;justify-content:space-between;gap:10px}
.combo-ft b{font-size:1.15rem;color:var(--navy)}
.combo-ft s{font-size:.8rem;color:var(--muted-2);margin-left:6px}

/* ---------- cake builder ---------- */
.builder{display:grid;gap:24px;align-items:start}
@media(min-width:980px){.builder{grid-template-columns:1.35fr .9fr;gap:36px}}
.b-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-xl);padding:24px}
@media(min-width:640px){.b-card{padding:32px}}
.b-group{padding:18px 0;border-bottom:1px solid var(--line)}
.b-group:first-child{padding-top:0}
.b-group:last-child{border-bottom:none;padding-bottom:0}
.b-group .lbl{display:flex;align-items:center;gap:8px}
.b-group .lbl span{width:22px;height:22px;border-radius:50%;background:var(--sky);color:var(--blue);display:inline-flex;align-items:center;justify-content:center;font-size:.68rem}
.b-two{display:grid;gap:14px}
@media(min-width:560px){.b-two{grid-template-columns:1fr 1fr}}
.tg-line{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0}
.tg-line strong{display:block;font-size:.88rem;color:var(--navy)}
.tg-line small{font-size:.78rem;color:var(--muted)}
.summary{position:sticky;top:calc(var(--nav-h) + 16px);background:var(--navy);color:#fff;border-radius:var(--r-xl);overflow:hidden}
.sum-img{height:170px;position:relative}
.sum-img img{width:100%;height:100%;object-fit:cover;opacity:.85}
.sum-img::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,var(--navy))}
.sum-bd{padding:6px 24px 24px}
.sum-bd h4{font-family:var(--fd);font-weight:400;font-size:1.5rem}
.sum-lines{margin:14px 0;display:grid;gap:8px;font-size:.84rem}
.sum-lines div{display:flex;justify-content:space-between;gap:10px;color:rgba(255,255,255,.75)}
.sum-lines b{color:#fff;font-weight:700;text-align:right}
.sum-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:14px;border-top:1px dashed rgba(255,255,255,.2);margin-bottom:18px}
.sum-total span{font-size:.78rem;opacity:.7}
.sum-total b{font-family:var(--fd);font-size:2rem;font-weight:500}
.sum-note{font-size:.74rem;color:rgba(255,255,255,.55);margin-top:12px;display:flex;gap:8px}
.sum-btns{display:grid;gap:10px}

/* ---------- how / zones ---------- */
.how{display:grid;gap:14px;grid-template-columns:1fr 1fr}
@media(min-width:900px){.how{grid-template-columns:repeat(4,1fr)}}
.how-step{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px}
.how-n{width:44px;height:44px;border-radius:12px;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.how-step strong{display:block;color:var(--navy);font-size:.95rem;margin-bottom:4px}
.how-step small{font-size:.8rem;color:var(--muted);line-height:1.55;display:block}
.zones{margin-top:28px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.zones-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.zones-hd strong{color:var(--navy)}
.zone-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.zone{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 20px;border-bottom:1px solid var(--line);font-size:.86rem}
.zone span:first-child{display:flex;align-items:center;gap:8px;color:var(--navy);font-weight:600}
.zone small{color:var(--muted);font-size:.76rem}
.zone b{color:var(--blue);font-size:.82rem;white-space:nowrap}

/* ---------- rewards ---------- */
.loyal{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.loyal::before{content:'';position:absolute;right:-180px;top:-200px;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(7,94,152,.45),transparent 65%)}
.loyal-grid{display:grid;gap:48px;align-items:center;position:relative;z-index:1}
@media(min-width:900px){.loyal-grid{grid-template-columns:1fr 1fr;gap:80px}}
.loyal .eyebrow{color:var(--blue-3)}
.loyal .h2{color:#fff}.loyal .h2 em{color:var(--blue-3)}
.loyal .lead{color:rgba(255,255,255,.65)}
.tiers{margin-top:28px;display:grid;gap:10px}
.tier{display:flex;align-items:center;gap:14px;padding:15px 18px;border-radius:var(--r);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.tier-ic{width:40px;height:40px;border-radius:12px;background:rgba(79,151,204,.18);color:var(--blue-3);display:flex;align-items:center;justify-content:center}
.tier-info{flex:1}
.tier-info strong{display:block;font-size:.95rem}
.tier-info small{font-size:.76rem;color:rgba(255,255,255,.5)}
.tier-perk{font-size:.74rem;font-weight:800;color:var(--navy);background:#fff;border-radius:var(--pill);padding:5px 12px;white-space:nowrap}
.mcard{border-radius:24px;padding:26px;background:linear-gradient(135deg,var(--blue) 0%,#053e66 100%);color:#fff;box-shadow:0 30px 60px rgba(0,0,0,.35);position:relative;overflow:hidden;aspect-ratio:1.6;display:flex;flex-direction:column;justify-content:space-between;max-width:470px;border:1px solid rgba(255,255,255,.12)}
.mcard::before{content:'';position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.08)}
.mc-top,.mc-mid,.mc-bot{position:relative;z-index:1}
.mc-top{display:flex;justify-content:space-between;align-items:center}
.mc-brand{font-family:var(--fd);font-style:italic;font-size:1.15rem}
.mc-tier{font-size:.66rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;background:rgba(14,34,48,.35);padding:5px 12px;border-radius:var(--pill)}
.mc-lbl{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;opacity:.75;font-weight:700}
.mc-pts{font-family:var(--fd);font-size:2.8rem;font-weight:400;line-height:1.05}
.mc-bar{height:5px;border-radius:9px;background:rgba(255,255,255,.22);overflow:hidden;margin:10px 0 6px}
.mc-bar i{display:block;height:100%;width:50%;background:#fff;border-radius:9px;transition:width .6s}
.mc-bar-row{display:flex;justify-content:space-between;font-size:.72rem;opacity:.8}
.mc-bot{display:flex;justify-content:space-between;align-items:flex-end;font-size:.84rem}
.mc-bot small{display:block;font-size:.68rem;opacity:.7}
.mc-num{font-family:ui-monospace,monospace;letter-spacing:.14em;opacity:.85}
.mcard-btns{display:flex;gap:10px;margin-top:20px;max-width:470px}
.mcard-btns .btn{flex:1}

/* ---------- gift cards ---------- */
.gift{display:grid;gap:36px;align-items:center}
@media(min-width:900px){.gift{grid-template-columns:1fr 1fr;gap:72px}}
.gcard{aspect-ratio:1.6;border-radius:24px;background:linear-gradient(140deg,#fff 0%,var(--sky) 100%);border:1px solid var(--sky-2);padding:28px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;box-shadow:var(--sh-lg);max-width:480px}
.gcard::before{content:'';position:absolute;right:-50px;bottom:-70px;width:240px;height:240px;border-radius:50%;background:var(--blue);opacity:.08}
.gcard::after{content:'';position:absolute;right:60px;top:-90px;width:180px;height:180px;border-radius:50%;border:24px solid var(--navy);opacity:.05}
.gc-top{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}
.gc-amt{font-family:var(--fd);font-size:3rem;color:var(--navy);line-height:1;position:relative;z-index:1}
.gc-to{font-size:.84rem;color:var(--muted);position:relative;z-index:1}
.gc-to b{color:var(--navy)}
.gift-form{display:grid;gap:16px;margin-top:24px}

/* ---------- track + faq ---------- */
.help-grid{display:grid;gap:28px;align-items:start}
@media(min-width:960px){.help-grid{grid-template-columns:.9fr 1.1fr;gap:56px}}
.track{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-xl);padding:26px}
.track h3{font-family:var(--fd);font-weight:500;font-size:1.5rem;color:var(--navy)}
.track>p{font-size:.86rem;color:var(--muted);margin:4px 0 18px}
.track-row{display:flex;gap:8px}
.track-res{margin-top:20px}
.tl{display:grid;gap:0;margin-top:14px}
.tl-step{display:flex;gap:14px;position:relative;padding-bottom:18px}
.tl-step:last-child{padding-bottom:0}
.tl-step::before{content:'';position:absolute;left:13px;top:28px;bottom:0;width:2px;background:var(--line-2)}
.tl-step:last-child::before{display:none}
.tl-step.done::before{background:var(--blue)}
.tl-dot{width:28px;height:28px;border-radius:50%;border:2px solid var(--line-2);background:var(--paper);display:flex;align-items:center;justify-content:center;color:transparent;flex-shrink:0;position:relative;z-index:1}
.tl-step.done .tl-dot{background:var(--blue);border-color:var(--blue);color:#fff}
.tl-step.cur .tl-dot{border-color:var(--blue);color:var(--blue);box-shadow:0 0 0 5px var(--sky)}
.tl-step strong{display:block;font-size:.88rem;color:var(--navy);line-height:1.3;padding-top:3px}
.tl-step small{font-size:.76rem;color:var(--muted)}
.track-box{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.track-box-hd{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.track-box-hd b{color:var(--navy);font-family:ui-monospace,monospace}
.faq{display:grid;gap:10px}
.faq details{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:border-color var(--t)}
.faq details[open]{border-color:var(--blue-3)}
.faq summary{list-style:none;cursor:pointer;padding:17px 20px;font-weight:700;color:var(--navy);font-size:.94rem;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .i{color:var(--blue);transition:transform var(--t)}
.faq details[open] summary .i{transform:rotate(45deg)}
.faq details p{padding:0 20px 18px;font-size:.88rem;color:var(--muted);line-height:1.7}

/* ---------- testimonials ---------- */
.tcar{overflow:hidden;margin:0 -8px}
.ttrack{display:flex;transition:transform .6s var(--ease)}
.tslide{flex:0 0 100%;padding:0 8px}
@media(min-width:700px){.tslide{flex-basis:50%}}
@media(min-width:1080px){.tslide{flex-basis:33.333%}}
.tcard{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;height:100%;display:flex;flex-direction:column}
.t-top{display:flex;justify-content:space-between;align-items:center}
.t-q{font-family:var(--fd);font-size:3.2rem;line-height:.6;color:var(--blue-3);height:24px}
.stars{display:inline-flex;gap:2px;color:var(--gold)}
.stars .off{color:var(--line-2)}
.t-text{font-family:var(--fd);font-size:1.06rem;line-height:1.65;color:var(--navy);margin:16px 0 22px;flex:1}
.t-foot{display:flex;align-items:center;gap:12px;padding-top:16px;border-top:1px solid var(--line)}
.t-av{width:42px;height:42px;border-radius:50%;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:800}
.t-name{font-size:.88rem;font-weight:800;color:var(--navy)}
.t-since{font-size:.74rem;color:var(--muted)}
.car-nav{display:flex;align-items:center;gap:10px}
.car-btn{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line-2);display:flex;align-items:center;justify-content:center;color:var(--navy);background:var(--paper);transition:all var(--t)}
@media(hover:hover){.car-btn:hover{background:var(--navy);border-color:var(--navy);color:#fff}}
.dots{display:flex;justify-content:center;gap:6px;margin-top:28px}
.dot{width:8px;height:8px;border-radius:9px;background:var(--line-2);transition:all var(--t)}
.dot.on{width:26px;background:var(--blue)}

/* ---------- instagram ---------- */
.insta{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
@media(min-width:800px){.insta{grid-template-columns:repeat(6,1fr);gap:12px}}
.insta a{position:relative;aspect-ratio:1;border-radius:var(--r);overflow:hidden;background:var(--sky)}
.insta img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.insta a::after{content:'';position:absolute;inset:0;background:rgba(14,34,48,0);transition:background var(--t)}
@media(hover:hover){.insta a:hover img{transform:scale(1.08)}.insta a:hover::after{background:rgba(14,34,48,.25)}}

/* ---------- stay in touch ---------- */
.stay{display:grid;gap:18px}
@media(min-width:900px){.stay{grid-template-columns:1.1fr .9fr}}
.stay-card{border-radius:var(--r-xl);padding:34px 26px;position:relative;overflow:hidden}
@media(min-width:640px){.stay-card{padding:44px}}
.stay-news{background:var(--sky)}
.stay-news::after{content:'';position:absolute;right:-70px;top:-70px;width:240px;height:240px;border-radius:50%;background:rgba(7,94,152,.08)}
.stay-rem{background:var(--paper);border:1px solid var(--line)}
.stay-card .h2{font-size:clamp(1.6rem,3vw,2.2rem)}
.news-form{display:flex;gap:10px;position:relative;z-index:1;margin-top:22px}
@media(max-width:480px){.news-form{flex-direction:column}}
.news-form .field{border-radius:var(--pill);min-height:54px;padding:0 22px;border-color:transparent;box-shadow:var(--sh-sm)}
.news-note{display:flex;align-items:center;gap:6px;font-size:.76rem;color:var(--muted);margin-top:12px;position:relative;z-index:1}
.rem-form{display:grid;gap:10px;margin-top:18px}
@media(min-width:520px){.rem-form{grid-template-columns:1fr 1fr}}
.rem-form .full{grid-column:1/-1}

/* ---------- footer ---------- */
.foot{background:var(--navy);color:rgba(255,255,255,.65);padding:68px 0 28px}
.foot-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.08)}
@media(min-width:960px){.foot-grid{grid-template-columns:1.5fr 1fr 1fr 1.4fr;gap:52px}}
.foot-brand{grid-column:1/-1}
@media(min-width:960px){.foot-brand{grid-column:auto}}
.foot .logo-txt{color:#fff}.foot .logo-txt small{color:rgba(255,255,255,.45)}
.foot .logo-mark{background:var(--blue)}.foot .logo-mark::after{border-color:var(--navy);background:#fff}
.foot-about{font-size:.87rem;line-height:1.8;margin:18px 0 20px;max-width:320px}
.socials{display:flex;gap:8px}
.soc{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;color:#fff;transition:all var(--t)}
@media(hover:hover){.soc:hover{background:var(--blue);border-color:var(--blue)}}
.foot h4{font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin-bottom:16px}
.foot li{margin-bottom:11px}
.foot li a,.foot li span{font-size:.87rem;display:flex;gap:10px;align-items:flex-start;line-height:1.55;transition:color var(--t)}
.foot li .i{margin-top:2px;color:var(--blue-3)}
@media(hover:hover){.foot li a:hover{color:#fff}}
.pay-logos{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.pay-logos span{font-size:.68rem;font-weight:800;padding:5px 9px;border-radius:6px;background:rgba(255,255,255,.08);color:#fff;letter-spacing:.04em}
.foot-bot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:24px;font-size:.78rem;color:rgba(255,255,255,.42)}
.foot-bot a{display:inline-flex;align-items:center;gap:5px}
@media(hover:hover){.foot-bot a:hover{color:#fff}}

/* ---------- floating buttons ---------- */
.fab-wa{position:fixed;right:16px;bottom:calc(var(--bot-nav) + 16px);z-index:880;width:54px;height:54px;border-radius:50%;background:#1f9d55;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(31,157,85,.38);transition:transform var(--t)}
@media(min-width:1024px){.fab-wa{bottom:24px;right:24px}}
@media(hover:hover){.fab-wa:hover{transform:scale(1.07)}}
.to-top{position:fixed;right:22px;bottom:calc(var(--bot-nav) + 82px);z-index:880;width:42px;height:42px;border-radius:50%;background:var(--paper);color:var(--navy);border:1px solid var(--line);box-shadow:var(--sh);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity var(--t)}
@media(min-width:1024px){.to-top{bottom:90px;right:30px}}
.to-top.show{opacity:1;pointer-events:auto}

/* ---------- drawers / modals ---------- */
.ov{position:fixed;inset:0;background:rgba(14,34,48,.45);backdrop-filter:blur(3px);z-index:1000;opacity:0;pointer-events:none;transition:opacity .3s}
.ov.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:100%;max-width:440px;background:var(--bg);z-index:1001;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .4s var(--ease);box-shadow:var(--sh-lg)}
.drawer.open{transform:none}
.dr-hd{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid var(--line);background:var(--paper)}
.dr-title{font-family:var(--fd);font-size:1.45rem;font-weight:500;color:var(--navy)}
.dr-title small{font-family:var(--fb);font-size:.8rem;color:var(--muted);margin-left:6px;font-weight:600}
.x-btn{width:40px;height:40px;border-radius:50%;background:var(--bg);display:flex;align-items:center;justify-content:center;color:var(--navy);transition:background var(--t);flex-shrink:0}
@media(hover:hover){.x-btn:hover{background:var(--sky)}}
.dr-body{flex:1;overflow-y:auto;padding:16px 22px;display:flex;flex-direction:column;gap:10px}
.dr-foot{padding:18px 22px calc(18px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--paper)}
.free-bar{background:var(--sky);border-radius:var(--r);padding:12px 14px;font-size:.8rem;color:var(--navy)}
.free-bar b{color:var(--blue)}
.free-track{height:6px;border-radius:9px;background:#fff;margin-top:8px;overflow:hidden}
.free-track i{display:block;height:100%;background:var(--blue);border-radius:9px;transition:width .5s}
.row-sum{display:flex;justify-content:space-between;font-size:.88rem;color:var(--muted);margin-bottom:7px}
.row-sum.disc{color:var(--green);font-weight:700}
.row-sum.total{font-size:1.02rem;color:var(--navy);font-weight:800;margin:10px 0 16px;padding-top:12px;border-top:1px dashed var(--line-2)}
.coupon-row{display:flex;gap:8px;margin-bottom:14px}
.coupon-row .field{min-height:42px;font-size:.84rem;text-transform:uppercase;font-family:ui-monospace,monospace;letter-spacing:.06em}
.coupon-row .btn{min-height:42px}
.coupon-on{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;border-radius:var(--r-sm);background:var(--green-l);color:var(--green);font-size:.82rem;font-weight:700;margin-bottom:14px}
.line-item{display:flex;gap:12px;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:11px}
.li-img{width:66px;height:66px;border-radius:var(--r-sm);overflow:hidden;flex-shrink:0;background:var(--sky)}
.li-img img{width:100%;height:100%;object-fit:cover}
.li-info{flex:1;min-width:0}
.li-name{font-weight:800;font-size:.87rem;color:var(--navy);line-height:1.3}
.li-sub{font-size:.74rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.li-price{font-weight:800;font-size:.9rem;color:var(--navy)}
.qty{display:inline-flex;align-items:center;border:1.5px solid var(--line-2);border-radius:var(--pill);margin-top:7px;background:var(--paper)}
.qty button{width:30px;height:30px;display:flex;align-items:center;justify-content:center;color:var(--navy)}
.qty span{min-width:22px;text-align:center;font-size:.84rem;font-weight:800}
.qty.lg button{width:42px;height:44px}.qty.lg span{min-width:30px;font-size:.95rem}
.li-rm{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--muted)}
@media(hover:hover){.li-rm:hover{background:var(--rose-l);color:var(--rose)}}
.li-acts{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.upsell{margin-top:6px}
.upsell h5{font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:8px 0 8px}
.ups-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ups{display:flex;align-items:center;gap:8px;padding:8px;border-radius:var(--r-sm);background:var(--paper);border:1px dashed var(--line-2);text-align:left}
.ups img{width:40px;height:40px;border-radius:8px;object-fit:cover}
.ups strong{display:block;font-size:.74rem;color:var(--navy);line-height:1.25}
.ups small{font-size:.72rem;color:var(--blue);font-weight:800}
.dr-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;padding:40px 0}
.dr-empty .empty-ic{margin:0}
.dr-empty h4{font-family:var(--fd);font-weight:500;font-size:1.3rem;color:var(--navy)}
.dr-empty p{font-size:.86rem;color:var(--muted);margin-bottom:8px}

.modal-bg{position:fixed;inset:0;z-index:1100;background:rgba(14,34,48,.5);backdrop-filter:blur(4px);display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s}
@media(min-width:640px){.modal-bg{align-items:center;padding:20px}}
.modal-bg.open{opacity:1;pointer-events:auto}
.modal{background:var(--bg);width:100%;border-radius:var(--r-xl) var(--r-xl) 0 0;max-height:94vh;overflow-y:auto;position:relative;transform:translateY(40px);transition:transform .35s var(--ease)}
@media(min-width:640px){.modal{border-radius:var(--r-xl);max-width:460px;transform:scale(.96)}}
.modal-bg.open .modal{transform:none}
.modal>.x-btn{position:absolute;top:14px;right:14px;background:var(--paper);z-index:2;box-shadow:var(--sh-sm)}
.auth-in{padding:30px 24px calc(28px + env(safe-area-inset-bottom))}
@media(min-width:640px){.auth-in{padding:38px 36px}}
.auth-in h3{font-family:var(--fd);font-weight:500;font-size:1.75rem;color:var(--navy);line-height:1.1;margin-top:20px}
.auth-in>p{font-size:.88rem;color:var(--muted);margin:6px 0 20px}
.seg{display:flex;background:var(--sky);border-radius:var(--pill);padding:4px;margin-bottom:20px}
.seg button{flex:1;min-height:40px;border-radius:var(--pill);font-size:.84rem;font-weight:700;color:var(--muted);transition:all var(--t);display:flex;align-items:center;justify-content:center;gap:6px}
.seg button.on{background:var(--paper);color:var(--navy);box-shadow:var(--sh-sm)}
.stack{display:flex;flex-direction:column;gap:14px}
.fine{text-align:center;font-size:.78rem;color:var(--muted);margin-top:14px}
.fine a{color:var(--blue);font-weight:700}

/* quick view */
.qv{max-width:920px!important;display:flex;flex-direction:column;overflow:hidden!important;max-height:92vh}
#qvBody{display:flex;flex-direction:column;min-height:0;flex:1}
.qv-grid{display:flex;flex-direction:column;min-height:0;flex:1}
.qv-img{background:var(--sky);position:relative;height:min(34vh,300px);flex-shrink:0}
.qv-img img{width:100%;height:100%;object-fit:cover}
.qv-info{display:flex;flex-direction:column;min-height:0;flex:1}
.qv-scroll{overflow-y:auto;padding:20px 20px 16px;display:flex;flex-direction:column;gap:14px;flex:1;min-height:0}
.qv-bar{border-top:1px solid var(--line);background:var(--paper);padding:12px 20px calc(12px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.qv-title{font-family:var(--fd);font-weight:500;font-size:1.6rem;line-height:1.12;color:var(--navy);margin-top:4px}
.qv-sub{color:var(--muted);font-size:.9rem;line-height:1.65}
.qv-price{font-size:1.35rem;font-weight:800;color:var(--navy);white-space:nowrap}
.qv-price s{font-size:.9rem;font-weight:600;color:var(--muted-2);margin-left:6px}
.qv-list{display:grid;gap:6px;font-size:.82rem;color:var(--text)}
.qv-list div{display:flex;gap:8px;align-items:center}
.qv-list .i{color:var(--blue)}
.qv-acts{display:flex;gap:8px;align-items:center;flex:1;min-width:250px}
.qv-acts .btn-primary{flex:1;min-width:0;padding:0 14px}
.qv-wl{border:1.5px solid var(--line-2);width:50px;height:50px;flex-shrink:0}
.qv-wl.on{color:var(--rose)}.qv-wl.on svg{fill:currentColor}
.qv-sizes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.qv-size{border:1.5px solid var(--line-2);border-radius:var(--r-sm);padding:9px 8px;text-align:center;display:flex;flex-direction:column;gap:1px;background:var(--paper);transition:all var(--t)}
.qv-size b{font-size:.92rem;color:var(--navy)}.qv-size small{font-size:.68rem;color:var(--muted)}.qv-size span{font-size:.78rem;font-weight:800;color:var(--blue);margin-top:2px}
.qv-size.on{border-color:var(--blue);background:var(--sky);box-shadow:0 0 0 3px rgba(7,94,152,.12)}
@media(min-width:760px){
  .qv{height:min(620px,88vh)}
  .qv-grid{flex-direction:row}
  .qv-img{height:auto;width:44%;flex-shrink:0}
  .qv-scroll{padding:30px 30px 18px}
  .qv-bar{padding:14px 30px}
  .qv-title{font-size:1.85rem}
}
@media(max-width:759px){
  .qv-img{height:min(27vh,230px)}
  .qv-bar{display:grid;grid-template-columns:1fr auto;grid-template-areas:"price qty" "add wl";gap:10px;align-items:center}
  .qv-acts{display:contents}
  .qv-price{grid-area:price}.qv-bar .qty{grid-area:qty}.qv-acts .btn-primary{grid-area:add;width:100%}.qv-wl{grid-area:wl;justify-self:end}
}

/* checkout */
.ck{max-width:600px!important}
.ck-hd{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:2}
.ck-hd h3{font-family:var(--fd);font-weight:500;font-size:1.4rem;color:var(--navy)}
.ck-steps{display:flex;gap:6px;padding:16px 22px 0}
.ck-st{flex:1}
.ck-st i{display:block;height:4px;border-radius:9px;background:var(--line-2);margin-bottom:6px;transition:background var(--t)}
.ck-st.on i{background:var(--blue)}
.ck-st span{font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ck-st.on span{color:var(--blue)}
.ck-body{padding:20px 22px;display:grid;gap:16px}
.ck-ft{display:flex;gap:10px;padding:16px 22px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--paper);position:sticky;bottom:0}
.ck-ft:has(>:nth-child(3)){flex-wrap:wrap}.ck-ft:has(>:nth-child(3))>.btn{flex:1 1 0;min-width:0;white-space:nowrap}.ck-ft:has(>:nth-child(3))>.btn-primary{flex-basis:100%;order:-1}
.ck-ft .btn-primary{flex:1}
.pay-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pay{display:flex;align-items:center;gap:10px;padding:14px;border-radius:var(--r);border:1.5px solid var(--line-2);background:var(--paper);text-align:left;transition:all var(--t)}
.pay.on{border-color:var(--blue);background:var(--sky);box-shadow:0 0 0 3px rgba(7,94,152,.1)}
.pay-logo{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.72rem;color:#fff;flex-shrink:0}
.pay strong{display:block;font-size:.86rem;color:var(--navy)}
.pay small{font-size:.72rem;color:var(--muted)}
.mini-sum{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.mini-sum .row-sum.total{margin-bottom:0}
.earn-note{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--blue);font-weight:700;background:var(--sky);padding:10px 12px;border-radius:var(--r-sm)}
.success{text-align:center;padding:10px 0}
.success-ic{width:78px;height:78px;border-radius:50%;background:var(--green-l);color:var(--green);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;animation:pop .5s var(--ease)}
.success h4{font-family:var(--fd);font-weight:500;font-size:1.8rem;color:var(--navy)}
.success p{color:var(--muted);font-size:.9rem;margin:6px 0 18px}
.oid{display:inline-flex;align-items:center;gap:8px;font-family:ui-monospace,monospace;font-size:1.1rem;font-weight:800;color:var(--blue);background:var(--sky);padding:10px 18px;border-radius:var(--pill)}

/* account */
.acct{max-width:540px}
.acct-hd{background:var(--navy);color:#fff;padding:22px 22px 0;position:relative;overflow:hidden}
.acct-hd::after{content:'';position:absolute;right:-70px;top:-70px;width:220px;height:220px;border-radius:50%;background:rgba(79,151,204,.12)}
.acct-hd .x-btn{background:rgba(255,255,255,.1);color:#fff;position:absolute;top:16px;right:16px;z-index:2}
.acct-user{display:flex;align-items:center;gap:14px;padding-right:48px;position:relative;z-index:1}
.acct-av{width:54px;height:54px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.05rem;border:3px solid rgba(255,255,255,.2);flex-shrink:0}
.acct-name{font-family:var(--fd);font-size:1.3rem;font-weight:500}
.acct-mail{font-size:.78rem;opacity:.6}
.acct-tier{display:inline-flex;align-items:center;gap:5px;margin-top:6px;font-size:.64rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;background:#fff;color:var(--navy);padding:4px 10px;border-radius:var(--pill)}
.acct-stats{display:grid;grid-template-columns:repeat(3,1fr);margin-top:20px;border-top:1px solid rgba(255,255,255,.1);position:relative;z-index:1}
.acct-stat{padding:14px 6px;text-align:center;border-right:1px solid rgba(255,255,255,.1)}
.acct-stat:last-child{border-right:none}
.acct-stat strong{display:block;font-family:var(--fd);font-size:1.35rem;font-weight:500}
.acct-stat small{font-size:.62rem;opacity:.55;letter-spacing:.06em;text-transform:uppercase;font-weight:700}
.tabs{display:flex;background:var(--paper);border-bottom:1px solid var(--line);padding:0 12px;overflow-x:auto;scrollbar-width:none;flex-shrink:0}
.tabs::-webkit-scrollbar{display:none}
.tab{min-height:50px;padding:0 14px;font-size:.84rem;font-weight:700;color:var(--muted);border-bottom:2px solid transparent;display:flex;align-items:center;gap:6px;white-space:nowrap}
.tab.on{color:var(--navy);border-bottom-color:var(--blue)}
.pane{display:none;padding:20px 22px 36px}
.pane.on{display:block}
.ocard{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:14px;margin-bottom:10px}
.ocard-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.ocard-hd b{font-family:ui-monospace,monospace;color:var(--navy)}
.ocard p{font-size:.8rem;color:var(--muted)}
.ocard-ft{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.rw-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rw{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:5px}
.rw.locked{opacity:.55}
.rw-ic{width:36px;height:36px;border-radius:10px;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.rw strong{font-size:.88rem;color:var(--navy)}
.rw small{font-size:.76rem;color:var(--muted)}
.rw .btn{margin-top:8px}
.pts-hero{background:linear-gradient(135deg,var(--blue),#053e66);color:#fff;border-radius:var(--r-lg);padding:20px;margin-bottom:18px}
.pts-hero small{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;opacity:.8;font-weight:800}
.pts-hero strong{display:block;font-family:var(--fd);font-weight:400;font-size:2.4rem;line-height:1.1}
.sec-row{display:flex;align-items:center;justify-content:space-between;margin:4px 0 12px}
.sec-row h5{font-family:var(--fd);font-size:1.12rem;font-weight:500;color:var(--navy)}

/* toast */
.toasts{position:fixed;left:50%;bottom:calc(var(--bot-nav) + 14px);transform:translateX(-50%);z-index:2000;display:flex;flex-direction:column;gap:8px;align-items:center;width:92%;max-width:380px;pointer-events:none}
@media(min-width:1024px){.toasts{bottom:28px}}
.toast{background:var(--navy);color:#fff;border-radius:var(--r);padding:13px 16px;font-size:.85rem;font-weight:600;display:flex;align-items:center;gap:10px;box-shadow:var(--sh-lg);width:100%;opacity:0;transform:translateY(30px);transition:all .35s var(--ease)}
.toast.show{opacity:1;transform:none}
.toast .t-ic{width:24px;height:24px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.toast.err .t-ic{background:var(--rose)}

@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px var(--green-l)}50%{box-shadow:0 0 0 8px rgba(47,138,91,.08)}}
@keyframes pop{0%{transform:scale(.5);opacity:0}100%{transform:scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* closed drawers: no shadow leaking onto the page, not reachable by keyboard */
.drawer{box-shadow:none;visibility:hidden;transition:transform .4s var(--ease),visibility 0s linear .4s}
.drawer.open{box-shadow:var(--sh-lg);visibility:visible;transition:transform .4s var(--ease),visibility 0s}
.fab-wa{width:50px;height:50px}
@media(max-width:1023px){.fab-wa{bottom:calc(var(--bot-nav) + 12px);right:12px}}

/* ---------- Section F: account, reviews, captcha ---------- */
.opt{text-transform:none;letter-spacing:0;font-weight:600;color:var(--muted)}
.link{color:var(--blue);font-weight:800;font-size:.8rem}
.b-span{grid-column:1/-1}
.avatar.has-img{padding:0;overflow:hidden;background:var(--sky)}
.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.keep{display:flex;align-items:center;gap:10px;font-size:.84rem;color:var(--text);font-weight:600;cursor:pointer}
.keep input{width:18px;height:18px;accent-color:var(--blue)}
.cap-box{min-height:78px;display:flex;justify-content:center}
.cap-box.hide{display:none}
.cake-member{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--blue);font-weight:700;background:var(--sky);padding:10px 12px;border-radius:var(--r-sm);margin-top:14px}
.cake-member a{text-decoration:underline}
#cakeCap{margin-top:14px;justify-content:flex-start}
.cake-done{display:flex;gap:12px;align-items:flex-start;background:var(--green-l);color:var(--green);border-radius:var(--r);padding:14px 16px;margin-top:14px}
.cake-done>div{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.cake-done strong{color:var(--navy);font-size:.92rem}.cake-done small{color:var(--text);font-size:.82rem;line-height:1.55}
.zone-dist{grid-column:1/-1;padding:12px 20px 8px;font-size:.66rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);background:var(--sky)}
.rv-summary{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:.86rem;color:var(--muted);flex-wrap:wrap}
.rv-summary b{color:var(--navy);font-size:1rem}
.rv-cta{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:22px;font-size:.86rem;color:var(--muted);text-align:center;flex-wrap:wrap}
.rv-cta .i{color:var(--gold)}.rv-cta a{color:var(--blue);font-weight:800;text-decoration:underline}
.t-reply{font-size:.82rem;color:var(--text);background:var(--sky);border-radius:var(--r-sm);padding:10px 12px;margin:-6px 0 16px}
.t-ver{display:inline-flex;align-items:center;gap:3px;font-size:.62rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--green);background:var(--green-l);padding:2px 7px;border-radius:var(--pill);vertical-align:2px;margin-left:4px}
.t-empty{align-items:center;justify-content:center;text-align:center;min-height:160px}
/* account */
.acct-av{position:relative}
.acct-av.has-img{padding:0;background:var(--sky)}
.acct-av img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.av-cam{position:absolute;right:-4px;bottom:-4px;width:24px;height:24px;border-radius:50%;background:#fff;color:var(--navy);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--sh-sm)}
.acct-since{display:inline-block;margin:6px 0 0 8px;font-size:.68rem;opacity:.6;font-weight:700}
.acct-stat{color:#fff;transition:background var(--t)}.acct-stat:hover{background:rgba(255,255,255,.06)}
.tab .i{opacity:.7}
.pane-intro{font-size:.84rem;color:var(--muted);margin-bottom:14px}
.pf-card{display:flex;gap:16px;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px;margin-bottom:20px}
.pf-card strong{display:block;color:var(--navy);font-size:.95rem}.pf-card small{display:block;color:var(--muted);font-size:.8rem;margin-top:2px}
.pf-card.done{background:var(--green-l);border-color:transparent;color:var(--green)}
.pf-ring{--p:0;width:64px;height:64px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:conic-gradient(var(--blue) calc(var(--p)*1%),var(--sky-2) 0)}
.pf-ring span{width:50px;height:50px;border-radius:50%;background:var(--paper);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.86rem;color:var(--navy)}
.pf-todo{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pf-todo button{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;font-weight:800;color:var(--blue);background:var(--sky);padding:6px 10px;border-radius:var(--pill)}
.pf-todo button:hover{background:var(--sky-2)}
.rate-card{display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(135deg,#fff8ea,#fbf0dc);border:1px solid rgba(217,154,43,.25);border-radius:var(--r);padding:14px 16px;margin:4px 0 20px}
.rate-card strong{display:block;color:var(--navy);font-size:.9rem}.rate-card small{color:var(--muted);font-size:.78rem}
.rw-next{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.rw-next strong{display:block;color:var(--navy);font-size:.88rem}.rw-next small{color:var(--muted);font-size:.78rem}
.rw-next .mc-bar{height:6px;background:var(--sky);border-radius:99px;margin-top:8px;overflow:hidden}.rw-next .mc-bar i{display:block;height:100%;background:var(--blue);border-radius:99px}
.qa-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.qa-grid>*{display:flex;align-items:center;gap:10px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:14px;font-size:.84rem;font-weight:800;color:var(--navy);text-align:left;transition:all var(--t)}
.qa-grid>*:hover{border-color:var(--blue);color:var(--blue)}
.qa-grid .i{color:var(--blue)}
.ocard-acts{display:flex;gap:6px;align-items:center}
.rated .stars{gap:1px}
.mt{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:12px 0 2px}
.mt-st{display:flex;flex-direction:column;gap:6px;font-size:.66rem;font-weight:700;color:var(--muted-2)}
.mt-st i{height:5px;border-radius:99px;background:var(--sky-2)}
.mt-st.on i{background:var(--blue)}.mt-st.on{color:var(--navy)}
.mt-st.cur i{background:linear-gradient(90deg,var(--blue),var(--blue-3));animation:mtPulse 1.6s ease-in-out infinite}
@keyframes mtPulse{50%{opacity:.55}}
.cake-card .cc-row{display:flex;gap:12px;align-items:flex-start}
.cc-ic{width:40px;height:40px;border-radius:12px;background:var(--cream-2);color:#93620f;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cc-row strong{display:block;color:var(--navy);font-size:.88rem}.cc-row small{display:block;color:var(--muted);font-size:.78rem}
.cc-note{font-size:.8rem!important;color:var(--text)!important;background:var(--bg);border-radius:var(--r-sm);padding:8px 10px;margin-top:10px}
.earn-list{display:grid;gap:8px;margin-bottom:20px}
.earn-list div{display:flex;align-items:center;gap:10px;font-size:.84rem;color:var(--text);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-sm);padding:10px 12px}
.earn-list .i{color:var(--blue)}
.pf-sec{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px;margin-bottom:14px}
.pf-sec h6{display:flex;align-items:center;gap:8px;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--navy);margin-bottom:14px}
.pf-sec h6 .i{color:var(--blue)}
.pf-sec+.btn-block{margin-bottom:14px}
.pf-photo{display:flex;gap:14px;align-items:center}
.pf-photo strong{display:block;color:var(--navy);font-size:.88rem}.pf-photo small{color:var(--muted);font-size:.76rem}
.pf-av{width:68px;height:68px;border-radius:50%;background:var(--blue);color:#fff;font-weight:800;font-size:1.2rem;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.pf-av img{width:100%;height:100%;object-fit:cover}
.pf-hint{display:flex;align-items:center;gap:6px;font-size:.76rem;color:var(--muted);margin-top:-4px}
.pf-hint .i{color:var(--blue)}
.pf-line{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:700;color:var(--navy);font-size:.9rem;margin-bottom:8px;word-break:break-all}
label.btn{cursor:pointer}
/* review modal */
.rv-modal{max-width:500px!important}
.rv-body{padding:28px 22px calc(24px + env(safe-area-inset-bottom))}
@media(min-width:640px){.rv-body{padding:34px 32px}}
.rv-body h3{font-family:var(--fd);font-weight:500;font-size:1.6rem;color:var(--navy);line-height:1.15;padding-right:40px}
.rv-sub{font-size:.86rem;color:var(--muted);margin:6px 0 18px}
.rv-stars{display:flex;gap:4px}
.rv-stars button{color:var(--line-2);padding:2px;transition:transform .15s,color .15s}
.rv-stars button:hover{transform:scale(1.12)}
.rv-stars button.on{color:var(--gold)}
.rv-stars .i{width:34px;height:34px}
.rv-stars.sm .i{width:22px;height:22px}
.rv-word{font-size:.84rem;font-weight:700;color:var(--muted);margin-top:4px}
.rv-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line);flex-wrap:wrap}
.rv-item b{font-size:.86rem;color:var(--navy)}
@media(max-width:480px){.acct .tabs{padding:0 6px}.acct .tab{padding:0 9px;font-size:.8rem}.acct .tab .i{display:none}}
/* header "My account" menu */
.u-menu{position:relative;display:flex}
.u-drop{position:absolute;right:0;top:calc(100% + 10px);width:280px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-lg);padding:8px;display:none;z-index:120}
.u-drop.open{display:block}
.u-drop-hd{display:flex;gap:10px;align-items:center;padding:10px 10px 12px;border-bottom:1px solid var(--line);margin-bottom:6px}
.u-drop-hd .avatar{display:flex;border:0;box-shadow:none;flex-shrink:0}
.u-drop-hd b{display:block;color:var(--navy);font-size:.88rem}.u-drop-hd small{display:block;font-size:.74rem;color:var(--muted);word-break:break-all}
.u-drop-hd .u-pts{color:var(--blue);font-weight:800}
.u-drop a,.u-drop .u-out{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border-radius:var(--r-sm);font-size:.86rem;font-weight:700;color:var(--text)}
.u-drop a:hover{background:var(--sky);color:var(--blue)}
.u-sep{height:1px;background:var(--line);margin:6px 4px}
.u-drop .u-out{color:var(--rose)}.u-drop .u-out:hover{background:var(--rose-l)}
@media(max-width:640px){.u-drop{position:fixed;left:12px;right:12px;top:70px;width:auto}}