/* Shared utility pages, rich footer and Lucide integration */
:root{--accent-soft:#f0eafb;--accent-border:#e0d7ef;--accent-text:#7545d8;--success:#00a477}
.lucide-inline,.lucide{display:inline-block;vertical-align:middle;flex:none}
.main-nav a.active{font-weight:700;color:var(--blue);position:relative}.main-nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:-11px;height:2px;background:var(--blue);border-radius:2px}.main-nav a>svg{width:17px;height:17px}
.utility-shell{padding-top:14px;padding-bottom:62px}.page-hero{min-height:210px;border:1px solid #d9e0eb;border-radius:17px;background:radial-gradient(circle at 98% 12%,#e2d9f1 0,transparent 24%),linear-gradient(110deg,#f2edfb 0%,#fff 70%,#f9f7fc 100%);padding:38px;margin:0 0 30px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.page-hero h1{font-size:clamp(27px,3vw,36px);letter-spacing:-1.2px;line-height:1.15;margin:16px 0 9px;font-weight:750;color:#101827}.page-hero p{font-size:15px;color:#65748a;line-height:1.7;max-width:760px;margin:0}.hero-label{display:inline-flex;align-items:center;gap:8px;background:#eae0f9;color:#6a2bcf;padding:6px 12px;border-radius:30px;font-size:13px;font-weight:600}.hero-label svg{width:16px;height:16px}.page-hero.centered{align-items:center;text-align:center;min-height:205px}.page-hero.centered p{max-width:780px}
.lookup-card,.price-category-panel,.price-panel,.reset-card{border:1px solid var(--line);border-radius:16px;background:var(--card);box-shadow:var(--shadow)}.lookup-card{padding:24px;margin-bottom:38px}.lookup-card form{max-width:100%;display:flex;flex-direction:column;align-items:center}.lookup-card label{font-size:12px;font-weight:600;margin:0 0 4px}.lookup-card input{width:100%;text-align:center;border:0;border-bottom:1px solid #e1daec;padding:12px 10px 10px;background:transparent;outline:0;color:var(--ink);font-size:14px;margin-bottom:9px}.lookup-card input:focus{border-bottom:2px solid var(--blue)}.lookup-card input::placeholder{color:#c2cad5}.lookup-card small{font-size:11px;color:var(--muted);font-style:italic;margin:0 0 24px}.primary-btn{border:0;background:#682cc9;color:#fff;border-radius:11px;padding:11px 18px;font-size:13px;font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;transition:.2s}.primary-btn:hover{background:#571eb4;transform:translateY(-1px)}.primary-btn:disabled{opacity:.65;cursor:wait;transform:none}.primary-btn svg{width:17px;height:17px}.recent-section{margin-top:20px}.recent-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 20px}.recent-heading>div{text-align:center;flex:1}.recent-heading h2{font-size:22px;margin:0 0 6px;letter-spacing:-.5px}.recent-heading p{font-size:13px;color:var(--muted);margin:0}.live-indicator{display:inline-flex;align-items:center;gap:6px;color:#168e6b;background:#e2f8f0;padding:6px 10px;border-radius:30px;font-size:11px;white-space:nowrap}.live-indicator svg{width:13px;height:13px}.table-card{border:1px solid var(--line);border-radius:15px;background:var(--card);padding:14px 15px;box-shadow:var(--shadow)}.table-scroll{overflow-x:auto;width:100%}.data-table{width:100%;border-collapse:collapse;min-width:720px;font-size:12px}.data-table th{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);font-weight:650;color:var(--ink);white-space:nowrap}.data-table td{padding:11px 10px;border-bottom:1px solid var(--line);white-space:nowrap;color:var(--ink)}.data-table tr:last-child td{border-bottom:0}.data-table td:first-child{color:#718096}.mono-cell{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}.table-empty{text-align:center!important;color:var(--muted)!important;padding:27px!important}.table-footnote{font-size:10px;color:var(--muted);margin:8px 2px 0}.status-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:30px;padding:4px 10px;font-size:10px;font-weight:650}.status-pill.success{background:#d9f8ed;color:#008d66}.status-pill.active{background:#e3f7ec;color:#078e55;border:1px solid #9bd9b6}.status-pill.inactive{background:#f1f2f4;color:#788293;border:1px solid #dce1e8}.status-pill.pending{background:#fff2d7;color:#946200}.status-pill.berhasil,.status-pill.success{background:#d9f8ed;color:#008d66}.status-pill.diproses,.status-pill.processing{background:#efe6fe;color:#682cc9}.status-pill.gagal,.status-pill.failed{background:#ffe2e4;color:#c0394b}.status-pill.kadaluwarsa,.status-pill.expired{background:#eef0f3;color:#647084}
.lookup-result{margin-top:20px;border:1px solid #cfe6db;background:#f3fcf7;border-radius:12px;padding:16px;color:#1a2d25}.lookup-result-top{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px}.lookup-result h3{font-size:18px;margin:13px 0}.lookup-result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.lookup-result-grid span{display:flex;flex-direction:column;font-size:11px;color:#748278}.lookup-result-grid b{font-size:13px;color:#1c3027;margin-top:4px}.lookup-result-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.lookup-result-links a{display:inline-flex;gap:5px;align-items:center;color:#6a2bcf;font-weight:600;font-size:11px}.lookup-result-links svg{width:13px;height:13px}.lookup-error{display:flex;gap:12px;align-items:flex-start;background:#fff7f5;border-color:#f4d3cb;color:#8f3628}.lookup-error>svg{width:22px;height:22px;flex:none}.lookup-error p{margin:3px 0 0;font-size:12px}
.price-category-panel{padding:18px 20px;margin-bottom:28px}.price-categories{display:flex;gap:10px;overflow-x:auto;padding:2px 1px 9px;scrollbar-width:thin}.price-category{flex:none;min-width:142px;border:1px solid var(--line);background:var(--card);border-radius:12px;padding:7px 10px;display:flex;align-items:center;gap:9px;text-align:left;cursor:pointer;box-shadow:0 2px 5px #182a4308}.price-category img{width:28px;height:28px;object-fit:cover;border-radius:50%}.price-category span{font-size:11px;line-height:1.25;white-space:nowrap}.price-category small{display:block;color:var(--muted);font-size:9px;margin-top:2px}.price-category.active{background:#682cc9;color:#fff;border-color:#682cc9}.price-category.active small{color:#eaddfe}.price-panel{padding:22px;margin-bottom:20px}.price-panel-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:17px}.price-panel-heading h2{font-size:19px;margin:0 0 5px}.price-panel-heading p{color:var(--muted);font-size:12px;margin:0}.price-table-card{padding:0;overflow:hidden}.price-table{min-width:590px}.price-table th{background:#f7f5fb;color:#6a7688;font-weight:500}.duration-cell{display:inline-flex;align-items:center;gap:12px}.duration-cell img{width:25px;height:25px;object-fit:cover;border-radius:50%}.table-order-link{display:inline-flex;align-items:center;gap:5px;color:var(--blue);font-size:11px;font-weight:650}.table-order-link svg{width:13px;height:13px}.price-footer-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;color:var(--muted);font-size:11px}.primary-btn.compact{padding:9px 13px;font-size:11px}
.reset-shell{padding-bottom:75px}.reset-card{width:min(600px,100%);padding:24px;margin:0 auto}.reset-card form{display:flex;flex-direction:column;gap:8px}.reset-card label{font-size:13px;font-weight:550;margin-top:4px}.reset-card select,.reset-card input{width:100%;height:46px;border:1px solid #d9e0eb;border-radius:12px;padding:0 13px;background:var(--card);color:var(--ink);outline:0;font:inherit;font-size:13px}.reset-card select:focus,.reset-card input:focus{border-color:#9456f9;box-shadow:0 0 0 3px #4387ff22}.password-field{position:relative}.password-field input{padding-right:47px}.password-field button{position:absolute;right:7px;top:6px;width:34px;height:34px;border:0;background:transparent;color:#64748b;display:grid;place-items:center;cursor:pointer}.password-field svg{width:17px;height:17px}.reset-warning{display:flex;gap:7px;align-items:flex-start;color:#8a6a24;background:#fff8e9;padding:10px;border-radius:9px;font-size:10px;line-height:1.55;margin:7px 0}.reset-warning svg{width:15px;height:15px;flex:none}.reset-submit{width:100%;height:47px;background:#8441f1;margin-top:5px}.reset-result{display:flex;gap:11px;align-items:flex-start;border-radius:10px;padding:13px;margin-top:14px;font-size:12px}.reset-result>svg{width:21px;height:21px;flex:none}.reset-result p{margin:3px 0 0}.reset-result.success{background:#eaf9f1;color:#087a51}.reset-result.error{background:#fff1f0;color:#b33a36}
/* Screenshot-inspired store footer */
.site-footer-rich{position:relative;background:#f2edfa;margin-top:60px;padding:70px 0 0;border-top:0;overflow:hidden;color:#3d4b60}.footer-wave{position:absolute;left:-2%;right:-2%;top:-35px;height:65px;background:var(--body);border-radius:0 0 50% 50%/0 0 70% 70%}.footer-grid{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:80px;padding-bottom:32px}.footer-logo{display:inline-flex;align-items:center;gap:10px;color:#101827}.footer-logo b{font-size:17px;font-weight:850;letter-spacing:-.5px}.footer-logo-mark{width:34px;height:34px;display:grid;place-items:center;color:#fff;border-radius:10px;background:linear-gradient(140deg,#6a15f2,#5e1fc5)}.footer-logo-mark svg{width:20px;height:20px}.footer-brand>p{font-size:11px;line-height:1.65;color:#68778e;max-width:430px;margin:12px 0 22px}.footer-brand h4,.footer-links h4{font-size:12px;color:#111827;margin:0 0 8px;font-weight:700}.payment-methods{display:flex;gap:6px;flex-wrap:wrap}.payment-pill{background:#fff;border-radius:8px;padding:6px 9px;color:#57647a;font-size:9px;font-weight:750;box-shadow:0 1px 3px #182a4308}.footer-guarantee{border-left:1px solid #d8dfeb;margin-top:17px;padding:0 0 0 14px;display:flex;align-items:center;gap:10px;color:#05a968}.footer-guarantee>svg{width:19px;height:19px}.footer-guarantee b,.footer-guarantee small{display:block}.footer-guarantee b{font-size:11px}.footer-guarantee small{font-size:9px;color:#68778e;margin-top:2px}.footer-links{display:grid;grid-template-columns:repeat(2,minmax(100px,1fr));gap:25px 45px}.footer-links>div{display:flex;flex-direction:column;align-items:flex-start;gap:7px}.footer-links a{color:#65738a;font-size:10px}.footer-links a:hover{color:#6a2bcf}.footer-bottom{position:relative;width:min(1200px,calc(100% - 56px));border-top:1px solid #d9e0eb;margin:auto;padding:17px 0 20px;display:flex;justify-content:space-between;gap:10px;color:#728096;font-size:10px}.footer-bottom b{color:#45546b}
/* Product help links */
.product-link-row{display:flex;gap:8px;flex-wrap:wrap;padding:0 22px 16px}.product-help-link{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:9px;padding:8px 11px;color:var(--blue);font-size:11px;font-weight:650;background:var(--card)}.product-help-link svg{width:15px;height:15px}
/* Purchase toast closely follows the reference card; demo is always labelled */
.purchase-notification{position:fixed;z-index:120;left:10px;bottom:18px;width:min(330px,calc(100vw - 20px));opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .35s,transform .35s}.purchase-notification.show{opacity:1;transform:translateY(0);pointer-events:auto}.purchase-toast-card{position:relative;border-radius:14px;background:#fff;color:#1c2637;border:1px solid #ede8f4;box-shadow:0 10px 35px #162a492a;padding:10px 12px 11px}.purchase-close{position:absolute;right:7px;top:5px;border:0;background:transparent;color:#94a0b2;font-size:16px;cursor:pointer}.purchase-toast-brand{display:flex;align-items:center;gap:5px;font-size:8px;font-weight:850;color:#526075;letter-spacing:.3px;margin:0 0 7px 38px}.purchase-toast-brand svg{width:11px;height:11px}.purchase-toast-main{display:flex;align-items:center;gap:9px}.purchase-toast-logo{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#f2ebfe;color:#6a2bcf;flex:none}.purchase-toast-logo svg{width:18px;height:18px}.purchase-toast-copy{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 4px;font-size:10px;line-height:1.35;min-width:0}.purchase-toast-copy>b{font-size:11px}.purchase-toast-copy>strong{width:100%;font-size:9px;color:#728096;font-weight:700}.purchase-toast-copy>span{font-size:10px}.purchase-toast-meta{display:flex;align-items:center;gap:12px;width:100%;margin-top:4px}.purchase-toast-meta span{display:inline-flex;align-items:center;gap:4px;font-size:9px}.purchase-toast-meta svg{width:11px;height:11px}.activity-success{color:#009b6e}.activity-time{color:#8a6e25;background:#fff4d3;border-radius:20px;padding:2px 6px}.demo-disclaimer{display:block;margin:7px 0 0 43px;color:#9b5d12;font-size:9px;font-weight:650}
.dark-mode .page-hero{background:radial-gradient(circle at 98% 12%,#382950 0,transparent 24%),linear-gradient(110deg,#1b2a40,#142033 72%,#1b2a40);border-color:var(--line)}.dark-mode .page-hero h1{color:var(--ink)}.dark-mode .page-hero p{color:#aebbd0}.dark-mode .lookup-card input,.dark-mode .reset-card input,.dark-mode .reset-card select{color:var(--ink);border-color:#38475d}.dark-mode .price-category.active{background:#682cc9}.dark-mode .price-table th{background:#1c293c}.dark-mode .site-footer-rich{background:#1a273a}.dark-mode .footer-logo,.dark-mode .footer-logo b,.dark-mode .footer-links h4,.dark-mode .footer-brand h4{color:#f3eefb}.dark-mode .footer-brand>p,.dark-mode .footer-links a,.dark-mode .footer-guarantee small{color:#9eacc0}.dark-mode .footer-bottom{border-color:#344258;color:#9eacc0}.dark-mode .footer-bottom b{color:#e8e1f4}.dark-mode .payment-pill{background:#28384f;color:#e6ddf4}.dark-mode .footer-wave{background:var(--body)}.dark-mode .purchase-toast-card{background:#172234;color:#efeaf7;border-color:#33445d}.dark-mode .purchase-toast-copy>strong{color:#aab7ca}.dark-mode .purchase-toast-logo{background:#3a2858}
@media(max-width:760px){.utility-shell{padding-top:8px;padding-bottom:38px}.page-hero{min-height:170px;padding:23px 19px;border-radius:14px;margin-bottom:20px}.page-hero h1{font-size:27px;margin:13px 0 7px}.page-hero p{font-size:12px}.hero-label{font-size:11px}.lookup-card{padding:17px 13px;margin-bottom:28px}.lookup-card small{text-align:center;line-height:1.5}.recent-heading{display:block;text-align:center}.recent-heading h2{font-size:19px}.recent-heading p{font-size:11px}.live-indicator{margin-top:10px}.table-card{padding:8px}.data-table{font-size:10px;min-width:700px}.data-table th,.data-table td{padding:10px 8px}.price-category-panel{padding:12px;margin-bottom:17px}.price-category{min-width:127px}.price-panel{padding:13px}.price-panel-heading h2{font-size:16px}.price-footer-row{align-items:flex-start;flex-direction:column}.reset-shell .page-hero{min-height:165px}.reset-card{padding:18px 14px}.footer-grid{grid-template-columns:1fr;gap:32px;padding-bottom:24px}.site-footer-rich{padding-top:53px;margin-top:38px}.footer-links{grid-template-columns:repeat(2,1fr);gap:23px}.footer-bottom{width:calc(100% - 28px);font-size:9px}.product-link-row{padding:0 12px 13px}.lookup-result-grid{grid-template-columns:1fr 1fr}.purchase-notification{left:8px;bottom:12px;width:min(300px,calc(100vw - 16px))}}

/* Product inventory display */
.product-stock-row{display:flex;align-items:center;gap:8px;padding:0 22px 15px}.stock-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 10px;font-size:11px;font-weight:650}.stock-pill svg{width:14px;height:14px}.stock-pill.available{color:#087a51;background:#e9f8f0}.stock-pill.empty{color:#b42318;background:#fff0ed}.dark-mode .stock-pill.available{color:#6ee7b7;background:#12382f}.dark-mode .stock-pill.empty{color:#fda29b;background:#482522}

/* Casaku-only checkout modal */
.casaku-modal{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;padding:18px}
.casaku-modal.open{display:flex}
.casaku-modal-backdrop{position:absolute;inset:0;background:rgba(10,18,32,.65);backdrop-filter:blur(5px)}
.casaku-payment-card{position:relative;z-index:1;width:min(470px,100%);max-height:calc(100vh - 36px);overflow:auto;background:#fff;border:1px solid #e3dcee;border-radius:20px;padding:22px;box-shadow:0 24px 80px rgba(4,13,30,.25);color:#152033}
.casaku-close{position:absolute;right:14px;top:14px;width:34px;height:34px;border:1px solid #e2e8f0;border-radius:10px;background:#f9f7fc;color:#5b6779;display:grid;place-items:center;cursor:pointer}
.casaku-close svg{width:17px;height:17px}
.casaku-modal-heading{display:flex;align-items:center;gap:12px;padding-right:35px}
.casaku-modal-icon{width:46px;height:46px;flex:none;border-radius:14px;background:#f1e9fe;color:#682cc9;display:grid;place-items:center}
.casaku-modal-icon svg{width:23px;height:23px}
.casaku-modal-heading h2{font-size:18px;line-height:1.25;margin:0 0 4px;color:#101827}
.casaku-modal-heading p{font-size:11px;color:#718096;line-height:1.5;margin:0}
.casaku-qr-frame{min-height:236px;margin:18px auto 13px;padding:12px;width:250px;max-width:100%;border:1px solid #e9e4f1;border-radius:16px;background:#fff;display:grid;place-items:center}
#casakuQrCode{display:flex;justify-content:center;align-items:center;min-height:224px;min-width:224px}
#casakuQrCode img,#casakuQrCode canvas{max-width:100%;height:auto!important}
#casakuQrFallback{max-width:100%;overflow-wrap:anywhere;font-size:10px;color:#536178;line-height:1.5;margin:0}
.casaku-payment-amount{text-align:center;padding:12px;background:#f7f3fd;border:1px solid #ebe5f4;border-radius:13px}
.casaku-payment-amount small{display:block;font-size:10px;color:#718096;margin-bottom:5px}
.casaku-payment-amount strong{font-size:27px;letter-spacing:-.7px;color:#6328c2}
.casaku-payment-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:13px 0}
.casaku-payment-meta span{display:flex;flex-direction:column;gap:4px;color:#8290a2;font-size:10px}
.casaku-payment-meta b{font-size:11px;color:#1b2738;font-weight:700;overflow-wrap:anywhere}
.casaku-payment-state{display:flex;gap:8px;align-items:center;padding:11px 12px;background:#fff7e7;color:#95610b;border:1px solid #f8e3b4;border-radius:11px;font-size:12px;font-weight:650}
.casaku-payment-state svg{width:17px;height:17px;flex:none}
.casaku-payment-state.paid{background:#e9fbf3;color:#078452;border-color:#bcebd5}
.casaku-payment-state.expired{background:#fff0ef;color:#b33c37;border-color:#f2ceca}
.casaku-payment-note{font-size:10px;line-height:1.6;color:#7b8798;margin:11px 0 14px}
.casaku-payment-actions{display:flex;gap:9px}
.casaku-payment-actions button,.casaku-payment-actions a{flex:1;min-height:39px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:10px;padding:8px 10px;font:600 11px inherit;text-decoration:none;cursor:pointer}
.casaku-payment-actions button{border:1px solid #e0d9ec;background:#fff;color:#42536b}
.casaku-payment-actions a{background:#682cc9;color:#fff;border:1px solid #682cc9}
.casaku-payment-actions svg{width:15px;height:15px}
body.modal-open{overflow:hidden}
.casaku-payment-pill{display:inline-flex;align-items:center;gap:6px}
.casaku-payment-pill svg{width:15px;height:15px}
@media(max-width:480px){.casaku-payment-card{padding:18px 15px;border-radius:17px}.casaku-modal-heading h2{font-size:16px}.casaku-payment-actions{flex-direction:column}}

/* ============================================================
   VYSESTORE navigation polish — mobile liquid glass + desktop glow
   ============================================================ */
.mobile-menu-btn{display:none}
.mobile-drawer-scrim,.mobile-drawer,.mobile-bottom-nav{display:none}
.search-box kbd{display:none!important}
.main-nav a span.nav-label{font-size:13px;color:inherit}
.category-chip{display:inline-flex;align-items:center;gap:7px}
.category-chip-icon{width:19px;height:19px;flex:none;object-fit:cover;border-radius:6px;box-shadow:0 2px 6px rgba(15,35,70,.14)}
.category-all-icon{display:inline-flex;flex:none}

/* Animated category artwork: soft floating motion, staggered per item. */
@keyframes vyseCategoryFloat{
  0%,100%{transform:translateY(0) rotate(0deg)}
  25%{transform:translateY(-4px) rotate(-1.4deg)}
  55%{transform:translateY(1px) rotate(1deg)}
  78%{transform:translateY(-2px) rotate(0deg)}
}
.quick-card img,.category-chip-icon{animation:vyseCategoryFloat 3.8s ease-in-out infinite;will-change:transform}
.quick-card:nth-child(2) img,.category-strip .category-chip:nth-child(2) .category-chip-icon{animation-delay:.35s}
.quick-card:nth-child(3) img,.category-strip .category-chip:nth-child(3) .category-chip-icon{animation-delay:.7s}
.quick-card:nth-child(4) img,.category-strip .category-chip:nth-child(4) .category-chip-icon{animation-delay:1.05s}
.quick-card:nth-child(5) img,.category-strip .category-chip:nth-child(5) .category-chip-icon{animation-delay:1.4s}
.quick-card:nth-child(6) img,.category-strip .category-chip:nth-child(6) .category-chip-icon{animation-delay:1.75s}

/* Mouse-following glow on desktop product cards. */
@media (hover:hover) and (pointer:fine) and (min-width:761px){
  .product-card{position:relative;isolation:isolate;overflow:hidden;transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease}
  .product-card::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .22s ease;background:radial-gradient(240px circle at var(--glow-x,50%) var(--glow-y,50%),rgba(158,101,249,.22),rgba(150,89,249,.08) 34%,transparent 72%);mix-blend-mode:screen}
  .product-card.glow-active{transform:translateY(-5px);box-shadow:0 15px 34px rgba(106,43,207,.18),0 0 0 1px rgba(153,93,249,.24)}
  .product-card.glow-active::after{opacity:1}
  .product-card-image,.product-card-info{position:relative;z-index:1}
}

@media(max-width:760px){
  body{padding-bottom:calc(92px + env(safe-area-inset-bottom))}
  .top-header{padding-top:9px;padding-bottom:9px}
  .header-main{grid-template-columns:minmax(0,1fr) auto;gap:9px}
  .brand-logo{font-size:19px;letter-spacing:-1px}
  .header-actions{display:flex;align-items:center;gap:7px}
  .member-header-actions{display:none!important}
  .icon-action{width:38px;height:38px;border-radius:13px}
  .mobile-menu-btn{display:grid;place-items:center;width:39px;height:39px;padding:0;border:1px solid rgba(255,255,255,.68);border-radius:13px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(241,233,254,.76));color:#511ea4;box-shadow:0 5px 16px rgba(95,45,176,.12),inset 0 1px 0 rgba(255,255,255,.9);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);cursor:pointer}
  .mobile-menu-btn svg{width:19px;height:19px}
  .search-box{grid-column:1/-1;grid-row:2;height:40px;margin-top:2px;border-radius:15px;background:rgba(244,239,252,.92);box-shadow:inset 0 1px 2px rgba(24,49,88,.035)}
  .main-nav{display:none!important}
  .hero-section{margin-top:4px}
  .hero-track{border-radius:13px;background:#4911a2}
  .hero-slide img{width:100%;height:auto;aspect-ratio:8/3;object-fit:contain;object-position:center;border-radius:13px;background:#4911a2}
  .hero-dots{padding-top:6px}
  .quick-list{gap:10px;padding:2px 2px 10px}
  .quick-card{overflow:visible}
  .quick-card img{animation-duration:3.1s}
  .category-strip{padding:5px 2px 12px;scrollbar-width:none}
  .category-strip::-webkit-scrollbar{display:none}
  .category-chip{gap:6px;min-height:36px}
  .category-chip-icon{width:18px;height:18px}
  .product-grid{gap:16px 13px}
  .product-card{margin:1px;border:1px solid rgba(206,191,231,.55);box-shadow:0 5px 15px rgba(20,46,86,.055)}

  /* Left-side slide-out navigation drawer. */
  .mobile-drawer-scrim{display:block;position:fixed;inset:0;z-index:10020;border:0;background:rgba(8,18,38,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s ease}
  .mobile-drawer-scrim.show{opacity:1;visibility:visible}
  .mobile-drawer{display:flex;flex-direction:column;position:fixed;z-index:10021;left:0;top:0;bottom:0;width:min(84vw,340px);padding:calc(17px + env(safe-area-inset-top)) 17px calc(18px + env(safe-area-inset-bottom));overflow-y:auto;background:linear-gradient(160deg,rgba(255,255,255,.98),rgba(245,240,254,.94));border-right:1px solid rgba(255,255,255,.9);border-radius:0 24px 24px 0;box-shadow:20px 0 60px rgba(5,22,55,.2);transform:translateX(-105%);transition:transform .32s cubic-bezier(.2,.8,.2,1);backdrop-filter:blur(26px) saturate(185%);-webkit-backdrop-filter:blur(26px) saturate(185%)}
  .mobile-drawer.open{transform:translateX(0)}
  .mobile-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:19px;border-bottom:1px solid rgba(167,146,201,.22)}
  .drawer-brand{display:flex;align-items:center;gap:9px;font-size:16px;font-weight:850;letter-spacing:-.5px;color:#142344}
  .drawer-brand-mark{width:35px;height:35px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(145deg,#9a5ff9,#5d1fc1);color:white;box-shadow:0 6px 15px rgba(103,39,206,.2)}
  .drawer-brand-mark svg{width:19px;height:19px}
  .drawer-close{width:35px;height:35px;display:grid;place-items:center;border:1px solid rgba(178,161,205,.35);border-radius:11px;background:rgba(255,255,255,.75);color:#52627a}
  .drawer-welcome{display:flex;align-items:center;gap:11px;padding:19px 2px 17px}
  .drawer-avatar{width:42px;height:42px;flex:none;display:grid;place-items:center;border-radius:15px;background:linear-gradient(145deg,#ede2fe,#decafd);color:#672ac9}
  .drawer-avatar svg{width:21px;height:21px}
  .drawer-welcome b,.drawer-welcome small{display:block;overflow-wrap:anywhere}
  .drawer-welcome b{font-size:12px;color:#172844}
  .drawer-welcome small{font-size:10px;color:#73829a;margin-top:3px}
  .drawer-nav{display:flex;flex-direction:column;gap:7px;padding:4px 0 16px}
  .drawer-nav .drawer-link{display:flex;align-items:center;gap:12px;width:100%;min-height:46px;padding:0 13px;border:1px solid transparent;border-radius:14px;color:#42536e;font-size:12px;font-weight:600;transition:background .18s,border-color .18s,transform .18s}
  .drawer-nav .drawer-link svg{width:18px;height:18px;color:#6681a7}
  .drawer-nav .drawer-link.active{background:linear-gradient(110deg,#f0e7fe,#fbf8ff);border-color:#e7d8fe;color:#5c1fbd;box-shadow:inset 3px 0 0 #783dd8}
  .drawer-nav .drawer-link.active svg{color:#6726cf}
  .drawer-nav .drawer-link:active{transform:scale(.985)}
  .drawer-member-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto;padding-top:15px;border-top:1px solid rgba(167,146,201,.22)}
  .drawer-member-actions a,.drawer-member-actions button{min-height:42px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid #e4d9f6;border-radius:12px;background:rgba(255,255,255,.8);color:#5a27ad;font-size:11px;font-weight:700}
  .drawer-member-actions a:first-child,.drawer-member-actions button{background:linear-gradient(135deg,#6e2fd4,#5b1ebc);border-color:#6e2fd4;color:white}
  .drawer-member-actions svg{width:15px;height:15px}
  .drawer-bottom-note{display:flex;align-items:center;gap:8px;padding:15px 3px 2px;color:#71839e;font-size:9px}
  .drawer-bottom-note svg{width:15px;height:15px;color:#0ca773}

  /* Floating liquid-glass bottom navigation. */
  .mobile-bottom-nav{display:flex;align-items:center;justify-content:space-around;position:fixed;z-index:9000;left:50%;bottom:calc(9px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(560px,calc(100% - 22px));min-height:66px;padding:7px 8px;border:1px solid rgba(255,255,255,.84);border-radius:23px;background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(244,238,254,.68) 48%,rgba(255,255,255,.74));box-shadow:0 12px 34px rgba(61,28,113,.17),inset 0 1px 0 rgba(255,255,255,.96),inset 0 -1px 0 rgba(164,134,211,.12);backdrop-filter:blur(24px) saturate(190%);-webkit-backdrop-filter:blur(24px) saturate(190%)}
  .mobile-bottom-nav::before{content:"";position:absolute;inset:1px;border-radius:22px;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.68),transparent 32%,rgba(158,102,249,.08) 65%,rgba(255,255,255,.5));}
  .bottom-nav-item{position:relative;z-index:1;flex:1;min-width:0;min-height:50px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:16px;color:#71809a;font-size:9px;font-weight:650;transition:color .2s,background .2s,transform .2s}
  .bottom-nav-item svg{width:19px;height:19px;stroke-width:1.9}
  .bottom-nav-item.active{color:#5d1cc7;background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(232,219,254,.72));box-shadow:0 4px 12px rgba(94,41,179,.12),inset 0 1px 0 rgba(255,255,255,.95)}
  .bottom-nav-item.active svg{filter:drop-shadow(0 2px 4px rgba(110,48,211,.22))}
  .bottom-nav-item:active{transform:scale(.94)}
  .dark-mode .mobile-drawer{background:linear-gradient(160deg,rgba(20,32,52,.98),rgba(16,28,47,.96));border-color:rgba(105,133,174,.25)}
  .dark-mode .drawer-brand,.dark-mode .drawer-welcome b{color:#f4eefe}
  .dark-mode .drawer-close,.dark-mode .drawer-member-actions a,.dark-mode .drawer-member-actions button{background:rgba(34,50,74,.88);border-color:#354a68;color:#f0e7fe}
  .dark-mode .drawer-nav .drawer-link{color:#c7b9dd}
  .dark-mode .drawer-nav .drawer-link.active{background:#39225f;border-color:#5c3897;color:#f0e8fe}
  .dark-mode .mobile-bottom-nav{background:linear-gradient(135deg,rgba(27,43,66,.9),rgba(20,34,55,.82));border-color:rgba(164,141,200,.32);box-shadow:0 12px 35px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.12)}
  .dark-mode .bottom-nav-item{color:#a9b8cf}
  .dark-mode .bottom-nav-item.active{color:#d6befd;background:linear-gradient(145deg,rgba(79,49,126,.9),rgba(28,53,88,.82))}
  .dark-mode .hero-track,.dark-mode .hero-slide img{background:#0b214c}
  .toast{bottom:calc(86px + env(safe-area-inset-bottom))}
  .purchase-notification{bottom:calc(86px + env(safe-area-inset-bottom))}
}

@media(prefers-reduced-motion:reduce){
  .quick-card img,.category-chip-icon{animation:none!important}
  .mobile-drawer,.mobile-drawer-scrim,.bottom-nav-item,.product-card{transition:none!important}
}

.duration-stock-note{display:block;min-height:12px;margin-top:3px;font-size:9px;font-weight:650;color:#24916d}.duration-card.duration-out-of-stock{opacity:.58;cursor:not-allowed;border-style:dashed}.duration-card.duration-out-of-stock .duration-stock-note{color:#d14949}.duration-card.duration-admin-fulfillment{border-color:rgba(205,145,42,.38);background:linear-gradient(145deg,rgba(255,248,230,.9),rgba(255,255,255,.95));cursor:pointer}.duration-card.duration-admin-fulfillment .duration-stock-note{color:#a36b12}.duration-card.duration-admin-fulfillment:hover{border-color:#c78e2f;transform:translateY(-2px)}.brand-logo-image{display:block;width:auto;max-width:190px;height:auto;max-height:48px;object-fit:contain}.drawer-brand-image{width:34px;height:34px;object-fit:contain;flex:none}

/* All ULTRA variants remain selectable. Empty variants lead to admin assistance, not a disabled gray card. */
.duration-card.duration-admin-fulfillment { opacity: 1; cursor: pointer; border-style: solid; }
.duration-card.duration-admin-fulfillment .duration-stock-note { color: #a36b12; font-size: 10px; }
.duration-card.duration-admin-fulfillment.selected { border-color: #682cc9; box-shadow: 0 3px 12px rgba(104,44,201,.14); }

/* Invoice recovery: keep public search separate from owner-only license access. */
.lookup-result-links .invoice-detail-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:43px;padding:11px 16px;background:#6b2ad3;color:#fff!important;border:1px solid #6b2ad3;border-radius:12px;text-decoration:none;font-weight:750;box-shadow:0 7px 18px #225fce26;transition:transform .16s,box-shadow .16s}
.lookup-result-links .invoice-detail-link:hover{background:#5920b4;transform:translateY(-2px);box-shadow:0 10px 22px #225fce35}
.lookup-result-links .invoice-detail-link svg{width:16px;height:16px;flex:none}
.invoice-access-note{display:flex;align-items:flex-start;gap:8px;padding:12px;margin:13px 0 0;border-radius:12px;border:1px solid #e4d9f6;background:#f9f5ff;color:#63498e;font-size:12px;line-height:1.6}
.invoice-access-note svg{width:16px;height:16px;flex:none;margin-top:2px}
.dark-mode .invoice-access-note{background:#172d48;border-color:#513976;color:#d3c3ed}
@media(max-width:640px){.lookup-result-links .invoice-detail-link{width:100%;font-size:13px}.invoice-access-note{font-size:11px}}

/* Modern product-logo purchase toast, matching the reference layout. */
.purchase-notification{width:min(304px,calc(100vw - 22px));bottom:18px}
.purchase-toast-card{border-radius:17px;padding:14px 15px 13px;border-color:#ebe6f4;box-shadow:0 14px 35px rgba(22,45,75,.18);font-family:inherit}
.purchase-toast-body{display:flex;align-items:center;gap:12px}
.purchase-toast-logo{width:44px;height:44px;flex:none;border-radius:13px;background:#f4effd;overflow:hidden;display:grid;place-items:center}
.purchase-toast-logo img{width:100%;height:100%;object-fit:contain;border-radius:12px}
.purchase-toast-copy{display:grid;gap:2px;line-height:1.32;font-size:11px;min-width:0;flex:1}
.purchase-toast-brand{margin:0 0 3px;display:inline-flex;gap:4px;align-items:center;justify-self:start;font-size:8px;letter-spacing:0;color:#fff;background:#192540;border-radius:5px;padding:3px 7px;font-weight:800}
.purchase-toast-brand svg{width:10px;height:10px}
.purchase-toast-copy>b{font-size:12px;font-weight:800;color:#1d273c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.purchase-toast-copy>strong{font-size:10px;font-weight:550;color:#617189;line-height:1.3;width:auto}
.purchase-toast-copy>span{font-size:10px;color:#6c7990}
.purchase-toast-meta{margin-top:4px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.purchase-toast-meta span{font-size:9px;font-weight:700}
.purchase-toast-meta .activity-success{color:#00a879}
.purchase-toast-meta .activity-time{color:#bd7816;background:#fff0c8}
.purchase-close{top:6px;right:7px;display:grid;place-items:center;width:22px;height:22px;padding:4px}
.purchase-close svg{width:13px;height:13px}
@media(max-width:760px){.purchase-notification{bottom:calc(88px + env(safe-area-inset-bottom));left:9px;width:min(304px,calc(100vw - 18px))}}

/* Payment branding refresh: logo badges, QRIS-only public labels, responsive trust footer. */
.site-footer-rich .footer-payment-trust.footer-inner {
  display:grid; grid-template-columns:minmax(0, 0.85fr) minmax(0, 1.35fr);
  align-items:start; justify-content:stretch; gap:34px;
  margin:0 auto 14px; padding:21px 0 27px;
  border-top:1px solid #e2daee;
}
.site-footer-rich .footer-payment-trust h4 {
  margin:0 0 12px; font-size:13px; color:#111827; font-weight:750;
}
.site-footer-rich .footer-payment-trust .payment-methods {
  display:flex; align-items:center; flex-wrap:wrap; gap:8px;
}
.site-footer-rich .payment-brand-logo {
  display:inline-flex; width:40px; height:40px; flex:0 0 40px;
  align-items:center; justify-content:center; border-radius:12px;
  overflow:hidden; background:#fff; box-shadow:0 1px 4px rgba(24,42,67,.04);
}
.site-footer-rich .payment-brand-logo img {
  width:35px; height:35px; display:block; object-fit:contain;
}
.site-footer-rich .payment-more {
  margin:9px 0 0; font-size:11px; line-height:1.55; color:#682cc9;
}
.site-footer-rich .footer-assurance-column {
  border-left:1px solid #e2daee; padding-left:28px;
}
.site-footer-rich .footer-assurance-column>p {
  margin:0; max-width:420px; color:#576984; line-height:1.65; font-size:12px;
}
.site-footer-rich .footer-assurance-column .footer-guarantee {
  border-left:0; margin:10px 0 0; padding:0;
  align-items:flex-start; color:#07a669;
}
.site-footer-rich .footer-assurance-column .footer-guarantee svg {
  flex-shrink:0; width:20px; height:20px;
}
.site-footer-rich .footer-assurance-column .footer-guarantee b {
  font-size:12px; color:#069c64;
}
.site-footer-rich .footer-assurance-column .footer-guarantee small {
  font-size:10px; line-height:1.5;
}
#productDetail .chosen-payment .qris-brand-symbol {
  display:inline-flex; width:45px; height:45px; flex:0 0 45px;
  align-items:center; justify-content:center; background:#fff;
  border:1px solid #e8e2f1; border-radius:12px; overflow:hidden;
}
#productDetail .chosen-payment .qris-brand-symbol img {
  width:38px; height:38px; display:block; object-fit:contain;
}
.dark-mode .site-footer-rich .footer-payment-trust.footer-inner { border-color:#344258; }
.dark-mode .site-footer-rich .footer-payment-trust h4 { color:#f3eefb; }
.dark-mode .site-footer-rich .footer-assurance-column { border-color:#344258; }
.dark-mode .site-footer-rich .footer-assurance-column>p { color:#aab8c8; }
.dark-mode .site-footer-rich .footer-assurance-column .footer-guarantee b { color:#34d399; }
@media(max-width:760px) {
  .site-footer-rich .footer-payment-trust.footer-inner { grid-template-columns:1fr; gap:19px; padding:21px 0 16px; }
  .site-footer-rich .footer-assurance-column { border-left:0; border-top:1px solid #e2daee; padding:15px 0 0; }
  .dark-mode .site-footer-rich .footer-assurance-column { border-top-color:#344258; }
  .site-footer-rich .footer-payment-trust .payment-methods { gap:7px; }
  .site-footer-rich .payment-brand-logo { width:38px; height:38px; flex-basis:38px; }
}


/* Five user-provided brand logos, original compact layout (not the later SVG mockups). */
.site-footer-rich .footer-payment-trust .payment-methods {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: center;
  gap: 7px;
  width: min(100%, 360px);
}
.site-footer-rich .payment-brand-logo {
  width: 100%; height: 45px; min-width: 0;
  display: flex; justify-content: center; align-items: center;
  flex: initial;
  padding: 5px 3px;
  border-radius: 11px;
  border: 1px solid #eee9f5;
  background: #ffffff;
  box-shadow: 0 2px 5px rgba(30, 52, 88, .06);
  box-sizing: border-box;
}
.site-footer-rich .payment-brand-logo img {
  display: block;
  width: 100%; max-width: 61px; height: 28px;
  object-fit: contain; object-position: center;
}
#productDetail .chosen-payment .qris-brand-symbol {
  width: 72px; height: 48px; flex: 0 0 72px;
  border-radius: 11px;
}
#productDetail .chosen-payment .qris-brand-symbol img {
  width: 61px; max-width: 100%; height: 29px;
  object-fit: contain;
}
@media (max-width: 760px) {
  .site-footer-rich .footer-payment-trust .payment-methods {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
    width: min(100%, 330px);
  }
  .site-footer-rich .payment-brand-logo { width: 100%; height: 42px; padding: 4px 2px; }
  .site-footer-rich .payment-brand-logo img { width: 100%; max-width: 57px; height: 25px; }
}

.footer-logo-mark img{width:22px;height:22px;object-fit:contain;display:block}


/* ===== Footer and drawer logo refinement ===== */
.footer-logo{gap:12px;align-items:center}
.footer-logo-mark{width:40px!important;height:40px!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;display:grid;place-items:center;flex:none}
.footer-logo-mark img{width:34px!important;height:34px!important;object-fit:contain;display:block;filter:drop-shadow(0 3px 10px rgba(124,89,226,.16))}
.footer-logo b{font-size:18px;font-weight:900;letter-spacing:-.03em}
.drawer-brand-mark{background:transparent!important;box-shadow:none!important}
@media (max-width:640px){
  .footer-logo-mark{width:36px!important;height:36px!important}
  .footer-logo-mark img{width:31px!important;height:31px!important}
  .footer-logo b{font-size:16px}
}

/* Consistent spacing of store logo and wordmark in footer and mobile drawer. */
.footer-logo{gap:6px!important}
.drawer-brand{gap:6px!important}

/* Footer information links: keep clickable heading styling consistent. */
.footer-links h4>a{font-size:inherit;font-weight:inherit;color:inherit;line-height:inherit}
.footer-links h4>a:hover{color:#7545d8}