.vnp-subnav{display:flex;align-items:center;gap:18px;padding-top:18px;padding-bottom:12px}.vnp-subnav>span{font-size:12px;color:rgb(var(--text-muted))}.vnp-back-link{display:inline-flex;align-items:center;gap:7px;min-height:38px;font-size:13px;font-weight:650;color:rgb(var(--text));white-space:nowrap}.vnp-back-link svg{width:17px;height:17px}.vnp-back-link:hover{color:rgb(var(--primary))}.vnp-back-link:focus-visible,.vnp-ux button:focus-visible,.vnp-ux a:focus-visible{outline:3px solid rgb(var(--primary)/.4);outline-offset:3px}.vnp-ux{font-family:'Inter var',Inter,system-ui,sans-serif;color:rgb(var(--text));--ux-radius:20px}.vnp-ux *{box-sizing:border-box}.vnp-ux h1,.vnp-ux h2,.vnp-ux h3{color:rgb(var(--text));letter-spacing:-.035em}.vnp-ux h1{font-size:clamp(26px,3vw,38px);line-height:1.2;font-weight:760}.vnp-ux h2{font-size:20px;line-height:1.3;font-weight:720}.vnp-ux p{line-height:1.75}.vnp-ux .ux-muted{color:rgb(var(--text-muted))}.ux-eyebrow{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:rgb(var(--primary));font-weight:750}.ux-pill{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid rgb(var(--border));background:rgb(var(--surface-sunken));border-radius:50px;font-size:11px;font-weight:650;color:rgb(var(--text-muted))}.ux-pill svg{width:13px;height:13px}.ux-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:12px;color:rgb(var(--text-muted));padding:8px 0 20px}.ux-breadcrumb a:hover{color:rgb(var(--primary))}.ux-card{border:1px solid rgb(var(--border));background:rgb(var(--surface));border-radius:var(--ux-radius);padding:24px;min-width:0}.ux-primary,.ux-secondary{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:11px 18px;border-radius:12px;font-size:13px;font-weight:720;text-align:center;cursor:pointer;transition:transform .16s,box-shadow .16s}.ux-primary{background:rgb(var(--primary));color:#fff;border:1px solid transparent}.ux-primary:hover{box-shadow:0 5px 18px rgb(var(--primary)/.2);transform:translateY(-1px)}.ux-secondary{background:rgb(var(--surface));color:rgb(var(--text));border:1px solid rgb(var(--border-strong))}.ux-primary:disabled,.ux-secondary:disabled{opacity:.55;cursor:not-allowed;transform:none}.ux-primary svg,.ux-secondary svg{width:17px;height:17px}.ux-text-button{border:none;background:none;padding:4px 0;color:rgb(var(--primary));font-size:12px;font-weight:650;cursor:pointer}.ux-header-row{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin:6px 0 23px}.ux-header-row p{font-size:13px;color:rgb(var(--text-muted));margin-top:7px}.ux-notice{padding:13px 15px;border:1px solid rgb(var(--border));background:rgb(var(--surface-sunken));border-radius:12px;color:rgb(var(--text-muted));font-size:12px;line-height:1.7}.ux-notice[data-tone=error]{border-color:rgb(var(--danger)/.35);background:rgb(var(--danger-soft));color:rgb(var(--danger))}.ux-notice[data-tone=success]{border-color:rgb(var(--success)/.25);background:rgb(var(--success-soft));color:rgb(var(--success))}.ux-product-wrap{padding-bottom:46px}.ux-product-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(340px,.85fr);gap:44px;align-items:start}.ux-product-gallery{min-width:0}.ux-photo-stage{background:rgb(var(--surface-sunken));border:1px solid rgb(var(--border));border-radius:24px;overflow:hidden;position:relative;aspect-ratio:1.12}.ux-photo-stage img{width:100%;height:100%;object-fit:contain;display:block}.ux-photo-stage .ux-photo-count{position:absolute;bottom:15px;left:15px;background:rgb(var(--surface)/.93);border:1px solid rgb(var(--border));border-radius:50px;padding:5px 10px;font-size:11px;font-weight:650}.ux-gallery-buttons{display:flex;gap:10px;overflow-x:auto;padding:15px 2px 4px;scrollbar-width:thin}.ux-gallery-button{flex:0 0 76px;width:76px;height:70px;border:2px solid transparent;border-radius:12px;padding:0;overflow:hidden;background:rgb(var(--surface-sunken));cursor:pointer}.ux-gallery-button img{width:100%;height:100%;object-fit:cover}.ux-gallery-button[aria-pressed=true]{border-color:rgb(var(--primary));box-shadow:0 0 0 3px rgb(var(--primary)/.09)}.ux-gallery-controls{display:flex;gap:7px;position:absolute;bottom:13px;right:14px}.ux-gallery-controls button{width:34px;height:34px;display:grid;place-items:center;background:rgb(var(--surface)/.94);border:1px solid rgb(var(--border));border-radius:50%;cursor:pointer}.ux-gallery-controls svg{width:15px;height:15px}.ux-product-detail{position:sticky;top:18px;padding:4px 0}.ux-product-detail h1{margin:15px 0 12px}.ux-product-detail .ux-short{font-size:14px;color:rgb(var(--text-muted));margin-bottom:20px}.ux-product-detail .ux-meta{display:flex;flex-wrap:wrap;gap:8px}.ux-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:11px;margin:18px 0 6px}.ux-price strong{font-size:34px;font-weight:750;letter-spacing:-.06em}.ux-price del{font-size:16px;color:rgb(var(--text-subtle))}.ux-savings{font-size:11px;font-weight:700;color:rgb(var(--success));background:rgb(var(--success-soft));padding:5px 8px;border-radius:6px}.ux-city-box{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:20px 0;padding:14px 15px;border:1px solid rgb(var(--border));border-radius:13px;background:rgb(var(--surface))}.ux-city-box small{display:block;font-size:10px;color:rgb(var(--text-muted));margin-bottom:3px}.ux-city-box strong{font-size:13px}.ux-small-note{font-size:11px;color:rgb(var(--text-muted));line-height:1.8}.ux-product-actions{display:grid;grid-template-columns:1fr;gap:9px;margin:18px 0 13px}.ux-trust-row{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;border-top:1px solid rgb(var(--border));padding-top:17px;margin-top:19px;font-size:11px;color:rgb(var(--text-muted))}.ux-trust-row svg{width:15px;height:15px;color:rgb(var(--primary));margin-bottom:6px}.ux-addon-list{margin:15px 0;display:grid;gap:7px}.ux-addon{display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px solid rgb(var(--border));border-radius:10px;font-size:12px;cursor:pointer}.ux-addon input{accent-color:rgb(var(--primary))}.ux-addon strong{margin-left:auto;font-size:12px}.ux-details-section{margin-top:29px;padding-top:22px;border-top:1px solid rgb(var(--border))}.ux-details-section h2{margin-bottom:13px}.ux-details-section p{font-size:13px;color:rgb(var(--text-muted))}.ux-included{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}.ux-included li{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:rgb(var(--text-muted))}.ux-included svg{flex:0 0 16px;width:16px;height:16px;color:rgb(var(--success));margin-top:3px}.ux-specs{display:grid;grid-template-columns:1fr 1fr;gap:17px}.ux-specs dt{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:rgb(var(--text-muted));margin-bottom:5px}.ux-specs dd{font-size:13px;line-height:1.7}.ux-review{padding:15px 0;border-bottom:1px solid rgb(var(--border))}.ux-review strong{font-size:12px}.ux-review p{font-size:13px;color:rgb(var(--text-muted));margin:7px 0}.ux-related{margin-top:42px}.ux-related h2{margin-bottom:19px}.ux-mobile-product{display:none}.ux-booking-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:28px;align-items:start}.ux-booking-form{display:grid;gap:20px}.ux-booking-section-head{display:flex;gap:11px;align-items:center;margin-bottom:18px}.ux-step{width:27px;height:27px;display:grid;place-items:center;border-radius:9px;background:rgb(var(--primary-soft));color:rgb(var(--primary));font-size:12px;font-weight:750;flex:0 0 auto}.ux-booking-section-head h2{font-size:16px;letter-spacing:-.02em}.ux-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.ux-field{display:block;min-width:0}.ux-field.full{grid-column:1/-1}.ux-field>span{font-size:11px;font-weight:650;margin-bottom:8px;display:block}.ux-field input,.ux-field textarea{display:block;width:100%;padding:12px 13px;min-height:45px;font-size:13px;border:1px solid rgb(var(--border-strong));border-radius:10px;background:rgb(var(--surface));color:rgb(var(--text));outline:none}.ux-field textarea{resize:vertical;min-height:94px;line-height:1.75}.ux-field input:focus,.ux-field textarea:focus{border-color:rgb(var(--primary));box-shadow:0 0 0 3px rgb(var(--primary)/.1)}.ux-field small{font-size:10px;line-height:1.8;display:block;margin-top:7px;color:rgb(var(--text-muted))}.ux-booking-summary{position:sticky;top:18px}.ux-summary-items{list-style:none;margin:15px 0;padding:0}.ux-summary-item{display:flex;gap:12px;padding:13px 0;border-bottom:1px solid rgb(var(--border))}.ux-summary-item img{width:58px;height:58px;object-fit:cover;border-radius:10px;background:rgb(var(--surface-sunken))}.ux-summary-item>div{min-width:0;flex:1}.ux-summary-item strong{font-size:12px;line-height:1.5;display:block}.ux-summary-item small{display:block;font-size:10px;color:rgb(var(--text-muted));margin-top:5px}.ux-summary-item b{font-size:12px;margin-top:7px;display:block}.ux-price-list{display:grid;gap:11px;font-size:12px;margin:18px 0}.ux-price-list>div{display:flex;justify-content:space-between;gap:16px}.ux-price-list dt{color:rgb(var(--text-muted))}.ux-price-list dd{font-weight:650;text-align:right}.ux-price-list .ux-price-total{border-top:1px solid rgb(var(--border));padding-top:15px;margin-top:3px;font-size:17px}.ux-price-list .ux-price-total dt{color:rgb(var(--text));font-weight:750}.ux-price-list .ux-price-total dd{color:rgb(var(--primary))}.ux-coupon-form{display:flex;gap:8px;margin-top:15px}.ux-coupon-form input{min-width:0;flex:1;padding:11px 12px;font-size:12px;border:1px solid rgb(var(--border-strong));border-radius:10px;background:rgb(var(--surface));color:rgb(var(--text));text-transform:uppercase}.ux-coupon-form button{min-height:42px;padding:10px 13px;font-size:11px}.ux-coupon-applied{display:flex;align-items:center;justify-content:space-between;gap:9px;border:1px solid rgb(var(--success)/.2);background:rgb(var(--success-soft));color:rgb(var(--success));border-radius:9px;padding:10px 11px;font-size:11px;margin-top:9px}.ux-price-status{font-size:11px;line-height:1.7;color:rgb(var(--text-muted));margin-top:10px;min-height:20px}.ux-price-status[data-error=true]{color:rgb(var(--danger))}.ux-booking-bottom{padding-top:4px;display:grid;gap:10px}.ux-booking-bottom>p{font-size:11px;color:rgb(var(--text-muted));text-align:center}.ux-address-actions{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}.ux-address-actions button{min-height:38px;font-size:11px;padding:8px 12px}.ux-address-modal{position:fixed;inset:0;z-index:250;background:rgb(0 0 0/.52);display:flex;align-items:center;justify-content:center;padding:22px;backdrop-filter:blur(3px)}.ux-address-modal[hidden]{display:none!important}.ux-address-panel{background:rgb(var(--surface));border:1px solid rgb(var(--border));width:min(560px,100%);max-height:calc(100dvh - 44px);overflow:auto;border-radius:23px;padding:24px;box-shadow:0 25px 90px rgb(0 0 0/.2)}.ux-address-top{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:9px}.ux-address-top h2{font-size:21px}.ux-address-close{width:34px;height:34px;border:1px solid rgb(var(--border));border-radius:50%;display:grid;place-items:center;cursor:pointer;color:rgb(var(--text));background:rgb(var(--surface-sunken));font-size:19px}.ux-address-panel>p{font-size:12px;color:rgb(var(--text-muted));margin-bottom:18px}.ux-address-status{font-size:12px;line-height:1.7;margin:13px 0;color:rgb(var(--text-muted))}.ux-address-status[data-error=true]{color:rgb(var(--danger))}.ux-detected-pin{padding:13px 14px;background:rgb(var(--surface-sunken));border:1px solid rgb(var(--border));border-radius:12px;margin:12px 0;font-size:12px;line-height:1.7}.ux-detected-pin a{color:rgb(var(--primary));font-weight:650;font-size:11px;display:inline-block;margin-top:6px}.ux-address-panel .ux-field{margin:15px 0}.ux-address-panel footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:19px}.ux-address-panel footer small{font-size:10px;color:rgb(var(--text-muted));max-width:230px}.ux-cart-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(310px,.7fr);gap:25px;align-items:start}.ux-cart-items{display:grid;gap:13px;list-style:none;padding:0}.ux-cart-item{display:flex;gap:18px;align-items:flex-start}.ux-cart-item img{width:112px;height:112px;object-fit:cover;border-radius:15px;background:rgb(var(--surface-sunken))}.ux-cart-item .ux-cart-detail{flex:1;min-width:0}.ux-cart-detail h2{font-size:16px;letter-spacing:-.025em;line-height:1.5}.ux-cart-detail small{font-size:10px;color:rgb(var(--text-muted))}.ux-cart-price{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:16px}.ux-cart-price strong{font-size:16px}.ux-cart-qty{display:flex;align-items:center;border:1px solid rgb(var(--border));border-radius:9px;overflow:hidden}.ux-cart-qty form{margin:0}.ux-cart-qty button{height:32px;width:32px;font-size:17px;color:rgb(var(--text));background:rgb(var(--surface-sunken));cursor:pointer}.ux-cart-qty button:disabled{opacity:.4}.ux-cart-qty span{width:29px;text-align:center;font-size:12px;font-weight:650}.ux-empty{text-align:center;max-width:680px;margin:35px auto;padding:55px 25px}.ux-empty .ux-icon-circle,.ux-confirmation-icon{height:65px;width:65px;border-radius:20px;background:rgb(var(--primary-soft));color:rgb(var(--primary));display:grid;place-items:center;margin:0 auto 20px}.ux-empty h1{font-size:28px}.ux-empty p{font-size:13px;color:rgb(var(--text-muted));margin:13px auto 23px;max-width:430px}.ux-empty .ux-primary{margin:4px}.ux-steps-nav{display:flex;align-items:center;gap:12px;font-size:11px;font-weight:650;color:rgb(var(--text-muted))}.ux-steps-nav .is-current{color:rgb(var(--primary))}.ux-confirmation{max-width:850px;margin:25px auto}.ux-confirmation-top{text-align:center;padding:22px 0 27px}.ux-confirmation-top h1{font-size:32px;margin:8px 0 10px}.ux-confirmation-top p{font-size:13px;color:rgb(var(--text-muted))}.ux-confirmation-icon{background:rgb(var(--success-soft));color:rgb(var(--success))}.ux-confirmation-details{display:grid;grid-template-columns:1fr 1fr;gap:23px;margin-top:20px}.ux-confirmation-details dt{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:rgb(var(--text-muted));margin-bottom:7px}.ux-confirmation-details dd{font-size:13px;line-height:1.8}.ux-rail-buttons{display:none;gap:7px;margin-bottom:12px;justify-content:flex-end}.ux-rail-buttons button{width:34px;height:34px;background:rgb(var(--surface));border:1px solid rgb(var(--border));color:rgb(var(--text));border-radius:50%;display:grid;place-items:center;cursor:pointer}.ux-rail-buttons svg{width:16px;height:16px}.ux-rail-buttons button:disabled{opacity:.35}.ux-rail-buttons[hidden]{display:none!important}@media(min-width:1024px){.ux-rail-buttons{display:flex}.ux-product-detail .ux-price{margin-top:20px}}@media(max-width:1000px){.ux-product-grid{grid-template-columns:minmax(0,1fr) minmax(290px,.85fr);gap:25px}.ux-booking-grid,.ux-cart-grid{grid-template-columns:1fr}.ux-booking-summary{position:static}.ux-booking-summary{order:-1}.ux-booking-summary .ux-summary-items{display:none}.ux-product-detail{top:12px}}@media(max-width:767px){.vnp-subnav{padding-top:12px;gap:11px}.vnp-subnav>span{font-size:10px}.vnp-back-link{font-size:12px}.ux-product-grid{grid-template-columns:1fr;gap:20px}.ux-product-detail{position:static}.ux-photo-stage{border-radius:18px;aspect-ratio:1.1}.ux-breadcrumb{font-size:10px;gap:6px;padding-bottom:14px}.ux-product-detail h1{font-size:25px;margin-top:10px}.ux-product-detail .ux-short{font-size:13px;margin-bottom:12px}.ux-price strong{font-size:29px}.ux-gallery-button{flex-basis:64px;width:64px;height:59px}.ux-product-wrap{padding-bottom:110px}.ux-card{padding:18px;border-radius:17px}.ux-fields{gap:13px}.ux-field>span{font-size:10px}.ux-field input,.ux-field textarea{font-size:14px}.ux-mobile-product{position:fixed;left:0;right:0;bottom:calc(var(--bottomnav-h) + env(safe-area-inset-bottom,0px));z-index:45;display:flex;align-items:center;gap:15px;padding:10px 16px;background:rgb(var(--surface)/.97);border-top:1px solid rgb(var(--border));box-shadow:0 -4px 20px rgb(0 0 0/.05)}.ux-mobile-product>div{flex:1;min-width:0}.ux-mobile-product small{display:block;font-size:9px;color:rgb(var(--text-muted))}.ux-mobile-product strong{font-size:18px}.ux-mobile-product button{font-size:12px;min-height:43px;min-width:160px}.ux-header-row{display:block;margin-bottom:20px}.ux-header-row .ux-steps-nav{margin-top:16px}.ux-header-row h1{font-size:28px}.ux-booking-form{gap:14px}.ux-booking-summary .ux-price-list{margin:10px 0}.ux-booking-summary h2{font-size:16px}.ux-booking-summary .ux-coupon-form{display:none}.ux-booking-bottom .ux-primary{font-size:13px;min-height:48px}.ux-address-modal{padding:0;align-items:flex-end}.ux-address-panel{width:100%;max-height:92dvh;border-radius:23px 23px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom))}.ux-cart-item{gap:12px}.ux-cart-item img{width:82px;height:90px;border-radius:11px}.ux-cart-detail h2{font-size:14px}.ux-cart-price{margin-top:12px}.ux-cart-price strong{font-size:14px}.ux-cart-qty button{height:30px;width:30px}.ux-confirmation-top h1{font-size:26px}.ux-confirmation-details{grid-template-columns:1fr;gap:16px}.ux-included{grid-template-columns:1fr}.ux-related{margin-top:30px}.ux-specs{gap:14px}.ux-details-section h2{font-size:18px}.ux-coupon-form input{font-size:13px}}@media(max-width:420px){.ux-fields{grid-template-columns:1fr}.ux-fields .ux-slot-fields{grid-column:1/-1}.ux-specs{grid-template-columns:1fr}.ux-address-panel footer{align-items:flex-start;flex-direction:column}.ux-address-panel footer .ux-primary{width:100%}}@media(prefers-reduced-motion:reduce){.vnp-ux *{scroll-behavior:auto!important;transition:none!important}.ux-primary:hover{transform:none}}
.ux-float-back{position:fixed;top:calc(12px + env(safe-area-inset-top,0px));left:calc(12px + env(safe-area-inset-left,0px));z-index:60;width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:rgb(var(--surface)/.94);color:rgb(var(--text));border:1px solid rgb(var(--border-strong));box-shadow:0 6px 22px rgb(0 0 0/.16);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;visibility:hidden;transform:translateY(-8px) scale(.92);transition:opacity .18s,transform .18s,visibility 0s linear .18s;-webkit-tap-highlight-color:transparent}.ux-float-back svg{width:22px;height:22px}.ux-float-back.is-visible{opacity:1;visibility:visible;transform:none;transition:opacity .18s,transform .18s,visibility 0s}.ux-float-back:hover{color:rgb(var(--primary));border-color:rgb(var(--primary)/.45)}.ux-float-back:active{transform:scale(.94)}.ux-float-back:focus-visible{outline:3px solid rgb(var(--primary)/.45);outline-offset:3px}@media(min-width:1024px){.ux-float-back{top:20px;left:20px}}@media print{.ux-float-back{display:none}}@media(prefers-reduced-motion:reduce){.ux-float-back,.ux-float-back.is-visible{transition:none;transform:none}}
/* ===== Wishlist — signed-out screen (Android app style, theme + dark aware) ===== */
.vnp-wlg{--wlg-bar:64px;display:flex;flex-direction:column;min-height:calc(100dvh - var(--bottomnav-h) - env(safe-area-inset-bottom,0px));font-family:'Inter var',Inter,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:rgb(var(--text))}
.vnp-wlg-bar{position:sticky;top:0;z-index:30;padding-top:env(safe-area-inset-top,0px);background:rgb(var(--background)/.88);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);transition:box-shadow .2s,border-color .2s;border-bottom:1px solid transparent}
.vnp-wlg-bar.is-raised{border-bottom-color:rgb(var(--border));box-shadow:0 2px 12px rgb(0 0 0/.06)}
.vnp-wlg-bar-in{display:flex;align-items:center;gap:4px;height:var(--wlg-bar);padding:0 8px 0 4px;max-width:1280px;margin:0 auto}
.vnp-wlg-back{position:relative;width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:50%;color:rgb(var(--text));overflow:hidden;-webkit-tap-highlight-color:transparent;isolation:isolate}
.vnp-wlg-back::before{content:'';position:absolute;inset:0;border-radius:inherit;background:currentColor;opacity:0;transition:opacity .15s;z-index:-1}
.vnp-wlg-back:hover::before{opacity:.08}.vnp-wlg-back:active::before{opacity:.14}
.vnp-wlg-back:focus-visible{outline:3px solid rgb(var(--primary)/.5);outline-offset:-3px}
.vnp-wlg-back svg{width:24px;height:24px;fill:currentColor}
.vnp-wlg-ripple{position:absolute;border-radius:50%;background:currentColor;opacity:.2;transform:scale(0);animation:vnpWlgRipple .45s ease-out forwards;pointer-events:none}
@keyframes vnpWlgRipple{to{transform:scale(2.6);opacity:0}}
.vnp-wlg-bar-title{font-size:20px;font-weight:650;letter-spacing:-.01em;line-height:1;margin:0 0 0 4px;color:rgb(var(--text))}
.vnp-wlg-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:12px 24px 28px;max-width:440px;width:100%;margin:0 auto}
.vnp-wlg-art{position:relative;width:min(62vw,250px);aspect-ratio:480/558;margin:0 auto 22px}
.vnp-wlg-glow{position:absolute;left:50%;top:52%;width:118%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,rgb(var(--primary)/.24),rgb(var(--primary)/.09) 58%,transparent 100%);z-index:0}
.vnp-wlg-floor{position:absolute;left:50%;bottom:-6px;width:62%;height:16px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgb(0 0 0/.18),transparent);z-index:0;animation:vnpWlgShadow 3.6s ease-in-out infinite}
.vnp-wlg-img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 10px 18px rgb(0 0 0/.12));animation:vnpWlgFloat 3.6s ease-in-out infinite;user-select:none;-webkit-user-drag:none}
@keyframes vnpWlgFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes vnpWlgShadow{0%,100%{transform:translateX(-50%) scale(1);opacity:1}50%{transform:translateX(-50%) scale(.86);opacity:.7}}
.vnp-wlg-img.is-faded{-webkit-mask-image:linear-gradient(to bottom,#000 80%,transparent 99%);mask-image:linear-gradient(to bottom,#000 80%,transparent 99%)}
.vnp-gate-cart .vnp-wlg-art{width:min(60vw,240px)}
.vnp-wlg-title{font-size:22px;line-height:1.3;font-weight:800;letter-spacing:-.025em;margin:0;color:rgb(var(--text))}
.vnp-wlg-text{font-size:14px;line-height:1.6;color:rgb(var(--text-muted));margin:8px auto 0;max-width:300px}
.vnp-wlg-login{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;max-width:320px;min-height:54px;margin-top:26px;padding:14px 24px;border-radius:999px;background:rgb(var(--primary-hover));color:#fff;font-size:16px;font-weight:750;letter-spacing:.01em;box-shadow:0 8px 22px rgb(var(--primary)/.32);transition:transform .15s,box-shadow .15s,filter .15s;-webkit-tap-highlight-color:transparent}
.vnp-wlg-login svg{width:20px;height:20px}
.vnp-wlg-login:hover{filter:brightness(1.05);box-shadow:0 10px 26px rgb(var(--primary)/.38)}
.vnp-wlg-login:active{transform:scale(.97)}
.vnp-wlg-login:focus-visible{outline:3px solid rgb(var(--primary)/.45);outline-offset:3px}
[data-mode=dark] .vnp-wlg-glow,[data-mode=amoled] .vnp-wlg-glow{background:radial-gradient(closest-side,rgb(var(--primary)/.30),rgb(var(--primary)/.10) 58%,transparent 100%)}
[data-mode=dark] .vnp-wlg-floor,[data-mode=amoled] .vnp-wlg-floor{background:radial-gradient(closest-side,rgb(0 0 0/.55),transparent)}
[data-mode=dark] .vnp-wlg-img,[data-mode=amoled] .vnp-wlg-img{filter:drop-shadow(0 10px 22px rgb(0 0 0/.45))}
[data-theme=amber] .vnp-wlg-login{background:rgb(var(--primary));color:rgb(28 18 0)}[data-theme=emerald] .vnp-wlg-login{background:rgb(var(--primary));color:rgb(2 26 16)}
[data-mode=dark] .vnp-wlg-login,[data-mode=amoled] .vnp-wlg-login{background:rgb(var(--primary));color:rgb(var(--primary-fg));box-shadow:0 8px 24px rgb(var(--primary)/.22)}
[data-mode=amoled] .vnp-wlg-bar{background:rgb(0 0 0/.86)}
@media(max-width:767px){body.vnp-wlg-page header.hero-wash{display:none}}
@media(max-height:640px) and (max-width:767px){.vnp-wlg-art{width:min(46vw,170px);margin-bottom:14px}.vnp-wlg-title{font-size:20px}.vnp-wlg-login{margin-top:18px;min-height:50px}}
@media(max-width:340px){.vnp-wlg-body{padding-left:18px;padding-right:18px}.vnp-wlg-title{font-size:19px}}
@media(min-width:768px){.vnp-wlg{min-height:calc(100dvh - 220px)}.vnp-wlg-bar{position:static;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.vnp-wlg-bar-in{padding:0 16px}.vnp-wlg-body{padding-top:8px;padding-bottom:56px}.vnp-wlg-art{width:250px}}
@media(prefers-reduced-motion:reduce){.vnp-wlg-img,.vnp-wlg-floor{animation:none}.vnp-wlg-ripple{display:none}}

/* ── 6-box OTP code entry (login screen + login popup) ─────────────────────
   One real <input autocomplete="one-time-code"> sits transparently over six
   boxes, so Android SMS autofill, paste and the existing OTP scripts keep working. */
  .vnp-otp{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:28px;cursor:text}
  .vnp-otp-input{position:absolute;inset:0;z-index:2;width:100%;height:100%;border:0;outline:0;background:transparent;color:transparent;caret-color:transparent;font-size:16px;letter-spacing:2em;-webkit-text-fill-color:transparent}
  .vnp-otp-input::selection{background:transparent}
  .vnp-otp-box{position:relative;display:grid;place-items:center;aspect-ratio:1/1.18;max-height:64px;border-radius:14px;border:1.5px solid rgb(var(--border-strong));background:rgb(var(--surface));font-size:24px;font-weight:800;color:rgb(var(--text));font-variant-numeric:tabular-nums;transition:border-color .15s,box-shadow .15s,background .15s,transform .15s}
  .vnp-otp-box.is-filled{border-color:rgb(var(--primary)/.55);background:rgb(var(--primary)/.06)}
  .vnp-otp-box.is-active{border-color:rgb(var(--primary));box-shadow:0 0 0 4px rgb(var(--primary)/.15)}
  .vnp-otp-box.is-active:empty::after{content:'';width:2px;height:26px;border-radius:2px;background:rgb(var(--primary));animation:vnpCaret 1s steps(1) infinite}
  @keyframes vnpCaret{50%{opacity:0}}
  .vnp-otp.is-complete .vnp-otp-box{border-color:rgb(var(--primary))}
  .vnp-otp.is-error .vnp-otp-box{border-color:rgb(var(--danger));background:rgb(var(--danger-soft));color:rgb(var(--danger))}
  .vnp-otp.is-error{animation:vnpShake .38s ease}
  @keyframes vnpShake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
  .vnp-otp-desk{gap:8px;margin-top:0}.vnp-otp-desk .vnp-otp-box{font-size:22px;border-radius:12px;background:rgb(var(--surface-sunken))}
@media(max-width:359px){.vnp-otp{gap:7px}.vnp-otp-box{font-size:21px;border-radius:12px}}
@media(prefers-reduced-motion:reduce){.vnp-otp.is-error,.vnp-otp-box.is-active:empty::after{animation:none}}

/* product card: short member-strip label, shown only in compact cards (shape blocks) */
.vnp-pc-short{display:none}

/* ── Skeleton loading (customer-ux.js) ─────────────────────────────────────
   Shimmer behind images while they load (only on/near screen), fade-in when
   ready, page skeleton for slow page changes, skeleton cards for "Load more".
   Theme variables → every theme + dark/AMOLED. Low-end/reduced-motion: static. */
@keyframes vnpSkShine{from{background-position:120% 0}to{background-position:-120% 0}}
@keyframes vnpSkIn{from{opacity:0}to{opacity:1}}
.vnp-sk,img.vnp-ld{background-color:rgb(var(--surface-sunken));
  background-image:linear-gradient(100deg,transparent 30%,rgb(var(--border) / .55) 50%,transparent 70%);
  background-size:220% 100%;background-repeat:no-repeat}
.vnp-sk.vnp-sk-on,img.vnp-ld.vnp-sk-on{animation:vnpSkShine 1.3s linear infinite}
img.vnp-in{animation:vnpSkIn .32s ease-out both}
.vnp-sk{display:block;border-radius:10px}
.vnp-sk-line{height:10px;border-radius:6px}
html.vnp-lite .vnp-sk,html.vnp-lite img.vnp-ld{background-image:none;animation:none!important}
@media (prefers-reduced-motion:reduce){.vnp-sk,img.vnp-ld{background-image:none;animation:none!important}img.vnp-in{animation:none}}
/* Page skeleton: covers the page body between the header and the bottom nav. */
.vnp-navsk{position:fixed;left:0;right:0;bottom:0;z-index:44;overflow:hidden;background:rgb(var(--background));
  padding:16px 0 calc(var(--bottomnav-h,64px) + 16px);animation:vnpSkIn .18s ease-out both}
.vnp-navsk .vnp-sk{animation:vnpSkShine 1.3s linear infinite}
.vnp-navsk-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}
@media (min-width:640px){.vnp-navsk-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1024px){.vnp-navsk-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.vnp-skcard{border-radius:14px;overflow:hidden;background:rgb(var(--surface));border:1px solid rgb(var(--border))}
.vnp-skcard>.vnp-sk:first-child{aspect-ratio:1/1;border-radius:0}
.vnp-skcard-b{padding:10px;display:grid;gap:8px}
/* "Load more": skeleton cards appear where the new cards will land. */
.vnp-more-sk{width:100%;margin-bottom:18px}

/* ── Product page (package.php): compact layout + horizontal add-ons ────────
   Phone: photos → title/price → add-ons (swipe) → book → compact details.
   PC: photos + details on the left, booking box on the right (stays in view only when it fits the screen height — .is-stick set by package.php). */
.ux-pp{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);grid-template-areas:"gallery buy" "info buy";column-gap:40px;row-gap:0;align-items:start}
.ux-pp>.ux-product-gallery{grid-area:gallery}
.ux-pp>.ux-product-detail{grid-area:buy;align-self:start;position:relative;top:auto}.ux-pp>.ux-product-detail.is-stick{position:sticky;top:16px}
/* body{overflow-x:hidden} (site-wide) makes <body> a scroll box, which silently disables sticky. 'clip' still blocks sideways scroll but keeps sticky working; product page only. */
@supports (overflow:clip){body:has(.ux-pp){overflow-x:clip;overflow-y:visible}}
.ux-pp>.ux-pp-info{grid-area:info;min-width:0}
@media(max-width:1000px){.ux-pp{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);column-gap:24px}}
@media(max-width:767px){
  .ux-pp{grid-template-columns:minmax(0,1fr);grid-template-areas:"gallery" "buy" "info"}
  .ux-pp>.ux-product-detail{position:static;padding-top:6px}
  .ux-pp .ux-photo-stage{aspect-ratio:1.2;border-radius:18px}
  .ux-pp .ux-gallery-buttons{padding-top:10px}
  .ux-pp .ux-gallery-button{flex-basis:58px;width:58px;height:54px}
  .ux-pp .ux-price{margin-top:12px}
  .ux-pp .ux-city-box{margin:14px 0;padding:11px 13px}
}
.ux-pp-pricenote{line-height:1.55;margin-top:2px}

/* Add-ons: horizontal swipe rail of picture cards */
.ux-ao{margin:18px 0 4px;padding-top:16px;border-top:1px solid rgb(var(--border))}
.ux-ao-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-bottom:10px}
.ux-ao-head h2{font-size:16px;font-weight:750;margin:0;letter-spacing:-.01em}
.ux-ao-head p{margin:2px 0 0;font-size:11.5px;color:rgb(var(--text-muted))}
.ux-ao-nav{display:none;gap:6px}
.ux-ao.has-more .ux-ao-nav{display:flex}
.ux-ao-nav button{width:32px;height:32px;display:grid;place-items:center;border-radius:999px;border:1px solid rgb(var(--border));background:rgb(var(--surface));color:rgb(var(--text));cursor:pointer;transition:opacity .2s,background .2s}
.ux-ao-nav button:hover{background:rgb(var(--surface-sunken))}
.ux-ao-nav svg{width:15px;height:15px}
.ux-ao.at-start [data-ao-step="-1"],.ux-ao.at-end [data-ao-step="1"]{opacity:.35;pointer-events:none}
@media(hover:none){.ux-ao-nav{display:none!important}}
.ux-ao-rail{display:flex;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding:0 2px;padding:3px 2px 8px;margin:0 -2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ux-ao-rail::-webkit-scrollbar{display:none}
.ux-ao-item{position:relative;flex:0 0 clamp(112px,31vw,136px);scroll-snap-align:start;cursor:pointer;-webkit-tap-highlight-color:transparent}
.ux-ao-in{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.ux-ao-card{display:flex;flex-direction:column;height:100%;border:1.5px solid rgb(var(--border));border-radius:14px;background:rgb(var(--surface));overflow:hidden;transition:border-color .18s,box-shadow .18s,transform .18s}
.ux-ao-item:active .ux-ao-card{transform:scale(.97)}
.ux-ao-media{position:relative;display:block;aspect-ratio:1/1;background:rgb(var(--surface-sunken));overflow:hidden}
.ux-ao-media img{display:block;width:100%;height:100%;object-fit:cover}
.ux-ao-ph{position:absolute;inset:0;display:grid;place-items:center;color:rgb(var(--primary));background:linear-gradient(145deg,rgb(var(--primary-soft)),rgb(var(--surface-sunken)))}
.ux-ao-ph svg{width:38%;height:38%;opacity:.85}
html[data-mode=dark] .ux-ao-ph,html[data-mode=amoled] .ux-ao-ph{background:linear-gradient(145deg,rgb(var(--primary) / .22),rgb(var(--surface-sunken)))}
.ux-ao-tick{position:absolute;top:7px;right:7px;width:24px;height:24px;border-radius:999px;display:grid;place-items:center;background:rgb(255 255 255 / .92);border:1.5px solid rgb(15 23 42 / .18);color:transparent;box-shadow:0 1px 4px rgb(15 23 42 / .18);transition:background .18s,color .18s,border-color .18s,transform .18s}
.ux-ao-tick svg{width:14px;height:14px}
.ux-ao-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;padding:8px 9px 2px;font-size:12px;font-weight:600;line-height:1.3;color:rgb(var(--text));min-height:calc(2 * 1.3em + 10px)}
.ux-ao-price{padding:2px 9px 9px;margin-top:auto;font-size:13px;font-weight:800;color:rgb(var(--text))}
.ux-ao-in:checked+.ux-ao-card{border-color:rgb(var(--primary));box-shadow:0 0 0 1.5px rgb(var(--primary)),0 6px 16px rgb(var(--primary) / .16)}
.ux-ao-in:checked+.ux-ao-card .ux-ao-tick{background:rgb(var(--primary));border-color:rgb(var(--primary));color:rgb(var(--primary-fg));transform:scale(1.06)}
.ux-ao-in:checked+.ux-ao-card .ux-ao-price{color:rgb(var(--primary-hover))}
html[data-mode=dark] .ux-ao-in:checked+.ux-ao-card .ux-ao-price,html[data-mode=amoled] .ux-ao-in:checked+.ux-ao-card .ux-ao-price{color:rgb(var(--primary))}
.ux-ao-in:focus-visible+.ux-ao-card{outline:3px solid rgb(var(--primary) / .55);outline-offset:2px}
.ux-ao-sum{display:none;align-items:center;justify-content:space-between;gap:10px;margin-top:4px;padding:9px 12px;border-radius:11px;background:rgb(var(--primary-soft));font-size:12px;color:rgb(var(--text))}
html[data-mode=dark] .ux-ao-sum,html[data-mode=amoled] .ux-ao-sum{background:rgb(var(--primary) / .16)}
.ux-ao-sum.is-on{display:flex}
.ux-ao-sum strong{font-size:14px}
@media(prefers-reduced-motion:reduce){.ux-ao-card,.ux-ao-tick{transition:none}.ux-ao-item:active .ux-ao-card{transform:none}}

/* Compact details */
.ux-pp-info{padding-bottom:6px}
.ux-pp-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:22px}
.ux-pp-fact{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border:1px solid rgb(var(--border));border-radius:13px;background:rgb(var(--surface))}
.ux-pp-fact>svg{flex:0 0 20px;width:20px;height:20px;color:rgb(var(--primary));margin-top:1px}
.ux-pp-fact small{display:block;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:rgb(var(--text-subtle));font-weight:700}
.ux-pp-fact strong{display:block;font-size:12.5px;line-height:1.4;font-weight:600;color:rgb(var(--text));margin-top:2px}
.ux-pp-sec{margin-top:22px;padding-top:18px;border-top:1px solid rgb(var(--border))}
.ux-pp-sec h2{font-size:17px;font-weight:750;margin:0 0 10px;display:flex;align-items:center;gap:8px}
.ux-pp-count{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;background:rgb(var(--surface-sunken));color:rgb(var(--text-muted))}
.ux-pp-desc p{font-size:13.5px;line-height:1.65;color:rgb(var(--text-muted));margin:0}
.ux-pp-desc.is-clamped p{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.ux-pp-more{display:none;margin-top:8px;padding:4px 0;border:0;background:none;color:rgb(var(--primary));font-size:12.5px;font-weight:700;cursor:pointer}
.ux-pp-more.is-on{display:inline-block}
html:not([data-mode=dark]):not([data-mode=amoled]) .ux-pp-more{color:rgb(var(--primary-hover))}
.ux-pp-inc.is-short .is-extra{display:none}
.ux-pp-acc{border:1px solid rgb(var(--border));border-radius:14px;overflow:hidden;background:rgb(var(--surface))}
.ux-pp-d+.ux-pp-d{border-top:1px solid rgb(var(--border))}
.ux-pp-d summary{display:flex;align-items:center;gap:10px;padding:13px 14px;cursor:pointer;list-style:none;font-size:13.5px;font-weight:650;color:rgb(var(--text));-webkit-tap-highlight-color:transparent}
.ux-pp-d summary::-webkit-details-marker{display:none}
.ux-pp-d summary>svg:first-child{flex:0 0 19px;width:19px;height:19px;color:rgb(var(--primary))}
.ux-pp-d summary>span{flex:1}
.ux-pp-chev{width:17px;height:17px;color:rgb(var(--text-subtle));transition:transform .2s}
.ux-pp-d[open] .ux-pp-chev{transform:rotate(180deg)}
.ux-pp-d summary:focus-visible{outline:3px solid rgb(var(--primary) / .5);outline-offset:-3px}
.ux-pp-dbody{padding:0 14px 14px 43px;font-size:13px;line-height:1.6;color:rgb(var(--text-muted))}
.ux-pp-reviews{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:thin}
.ux-pp-reviews .ux-review{flex:0 0 min(270px,82%);scroll-snap-align:start;padding:13px 14px;border:1px solid rgb(var(--border));border-radius:14px;background:rgb(var(--surface))}
.ux-pp-reviews .ux-review p{font-size:12.5px;margin:6px 0 0}
@media(max-width:767px){
  .ux-pp-facts{grid-template-columns:1fr;gap:0;margin-top:18px;border:1px solid rgb(var(--border));border-radius:14px;overflow:hidden;background:rgb(var(--surface))}
  .ux-pp-fact{border:0;border-radius:0;padding:10px 13px;background:none}
  .ux-pp-fact+.ux-pp-fact{border-top:1px solid rgb(var(--border))}
  .ux-pp-sec{margin-top:18px;padding-top:15px}
  .ux-pp .ux-included{grid-template-columns:1fr}
}