:root{--black:#0F0E0D;--off:#FAFAF8;--warm:#F5F2ED;--warmer:#EDE8DF;--mid:#8A8480;--light:#DDD9D3;--border:#E8E4DE;--white:#FFFFFF;--green:#2D6A4F;--red:#DC2626;--blue:#1D4ED8;--gold:#B45309;--text:#1C1A18;}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Outfit',sans-serif;background:var(--off);color:var(--text);min-height:100vh;}
nav{background:var(--white);border-bottom:1px solid var(--border);padding:0 1.75rem;display:flex;align-items:center;justify-content:space-between;height:62px;position:sticky;top:0;z-index:200;box-shadow:0 1px 8px rgba(0,0,0,0.05);}
.nav-brand{display:flex;align-items:center;gap:0.65rem;flex-shrink:0;}
.nc-mark{width:36px;height:36px;background:var(--black);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.nc-mark span{color:var(--white);font-weight:700;font-size:0.82rem;letter-spacing:-0.02em;}
.brand-n{font-family:'Playfair Display',serif;font-size:1.05rem;font-weight:700;color:var(--black);}
.nav-links{display:flex;align-items:center;gap:0.05rem;overflow-x:auto;}
.nb{padding:0.42rem 0.8rem;border:none;background:none;color:var(--mid);font-family:'Outfit',sans-serif;font-size:0.75rem;font-weight:500;cursor:pointer;transition:all 0.18s;border-radius:6px;white-space:nowrap;}
.nb:hover{background:var(--warm);color:var(--text);}
.nb.on{background:var(--black);color:var(--white);}
.nb.admin-btn{border:1px solid var(--border);color:var(--gold);}
.nb.admin-btn:hover,.nb.admin-btn.on{background:var(--gold);color:var(--white);border-color:var(--gold);}
.badge{background:var(--red);color:#fff;font-size:0.56rem;font-weight:700;padding:1px 5px;border-radius:10px;margin-left:2px;vertical-align:middle;}
.view{display:none;padding:1.75rem;max-width:1280px;margin:0 auto;}
.view.on{display:block;animation:up 0.28s ease;}
@keyframes up{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.ph{margin-bottom:1.75rem;}
.ph h1{font-family:'Playfair Display',serif;font-size:1.9rem;font-weight:700;line-height:1.15;}
.ph h1 em{font-style:italic;font-weight:400;color:var(--mid);}
.ph p{color:var(--mid);font-size:0.83rem;margin-top:0.25rem;}
.ph-row{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:1rem;margin-bottom:1.75rem;}
.card{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:1.4rem;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
.clbl{font-size:0.67rem;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;color:var(--mid);margin-bottom:0.85rem;}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;}
.stat{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:1.25rem;position:relative;overflow:hidden;}
.stat::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--black);}
.slbl{font-size:0.67rem;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--mid);}
.sval{font-family:'Playfair Display',serif;font-size:2rem;font-weight:700;line-height:1;margin:0.28rem 0;}
.ssub{font-size:0.73rem;color:var(--mid);}
.btn{padding:0.58rem 1.3rem;border-radius:8px;font-family:'Outfit',sans-serif;font-size:0.8rem;font-weight:600;cursor:pointer;transition:all 0.18s;border:none;}
.btn-dk{background:var(--black);color:var(--white);}
.btn-dk:hover{background:#333;transform:translateY(-1px);}
.btn-ol{background:var(--white);color:var(--black);border:1.5px solid var(--black);}
.btn-ol:hover{background:var(--black);color:var(--white);}
.btn-gr{background:var(--green);color:var(--white);}
.btn-gr:hover{background:#1e4d38;}
.btn-rd{background:var(--red);color:var(--white);}
.btn-rd:hover{background:#b91c1c;}
.btn-gld{background:var(--gold);color:var(--white);}
.btn-gld:hover{background:#92400e;}
.btn-pr{background:#4F46E5;color:var(--white);display:flex;align-items:center;gap:0.4rem;}
.btn-pr:hover{background:#4338CA;}
.btn-sm{padding:0.3rem 0.8rem;font-size:0.73rem;}
.btn-xs{padding:0.22rem 0.6rem;font-size:0.68rem;}
.btn-gh{background:none;border:1px solid var(--border);color:var(--mid);font-family:'Outfit',sans-serif;font-size:0.75rem;cursor:pointer;border-radius:6px;padding:0.3rem 0.7rem;transition:all 0.18s;}
.btn-gh:hover{border-color:var(--black);color:var(--black);}
.bge{display:inline-block;padding:0.18rem 0.65rem;border-radius:20px;font-size:0.67rem;font-weight:600;letter-spacing:0.03em;}
.b-pend{background:#FEF3C7;color:#92400E;}
.b-proc{background:#DBEAFE;color:#1E40AF;}
.b-ship{background:#D1FAE5;color:#065F46;}
.b-done{background:#F0FDF4;color:#166534;}
.b-paid{background:#D1FAE5;color:#065F46;}
.b-unp{background:#FEE2E2;color:#991B1B;}
.b-new{background:#EDE9FE;color:#4C1D95;}
table{width:100%;border-collapse:collapse;}
th{text-align:left;padding:0.6rem 0.9rem;font-size:0.65rem;text-transform:uppercase;letter-spacing:0.1em;color:var(--mid);border-bottom:1.5px solid var(--border);font-weight:600;}
td{padding:0.82rem 0.9rem;font-size:0.83rem;border-bottom:1px solid var(--border);vertical-align:middle;}
tr:last-child td{border-bottom:none;}
tr:hover td{background:var(--warm);}
.fg{margin-bottom:0.9rem;}
.fl{display:block;font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:0.08em;color:var(--mid);margin-bottom:0.32rem;}
.fi,.fs,.ft{width:100%;padding:0.6rem 0.85rem;border:1.5px solid var(--border);border-radius:8px;font-family:'Outfit',sans-serif;font-size:0.85rem;background:var(--white);color:var(--text);outline:none;transition:border 0.18s;}
.fi:focus,.fs:focus,.ft:focus{border-color:var(--black);}
.ft{resize:vertical;min-height:75px;}
.tabs{display:flex;gap:0.3rem;margin-bottom:1.4rem;border-bottom:1.5px solid var(--border);}
.tab{padding:0.48rem 1rem;border:none;background:none;font-family:'Outfit',sans-serif;font-size:0.78rem;font-weight:500;color:var(--mid);cursor:pointer;transition:all 0.18s;border-bottom:2px solid transparent;margin-bottom:-1.5px;}
.tab.on{color:var(--black);border-bottom-color:var(--black);font-weight:600;}
.tab:hover:not(.on){color:var(--text);}
.tc{display:none;}.tc.on{display:block;animation:up 0.2s ease;}
.pc{background:var(--white);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:all 0.22s;cursor:pointer;}
.pc:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(0,0,0,0.1);}
.pc-img{height:155px;display:flex;align-items:center;justify-content:center;font-size:2.8rem;position:relative;overflow:hidden;}
.pc-img img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;}
.pc-img .emoji-fb{position:relative;z-index:1;}
.img-soap{background:linear-gradient(135deg,#F5E6D3,#EDD5B8);}
.img-cream{background:linear-gradient(135deg,#E8F4F0,#C8E6DD);}
.img-wash{background:linear-gradient(135deg,#F0E8F4,#DECCEE);}
.img-serum{background:linear-gradient(135deg,#FFF3E0,#FFE0B2);}
.img-label{background:linear-gradient(135deg,#EDE9FE,#DDD6FE);}
.pc-tag{position:absolute;top:10px;right:10px;background:var(--black);color:var(--white);font-size:0.6rem;font-weight:700;padding:3px 8px;border-radius:20px;z-index:2;}
.pc-body{padding:1rem 1.1rem;}
.pc-name{font-family:'Playfair Display',serif;font-size:0.97rem;font-weight:600;margin-bottom:0.18rem;}
.pc-tl{font-size:0.74rem;color:var(--mid);margin-bottom:0.6rem;line-height:1.4;}
.pc-row{display:flex;justify-content:space-between;align-items:center;}
.pc-price{font-size:0.88rem;font-weight:700;}
.pc-moq{font-size:0.68rem;color:var(--mid);}
.size-btns{display:flex;gap:0.4rem;margin-bottom:0.75rem;flex-wrap:wrap;}
.size-btn{padding:0.25rem 0.7rem;border:1.5px solid var(--border);border-radius:6px;font-size:0.73rem;font-weight:600;cursor:pointer;transition:all 0.15s;background:var(--white);color:var(--mid);}
.size-btn.on{border-color:var(--black);background:var(--black);color:var(--white);}
.size-btn:hover:not(.on){border-color:var(--black);color:var(--black);}
.stars{display:flex;gap:2px;}
.star{font-size:1.1rem;cursor:pointer;transition:transform 0.1s;}
.star:hover{transform:scale(1.2);}
.star-display{font-size:0.9rem;}
.review-card{background:var(--warm);border-radius:10px;padding:1rem 1.1rem;margin-bottom:0.75rem;}
.review-name{font-weight:600;font-size:0.85rem;}
.review-text{font-size:0.82rem;color:var(--mid);margin-top:0.3rem;line-height:1.5;}
.review-meta{font-size:0.7rem;color:var(--light);margin-top:0.3rem;}
.admin-header{background:linear-gradient(135deg,#1C1A18,#3D3B38);color:var(--white);padding:1.25rem 1.5rem;border-radius:12px;margin-bottom:1.5rem;display:flex;align-items:center;justify-content:space-between;}
.admin-header h2{font-family:'Playfair Display',serif;font-size:1.2rem;font-weight:600;}
.admin-header p{font-size:0.78rem;color:#9CA3AF;margin-top:0.2rem;}
.admin-prod-row{display:flex;align-items:center;gap:1rem;padding:0.9rem;border:1px solid var(--border);border-radius:10px;background:var(--white);margin-bottom:0.7rem;transition:all 0.18s;}
.admin-prod-row:hover{border-color:var(--black);}
.admin-prod-img{width:52px;height:52px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0;overflow:hidden;}
.admin-prod-img img{width:100%;height:100%;object-fit:cover;}
.admin-prod-info{flex:1;}
.admin-prod-name{font-weight:600;font-size:0.88rem;}
.admin-prod-meta{font-size:0.73rem;color:var(--mid);margin-top:0.15rem;}
.admin-actions{display:flex;gap:0.4rem;flex-shrink:0;}
.img-upload-area{border:2px dashed var(--border);border-radius:10px;padding:1.5rem;text-align:center;cursor:pointer;transition:all 0.18s;background:var(--warm);}
.img-upload-area:hover{border-color:var(--black);}
.img-preview{width:100%;height:140px;object-fit:cover;border-radius:8px;margin-top:0.5rem;}
.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.55);z-index:400;align-items:center;justify-content:center;padding:1rem;}
.overlay.open{display:flex;}
.modal{background:var(--white);border-radius:16px;padding:1.75rem;width:100%;max-width:580px;max-height:92vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,0.2);animation:up 0.22s ease;}
.modal-lg{max-width:760px;}
.modal h2{font-family:'Playfair Display',serif;font-size:1.45rem;font-weight:700;margin-bottom:1.1rem;}
.mcl{float:right;background:var(--warm);border:none;width:28px;height:28px;border-radius:50%;font-size:0.95rem;cursor:pointer;color:var(--mid);display:flex;align-items:center;justify-content:center;transition:all 0.18s;}
.mcl:hover{background:var(--black);color:var(--white);}
.receipt{background:var(--white);border:1px solid var(--border);border-radius:10px;padding:1.75rem;font-size:0.84rem;}
.rcpt-hdr{text-align:center;margin-bottom:1.1rem;padding-bottom:1rem;border-bottom:2px dashed var(--border);}
.rcpt-logo{display:flex;align-items:center;justify-content:center;gap:0.55rem;margin-bottom:0.35rem;}
.rcpt-nc{width:32px;height:32px;background:var(--black);display:flex;align-items:center;justify-content:center;}
.rcpt-nc span{color:var(--white);font-weight:700;font-size:0.78rem;}
.rcpt-row{display:flex;justify-content:space-between;padding:0.28rem 0;border-bottom:1px solid var(--border);}
.rcpt-total{font-weight:700;font-size:0.98rem;padding-top:0.45rem;}
.rcpt-footer{text-align:center;margin-top:0.85rem;padding-top:0.75rem;border-top:2px dashed var(--border);font-size:0.73rem;color:var(--mid);}
.tl{position:relative;padding-left:1.5rem;}
.tl::before{content:'';position:absolute;left:5px;top:4px;bottom:4px;width:1px;background:var(--border);}
.tli{position:relative;margin-bottom:0.9rem;}
.tli::before{content:'';position:absolute;left:-1.5rem;top:5px;width:9px;height:9px;border-radius:50%;background:var(--black);border:2px solid var(--off);box-shadow:0 0 0 1px var(--black);}
.tli.dim::before{background:var(--light);box-shadow:0 0 0 1px var(--light);}
.tli-t{font-size:0.83rem;font-weight:600;}
.tli-d{font-size:0.7rem;color:var(--mid);}
.divider{border:none;border-top:1px solid var(--border);margin:1.1rem 0;}
.info-row{display:flex;justify-content:space-between;padding:0.38rem 0;border-bottom:1px solid var(--border);font-size:0.83rem;}
.info-row:last-child{border-bottom:none;}
.benefit-tag{display:inline-block;background:var(--warm);border-radius:20px;padding:0.2rem 0.65rem;font-size:0.7rem;margin:0.18rem 0.12rem;}
@media print {
  /* individual label print */
  body:not(.bulk-printing) { width: 80mm; height: 100mm; overflow: hidden; margin: 0; padding: 0; }
  body:not(.bulk-printing) * { visibility: hidden; }
  body:not(.bulk-printing) #print-zone, body:not(.bulk-printing) #print-zone * { visibility: visible; }
  body:not(.bulk-printing) #print-zone { display: block !important; position: fixed !important; left: 0 !important; top: 0 !important; width: 80mm !important; background: white !important; }
  /* bulk print */
  body.bulk-printing { overflow: visible !important; height: auto !important; margin: 0; padding: 0; }
  body.bulk-printing > *:not(#bulk-print-zone) { display: none !important; }
  body.bulk-printing #bulk-print-zone { display: block !important; visibility: visible !important; position: relative !important; top: auto !important; left: auto !important; background: white !important; height: auto !important; overflow: visible !important; }
  body.bulk-printing #bulk-print-zone > * { display: block !important; visibility: visible !important; }
  body.bulk-printing #bulk-print-zone * { visibility: visible !important; }
}
::-webkit-scrollbar{width:4px;}::-webkit-scrollbar-thumb{background:var(--light);border-radius:2px;}
@media(max-width:900px){.g2,.g3,.g4{grid-template-columns:1fr 1fr;}}
@media(max-width:600px){.g2,.g3,.g4{grid-template-columns:1fr;}.view{padding:1rem;}.brand-n,.nb span:not(.badge){display:none;}nav{padding:0 0.75rem;}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0.3}}
.msg{max-width:82%;padding:0.68rem 0.95rem;border-radius:14px;font-size:0.84rem;line-height:1.55;}
.msg-bot{background:var(--white);color:var(--text);align-self:flex-start;border:1px solid var(--border);border-bottom-left-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,0.04);}
.msg-user{background:var(--black);color:var(--white);align-self:flex-end;border-bottom-right-radius:4px;}
.msg-typing{background:var(--white);border:1px solid var(--border);align-self:flex-start;padding:0.68rem 0.95rem;border-radius:14px;border-bottom-left-radius:4px;}
.dot-a span{display:inline-block;width:5px;height:5px;background:var(--mid);border-radius:50%;margin:0 1px;animation:bounce 1.2s infinite;}
.dot-a span:nth-child(2){animation-delay:0.2s;}.dot-a span:nth-child(3){animation-delay:0.4s;}
@keyframes bounce{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}
.qr-btn{padding:0.27rem 0.72rem;border:1px solid var(--border);border-radius:20px;font-size:0.72rem;font-weight:500;background:var(--white);cursor:pointer;transition:all 0.18s;color:var(--text);font-family:'Outfit',sans-serif;}
.qr-btn:hover{background:var(--black);color:var(--white);border-color:var(--black);}

/* ═══ PUBLIC STOREFRONT ═══ */
#storefront { display:block; }
#storefront.hidden { display:none; }
#app { display:none; }
#app.visible { display:block; }

.sf-body { font-family:'Outfit',sans-serif; background:#FAFAF8; color:#1C1A18; }
.sf-nav { position:fixed; top:0; left:0; right:0; z-index:300; padding:0 2rem; height:68px; display:flex; align-items:center; justify-content:space-between; background:rgba(250,250,248,0.92); backdrop-filter:blur(12px); border-bottom:1px solid rgba(0,0,0,0.06); }
.sf-logo { display:flex; align-items:center; gap:0.6rem; }
.sf-mark { width:38px; height:38px; background:#0F0E0D; display:flex; align-items:center; justify-content:center; }
.sf-mark span { color:white; font-weight:700; font-size:0.82rem; letter-spacing:-0.02em; }
.sf-brand { font-family:'Playfair Display',serif; font-size:1.1rem; font-weight:700; color:#0F0E0D; }
.sf-nav-links { display:flex; align-items:center; gap:0.2rem; }
.sf-nav-link { padding:0.4rem 0.9rem; border:none; background:none; font-family:'Outfit',sans-serif; font-size:0.78rem; font-weight:500; color:#8A8480; cursor:pointer; border-radius:6px; transition:all 0.18s; }
.sf-nav-link:hover { color:#0F0E0D; background:#F0EDE8; }
.sf-nav-wa { padding:0.42rem 1.1rem; background:#25D366; color:white; border:none; border-radius:20px; font-family:'Outfit',sans-serif; font-size:0.78rem; font-weight:600; cursor:pointer; display:flex; align-items:center; gap:0.4rem; transition:all 0.2s; }
.sf-nav-wa:hover { background:#1ebe5a; transform:translateY(-1px); }

.sf-hero { min-height:100vh; display:flex; align-items:center; padding:6rem 2rem 3rem; background:linear-gradient(160deg,#0F0E0D 0%,#1C1A18 45%,#2D2B28 100%); position:relative; overflow:hidden; }
.sf-hero::before { content:''; position:absolute; top:-20%; right:-10%; width:70%; height:140%; background:radial-gradient(ellipse,rgba(180,83,9,0.18) 0%,transparent 70%); pointer-events:none; }
.sf-hero::after { content:''; position:absolute; bottom:-10%; left:-5%; width:50%; height:80%; background:radial-gradient(ellipse,rgba(45,106,79,0.12) 0%,transparent 70%); pointer-events:none; }
.sf-hero-inner { max-width:1200px; margin:0 auto; width:100%; display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; position:relative; z-index:1; }
.sf-hero-eyebrow { font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.18em; color:#B45309; margin-bottom:1.1rem; }
.sf-hero-h1 { font-family:'Playfair Display',serif; font-size:clamp(2.6rem,5vw,4rem); font-weight:700; color:white; line-height:1.1; margin-bottom:1.2rem; }
.sf-hero-h1 em { font-style:italic; font-weight:400; color:#DDD9D3; }
.sf-hero-p { font-size:1rem; color:#9CA3AF; line-height:1.75; margin-bottom:2rem; max-width:440px; }
.sf-hero-btns { display:flex; gap:0.75rem; flex-wrap:wrap; }
.sf-btn-wa { padding:0.8rem 1.6rem; background:#25D366; color:white; border:none; border-radius:8px; font-family:'Outfit',sans-serif; font-size:0.88rem; font-weight:700; cursor:pointer; display:flex; align-items:center; gap:0.5rem; transition:all 0.2s; }
.sf-btn-wa:hover { background:#1ebe5a; transform:translateY(-2px); box-shadow:0 8px 20px rgba(37,211,102,0.3); }
.sf-btn-ol { padding:0.8rem 1.6rem; background:transparent; color:white; border:1.5px solid rgba(255,255,255,0.25); border-radius:8px; font-family:'Outfit',sans-serif; font-size:0.88rem; font-weight:600; cursor:pointer; transition:all 0.2s; }
.sf-btn-ol:hover { border-color:white; background:rgba(255,255,255,0.08); }
.sf-btn-gold { padding:0.8rem 1.6rem; background:#B45309; color:white; border:none; border-radius:8px; font-family:'Outfit',sans-serif; font-size:0.88rem; font-weight:700; cursor:pointer; transition:all 0.2s; text-decoration:none; display:inline-flex; align-items:center; }
.sf-btn-gold:hover { background:#92400E; transform:translateY(-2px); box-shadow:0 8px 20px rgba(180,83,9,0.35); }
.sf-hero-right { display:flex; flex-direction:column; gap:1rem; }
.sf-hero-card { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:14px; padding:1.1rem 1.3rem; backdrop-filter:blur(8px); transition:all 0.2s; cursor:pointer; }
.sf-hero-card:hover { background:rgba(255,255,255,0.09); border-color:rgba(255,255,255,0.2); transform:translateX(4px); }
.sf-hero-card-top { display:flex; align-items:center; gap:0.75rem; margin-bottom:0.3rem; }
.sf-hero-card-emoji { font-size:1.5rem; }
.sf-hero-card-name { font-weight:600; color:white; font-size:0.92rem; }
.sf-hero-card-tag { font-size:0.6rem; font-weight:700; text-transform:uppercase; letter-spacing:0.1em; padding:2px 8px; border-radius:10px; background:#B45309; color:white; }
.sf-hero-card-tl { font-size:0.77rem; color:#9CA3AF; }

.sf-section { padding:5rem 2rem; max-width:1200px; margin:0 auto; }
.sf-section-label { font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.18em; color:#B45309; margin-bottom:0.6rem; }
.sf-section-h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.6rem); font-weight:700; color:#0F0E0D; line-height:1.15; margin-bottom:0.5rem; }
.sf-section-h2 em { font-style:italic; font-weight:400; color:#8A8480; }
.sf-section-sub { font-size:0.88rem; color:#8A8480; margin-bottom:2.5rem; max-width:500px; }

.sf-cats { display:flex; gap:0.5rem; flex-wrap:wrap; margin-bottom:2rem; }
.sf-cat { padding:0.35rem 1rem; border:1.5px solid #E8E4DE; border-radius:20px; font-size:0.75rem; font-weight:600; cursor:pointer; transition:all 0.18s; background:white; color:#8A8480; font-family:'Outfit',sans-serif; }
.sf-cat.on { background:#0F0E0D; color:white; border-color:#0F0E0D; }
.sf-cat:hover:not(.on) { border-color:#0F0E0D; color:#0F0E0D; }

.sf-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.sf-card { background:white; border:1px solid #E8E4DE; border-radius:16px; overflow:hidden; cursor:pointer; transition:all 0.25s; }
.sf-card:hover { transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.1); border-color:#0F0E0D; }
.sf-card-img { height:160px; display:flex; align-items:center; justify-content:center; font-size:3rem; position:relative; overflow:hidden; }
.sf-card-img img { width:100%; height:100%; object-fit:cover; }
.sf-card-badge { position:absolute; top:10px; left:10px; background:#0F0E0D; color:white; font-size:0.6rem; font-weight:700; padding:3px 10px; border-radius:20px; }
.sf-card-body { padding:1.1rem 1.2rem 1.3rem; }
.sf-card-cat { font-size:0.62rem; font-weight:700; text-transform:uppercase; letter-spacing:0.1em; color:#B45309; margin-bottom:0.3rem; }
.sf-card-name { font-family:'Playfair Display',serif; font-size:1rem; font-weight:600; margin-bottom:0.25rem; line-height:1.3; }
.sf-card-tl { font-size:0.75rem; color:#8A8480; margin-bottom:0.9rem; line-height:1.45; }
.sf-card-footer { display:flex; align-items:center; justify-content:space-between; }
.sf-card-price { font-size:0.9rem; font-weight:700; }
.sf-card-moq { font-size:0.68rem; color:#8A8480; }
.sf-card-btn { padding:0.32rem 0.9rem; background:#0F0E0D; color:white; border:none; border-radius:6px; font-size:0.72rem; font-weight:600; cursor:pointer; font-family:'Outfit',sans-serif; transition:all 0.18s; }
.sf-card-btn:hover { background:#333; }

.sf-reviews-wrap { background:linear-gradient(135deg,#0F0E0D,#1C1A18); padding:5rem 2rem; }
.sf-reviews-inner { max-width:1200px; margin:0 auto; }
.sf-rev-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; margin-top:2.5rem; }
.sf-rev-card { background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:14px; padding:1.3rem; }
.sf-rev-stars { font-size:0.9rem; margin-bottom:0.6rem; }
.sf-rev-text { font-size:0.84rem; color:#D1D5DB; line-height:1.65; margin-bottom:0.8rem; }
.sf-rev-name { font-size:0.72rem; font-weight:600; color:#9CA3AF; }
.sf-rev-prod { font-size:0.68rem; color:#6B7280; }

.sf-why { padding:5rem 2rem; max-width:1200px; margin:0 auto; }
.sf-why-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; margin-top:2.5rem; }
.sf-why-item { text-align:center; padding:1.5rem 1rem; }
.sf-why-icon { font-size:2.2rem; margin-bottom:0.75rem; }
.sf-why-title { font-weight:700; font-size:0.9rem; margin-bottom:0.3rem; }
.sf-why-desc { font-size:0.78rem; color:#8A8480; line-height:1.6; }

.sf-cta { background:#0F0E0D; padding:5rem 2rem; text-align:center; }
.sf-cta-h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3vw,2.8rem); color:white; margin-bottom:0.75rem; }
.sf-cta-p { color:#9CA3AF; font-size:0.9rem; margin-bottom:2rem; }
.sf-cta-btns { display:flex; gap:0.75rem; justify-content:center; flex-wrap:wrap; }

.sf-footer { background:#0A0908; border-top:1px solid rgba(255,255,255,0.06); }
.sf-footer-main { max-width:1100px; margin:0 auto; padding:2.8rem 2rem 2rem; display:grid; grid-template-columns:1fr auto 1fr; gap:2rem; align-items:start; }
.sf-footer-brand-name { font-family:'Playfair Display',serif; font-size:1.1rem; font-weight:700; color:white; margin-bottom:0.35rem; }
.sf-footer-brand-tag { font-size:0.72rem; color:#6B7280; letter-spacing:0.04em; line-height:1.5; }
.sf-footer-links { display:flex; flex-direction:column; gap:0.55rem; align-items:center; }
.sf-footer-links-title { font-size:0.62rem; font-weight:700; text-transform:uppercase; letter-spacing:0.1em; color:#4B5563; margin-bottom:0.2rem; }
.sf-footer-link { font-size:0.78rem; color:#9CA3AF; text-decoration:none; transition:color 0.15s; }
.sf-footer-link:hover { color:#B45309; }
.sf-footer-contact { text-align:right; display:flex; flex-direction:column; gap:0.45rem; }
.sf-footer-contact-title { font-size:0.62rem; font-weight:700; text-transform:uppercase; letter-spacing:0.1em; color:#4B5563; margin-bottom:0.2rem; }
.sf-footer-contact a, .sf-footer-contact span { font-size:0.78rem; color:#9CA3AF; text-decoration:none; display:block; transition:color 0.15s; }
.sf-footer-contact a:hover { color:#B45309; }
.sf-footer-bar { border-top:1px solid rgba(255,255,255,0.05); padding:0.9rem 2rem; text-align:center; }
.sf-footer-bar p { font-size:0.7rem; color:#374151; }

/* Product detail modal for storefront */
.sf-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:500; align-items:center; justify-content:center; padding:1rem; }
.sf-overlay.open { display:flex; }
.sf-modal { background:white; border-radius:20px; width:100%; max-width:640px; max-height:92vh; overflow-y:auto; animation:sfUp 0.25s ease; }
@keyframes sfUp { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }
.sf-modal-img { height:220px; display:flex; align-items:center; justify-content:center; font-size:5rem; border-radius:20px 20px 0 0; overflow:hidden; position:relative; }
.sf-modal-img img { width:100%; height:100%; object-fit:cover; }
.sf-modal-close { position:absolute; top:1rem; right:1rem; width:32px; height:32px; background:rgba(0,0,0,0.4); color:white; border:none; border-radius:50%; font-size:1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.sf-modal-body { padding:1.5rem 1.75rem 2rem; }
.sf-modal-name { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; margin-bottom:0.25rem; }
.sf-modal-tl { color:#8A8480; font-size:0.85rem; margin-bottom:1rem; }
.sf-modal-section { margin-bottom:1rem; }
.sf-modal-label { font-size:0.65rem; font-weight:700; text-transform:uppercase; letter-spacing:0.12em; color:#8A8480; margin-bottom:0.35rem; }
.sf-modal-text { font-size:0.84rem; line-height:1.7; color:#1C1A18; }
.sf-modal-benefit { display:inline-block; background:#F5F2ED; border-radius:20px; padding:0.2rem 0.7rem; font-size:0.72rem; margin:0.15rem; }
.sf-modal-price-row { display:flex; gap:1.5rem; margin:1.1rem 0; padding:1rem 0; border-top:1px solid #E8E4DE; border-bottom:1px solid #E8E4DE; }
.sf-modal-price-item { }
.sf-modal-price-lbl { font-size:0.65rem; font-weight:700; text-transform:uppercase; letter-spacing:0.1em; color:#8A8480; margin-bottom:0.2rem; }
.sf-modal-price-val { font-size:1.1rem; font-weight:700; }
.sf-modal-sizes { display:flex; gap:0.4rem; flex-wrap:wrap; margin-bottom:1rem; }
.sf-modal-sz { padding:0.3rem 0.8rem; border:1.5px solid #E8E4DE; border-radius:6px; font-size:0.75rem; font-weight:600; cursor:pointer; transition:all 0.15s; background:white; font-family:'Outfit',sans-serif; }
.sf-modal-sz.on { border-color:#0F0E0D; background:#0F0E0D; color:white; }
.sf-modal-wa { width:100%; padding:0.85rem; background:#25D366; color:white; border:none; border-radius:10px; font-family:'Outfit',sans-serif; font-size:0.92rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:0.5rem; transition:all 0.2s; margin-top:0.5rem; }
.sf-modal-wa:hover { background:#1ebe5a; transform:translateY(-1px); box-shadow:0 6px 20px rgba(37,211,102,0.3); }

@media(max-width:900px){
  .sf-hero-inner{grid-template-columns:1fr;gap:2rem;}
  .sf-hero-right{display:flex;}
  .sf-grid{grid-template-columns:1fr 1fr;}
  .sf-rev-grid{grid-template-columns:1fr 1fr;}
  .sf-why-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:640px){
  .sf-nav{padding:0 0.9rem;}
  .sf-nav-links{display:none;}
  .sf-nav-wa{padding:0.38rem 0.85rem;font-size:0.72rem;}
  .sf-hero{padding:4.5rem 1.2rem 2.5rem;min-height:auto;}
  .sf-hero-h1{font-size:2.2rem;}
  .sf-hero-p{font-size:0.86rem;margin-bottom:1.5rem;}
  .sf-hero-btns{flex-direction:column;gap:0.6rem;}
  .sf-btn-wa,.sf-btn-ol,.sf-btn-gold{width:100%;justify-content:center;text-align:center;padding:0.85rem 1rem;}
  .sf-hero-right{display:flex;}
  .sf-section{padding:2.5rem 1.2rem;}
  .sf-section-h2{font-size:1.5rem;}
  .sf-section-sub{font-size:0.82rem;}
  .sf-grid{grid-template-columns:1fr;}
  .sf-rev-grid{grid-template-columns:1fr;}
  .sf-why-grid{grid-template-columns:1fr 1fr;gap:0.9rem;}
  .sf-why-item{padding:0.9rem 0.4rem;}
  .sf-why-icon{font-size:1.8rem;}
  .sf-why-title{font-size:0.82rem;}
  .sf-why-desc{font-size:0.72rem;}
  .sf-cats{gap:0.35rem;}
  .sf-cat{font-size:0.68rem;padding:0.25rem 0.7rem;}
  .sf-reviews-wrap{padding:2.5rem 1.2rem;}
  .sf-cta{padding:2.5rem 1.2rem;}
  .sf-cta-h2{font-size:1.6rem;}
  .sf-cta-btns{flex-direction:column;align-items:stretch;}
  .sf-modal-body{padding:1.1rem 1.2rem 1.5rem;}
  .sf-modal-img{height:180px;}
  .sf-footer-main{grid-template-columns:1fr;gap:2rem;padding:2rem 1.2rem 1.5rem;}
  .sf-footer-links{align-items:flex-start;}
  .sf-footer-contact{text-align:left;}
}


/* ── PRODUCT MODAL: QTY + SCENT ── */
.sf-modal-scent-pill{padding:0.28rem 0.75rem;border:1.5px solid var(--border);border-radius:6px;font-size:0.72rem;font-weight:600;cursor:pointer;background:white;font-family:'Outfit',sans-serif;transition:all 0.15s;}
.sf-modal-scent-pill.on{background:var(--black,#0F0E0D);color:white;border-color:var(--black,#0F0E0D);}
.sf-qty-row{display:flex;align-items:center;gap:0.75rem;margin-bottom:1rem;}
.sf-qty-btn{width:32px;height:32px;border:1.5px solid var(--border,#E8E4DE);border-radius:8px;background:white;cursor:pointer;font-size:1rem;font-weight:600;display:flex;align-items:center;justify-content:center;transition:all 0.15px;}
.sf-qty-btn:hover{border-color:#0F0E0D;background:#0F0E0D;color:white;}

/* ── CART BUTTON (fixed bottom left) ── */
#sf-cart-btn{position:fixed;bottom:1.5rem;left:1.5rem;z-index:700;background:#0F0E0D;color:white;border:none;border-radius:28px;padding:0.65rem 1.1rem;font-family:'Outfit',sans-serif;font-size:0.8rem;font-weight:600;cursor:pointer;display:none;align-items:center;gap:0.5rem;box-shadow:0 4px 20px rgba(0,0,0,0.25);transition:all 0.2s;}
#sf-cart-btn:hover{transform:translateY(-2px);}
.sf-cart-count-badge{background:#DC2626;color:white;width:18px;height:18px;border-radius:50%;font-size:0.6rem;font-weight:700;display:flex;align-items:center;justify-content:center;}

/* ── CART OVERLAY ── */
#sf-cart-overlay{z-index:800;}
.sf-cart-modal{background:white;width:100%;max-width:500px;max-height:94vh;border-radius:20px;display:flex;flex-direction:column;overflow:hidden;animation:sfUp 0.25s ease;} .sf-cart-body{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;}
.sf-cart-hdr{padding:1.1rem 1.4rem;border-bottom:1px solid #E8E4DE;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
.sf-cart-hdr h3{font-family:'Playfair Display',serif;font-size:1.15rem;font-weight:700;}
.sf-cart-items-wrap{}
.sf-cart-item{display:flex;align-items:flex-start;gap:0.85rem;padding:0.85rem 1.4rem;border-bottom:1px solid #F5F2ED;}
.sf-cart-item-emoji{width:48px;height:48px;background:#F5F2ED;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0;}
.sf-cart-item-info{flex:1;}
.sf-cart-item-name{font-weight:700;font-size:0.83rem;margin-bottom:0.1rem;}
.sf-cart-item-sub{font-size:0.7rem;color:#8A8480;margin-bottom:0.35rem;}
.sf-cart-item-qty-row{display:flex;align-items:center;gap:0.4rem;}
.sf-cq-btn{width:22px;height:22px;border:1px solid #E8E4DE;border-radius:4px;background:white;cursor:pointer;font-size:0.8rem;display:flex;align-items:center;justify-content:center;transition:all 0.1s;}
.sf-cq-btn:hover{background:#0F0E0D;color:white;border-color:#0F0E0D;}
.sf-cq-val{font-size:0.8rem;font-weight:700;min-width:18px;text-align:center;}
.sf-rm-btn{background:none;border:none;color:#DC2626;cursor:pointer;font-size:0.85rem;margin-left:0.2rem;}
.sf-cart-item-price{font-weight:700;font-size:0.85rem;flex-shrink:0;padding-top:2px;}

/* Cart customer details + shipping */
.sf-cart-section{padding:1rem 1.4rem;border-bottom:1px solid #E8E4DE;}
.sf-cart-section-lbl{font-size:0.62rem;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;color:#8A8480;margin-bottom:0.65rem;}
.sf-fi{width:100%;border:1.5px solid #E8E4DE;border-radius:8px;padding:0.55rem 0.8rem;font-family:'Outfit',sans-serif;font-size:0.83rem;outline:none;background:#FAFAF8;margin-bottom:0.5rem;transition:border-color 0.15s;}
.sf-fi:focus{border-color:#0F0E0D;}
.sf-ship-opt{display:flex;align-items:flex-start;gap:0.7rem;padding:0.65rem 0.85rem;border:1.5px solid #E8E4DE;border-radius:10px;margin-bottom:0.45rem;cursor:pointer;transition:all 0.15s;}
.sf-ship-opt.on{border-color:#0F0E0D;background:#F8F8F6;}
.sf-ship-opt input[type=radio]{accent-color:#0F0E0D;margin-top:3px;flex-shrink:0;}
.sf-ship-opt-info{flex:1;}
.sf-ship-opt-name{font-weight:700;font-size:0.82rem;}
.sf-ship-opt-desc{font-size:0.68rem;color:#8A8480;line-height:1.45;margin-top:0.1rem;}
.sf-ship-opt-fee{font-weight:700;font-size:0.78rem;flex-shrink:0;text-align:right;}
.sf-ship-extra{display:none;margin-top:0.5rem;}
.sf-ship-extra.show{display:block;}

/* Cart summary + checkout */
.sf-cart-footer-wrap{padding:1rem 1.4rem;flex-shrink:0;}
.sf-sum-row{display:flex;justify-content:space-between;font-size:0.8rem;color:#8A8480;margin-bottom:0.3rem;}
.sf-sum-row.big{font-weight:700;font-size:0.95rem;color:#1C1A18;padding-top:0.5rem;border-top:1px solid #E8E4DE;margin-top:0.2rem;}
.sf-no-cod{background:#FEF3C7;border-radius:8px;padding:0.55rem 0.8rem;font-size:0.72rem;color:#92400E;margin-bottom:0.85rem;line-height:1.5;}
.sf-checkout-btn{width:100%;padding:0.82rem;background:#25D366;color:white;border:none;border-radius:10px;font-family:'Outfit',sans-serif;font-size:0.88rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:0.5rem;transition:all 0.2s;}
.sf-checkout-btn:hover{background:#1ebe5a;}
.sf-checkout-btn:disabled{background:#9CA3AF;cursor:not-allowed;}
.sf-pay-opts{margin-bottom:0.75rem;}
.sf-pay-opt-lbl{display:flex;align-items:center;gap:0.6rem;padding:0.55rem 0.75rem;border:1.5px solid #E8E4DE;border-radius:8px;cursor:pointer;font-size:0.8rem;margin-bottom:0.4rem;transition:border-color 0.15s;user-select:none;}
.sf-pay-opt-lbl.on{border-color:#0F0E0D;background:#F5F2ED;}
.sf-pay-opt-lbl input[type=radio]{width:14px;height:14px;cursor:pointer;accent-color:#0F0E0D;flex-shrink:0;}
.sf-card-fee-box{background:#FEF3C7;border:1px solid #FCD34D;border-radius:8px;padding:0.55rem 0.75rem;font-size:0.75rem;color:#92400E;margin-bottom:0.75rem;line-height:1.6;}
.sf-fygaro-btn{width:100%;padding:0.85rem;background:#1D4ED8;color:white;border:none;border-radius:10px;font-family:'Outfit',sans-serif;font-size:0.9rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:0.5rem;transition:background 0.2s;}
.sf-fygaro-btn:hover{background:#1e40af;}
/* Best Sellers section */
.sf-bs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:1.5rem;}
@media(max-width:768px){.sf-bs-grid{grid-template-columns:1fr;}}
.sf-bs-card{background:white;border-radius:16px;overflow:hidden;border:1px solid var(--border);transition:box-shadow 0.2s;cursor:pointer;}
.sf-bs-card:hover{box-shadow:0 8px 24px rgba(0,0,0,0.1);}
.sf-bs-img{height:200px;display:flex;align-items:center;justify-content:center;font-size:3.5rem;overflow:hidden;}
.sf-bs-body{padding:1.2rem;}
.sf-bs-name{font-family:'Playfair Display',serif;font-size:1.05rem;font-weight:700;margin-bottom:0.3rem;}
.sf-bs-tl{font-size:0.78rem;color:#8A8480;line-height:1.5;margin-bottom:0.75rem;}
.sf-bs-price{font-size:1.05rem;font-weight:700;color:#0F0E0D;margin-bottom:0.75rem;}
.sf-bs-btn{width:100%;padding:0.6rem;background:#0F0E0D;color:white;border:none;border-radius:8px;font-family:'Outfit',sans-serif;font-size:0.82rem;font-weight:600;cursor:pointer;transition:background 0.15s;}
.sf-bs-btn:hover{background:#2D2B28;}
/* Shipping label print */
.nc-label{border:2px solid #0F0E0D;border-radius:4px;padding:1.2rem;max-width:440px;font-size:0.78rem;font-family:'Outfit',sans-serif;background:white;}
.nc-label-hdr{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:2px solid #0F0E0D;padding-bottom:0.75rem;margin-bottom:0.75rem;}
.nc-label-to{font-size:1.05rem;font-weight:700;margin-bottom:0.2rem;}
.nc-label-to-sub{font-size:0.78rem;color:#444;line-height:1.5;}
.nc-label-mid{border-top:1px dashed #ccc;padding-top:0.6rem;margin-top:0.6rem;font-size:0.75rem;line-height:1.7;}
.nc-label-footer{display:flex;justify-content:space-between;border-top:1px solid #0F0E0D;padding-top:0.5rem;margin-top:0.6rem;font-size:0.65rem;}
/* Payment status badges */
.b-await{background:#FEF3C7;color:#92400E;}
.b-refund{background:#EDE9FE;color:#5B21B6;}

/* ── ABOUT SECTION ── */
.sf-about-wrap{padding:4.5rem 2rem;background:#FAFAF8;}
.sf-about-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;}
.sf-about-visual{background:linear-gradient(135deg,#1C1A18,#2D2B28);border-radius:16px;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;font-size:5rem;position:relative;}
.sf-about-badge{position:absolute;bottom:-1rem;right:-1rem;background:#0F0E0D;color:white;padding:0.85rem 1.1rem;border-radius:12px;text-align:center;}
.sf-about-stats{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem;margin-top:1.5rem;}
.sf-about-stat{background:#F5F2ED;border-radius:10px;padding:0.85rem 1rem;}
.sf-about-stat-n{font-family:'Playfair Display',serif;font-size:1.5rem;font-weight:700;}
.sf-about-stat-l{font-size:0.72rem;color:#8A8480;}

/* ── FLOATING CHAT ── */
#sf-chat-widget{position:fixed;bottom:1.5rem;right:1.5rem;z-index:700;}
#sf-chat-fab{width:56px;height:56px;background:linear-gradient(135deg,#0F0E0D,#2D2B28);border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(0,0,0,0.25);transition:all 0.2s;position:relative;}
#sf-chat-fab:hover{transform:scale(1.08);}
#sf-chat-unread{position:absolute;top:-3px;right:-3px;width:18px;height:18px;background:#DC2626;color:white;border-radius:50%;font-size:0.6rem;font-weight:700;display:none;align-items:center;justify-content:center;}
#sf-chat-box{display:none;position:absolute;bottom:68px;right:0;width:320px;background:white;border-radius:18px;box-shadow:0 16px 50px rgba(0,0,0,0.18);overflow:hidden;flex-direction:column;}
#sf-chat-box.open{display:flex;}
.sf-ch-hdr{background:linear-gradient(135deg,#0F0E0D,#2D2B28);padding:0.85rem 1rem;display:flex;align-items:center;gap:0.65rem;}
.sf-ch-av{width:34px;height:34px;background:white;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.sf-ch-av span{font-weight:700;font-size:0.75rem;color:#0F0E0D;}
.sf-ch-name{color:white;font-size:0.85rem;font-weight:600;}
.sf-ch-status{color:#9CA3AF;font-size:0.6rem;display:flex;align-items:center;gap:3px;}
.sf-ch-dot{width:6px;height:6px;background:#4ade80;border-radius:50%;animation:blink 2s infinite;}
.sf-ch-msgs{height:260px;overflow-y:auto;padding:0.85rem;display:flex;flex-direction:column;gap:0.5rem;background:#F8F8F6;}
.sf-ch-msg{max-width:85%;padding:0.55rem 0.8rem;border-radius:14px;font-size:0.8rem;line-height:1.5;}
.sf-ch-msg-bot{background:white;border:1px solid #E8E4DE;align-self:flex-start;border-bottom-left-radius:4px;}
.sf-ch-msg-user{background:#0F0E0D;color:white;align-self:flex-end;border-bottom-right-radius:4px;}
.sf-ch-typing{background:white;border:1px solid #E8E4DE;align-self:flex-start;padding:0.55rem 0.8rem;border-radius:14px;border-bottom-left-radius:4px;}
.sf-ch-qr{display:flex;flex-wrap:wrap;gap:0.28rem;padding:0.4rem 0.65rem;background:#F8F8F6;border-top:1px solid #E8E4DE;}
.sf-ch-qr-btn{padding:0.2rem 0.6rem;border:1px solid #E8E4DE;border-radius:20px;font-size:0.68rem;font-weight:500;background:white;cursor:pointer;font-family:'Outfit',sans-serif;transition:all 0.15s;color:#1C1A18;}
.sf-ch-qr-btn:hover{background:#0F0E0D;color:white;border-color:#0F0E0D;}
.sf-ch-inp{display:flex;padding:0.5rem;gap:0.4rem;background:white;border-top:1px solid #E8E4DE;}
.sf-ch-inp input{flex:1;border:1.5px solid #E8E4DE;padding:0.42rem 0.75rem;border-radius:18px;font-family:'Outfit',sans-serif;font-size:0.78rem;outline:none;background:#FAFAF8;}
.sf-ch-inp input:focus{border-color:#0F0E0D;}
.sf-ch-send{width:30px;height:30px;border-radius:50%;background:#0F0E0D;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.15s;}
.sf-ch-send:hover{background:#333;}

@media(max-width:640px){
  .sf-about-inner{grid-template-columns:1fr;}
  .sf-about-wrap{padding:3rem 1.2rem;}
  #sf-cart-btn{bottom:1rem;left:1rem;}
  #sf-chat-widget{bottom:1rem;right:1rem;}
  #sf-chat-box{width:calc(100vw - 2.5rem);right:-0.5rem;}
  #sf-chat-box.open{display:flex;}
}

/* Staff/Admin buttons — hidden by default, revealed via ?staff=true */
#sf-staff-btn, #nav-admin, #btn-admin-panel { display: none !important; }