/* source: public/css/ampol-v7.css */
/* ========================================================================
   AMPOLSHOP V7 — Smoked Emerald UI / clear controls / stronger product art
   ======================================================================== */
:root {
    --ampol-canvas: #c8d1cc;
    --ampol-canvas-deep: #aebbb4;
    --ampol-surface: #f1f4f2;
    --ampol-surface-soft: #e7ece9;
    --ampol-surface-mint: #dce6e0;
    --ampol-line: rgba(6, 95, 70, .17);
}
body {
    background:
        radial-gradient(circle at 7% 8%, rgba(16,185,129,.18), transparent 32rem),
        radial-gradient(circle at 92% 70%, rgba(5,46,31,.17), transparent 35rem),
        linear-gradient(145deg, #d7ded9 0%, #bac6bf 48%, #dce3df 100%) !important;
}
.site-canvas,
.ambient-page,
.dashboard-shell,
.product-service-page {
    background:
        radial-gradient(circle at 15% 10%, rgba(16,185,129,.12), transparent 28rem),
        linear-gradient(150deg, rgba(214,224,218,.94), rgba(177,191,183,.93)) !important;
}
.premium-panel,
.glass-panel,
.metric-card,
[data-group],
.admin-order-row,
.ticket-row,
.account-recent a,
.account-support a {
    background: linear-gradient(150deg, rgba(248,250,249,.98), rgba(225,232,228,.97)) !important;
    border-color: rgba(6,95,70,.17) !important;
    box-shadow: 0 22px 65px rgba(20,38,29,.16) !important;
}
.premium-panel:nth-child(even),
.account-activity,
.account-support,
.admin-table tbody tr:nth-child(odd) {
    background-color: rgba(226,233,229,.96) !important;
}

/* One reusable, unmistakable checkbox for the whole administration. */
.ampol-check-option {
    position: relative;
    display: flex;
    min-height: 3.6rem;
    width: 100%;
    cursor: pointer;
    align-items: center;
    gap: .75rem;
    overflow: hidden;
    border: 1px solid rgba(148,163,184,.22);
    border-radius: 1rem;
    padding: .72rem .78rem;
    background: rgba(15,23,20,.72);
    color: #cbd5e1;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.ampol-check-option:hover { border-color: rgba(52,211,153,.46); background: rgba(24,39,32,.92); transform: translateY(-1px); }
.ampol-check-option:focus-within { outline: 3px solid rgba(16,185,129,.18); border-color: rgb(52 211 153); }
.ampol-check-input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.ampol-check-box {
    display: grid; width: 1.55rem; height: 1.55rem; flex: 0 0 auto; place-items: center;
    border: 2px solid rgba(148,163,184,.55); border-radius: .48rem; background: #111916; color: transparent;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.025); transition: .2s ease;
}
.ampol-check-box svg { width: 1rem; height: 1rem; }
.ampol-check-copy { min-width: 0; flex: 1; }
.ampol-check-copy b { display: block; font-size: .78rem; font-weight: 900; color: #e2e8f0; }
.ampol-check-copy small { display: block; margin-top: .16rem; font-size: .6rem; line-height: 1.55; color: #94a3b8; }
.ampol-check-state { flex: 0 0 auto; border-radius: 999px; padding: .28rem .52rem; background: rgba(148,163,184,.10); font-size: .56rem; font-weight: 900; color: #94a3b8; }
.ampol-check-state i { font-style: normal; }
.ampol-check-state .is-on { display: none; }
.ampol-check-input:checked ~ .ampol-check-box { border-color: #34d399; background: linear-gradient(145deg,#059669,#34d399); color: #fff; box-shadow: 0 0 0 4px rgba(16,185,129,.13), 0 8px 22px rgba(16,185,129,.24); }
.ampol-check-input:checked ~ .ampol-check-copy b { color: #ecfdf5; }
.ampol-check-input:checked ~ .ampol-check-state { background: rgba(16,185,129,.17); color: #6ee7b7; }
.ampol-check-input:checked ~ .ampol-check-state .is-on { display: inline; }
.ampol-check-input:checked ~ .ampol-check-state .is-off { display: none; }
.ampol-check-option:has(.ampol-check-input:checked) { border-color: rgba(52,211,153,.55); background: linear-gradient(145deg,rgba(5,150,105,.18),rgba(22,36,30,.96)); }
.ampol-check-option:has(.ampol-check-input:disabled) { cursor: not-allowed; opacity: .48; transform: none; }
.ampol-check-option.is-compact { min-height: 2.9rem; padding: .55rem .62rem; border-radius: .8rem; }
.ampol-check-option.is-compact .ampol-check-box { width: 1.28rem; height: 1.28rem; }
.ampol-check-option.is-compact .ampol-check-state { display: none; }
.ampol-check-option.is-compact .ampol-check-copy b { font-size: .68rem; }

/* Product variants imported from WooCommerce remain children of their parent. */
.product-variant-picker { border: 1px solid rgba(52,211,153,.16); border-radius: 1.25rem; padding: .9rem; background: rgba(16,185,129,.045); }
.product-variant-option { display:flex; align-items:center; justify-content:space-between; gap:.65rem; width:100%; border:1px solid rgba(255,255,255,.09); border-radius:1rem; padding:.72rem .78rem; background:rgba(0,0,0,.18); text-align:right; transition:.2s ease; }
.product-variant-option:hover { border-color:rgba(52,211,153,.38); transform:translateY(-1px); }
.product-variant-option.is-active { border-color:#34d399; background:linear-gradient(145deg,rgba(5,150,105,.24),rgba(6,78,59,.28)); box-shadow:0 0 0 3px rgba(16,185,129,.10); }
.product-variant-option span { min-width:0; }
.product-variant-option b { display:block; font-size:.72rem; font-weight:900; color:#f8fafc; }
.product-variant-option small { display:block; margin-top:.18rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.55rem; color:#94a3b8; }
.product-variant-option strong { flex:0 0 auto; font-size:.68rem; color:#6ee7b7; }

/* Product art: use the real artwork, not a washed-out luminosity layer. */
.store-product-card { background: linear-gradient(155deg,#17211d,#0e1512) !important; border-color: rgba(110,231,183,.16) !important; box-shadow:0 20px 55px rgba(12,32,23,.22) !important; }
.store-product-card__visual { isolation:isolate; overflow:hidden; background:linear-gradient(145deg,#24342c,#14201a) !important; }
.store-product-card__image-wrap { position:absolute; inset:0; z-index:2; overflow:hidden; }
.store-product-card__image { width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(1.06) contrast(1.03); transform:scale(1.015); transition:transform .75s cubic-bezier(.2,.8,.2,1),filter .45s ease; }
.store-product-card:hover .store-product-card__image { transform:scale(1.09); filter:saturate(1.13) contrast(1.06) brightness(1.04); }
.store-product-card__image-wrap::after { content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(8,16,12,.92) 0%,rgba(8,16,12,.18) 48%,rgba(8,16,12,.07) 100%); }
.store-product-card__visual-bottom { background:linear-gradient(to top,#111a16 2%,rgba(17,26,22,.15),transparent) !important; }
.store-product-card__category { background:rgba(8,18,13,.72) !important; border-color:rgba(255,255,255,.14) !important; color:#e2e8f0 !important; }
.store-product-card__commercial-badge { background:rgba(8,18,13,.74) !important; color:#6ee7b7 !important; }
.store-product-card__instant { background:rgba(6,30,20,.80) !important; color:#6ee7b7 !important; }
.store-product-card__arrow { background:rgba(255,255,255,.055) !important; border-color:rgba(255,255,255,.10) !important; color:#a7f3d0 !important; }
.product-service-artwork img { opacity:.94 !important; mix-blend-mode:normal !important; filter:saturate(1.06) contrast(1.04); }

@media (max-width: 640px) {
    .ampol-check-option { min-height:3.15rem; padding:.6rem; }
    .ampol-check-state { font-size:.5rem; }
    .product-variant-option { padding:.64rem; }
}

/* Keep legacy dark-text and light-text utility mixes readable on V7 smoked panels. */
.premium-panel .text-white,
.glass-panel .text-white,
.metric-card .text-white,
[data-group] .text-white,
.admin-order-row .text-white,
.ticket-row .text-white {
    color: #10231a !important;
}
.premium-panel .text-zinc-300,
.glass-panel .text-zinc-300,
.metric-card .text-zinc-300,
[data-group] .text-zinc-300 {
    color: #334c40 !important;
}
.premium-panel .text-zinc-500,
.glass-panel .text-zinc-500,
.metric-card .text-zinc-500,
[data-group] .text-zinc-500 {
    color: #64776d !important;
}
.premium-panel .border-white\/\[\.07\],
.premium-panel .border-white\/\[\.06\],
.glass-panel .border-white\/10 {
    border-color: rgba(6,95,70,.14) !important;
}

.product-variant-picker__head{display:flex;align-items:flex-end;justify-content:space-between;gap:.65rem}.product-variant-picker__head span{display:block;font-size:.58rem;font-weight:900;color:#6ee7b7}.product-variant-picker__head b{display:block;margin-top:.18rem;font-size:.8rem;color:#fff}.product-variant-picker__head small{font-size:.55rem;color:#94a3b8}.product-variant-picker__grid{display:grid;gap:.55rem;margin-top:.75rem}.product-variant-option input{width:1rem;height:1rem;accent-color:#10b981}.product-variant-option strong i{font-size:.52rem;font-style:normal}.sep-payment-option{border:1px solid rgba(5,150,105,.35);background:linear-gradient(135deg,#e7f1ec,#d8e6df);color:#10231a}.sep-payment-option b{color:#10231a}.sep-payment-option small{color:#526a5f}

/* source: public/css/ampol-v8.css */
/* ========================================================================
   AMPOLSHOP V8 — Obsidian Emerald / compact mobile commerce / orbital loader
   This stylesheet intentionally loads after app.css and ampol-v7.css.
   ======================================================================== */
:root {
    --ampol-v8-bg: #090e0c;
    --ampol-v8-bg-2: #0e1713;
    --ampol-v8-panel: #121d18;
    --ampol-v8-panel-2: #17241e;
    --ampol-v8-panel-soft: rgba(24, 38, 31, .88);
    --ampol-v8-line: rgba(167, 243, 208, .12);
    --ampol-v8-line-strong: rgba(52, 211, 153, .26);
    --ampol-v8-text: #ecfdf5;
    --ampol-v8-muted: #91a69b;
    --ampol-v8-green: #18d879;
    --ampol-v8-green-2: #059669;
    --ampol-v8-danger: #fb7185;
}

html { color-scheme: dark; background: var(--ampol-v8-bg); }
body {
    min-height: 100vh;
    color: var(--ampol-v8-text);
    background:
        radial-gradient(circle at 8% 6%, rgba(24,216,121,.17), transparent 32rem),
        radial-gradient(circle at 93% 72%, rgba(5,85,57,.18), transparent 38rem),
        linear-gradient(145deg, #080d0b 0%, #101914 52%, #090e0c 100%) !important;
}
body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: .035;
    background-image: linear-gradient(rgba(255,255,255,.6) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.6) 1px,transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(to bottom, black, transparent 80%);
}

.site-canvas,
.ambient-page,
.dashboard-shell,
.product-service-page,
.ampol-orders-page,
main[style*="background"] {
    background:
        radial-gradient(circle at 12% 8%, rgba(24,216,121,.12), transparent 27rem),
        radial-gradient(circle at 88% 68%, rgba(5,85,57,.13), transparent 36rem),
        linear-gradient(150deg, rgba(8,14,11,.99), rgba(17,27,22,.98)) !important;
}

/* Shared surfaces */
.admin-surface,
.premium-panel,
.glass-panel,
.metric-card,
[data-group],
.admin-order-row,
.ticket-row,
.account-recent,
.account-activity,
.account-support,
.product-order-card,
.store-filter-panel {
    border: 1px solid var(--ampol-v8-line) !important;
    background:
        linear-gradient(145deg, rgba(255,255,255,.035), transparent 48%),
        linear-gradient(155deg, rgba(20,33,27,.98), rgba(12,20,16,.98)) !important;
    box-shadow: 0 22px 70px rgba(0,0,0,.27) !important;
}

.premium-panel:nth-child(even),
.account-activity,
.account-support,
.admin-table tbody tr:nth-child(odd) {
    background-color: transparent !important;
}

.premium-panel .text-white,
.glass-panel .text-white,
.metric-card .text-white,
[data-group] .text-white,
.admin-order-row .text-white,
.ticket-row .text-white,
.admin-surface .text-white { color: #f0fdf4 !important; }
.premium-panel .text-zinc-300,
.glass-panel .text-zinc-300,
.metric-card .text-zinc-300,
[data-group] .text-zinc-300,
.admin-surface .text-zinc-300 { color: #cbd5e1 !important; }
.premium-panel .text-zinc-500,
.glass-panel .text-zinc-500,
.metric-card .text-zinc-500,
[data-group] .text-zinc-500,
.admin-surface .text-zinc-500 { color: #8fa399 !important; }

.bg-white,
.bg-white\/95,
.bg-white\/90,
.bg-\[\#f7fcf9\],
.bg-\[\#effaf4\] { background-color: var(--ampol-v8-panel) !important; }
.text-slate-900 { color: #f0fdf4 !important; }
.text-slate-700, .text-slate-600 { color: #b6c8bf !important; }
.text-slate-500 { color: #82968c !important; }
.border-emerald-900\/10, .border-slate-200, .border-slate-100 { border-color: var(--ampol-v8-line) !important; }

.field,
.select-field,
.textarea-field,
.product-order-field,
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
    border-color: rgba(148,163,184,.17) !important;
    background-color: rgba(4,10,7,.48) !important;
    color: #ecfdf5 !important;
}
.field::placeholder,
.textarea-field::placeholder,
input::placeholder,
textarea::placeholder { color: #64766d !important; }
.field:focus,
.select-field:focus,
.textarea-field:focus,
.product-order-field:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: rgba(52,211,153,.58) !important;
    box-shadow: 0 0 0 4px rgba(16,185,129,.10) !important;
}
option { background: #101914; color: #ecfdf5; }
.field-label { color: #a9bbb2 !important; }

/* Clear checkbox state across admin and storefront. */
.ampol-check-option {
    background: rgba(7,13,10,.62) !important;
    border-color: rgba(148,163,184,.2) !important;
}
.ampol-check-option:has(.ampol-check-input:checked) {
    background: linear-gradient(145deg,rgba(5,150,105,.24),rgba(13,30,22,.96)) !important;
    border-color: rgba(52,211,153,.62) !important;
    box-shadow: 0 0 0 3px rgba(16,185,129,.08), 0 14px 34px rgba(0,0,0,.18);
}

/* ======================================================================
   Compact product cards — mobile-first
   ====================================================================== */
.store-product-card {
    border-radius: 1.15rem !important;
    background: linear-gradient(155deg,#151f1a,#0c1310) !important;
    box-shadow: 0 14px 38px rgba(0,0,0,.28) !important;
}
.store-product-card__visual { aspect-ratio: 1.32 / 1 !important; }
.store-product-card > div { padding: .85rem !important; }
.store-product-card > div > div:first-child { font-size: .55rem !important; }
.store-product-card > div > a { margin-top: .55rem !important; min-height: 2.65rem !important; font-size: .76rem !important; line-height: 1.35rem !important; }
.store-product-card > div > div:last-child { padding-top: .65rem !important; }
.store-product-card__arrow { width: 2.15rem !important; height: 2.15rem !important; border-radius: .7rem !important; }
.store-product-card .text-xl { font-size: .9rem !important; line-height: 1.15 !important; }
.store-product-card .text-xs { font-size: .52rem !important; }
.store-product-card__category,
.store-product-card__discount,
.store-product-card__commercial-badge,
.store-product-card__instant { padding: .28rem .42rem !important; font-size: .45rem !important; }
.store-product-card__image { object-fit: cover; }

/* Dark mobile filter sheet. */
.store-mobile-choice span { background: rgba(255,255,255,.025); }
.store-filter-switch { background: rgba(255,255,255,.025) !important; }

/* ======================================================================
   Orders — compact app-like cards
   ====================================================================== */
.ampol-orders-page { position: relative; }
.ampol-orders-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.2rem 0 1rem;
}
.ampol-orders-head .eyebrow { font-size: .62rem; font-weight: 900; letter-spacing: .25em; color: #34d399; }
.ampol-orders-head h1 { margin-top: .3rem; font-size: clamp(1.55rem,5vw,2.4rem); font-weight: 900; color: #f0fdf4; }
.ampol-orders-head p:last-child { margin-top: .4rem; max-width: 38rem; font-size: .76rem; line-height: 1.7; color: #8fa399; }
.ampol-orders-shop-button { flex: 0 0 auto; }

.ampol-order-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .65rem; margin: .75rem 0 1rem; }
.ampol-order-metrics article {
    min-width: 0;
    border: 1px solid var(--ampol-v8-line);
    border-radius: 1rem;
    padding: .8rem;
    background: linear-gradient(145deg,rgba(255,255,255,.035),rgba(12,21,17,.86));
}
.ampol-order-metrics small { display: block; overflow: hidden; font-size: .53rem; font-weight: 800; white-space: nowrap; text-overflow: ellipsis; color: #81958a; }
.ampol-order-metrics b { display: block; margin-top: .25rem; font-size: 1.1rem; color: #ecfdf5; }

.ampol-mobile-orders { display: grid; gap: .58rem; }
.ampol-mobile-order-card {
    display: block;
    border: 1px solid var(--ampol-v8-line);
    border-radius: 1rem;
    padding: .78rem;
    background: linear-gradient(145deg,rgba(255,255,255,.035),rgba(11,19,15,.94));
    box-shadow: 0 12px 32px rgba(0,0,0,.18);
    transition: transform .2s ease,border-color .2s ease;
}
.ampol-mobile-order-card:active { transform: scale(.985); }
.ampol-mobile-order-card:hover { border-color: var(--ampol-v8-line-strong); }
.ampol-mobile-order-card__top,
.ampol-mobile-order-card__foot { display: flex; align-items: center; justify-content: space-between; gap: .65rem; }
.ampol-mobile-order-card__top small,
.ampol-mobile-order-card__amount small { display: block; font-size: .48rem; font-weight: 800; color: #71847a; }
.ampol-mobile-order-card__top b { display: block; margin-top: .1rem; direction: ltr; text-align: right; font-size: .82rem; color: #f0fdf4; }
.ampol-mobile-order-card__main { display: flex; align-items: end; justify-content: space-between; gap: .7rem; margin: .65rem 0; border-block: 1px solid rgba(255,255,255,.065); padding-block: .62rem; }
.ampol-mobile-order-card__amount b { display: block; margin-top: .12rem; font-size: .9rem; color: #a7f3d0; }
.ampol-mobile-order-card__amount i { font-size: .48rem; font-style: normal; color: #6f8378; }
.ampol-mobile-order-card__meta { display: flex; flex-direction: column; align-items: end; gap: .18rem; font-size: .5rem; color: #71847a; }
.ampol-order-view { display: inline-flex; align-items: center; gap: .2rem; font-size: .58rem; font-weight: 900; color: #6ee7b7; }
.ampol-order-view svg { width: .8rem; height: .8rem; transform: rotate(180deg); }
.ampol-status-chip { display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 999px; padding: .3rem .5rem; font-size: .5rem; font-weight: 900; white-space: nowrap; }
.ampol-status-chip.is-success { border-color: rgba(52,211,153,.22); background: rgba(16,185,129,.10); color: #6ee7b7; }
.ampol-status-chip.is-info { border-color: rgba(96,165,250,.22); background: rgba(59,130,246,.10); color: #93c5fd; }
.ampol-status-chip.is-warning { border-color: rgba(251,191,36,.22); background: rgba(245,158,11,.10); color: #fcd34d; }
.ampol-status-chip.is-danger { border-color: rgba(251,113,133,.22); background: rgba(244,63,94,.10); color: #fda4af; }
.ampol-status-chip.is-purple { border-color: rgba(192,132,252,.22); background: rgba(168,85,247,.10); color: #d8b4fe; }
.ampol-status-chip.is-muted { border-color: rgba(148,163,184,.14); background: rgba(148,163,184,.07); color: #94a3b8; }
.ampol-orders-table-wrap { overflow: hidden; border: 1px solid var(--ampol-v8-line); border-radius: 1.35rem; background: rgba(12,20,16,.9); }
.ampol-orders-table { width: 100%; border-collapse: collapse; }
.ampol-orders-table th { padding: .85rem 1rem; text-align: right; font-size: .57rem; font-weight: 900; color: #72867b; background: rgba(255,255,255,.025); }
.ampol-orders-table td { border-top: 1px solid rgba(255,255,255,.055); padding: .9rem 1rem; font-size: .68rem; color: #adbbb4; }
.ampol-orders-table td b { color: #ecfdf5; }
.ampol-order-row-link { font-weight: 900; color: #6ee7b7; }
.ampol-orders-empty { border: 1px dashed rgba(52,211,153,.22); border-radius: 1.5rem; padding: 3rem 1rem; text-align: center; background: rgba(13,23,18,.8); }
.ampol-orders-empty__icon { display: grid; width: 3.5rem; height: 3.5rem; margin: 0 auto; place-items: center; border-radius: 1rem; background: rgba(16,185,129,.1); font-size: 1.4rem; color: #6ee7b7; }
.ampol-orders-empty h2 { margin-top: 1rem; font-size: 1rem; font-weight: 900; }
.ampol-orders-empty p { margin: .5rem auto 0; max-width: 24rem; font-size: .7rem; line-height: 1.7; color: #82968c; }

/* KYC appears only after a qualifying paid order. */
.ampol-kyc-required {
    border-color: rgba(251,191,36,.26) !important;
    background: linear-gradient(145deg,rgba(245,158,11,.11),rgba(18,28,23,.98)) !important;
}

/* Coupon administration and checkout. */
.admin-table { width: 100%; border-collapse: collapse; }
.admin-table th { padding: .75rem 1rem; text-align: right; font-size: .58rem; color: #82968c; }
.admin-table td { border-top: 1px solid rgba(255,255,255,.06); padding: .8rem 1rem; font-size: .68rem; color: #aebfb6; }
.admin-table td small { display: block; margin-top: .15rem; color: #6f8378; }

/* ======================================================================
   Orbital AMPOL loader
   ====================================================================== */
#ampol-page-loader {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: grid;
    place-items: center;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 46%, rgba(24,216,121,.18), transparent 15rem),
        rgba(5,10,8,.90) !important;
    backdrop-filter: blur(18px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .22s ease, visibility .22s ease;
}
#ampol-page-loader.is-visible { opacity: 1; visibility: visible; }
.ampol-v8-loader {
    position: relative;
    width: min(82vw, 19rem);
    aspect-ratio: 1;
    display: grid;
    place-items: center;
}
.ampol-v8-loader::before {
    content: '';
    position: absolute;
    inset: 8%;
    border: 1px solid rgba(110,231,183,.12);
    border-radius: 50%;
    box-shadow: inset 0 0 60px rgba(16,185,129,.045), 0 0 70px rgba(16,185,129,.08);
}
.ampol-v8-loader__ring {
    position: absolute;
    inset: 4%;
    border: 1px dashed rgba(110,231,183,.19);
    border-radius: 50%;
    animation: ampolV8Orbit 7.5s linear infinite;
}
.ampol-v8-loader__ring.is-inner { inset: 21%; border-style: solid; border-color: rgba(255,255,255,.08); animation-duration: 5s; animation-direction: reverse; }
.ampol-v8-loader__token {
    position: absolute;
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    border: 1px solid rgba(110,231,183,.22);
    border-radius: .85rem;
    background: linear-gradient(145deg,rgba(30,51,40,.98),rgba(8,16,12,.98));
    box-shadow: 0 10px 30px rgba(0,0,0,.35), 0 0 25px rgba(24,216,121,.09);
    font-size: .62rem;
    font-weight: 900;
    color: #a7f3d0;
    animation: ampolV8CounterOrbit 7.5s linear infinite;
}
.ampol-v8-loader__token.is-gem { top: -1.2rem; left: calc(50% - 1.25rem); font-size: 1.05rem; }
.ampol-v8-loader__token.is-cp { top: calc(50% - 1.25rem); right: -1.2rem; }
.ampol-v8-loader__token.is-uc { bottom: -1.2rem; left: calc(50% - 1.25rem); }
.ampol-v8-loader__token.is-star { top: calc(50% - 1.25rem); left: -1.2rem; font-size: 1rem; }
.ampol-v8-loader__inner-token { position: absolute; width: 2rem; height: 2rem; display:grid; place-items:center; border-radius:999px; background:rgba(16,185,129,.13); color:#6ee7b7; font-size:.8rem; box-shadow:0 0 25px rgba(24,216,121,.12); }
.ampol-v8-loader__inner-token.is-one { top: 7%; left: 50%; transform: translateX(-50%); }
.ampol-v8-loader__inner-token.is-two { bottom: 7%; left: 50%; transform: translateX(-50%); }
.ampol-v8-loader__core {
    position: relative;
    z-index: 3;
    width: 8.7rem;
    border: 1px solid rgba(110,231,183,.2);
    border-radius: 1.7rem;
    padding: 1.05rem .8rem;
    text-align: center;
    background: linear-gradient(155deg,rgba(27,45,36,.97),rgba(7,14,10,.98));
    box-shadow: 0 25px 80px rgba(0,0,0,.42), 0 0 45px rgba(24,216,121,.12), inset 0 1px 0 rgba(255,255,255,.07);
}
.ampol-v8-loader__mark { display:grid; width:2.25rem; height:2.25rem; margin:0 auto .55rem; place-items:center; border-radius:.75rem; background:linear-gradient(145deg,#18d879,#047857); box-shadow:0 0 28px rgba(24,216,121,.35); color:white; font-size:.85rem; font-weight:900; transform:rotate(-8deg); }
.ampol-v8-loader__core b { display:block; direction:ltr; font-family:Figtree,sans-serif; font-size:.82rem; font-weight:900; letter-spacing:.11em; color:#ecfdf5; }
.ampol-v8-loader__core small { display:block; margin-top:.45rem; font-size:.64rem; font-weight:800; color:#8fa399; }
.ampol-v8-loader__dots { display:flex; justify-content:center; gap:.25rem; margin-top:.55rem; }
.ampol-v8-loader__dots i { width:.28rem; height:.28rem; border-radius:999px; background:#34d399; animation:ampolV8Dot 1s ease-in-out infinite; }
.ampol-v8-loader__dots i:nth-child(2){animation-delay:.15s}.ampol-v8-loader__dots i:nth-child(3){animation-delay:.3s}
@keyframes ampolV8Orbit { to { transform: rotate(360deg); } }
@keyframes ampolV8CounterOrbit { to { transform: rotate(-360deg); } }
@keyframes ampolV8Dot { 50% { transform: translateY(-.2rem); opacity:.45; } }

@media (max-width: 640px) {
    .page-shell { padding-left: .7rem !important; padding-right: .7rem !important; }
    .ampol-orders-head { align-items: center; padding-top: .65rem; }
    .ampol-orders-head p:last-child { display: none; }
    .ampol-orders-shop-button { min-height: 2.35rem !important; padding-inline: .75rem !important; font-size: .62rem !important; }
    .ampol-order-metrics { gap: .45rem; }
    .ampol-order-metrics article { border-radius: .85rem; padding: .65rem; }

    .store-product-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: .55rem !important; }
    .store-product-card { border-radius: .9rem !important; }
    .store-product-card__visual { aspect-ratio: 1.12 / 1 !important; }
    .store-product-card > div { padding: .58rem !important; }
    .store-product-card > div > div:first-child { display: none !important; }
    .store-product-card > div > a { margin-top: 0 !important; min-height: 2.35rem !important; font-size: .66rem !important; line-height: 1.15rem !important; }
    .store-product-card > div > div:last-child { gap: .3rem !important; padding-top: .48rem !important; }
    .store-product-card .text-xl { font-size: .72rem !important; }
    .store-product-card .text-xs { font-size: .42rem !important; }
    .store-product-card__arrow { width: 1.75rem !important; height: 1.75rem !important; border-radius: .55rem !important; }
    .store-product-card__arrow svg { width: .72rem !important; height: .72rem !important; }
    .store-product-card__category { max-width: 70% !important; }
    .store-product-card .absolute.inset-x-3 { inset-inline: .42rem !important; top: .42rem !important; }

    .dashboard-grid { gap: .75rem !important; }
    .dashboard-grid .metric-card { min-height: auto !important; padding: .75rem !important; border-radius: 1rem !important; }
    .account-recent a { padding: .72rem !important; border-radius: .9rem !important; }

    .ampol-v8-loader { width: min(87vw,17rem); }
    .ampol-v8-loader__token { width:2.15rem;height:2.15rem;border-radius:.72rem;font-size:.54rem; }
    .ampol-v8-loader__token.is-gem { left:calc(50% - 1.075rem); }
    .ampol-v8-loader__token.is-uc { left:calc(50% - 1.075rem); }
    .ampol-v8-loader__core { width:7.8rem; border-radius:1.45rem; }
}

@media (max-width: 355px) {
    .store-product-grid { grid-template-columns: minmax(0,1fr) !important; }
    .store-product-card__visual { aspect-ratio: 1.55 / 1 !important; }
}

@media (min-width: 641px) and (max-width: 1023px) {
    .store-product-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}

@media (prefers-reduced-motion: reduce) {
    .ampol-v8-loader__ring,
    .ampol-v8-loader__token,
    .ampol-v8-loader__dots i { animation: none !important; }
    .ampol-v8-loader__ring { border-style: solid; }
}
.ampol-kyc-required-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    border: 1px solid rgba(251,191,36,.28);
    border-radius: 1.35rem;
    padding: 1rem;
    background: linear-gradient(145deg,rgba(245,158,11,.12),rgba(18,28,23,.98));
    box-shadow: 0 20px 55px rgba(0,0,0,.2);
}
.ampol-kyc-required-card__icon {
    display: grid;
    width: 2.8rem;
    height: 2.8rem;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid rgba(251,191,36,.3);
    border-radius: .9rem;
    background: rgba(245,158,11,.12);
    font-size: 1.1rem;
    font-weight: 900;
    color: #fcd34d;
}
@media (max-width:640px){
    .ampol-kyc-required-card { align-items:flex-start; flex-wrap:wrap; padding:.85rem; border-radius:1rem; }
    .ampol-kyc-required-card > a { width:100%; }
}


/* ======================================================================
   V8.0.1 — explicit checkbox state hotfix
   Kept in the standalone CSS so shared-host deployments do not require Vite.
   ====================================================================== */
.ampol-check-option {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: .8rem !important;
    min-height: 4.35rem !important;
    padding: .85rem 1rem !important;
    border: 1px solid rgba(148,163,184,.28) !important;
    border-radius: 1rem !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease !important;
}
.ampol-check-option:hover {
    border-color: rgba(52,211,153,.45) !important;
    transform: translateY(-1px);
}
.ampol-check-input {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
.ampol-check-box {
    display: inline-flex !important;
    width: 1.55rem !important;
    height: 1.55rem !important;
    flex: 0 0 1.55rem !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid rgba(203,213,225,.52) !important;
    border-radius: .48rem !important;
    background: rgba(255,255,255,.06) !important;
    color: transparent !important;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,.16) !important;
    transition: .18s ease !important;
}
.ampol-check-box svg { width: 1rem !important; height: 1rem !important; }
.ampol-check-copy { min-width: 0 !important; flex: 1 1 auto !important; }
.ampol-check-copy b { display: block !important; color: #e5eee9 !important; font-size: .76rem !important; line-height: 1.55 !important; }
.ampol-check-copy small { display: block !important; margin-top: .22rem !important; color: #8fa399 !important; font-size: .62rem !important; line-height: 1.65 !important; }
.ampol-check-state {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    border-radius: 999px !important;
    padding: .32rem .58rem !important;
    background: rgba(148,163,184,.13) !important;
    color: #b3c0b9 !important;
    font-size: .56rem !important;
    font-weight: 900 !important;
}
.ampol-check-state i { font-style: normal !important; }
.ampol-check-state .is-on { display: none !important; }
.ampol-check-input:focus-visible ~ .ampol-check-box {
    outline: 3px solid rgba(52,211,153,.28) !important;
    outline-offset: 3px !important;
}
.ampol-check-input:checked ~ .ampol-check-box {
    border-color: #34d399 !important;
    background: linear-gradient(145deg,#059669,#34d399) !important;
    color: #fff !important;
    box-shadow: 0 0 0 4px rgba(16,185,129,.14), 0 9px 24px rgba(16,185,129,.28) !important;
}
.ampol-check-input:checked ~ .ampol-check-copy b { color: #f0fdf4 !important; }
.ampol-check-input:checked ~ .ampol-check-state {
    background: rgba(16,185,129,.22) !important;
    color: #86efac !important;
    border: 1px solid rgba(52,211,153,.32) !important;
}
.ampol-check-input:checked ~ .ampol-check-state .is-on { display: inline !important; }
.ampol-check-input:checked ~ .ampol-check-state .is-off { display: none !important; }
.ampol-check-option:has(.ampol-check-input:checked) {
    background: linear-gradient(145deg,rgba(5,150,105,.28),rgba(10,27,19,.98)) !important;
    border-color: rgba(52,211,153,.78) !important;
    box-shadow: 0 0 0 3px rgba(16,185,129,.09), 0 16px 38px rgba(0,0,0,.24) !important;
}
.ampol-check-option.is-compact { min-height: 3rem !important; padding: .6rem .7rem !important; }
.ampol-check-option.is-compact .ampol-check-box { width: 1.35rem !important; height: 1.35rem !important; flex-basis: 1.35rem !important; }
.ampol-check-option.is-compact .ampol-check-state { display: none !important; }
@media (max-width: 640px) {
    .ampol-check-option { min-height: 3.7rem !important; padding: .72rem .78rem !important; gap: .65rem !important; }
    .ampol-check-copy b { font-size: .7rem !important; }
    .ampol-check-state { font-size: .5rem !important; }
}

/* ========================================================================
   AMPOLSHOP V8.1 — Global UI legibility and contrast system
   Applies one consistent rule across storefront, checkout, account and admin:
   light surfaces use dark text; dark surfaces use light text.
   ======================================================================== */
:root {
    --ampol-ui-dark-0: #07100c;
    --ampol-ui-dark-1: #0b1711;
    --ampol-ui-dark-2: #12231a;
    --ampol-ui-dark-3: #183025;
    --ampol-ui-light-0: #f7fbf9;
    --ampol-ui-light-1: #edf5f1;
    --ampol-ui-light-2: #dce9e2;
    --ampol-ui-ink: #102019;
    --ampol-ui-ink-2: #294338;
    --ampol-ui-ink-3: #5b7167;
    --ampol-ui-white: #f5fff9;
    --ampol-ui-white-2: #d9ebe1;
    --ampol-ui-white-3: #9eb4a8;
    --ampol-ui-accent: #25dc86;
    --ampol-ui-accent-soft: #8cf0bc;
    --ampol-ui-border-dark: rgba(154, 230, 190, .18);
    --ampol-ui-border-light: rgba(15, 95, 66, .18);
}

html[dir="rtl"] body,
html[dir="rtl"] input,
html[dir="rtl"] button,
html[dir="rtl"] select,
html[dir="rtl"] textarea {
    font-family: "Vazirmatn", Tahoma, Arial, sans-serif !important;
}

.ampol-app {
    --ui-text-primary: var(--ampol-ui-white);
    --ui-text-secondary: var(--ampol-ui-white-2);
    --ui-text-muted: var(--ampol-ui-white-3);
    --ui-border: var(--ampol-ui-border-dark);
    --ui-field-bg: rgba(2, 10, 6, .68);
    --ui-field-border: rgba(147, 197, 174, .24);
    --ui-soft-bg: rgba(255, 255, 255, .055);
    --ui-soft-hover: rgba(37, 220, 134, .11);
    color: var(--ui-text-primary);
    font-weight: 500;
    line-height: 1.75;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.ampol-app h1,
.ampol-app h2,
.ampol-app h3,
.ampol-app h4,
.ampol-app h5,
.ampol-app h6 {
    color: var(--ui-text-primary);
    font-weight: 900;
    line-height: 1.35;
}

.ampol-app :is(.text-white, .text-slate-900, .text-slate-800, .text-gray-900, .text-gray-800, .text-zinc-900, .text-zinc-800, .text-zinc-700) {
    color: var(--ui-text-primary) !important;
}
.ampol-app :is(.text-zinc-200, .text-zinc-300, .text-zinc-400, .text-slate-700, .text-slate-600, .text-gray-700, .text-gray-600) {
    color: var(--ui-text-secondary) !important;
}
.ampol-app :is(.text-zinc-500, .text-zinc-600, .text-slate-500, .text-slate-400, .text-gray-500, .text-gray-400) {
    color: var(--ui-text-muted) !important;
}

/* Dark semantic surfaces. */
.ampol-app :is(
    .premium-panel,
    .glass-panel,
    .metric-card,
    .admin-surface,
    .admin-order-row,
    .ticket-row,
    .account-recent,
    .account-activity,
    .account-support,
    .product-order-card,
    .store-filter-panel,
    .store-product-card,
    .ampol-orders-table-wrap,
    .ampol-mobile-order-card,
    .ampol-v8-loader__core,
    .admin-sidebar,
    .ampol-dark-surface
),
.ampol-app [class~="bg-black"],
.ampol-app [class*="bg-black/"],
.ampol-app [class*="bg-emerald-950"],
.ampol-app [class*="bg-emerald-900"] {
    --ui-text-primary: var(--ampol-ui-white);
    --ui-text-secondary: var(--ampol-ui-white-2);
    --ui-text-muted: var(--ampol-ui-white-3);
    --ui-border: var(--ampol-ui-border-dark);
    --ui-field-bg: rgba(1, 10, 5, .68);
    --ui-field-border: rgba(141, 211, 176, .24);
    --ui-soft-bg: rgba(255, 255, 255, .055);
    --ui-soft-hover: rgba(37, 220, 134, .12);
    color-scheme: dark;
}

/* Explicit light surfaces. High opacity white and pale utility cards stay light. */
.ampol-app :is(
    .ampol-light-surface,
    [class~="bg-white"],
    [class~="bg-white/70"],
    [class~="bg-white/75"],
    [class~="bg-white/85"],
    [class~="bg-white/90"],
    [class~="bg-white/92"],
    [class~="bg-white/95"],
    [class~="bg-emerald-50"],
    [class~="bg-emerald-50/40"],
    [class~="bg-emerald-50/55"],
    [class~="bg-emerald-50/60"],
    [class~="bg-emerald-50/70"],
    [class~="bg-emerald-50/90"],
    [class~="bg-slate-50"],
    [class~="bg-amber-50"],
    [class~="bg-rose-50"],
    [class~="bg-[#eef8f3]"],
    [class~="bg-[#edf7f2]"],
    [class~="bg-[#e9f5ef]"],
    [class~="bg-[#effaf4]"],
    [class~="bg-[#f2faf6]"],
    [class~="bg-[#f2faf5]"],
    [class~="bg-[#f4faf7]"],
    [class~="bg-[#f0f7f4]"]
) {
    --ui-text-primary: var(--ampol-ui-ink);
    --ui-text-secondary: var(--ampol-ui-ink-2);
    --ui-text-muted: var(--ampol-ui-ink-3);
    --ui-border: var(--ampol-ui-border-light);
    --ui-field-bg: #fbfefd;
    --ui-field-border: rgba(15, 95, 66, .22);
    --ui-soft-bg: rgba(8, 116, 67, .065);
    --ui-soft-hover: rgba(8, 116, 67, .12);
    color: var(--ui-text-primary) !important;
    color-scheme: light;
    background-color: var(--ampol-ui-light-0) !important;
}

.ampol-app [class~="bg-white"],
.ampol-app [class~="bg-white/70"],
.ampol-app [class~="bg-white/75"],
.ampol-app [class~="bg-white/85"],
.ampol-app [class~="bg-white/90"],
.ampol-app [class~="bg-white/92"],
.ampol-app [class~="bg-white/95"] {
    background: linear-gradient(145deg, #f8fcfa, #eaf3ee) !important;
    border-color: var(--ampol-ui-border-light) !important;
}

/* Native controls now inherit the contrast of the surface that contains them. */
.ampol-app input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.ampol-app select,
.ampol-app textarea,
.ampol-app .field,
.ampol-app .select-field,
.ampol-app .textarea-field,
.ampol-app .product-order-field {
    min-height: 2.9rem;
    border: 1px solid var(--ui-field-border) !important;
    background: var(--ui-field-bg) !important;
    color: var(--ui-text-primary) !important;
    font-size: .82rem !important;
    font-weight: 650 !important;
    line-height: 1.7 !important;
    caret-color: var(--ampol-ui-accent);
}
.ampol-app textarea,
.ampol-app .textarea-field { min-height: 8.5rem; }
.ampol-app input::placeholder,
.ampol-app textarea::placeholder { color: var(--ui-text-muted) !important; opacity: .92 !important; }
.ampol-app :is(input, select, textarea):focus {
    border-color: rgba(37, 220, 134, .72) !important;
    box-shadow: 0 0 0 4px rgba(37, 220, 134, .13) !important;
    outline: none !important;
}
.ampol-app option { background: var(--ampol-ui-dark-1); color: var(--ampol-ui-white); }
.ampol-app .field-label { color: var(--ui-text-secondary) !important; font-weight: 850 !important; }
.ampol-app .field-help { color: var(--ui-text-muted) !important; line-height: 1.75 !important; }

/* Buttons must never inherit an unreadable foreground from a parent card. */
.ampol-app .btn-primary {
    --ui-text-primary: #fff;
    color: #fff !important;
    font-weight: 900 !important;
}
.ampol-app .btn-secondary {
    border-color: var(--ui-border) !important;
    background: var(--ui-soft-bg) !important;
    color: var(--ui-text-primary) !important;
    font-weight: 850 !important;
}
.ampol-app .btn-secondary:hover { background: var(--ui-soft-hover) !important; border-color: rgba(37, 220, 134, .46) !important; }
.ampol-app .btn-ghost { color: var(--ui-text-secondary) !important; font-weight: 800 !important; }
.ampol-app .btn-ghost:hover { color: var(--ui-text-primary) !important; background: var(--ui-soft-hover) !important; }
.ampol-app .btn-danger { color: #fecdd3 !important; }
.ampol-app button:disabled,
.ampol-app [aria-disabled="true"] { opacity: .55 !important; cursor: not-allowed !important; }

/* Native checkbox/radio fallback — visible even outside the shared component. */
.ampol-app input[type="checkbox"]:not(.ampol-check-input),
.ampol-app input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-grid !important;
    width: 1.28rem !important;
    height: 1.28rem !important;
    flex: 0 0 1.28rem !important;
    place-items: center !important;
    border: 2px solid rgba(80, 115, 98, .48) !important;
    background: rgba(255, 255, 255, .82) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .11) !important;
    cursor: pointer !important;
    transition: .18s ease !important;
}
.ampol-app input[type="checkbox"]:not(.ampol-check-input) { border-radius: .38rem !important; }
.ampol-app input[type="radio"] { border-radius: 999px !important; }
.ampol-app input[type="checkbox"]:not(.ampol-check-input)::after {
    content: "✓";
    color: #fff;
    font-size: .88rem;
    font-weight: 1000;
    line-height: 1;
    transform: scale(0);
    transition: transform .14s ease;
}
.ampol-app input[type="radio"]::after {
    content: "";
    width: .5rem;
    height: .5rem;
    border-radius: 999px;
    background: #fff;
    transform: scale(0);
    transition: transform .14s ease;
}
.ampol-app input[type="checkbox"]:not(.ampol-check-input):checked,
.ampol-app input[type="radio"]:checked {
    border-color: #16a56a !important;
    background: linear-gradient(145deg, #047857, #25dc86) !important;
    box-shadow: 0 0 0 4px rgba(37, 220, 134, .17), 0 8px 22px rgba(5, 150, 105, .22) !important;
}
.ampol-app input[type="checkbox"]:not(.ampol-check-input):checked::after,
.ampol-app input[type="radio"]:checked::after { transform: scale(1); }
.ampol-app label:has(> input[type="checkbox"]:not(.ampol-check-input):checked),
.ampol-app label:has(> input[type="radio"]:checked) {
    border-color: rgba(37, 220, 134, .54) !important;
    box-shadow: inset 0 0 0 1px rgba(37, 220, 134, .12), 0 12px 34px rgba(3, 24, 14, .08) !important;
}

/* Shared custom checkbox: explicit tick and stronger selected row. */
.ampol-app .ampol-check-box::after {
    content: "✓";
    position: absolute;
    color: #fff;
    font-size: .95rem;
    font-weight: 1000;
    line-height: 1;
    opacity: 0;
    transform: scale(.5);
    transition: .16s ease;
}
.ampol-app .ampol-check-box { position: relative !important; overflow: visible !important; }
.ampol-app .ampol-check-input:checked ~ .ampol-check-box::after { opacity: 1; transform: scale(1); }
.ampol-app .ampol-check-input:checked ~ .ampol-check-box svg { opacity: 0 !important; }
.ampol-app .ampol-check-option:has(.ampol-check-input:checked) {
    border-width: 2px !important;
    border-color: #25dc86 !important;
    background: linear-gradient(145deg, rgba(5, 150, 105, .34), rgba(7, 30, 19, .98)) !important;
}
.ampol-app .ampol-check-state { min-width: 3.4rem !important; justify-content: center !important; }

/* Admin-wide visual system. */
.ampol-admin-ui {
    --ui-text-primary: var(--ampol-ui-white);
    --ui-text-secondary: var(--ampol-ui-white-2);
    --ui-text-muted: var(--ampol-ui-white-3);
    background:
        radial-gradient(circle at 11% 8%, rgba(37, 220, 134, .12), transparent 28rem),
        radial-gradient(circle at 90% 75%, rgba(6, 78, 59, .18), transparent 34rem),
        linear-gradient(150deg, #07100c, #0d1913 50%, #08110d) !important;
}
.ampol-admin-ui .premium-panel,
.ampol-admin-ui .glass-panel,
.ampol-admin-ui .admin-surface,
.ampol-admin-ui .metric-card {
    background: linear-gradient(145deg, rgba(23, 42, 32, .96), rgba(8, 20, 13, .97)) !important;
    border-color: var(--ampol-ui-border-dark) !important;
    color: var(--ampol-ui-white) !important;
}
.ampol-admin-ui .eyebrow { color: #53e99c !important; }
.ampol-admin-ui .admin-table th {
    background: rgba(0, 0, 0, .26) !important;
    color: #b3c9bd !important;
    font-size: .66rem !important;
    font-weight: 900 !important;
}
.ampol-admin-ui .admin-table td { color: #d8e7df !important; font-size: .74rem !important; }
.ampol-admin-ui .admin-table tbody tr:hover { background: rgba(37, 220, 134, .055) !important; }
.ampol-admin-ui nav a { color: #aabdb2 !important; }
.ampol-admin-ui nav a:hover { color: #f2fff7 !important; }
.ampol-admin-ui nav a[class*="text-emerald"] { color: #66efaa !important; }

/* Order workspace: values, labels and copy actions stay readable. */
.ampol-order-workspace [class*="bg-black/"] {
    --ui-text-primary: #f6fff9;
    --ui-text-secondary: #d7e8df;
    --ui-text-muted: #a7bdb1;
    background: linear-gradient(145deg, rgba(5, 17, 10, .92), rgba(12, 30, 20, .94)) !important;
    border-color: rgba(122, 228, 173, .21) !important;
}
.ampol-order-workspace .copy-chip {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(37, 220, 134, .24) !important;
    border-radius: .7rem;
    padding: .38rem .65rem;
    background: rgba(37, 220, 134, .09) !important;
    color: #8cf0bc !important;
    font-size: .62rem !important;
    font-weight: 900 !important;
}
.ampol-order-workspace .copy-chip:hover { background: rgba(37, 220, 134, .18) !important; color: #fff !important; }
.ampol-order-workspace article > .mt-6.grid > div { min-height: 6.3rem; }

/* Checkout-wide contrast repair. */
.ampol-checkout-page {
    background:
        radial-gradient(circle at 8% 12%, rgba(37, 220, 134, .12), transparent 32%),
        radial-gradient(circle at 92% 65%, rgba(6, 78, 59, .14), transparent 38%),
        linear-gradient(135deg, #07110d, #0c1a13 50%, #07100c) !important;
}
.ampol-checkout-page > .page-shell > header h1 { color: #f4fff8 !important; }
.ampol-checkout-page > .page-shell > header p { color: #c1d5ca !important; }
.ampol-checkout-page form > div > section,
.ampol-checkout-page form > aside {
    border-color: rgba(132, 218, 174, .2) !important;
}
.ampol-checkout-page form > div > section {
    --ui-text-primary: var(--ampol-ui-ink);
    --ui-text-secondary: var(--ampol-ui-ink-2);
    --ui-text-muted: var(--ampol-ui-ink-3);
    --ui-field-bg: #f9fcfa;
    --ui-field-border: rgba(15, 95, 66, .2);
    --ui-soft-bg: rgba(8, 116, 67, .065);
    background: linear-gradient(145deg, #f4faf7, #e5f0ea) !important;
    color: var(--ampol-ui-ink) !important;
    color-scheme: light;
}
.ampol-checkout-page form > aside {
    --ui-text-primary: var(--ampol-ui-white);
    --ui-text-secondary: var(--ampol-ui-white-2);
    --ui-text-muted: var(--ampol-ui-white-3);
    background: linear-gradient(145deg, rgba(17, 35, 25, .97), rgba(5, 16, 10, .98)) !important;
    color: var(--ampol-ui-white) !important;
}
.ampol-checkout-page form > div > section [class*="bg-emerald-950"],
.ampol-checkout-page form > div > section [class*="bg-emerald-900"],
.ampol-checkout-page form > div > section [class*="bg-black/"] {
    --ui-text-primary: #f5fff9;
    --ui-text-secondary: #d8e9df;
    --ui-text-muted: #a5b9ae;
    background: linear-gradient(145deg, #075c3d, #063b29) !important;
    color: #f5fff9 !important;
}
.ampol-checkout-page .status-pill,
.ampol-checkout-page [class*="rounded-full"] { font-weight: 850; }
.ampol-checkout-page textarea { resize: vertical; }

/* Storefront cards: product title, metadata and price are always legible. */
.store-product-card { --ui-text-primary: #f5fff9; --ui-text-secondary: #d7e9df; --ui-text-muted: #9eb4a8; }
.store-product-card > div { color: #eaf8f0 !important; }
.store-product-card > div > a { color: #f6fff9 !important; text-shadow: 0 1px 0 rgba(0,0,0,.24); }
.store-product-card > div > div:first-child { color: #abc0b4 !important; }
.store-product-card .store-product-card__value strong { color: #74efad !important; text-shadow: 0 10px 30px rgba(0,0,0,.35) !important; }
.store-product-card .store-product-card__value small { color: #d6f9e6 !important; }
.store-product-card [class*="line-through"] { color: #91a99d !important; }
.store-product-card [class*="text-xl"],
.store-product-card [class*="font-black"] { color: #f4fff8 !important; }

/* Status and validation messages keep their semantic colors. */
.ampol-app :is(.status-green, .text-emerald-300, .text-emerald-400, .text-emerald-500) { color: #65efaa !important; }
.ampol-app :is(.status-yellow, .text-amber-200, .text-amber-300, .text-amber-400) { color: #fbd66d !important; }
.ampol-app :is(.status-red, .text-rose-200, .text-rose-300, .text-rose-400, .text-rose-600, .text-rose-700) { color: #ff9daf !important; }
.ampol-app :is(.status-blue, .text-sky-300, .text-sky-400, .text-sky-600) { color: #8ed8ff !important; }
.ampol-app .bg-amber-50 { background: #fff8df !important; }
.ampol-app .bg-rose-50 { background: #fff1f3 !important; }
.ampol-app .bg-amber-50 :is(.text-amber-800, .text-amber-900, .text-amber-950) { color: #78350f !important; }
.ampol-app .bg-rose-50 :is(.text-rose-600, .text-rose-700, .text-rose-900) { color: #9f1239 !important; }

/* Better density and typography on small screens. */
@media (max-width: 640px) {
    .ampol-app { font-size: 14px; }
    .ampol-app h1 { font-size: clamp(1.55rem, 7vw, 2.15rem) !important; }
    .ampol-app h2 { line-height: 1.45 !important; }
    .ampol-app .premium-panel,
    .ampol-app .glass-panel { border-radius: 1rem !important; }
    .ampol-admin-ui .page-shell { padding-inline: .65rem !important; }
    .ampol-admin-ui .ampol-admin-content > header { margin-bottom: 1rem !important; }
    .ampol-order-workspace article { padding: .85rem !important; border-radius: 1rem !important; }
    .ampol-order-workspace article > .mt-6.grid { gap: .55rem !important; }
    .ampol-order-workspace article > .mt-6.grid > div { min-height: auto; padding: .72rem !important; border-radius: .85rem !important; }
    .ampol-checkout-page .page-shell { padding-inline: .65rem !important; }
    .ampol-checkout-page form > div > section,
    .ampol-checkout-page form > aside { border-radius: 1.15rem !important; padding: .85rem !important; }
    .ampol-app input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
    .ampol-app select,
    .ampol-app textarea { font-size: .76rem !important; }
}

@media (prefers-contrast: more) {
    .ampol-app { --ui-text-muted: var(--ui-text-secondary); }
    .ampol-app :is(.premium-panel, .glass-panel, .metric-card, [class~="bg-white"]) { border-width: 2px !important; }
}

/* source: public/css/ampol-v8.2.css */
/* ======================================================================
   AMPOLSHOP V8.2 — Unified contrast, typography and correction workflow UI
   Loaded after V8.1 so these rules intentionally win.
   ====================================================================== */
:root {
    --ampol82-light-bg: #f4faf7;
    --ampol82-light-bg-2: #e8f2ed;
    --ampol82-light-ink: #102019;
    --ampol82-light-muted: #4f695d;
    --ampol82-dark-bg: #07110d;
    --ampol82-dark-bg-2: #0e1e16;
    --ampol82-dark-ink: #f3fff8;
    --ampol82-dark-muted: #b7ccbf;
    --ampol82-green: #25dc86;
}

/* Shared Persian typography */
.ampol-app {
    font-size: 15px;
    letter-spacing: 0;
}
.ampol-app :where(p, li, td, th, label, input, textarea, select, button, a, span, small) {
    line-height: 1.8;
}
.ampol-app :where(h1,h2,h3,h4,h5,h6) {
    letter-spacing: -.02em;
}

/* Force readable text on pale surfaces. */
.ampol-app :is(
    [class~="bg-white"],
    [class*="bg-white/"],
    [class~="bg-emerald-50"],
    [class*="bg-emerald-50/"],
    [class~="bg-slate-50"],
    [class~="bg-amber-50"],
    [class~="bg-rose-50"],
    [class~="bg-[#eef8f3]"],
    [class~="bg-[#edf7f2]"],
    [class~="bg-[#e9f5ef]"],
    [class~="bg-[#effaf4]"],
    [class~="bg-[#f2faf6]"],
    [class~="bg-[#f4faf7]"]
) :where(h1,h2,h3,h4,h5,h6,p,span,b,strong,small,label,legend,th,td,a):not(.btn-primary):not(.btn-danger):not(.status-pill):not(.text-emerald-300):not(.text-emerald-400):not(.text-rose-600):not(.text-rose-700):not(.text-amber-700):not(.text-amber-800):not(.text-amber-900):not(.text-amber-950) {
    color: var(--ampol82-light-ink) !important;
    text-shadow: none !important;
}
.ampol-app :is(
    [class~="bg-white"],
    [class*="bg-white/"],
    [class~="bg-emerald-50"],
    [class*="bg-emerald-50/"],
    [class~="bg-slate-50"]
) :where(.text-zinc-400,.text-zinc-500,.text-zinc-600,.text-slate-400,.text-slate-500,.text-slate-600) {
    color: var(--ampol82-light-muted) !important;
}

/* Stronger dark-surface contrast. */
.ampol-app :is(.premium-panel,.glass-panel,.admin-surface,.product-order-card,.store-product-card,.ampol-dark-surface) :where(.text-zinc-500,.text-zinc-600,.text-zinc-700) {
    color: var(--ampol82-dark-muted) !important;
}
.ampol-app :is(.premium-panel,.glass-panel,.admin-surface,.product-order-card,.store-product-card,.ampol-dark-surface) :where(h1,h2,h3,h4,h5,h6,b,strong):not(.ampol-light-surface *) {
    color: var(--ampol82-dark-ink) !important;
}

/* Admin order workspace */
.ampol-order-workspace article > .mt-6.grid > div {
    background: linear-gradient(145deg,#f8fcfa,#e7f1ec) !important;
    border: 1px solid rgba(12,92,62,.18) !important;
    color: var(--ampol82-light-ink) !important;
}
.ampol-order-workspace article > .mt-6.grid > div :where(small,b,span):not(.copy-chip) {
    color: var(--ampol82-light-ink) !important;
}
.ampol-order-workspace article > .mt-6.grid > div small {
    color: #426257 !important;
    font-size: .76rem !important;
}
.ampol-order-workspace article > .mt-6.grid > div b {
    font-size: .92rem !important;
    font-weight: 900 !important;
}
.ampol-order-workspace article > .mt-6.grid > div[class*="bg-amber"] {
    background: linear-gradient(145deg,#fff9e8,#f8eed2) !important;
}
.ampol-order-workspace article > .mt-6.grid > div[class*="bg-amber"] :where(small,b,span):not(.copy-chip) {
    color: #633f06 !important;
}

/* Fixed, scrollable admin action dialog */
.ampol-action-dialog > summary::-webkit-details-marker { display: none; }
.ampol-action-dialog__backdrop {
    position: fixed;
    inset: 0;
    z-index: 90;
    background: rgba(0,8,4,.74);
    backdrop-filter: blur(8px);
}
.ampol-action-dialog__panel {
    position: fixed;
    z-index: 100;
    inset-inline: auto;
    left: 50%;
    right: auto;
    top: 50%;
    transform: translate(-50%,-50%);
    width: min(94vw, 610px);
    max-height: min(88vh, 760px);
    display: grid;
    grid-template-rows: auto minmax(0,1fr) auto;
    overflow: hidden;
    border: 1px solid rgba(37,220,134,.28);
    border-radius: 1.35rem;
    background: linear-gradient(145deg,#f7fcf9,#e5f0ea);
    color: var(--ampol82-light-ink);
    box-shadow: 0 32px 100px rgba(0,0,0,.48);
}
.ampol-action-dialog__header,
.ampol-action-dialog__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    background: #eff7f3;
}
.ampol-action-dialog__header { border-bottom: 1px solid rgba(15,95,66,.14); }
.ampol-action-dialog__footer { border-top: 1px solid rgba(15,95,66,.14); }
.ampol-action-dialog__header b { color: var(--ampol82-light-ink) !important; font-size: 1rem; }
.ampol-action-dialog__header p { margin-top: .2rem; color: var(--ampol82-light-muted) !important; font-size: .72rem; }
.ampol-action-dialog__body { overflow-y: auto; padding: 1rem 1.15rem 1.35rem; }
.ampol-action-dialog__close {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: .7rem;
    background: rgba(15,95,66,.08);
    color: #173d2c !important;
    font-size: 1.3rem;
    font-weight: 900;
}
.ampol-action-dialog :where(.field-label,.field-help,label,legend,p,span,b) { color: var(--ampol82-light-ink) !important; }
.ampol-action-dialog .field-help { color: var(--ampol82-light-muted) !important; font-size: .7rem; }
.ampol-action-dialog input:not([type="checkbox"]),
.ampol-action-dialog select,
.ampol-action-dialog textarea {
    background: #fff !important;
    color: var(--ampol82-light-ink) !important;
    border-color: rgba(15,95,66,.22) !important;
}
.ampol-check-row {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-height: 3rem;
    padding: .65rem .75rem;
    border: 1px solid rgba(15,95,66,.15);
    border-radius: .85rem;
    background: rgba(255,255,255,.75);
    cursor: pointer;
}
.ampol-check-row:has(input:checked) {
    border-color: rgba(5,150,105,.55);
    background: rgba(37,220,134,.12);
    box-shadow: inset 0 0 0 1px rgba(37,220,134,.12);
}
.ampol-check-row span { color: var(--ampol82-light-ink) !important; font-size: .76rem; font-weight: 800; }

/* Checkout payment cards */
.is-checkout-route .ampol-checkout-page form > div > section {
    color: var(--ampol82-light-ink) !important;
}
.is-checkout-route .ampol-checkout-page form > div > section > :where(h1,h2,h3,p) {
    color: var(--ampol82-light-ink) !important;
}
.is-checkout-route .ampol-checkout-page form > div > section label:not(.ampol-dark-payment-card),
.is-checkout-route .ampol-checkout-page form > div > section label:not(.ampol-dark-payment-card) :where(b,strong,span,small,p) {
    color: var(--ampol82-light-ink) !important;
}
.is-checkout-route .ampol-checkout-page form > div > section label[class*="bg-emerald-950"],
.is-checkout-route .ampol-checkout-page form > div > section label[class*="bg-emerald-900"],
.is-checkout-route .ampol-checkout-page form > div > section label[class*="bg-black"] {
    color: var(--ampol82-dark-ink) !important;
}
.is-checkout-route .ampol-checkout-page form > div > section label[class*="bg-emerald-950"] :where(b,strong,span,small,p),
.is-checkout-route .ampol-checkout-page form > div > section label[class*="bg-emerald-900"] :where(b,strong,span,small,p),
.is-checkout-route .ampol-checkout-page form > div > section label[class*="bg-black"] :where(b,strong,span,small,p) {
    color: var(--ampol82-dark-ink) !important;
}
.is-checkout-route .ampol-checkout-page input,
.is-checkout-route .ampol-checkout-page textarea,
.is-checkout-route .ampol-checkout-page select {
    color: var(--ampol82-light-ink) !important;
    background: #fbfefd !important;
}
.is-checkout-route .ampol-checkout-page input::placeholder,
.is-checkout-route .ampol-checkout-page textarea::placeholder { color: #667b71 !important; }
.is-checkout-route .ampol-checkout-page button:not(.btn-primary):not(.btn-danger) { color: #173c2c !important; }

/* Product detail page */
.is-product-route .product-info-panel {
    background: linear-gradient(145deg,#f7fbf9,#e8f2ed) !important;
    border-color: rgba(12,92,62,.18) !important;
    color: var(--ampol82-light-ink) !important;
}
.is-product-route .product-info-panel :where(h2,h3,h4,b,strong,p,small,li,span):not(.storefront-kicker) {
    color: var(--ampol82-light-ink) !important;
}
.is-product-route .product-info-panel .storefront-kicker { color: #e25047 !important; }
.is-product-route .product-rich-content {
    color: #29493b !important;
    font-size: 1rem !important;
    font-weight: 560 !important;
    line-height: 2.05 !important;
}
.is-product-route .product-rich-content :where(p,li,span,strong,b,h2,h3,h4,blockquote) {
    color: inherit !important;
    background: transparent !important;
    text-decoration: none !important;
    opacity: 1 !important;
}
.is-product-route .product-rich-content :where(mark,[style*="background"],[style*="color"]) {
    background: transparent !important;
    color: inherit !important;
}
.is-product-route .product-rich-content h2 { font-size: 1.25rem !important; }
.is-product-route .product-rich-content h3 { font-size: 1.12rem !important; }
.is-product-route .product-purchase-steps b { color: #102019 !important; font-size: .9rem !important; }
.is-product-route .product-purchase-steps small { color: #536c61 !important; font-size: .74rem !important; }
.is-product-route .product-package-chip {
    min-width: 7.2rem;
    background: linear-gradient(145deg,#fff,#edf5f1) !important;
    border-color: rgba(12,92,62,.18) !important;
}
.is-product-route .product-package-chip :where(b,strong,small) { color: #133225 !important; }
.is-product-route .product-package-chip.is-active {
    border-color: var(--ampol82-green) !important;
    box-shadow: 0 0 0 3px rgba(37,220,134,.14) !important;
}

/* Dashboard / recent orders / tickets */
.is-dashboard-route .account-recent,
.is-dashboard-route .account-support,
.is-dashboard-route .account-activity { color: var(--ampol82-dark-ink) !important; }
.is-dashboard-route .account-recent table td,
.is-dashboard-route .account-recent table th { color: #dcece3 !important; }
.is-dashboard-route .account-recent table td [class*="bg-white"],
.is-dashboard-route .account-recent table td [class*="bg-[#"] {
    background: rgba(255,255,255,.06) !important;
    color: #f2fff7 !important;
}
.is-dashboard-route .account-recent table td [class*="bg-white"] :where(span,b,p,small),
.is-dashboard-route .account-recent table td [class*="bg-[#"] :where(span,b,p,small) {
    color: #f2fff7 !important;
}
.is-dashboard-route .account-support a[class*="bg-white"],
.is-dashboard-route .account-support [class*="bg-white"] {
    background: rgba(255,255,255,.055) !important;
    color: #f4fff8 !important;
}
.is-dashboard-route .account-support [class*="bg-white"] :where(h1,h2,h3,p,span,b,strong,small) { color: #f4fff8 !important; }

/* Coupon/admin pages */
.is-admin-route .ampol-admin-ui :where(h1,h2,h3,h4) { color: #f4fff8 !important; }
.is-admin-route .ampol-admin-ui .premium-panel :where(.text-zinc-500,.text-zinc-600,.text-zinc-700) { color: #abc0b4 !important; }
.is-admin-route .ampol-admin-ui [class*="bg-white"] {
    color: var(--ampol82-light-ink) !important;
}
.is-admin-route .ampol-admin-ui [class*="bg-white"] :where(h1,h2,h3,p,span,b,strong,small,label,th,td,a):not(.btn-primary):not(.status-pill) {
    color: var(--ampol82-light-ink) !important;
}

/* Checkbox clarity */
.ampol-app input[type="checkbox"]:checked::after { color: #fff !important; }
.ampol-app label:has(input[type="checkbox"]:checked) {
    background-color: rgba(37,220,134,.11) !important;
    border-color: rgba(37,220,134,.58) !important;
}

@media (max-width: 640px) {
    .ampol-app { font-size: 14px; }
    .ampol-action-dialog__panel { width: calc(100vw - 1rem); max-height: calc(100vh - 1rem); border-radius: 1rem; }
    .ampol-action-dialog__header,.ampol-action-dialog__footer,.ampol-action-dialog__body { padding-inline: .85rem; }
    .is-product-route .product-rich-content { font-size: .9rem !important; line-height: 1.95 !important; }
    .is-product-route .product-package-chip { min-width: 6.1rem; padding: .65rem !important; }
    .ampol-order-workspace article > .mt-6.grid > div small { font-size: .68rem !important; }
    .ampol-order-workspace article > .mt-6.grid > div b { font-size: .82rem !important; }
}

.ampol-correction-required-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(251,191,36,.34);
    border-radius: 1.35rem;
    background: linear-gradient(135deg,rgba(120,53,15,.34),rgba(21,20,12,.96));
    box-shadow: 0 18px 48px rgba(0,0,0,.18);
}
.ampol-correction-required-card__icon {
    display: grid;
    place-items: center;
    width: 2.55rem;
    height: 2.55rem;
    flex: 0 0 2.55rem;
    border-radius: .85rem;
    border: 1px solid rgba(251,191,36,.35);
    background: rgba(251,191,36,.12);
    color: #fcd34d;
    font-weight: 1000;
}
@media (max-width:640px) {
    .ampol-correction-required-card { align-items: flex-start; flex-wrap: wrap; }
    .ampol-correction-required-card > a { width: 100%; }
}

/* source: public/css/ampol-v9.css */
/* ======================================================================
   AMPOLSHOP V9 — tokenized themes, mobile density and operations UI
   This file is deliberately loaded last.
   ====================================================================== */

:root,
:root[data-theme="emerald"] {
    color-scheme: light;
    --theme-page: #f4faf7;
    --theme-page-alt: #e8f2ed;
    --theme-panel: rgba(255, 255, 255, .93);
    --theme-panel-strong: #ffffff;
    --theme-panel-soft: #edf6f1;
    --theme-text: #102019;
    --theme-muted: #5b7165;
    --theme-faint: #84968c;
    --theme-line: rgba(10, 91, 60, .16);
    --theme-line-strong: rgba(16, 185, 129, .38);
    --theme-accent: #10b981;
    --theme-accent-2: #087443;
    --theme-accent-3: #63e6a4;
    --theme-accent-soft: rgba(16, 185, 129, .12);
    --theme-accent-contrast: #ffffff;
    --theme-accent-text: #067647;
    --theme-action-from: #065f46;
    --theme-action-to: #047857;
    --theme-action-text: #ffffff;
    --theme-dark: #0d1c15;
    --theme-dark-2: #14291e;
    --theme-on-dark: #f4fff8;
    --theme-on-dark-muted: #b6cabf;
    --theme-header: rgba(255, 255, 255, .91);
    --theme-shadow: rgba(20, 67, 44, .14);
    --theme-hero-glow: rgba(16, 185, 129, .32);
}

:root[data-theme="crimson"] {
    color-scheme: light;
    --theme-page: #fff7e8;
    --theme-page-alt: #f3e6cf;
    --theme-panel: rgba(255, 252, 244, .94);
    --theme-panel-strong: #fffdf8;
    --theme-panel-soft: #f8ecd8;
    --theme-text: #321a17;
    --theme-muted: #785c53;
    --theme-faint: #a48b80;
    --theme-line: rgba(133, 54, 43, .17);
    --theme-line-strong: rgba(196, 61, 50, .40);
    --theme-accent: #c43d32;
    --theme-accent-2: #8f2721;
    --theme-accent-3: #d7a83d;
    --theme-accent-soft: rgba(196, 61, 50, .11);
    --theme-accent-contrast: #ffffff;
    --theme-accent-text: #9f2f27;
    --theme-action-from: #8f2721;
    --theme-action-to: #c43d32;
    --theme-action-text: #ffffff;
    --theme-dark: #2d1815;
    --theme-dark-2: #47211c;
    --theme-on-dark: #fff9ed;
    --theme-on-dark-muted: #e6cfc1;
    --theme-header: rgba(255, 250, 239, .92);
    --theme-shadow: rgba(91, 37, 25, .15);
    --theme-hero-glow: rgba(196, 61, 50, .33);
}

:root[data-theme="sapphire"] {
    color-scheme: light;
    --theme-page: #f2f8ff;
    --theme-page-alt: #e2edf8;
    --theme-panel: rgba(255, 255, 255, .94);
    --theme-panel-strong: #ffffff;
    --theme-panel-soft: #eaf3fb;
    --theme-text: #12283d;
    --theme-muted: #526b82;
    --theme-faint: #8196a9;
    --theme-line: rgba(23, 89, 146, .16);
    --theme-line-strong: rgba(35, 131, 219, .38);
    --theme-accent: #2383db;
    --theme-accent-2: #17558f;
    --theme-accent-3: #69b7f8;
    --theme-accent-soft: rgba(35, 131, 219, .11);
    --theme-accent-contrast: #ffffff;
    --theme-accent-text: #1767a9;
    --theme-action-from: #174f7d;
    --theme-action-to: #1767a9;
    --theme-action-text: #ffffff;
    --theme-dark: #102438;
    --theme-dark-2: #183a5a;
    --theme-on-dark: #f3f9ff;
    --theme-on-dark-muted: #bdd0e1;
    --theme-header: rgba(248, 252, 255, .92);
    --theme-shadow: rgba(24, 67, 104, .14);
    --theme-hero-glow: rgba(35, 131, 219, .34);
}

:root[data-theme="graphite"] {
    color-scheme: dark;
    --theme-page: #11151b;
    --theme-page-alt: #171d25;
    --theme-panel: rgba(28, 35, 44, .94);
    --theme-panel-strong: #202832;
    --theme-panel-soft: #252e38;
    --theme-text: #edf3f6;
    --theme-muted: #aebbc5;
    --theme-faint: #778692;
    --theme-line: rgba(214, 228, 238, .12);
    --theme-line-strong: rgba(125, 211, 168, .34);
    --theme-accent: #7dd3a8;
    --theme-accent-2: #2d8c65;
    --theme-accent-3: #b3ebce;
    --theme-accent-soft: rgba(125, 211, 168, .12);
    --theme-accent-contrast: #0d1a14;
    --theme-accent-text: #9be4be;
    --theme-action-from: #7dd3a8;
    --theme-action-to: #b3ebce;
    --theme-action-text: #0d1a14;
    --theme-dark: #0b0f14;
    --theme-dark-2: #161e26;
    --theme-on-dark: #f3f7f9;
    --theme-on-dark-muted: #adbac4;
    --theme-header: rgba(22, 27, 34, .92);
    --theme-shadow: rgba(0, 0, 0, .34);
    --theme-hero-glow: rgba(125, 211, 168, .26);
}

:root[data-theme="violet"] {
    color-scheme: light;
    --theme-page: #f8f5ff;
    --theme-page-alt: #ece7f7;
    --theme-panel: rgba(255, 255, 255, .94);
    --theme-panel-strong: #ffffff;
    --theme-panel-soft: #f0ebfb;
    --theme-text: #281d3d;
    --theme-muted: #6b5c82;
    --theme-faint: #9587a9;
    --theme-line: rgba(92, 58, 148, .16);
    --theme-line-strong: rgba(139, 92, 246, .38);
    --theme-accent: #8b5cf6;
    --theme-accent-2: #5b35b3;
    --theme-accent-3: #b79af9;
    --theme-accent-soft: rgba(139, 92, 246, .11);
    --theme-accent-contrast: #ffffff;
    --theme-accent-text: #7042d2;
    --theme-action-from: #5b35b3;
    --theme-action-to: #7c3aed;
    --theme-action-text: #ffffff;
    --theme-dark: #211735;
    --theme-dark-2: #39255c;
    --theme-on-dark: #faf7ff;
    --theme-on-dark-muted: #d5c8e8;
    --theme-header: rgba(252, 250, 255, .92);
    --theme-shadow: rgba(60, 38, 97, .15);
    --theme-hero-glow: rgba(139, 92, 246, .32);
}

html { background: var(--theme-page) !important; }
html.ampol-modal-open { overflow: hidden; }
body.ampol-app {
    color: var(--theme-text) !important;
    background:
        radial-gradient(circle at 8% -5%, var(--theme-accent-soft), transparent 29rem),
        radial-gradient(circle at 96% 35%, color-mix(in srgb, var(--theme-accent-2) 11%, transparent), transparent 32rem),
        linear-gradient(150deg, var(--theme-page), var(--theme-page-alt)) !important;
    background-attachment: fixed !important;
}
body.ampol-app::after { background: radial-gradient(circle at center, transparent 35%, color-mix(in srgb, var(--theme-dark) 10%, transparent)) !important; }
body.ampol-app::before { opacity: .12 !important; }

.site-canvas,
.storefront-page,
.product-service-page,
.ampol-orders-page,
.dashboard-shell { background: transparent !important; color: var(--theme-text); }

.premium-panel,
.glass-panel,
.metric-card,
.admin-surface,
.account-recent,
.account-support,
.account-activity,
.ampol-product-permission-card {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: linear-gradient(150deg, var(--theme-panel), var(--theme-panel-soft)) !important;
    box-shadow: 0 20px 58px var(--theme-shadow) !important;
}
.premium-panel::before,
.glass-panel::before { background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--theme-accent) 34%, transparent), transparent) !important; }
.premium-panel :where(.text-white,.text-zinc-100,.text-zinc-200),
.glass-panel :where(.text-white,.text-zinc-100,.text-zinc-200),
.metric-card :where(.text-white,.text-zinc-100,.text-zinc-200),
.ampol-product-permission-card :where(.text-white,.text-zinc-100,.text-zinc-200) { color: var(--theme-text) !important; }
.premium-panel :where(.text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600,.text-zinc-700),
.glass-panel :where(.text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600,.text-zinc-700),
.metric-card :where(.text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600,.text-zinc-700) { color: var(--theme-muted) !important; }
.premium-panel :where([class~="bg-white"],[class*="bg-black/"]),
.glass-panel :where([class~="bg-white"],[class*="bg-black/"]) { background: var(--theme-panel-soft) !important; }
.premium-panel [class*="border-white"],
.glass-panel [class*="border-white"] { border-color: var(--theme-line) !important; }
.ampol-account-level-card { color: var(--theme-text); border-color: var(--theme-line) !important; background: var(--theme-panel-soft) !important; box-shadow: 0 18px 46px var(--theme-shadow) !important; }

.eyebrow,
.storefront-kicker { color: var(--theme-accent) !important; }
.eyebrow::before { background: linear-gradient(90deg, var(--theme-accent), transparent) !important; }
.section-title,
.ampol-section-head h2 { color: var(--theme-text) !important; }
.section-copy,
.ampol-section-head p { color: var(--theme-muted) !important; }

.btn-primary,
.ampol-login-button {
    color: var(--theme-accent-contrast) !important;
    border-color: transparent !important;
    background: linear-gradient(120deg, var(--theme-accent-2), var(--theme-accent), var(--theme-accent-3)) !important;
    box-shadow: 0 14px 36px color-mix(in srgb, var(--theme-accent) 27%, transparent) !important;
}
.btn-primary:hover,
.ampol-login-button:hover { box-shadow: 0 18px 44px color-mix(in srgb, var(--theme-accent) 38%, transparent) !important; }
.btn-secondary,
.btn-ghost {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: color-mix(in srgb, var(--theme-panel-strong) 78%, transparent) !important;
}
.btn-secondary:hover,
.btn-ghost:hover { color: var(--theme-accent-2) !important; border-color: var(--theme-line-strong) !important; background: var(--theme-accent-soft) !important; }
.copy-chip { color: var(--theme-accent-2) !important; border-color: var(--theme-line-strong) !important; background: var(--theme-accent-soft) !important; }
.copy-chip.is-copied,
[data-copy].is-copied { outline: 3px solid var(--theme-accent-soft); border-color: var(--theme-accent) !important; }

.field,
.select-field,
.textarea-field,
.ampol-app input:not([type="checkbox"]):not([type="radio"]),
.ampol-app textarea,
.ampol-app select {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background-color: var(--theme-panel-strong) !important;
}
.ampol-app input::placeholder,
.ampol-app textarea::placeholder { color: var(--theme-faint) !important; opacity: 1; }
.field-label,
.form-label { color: var(--theme-text) !important; }
.field-help { color: var(--theme-muted) !important; }

/* Legacy utility classes now inherit the selected accent instead of leaking green. */
.ampol-app [class*="text-emerald-"] { color: var(--theme-accent-2) !important; }
.ampol-app [class*="border-emerald-"] { border-color: var(--theme-line-strong) !important; }
.ampol-app [class*="bg-emerald-"] { background-color: var(--theme-accent-soft) !important; }
.ampol-app [class*="shadow-emerald-"] { --tw-shadow-color: var(--theme-shadow) !important; }
.ampol-app [class*="from-emerald-"] {
    --tw-gradient-from: var(--theme-accent-2) var(--tw-gradient-from-position) !important;
    --tw-gradient-to: color-mix(in srgb, var(--theme-accent-2) 0%, transparent) var(--tw-gradient-to-position) !important;
}
.ampol-app [class*="via-emerald-"] {
    --tw-gradient-to: color-mix(in srgb, var(--theme-accent) 0%, transparent) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--theme-accent) var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}
.ampol-app [class*="to-emerald-"] { --tw-gradient-to: var(--theme-accent) var(--tw-gradient-to-position) !important; }
.ampol-app :where([class~="bg-[#eef8f3]"],[class~="bg-[#edf7f2]"],[class~="bg-[#f3f8f5]"]) { background: var(--theme-panel-soft) !important; }

/* Header */
.ampol-site-header {
    position: fixed;
    inset: 0 0 auto;
    z-index: 80;
    border-bottom: 1px solid var(--theme-line);
    background: var(--theme-header);
    box-shadow: 0 10px 40px var(--theme-shadow);
    backdrop-filter: blur(22px) saturate(1.35);
}
.ampol-site-header__bar { display: flex; height: 4.7rem; align-items: center; justify-content: space-between; gap: 1rem; }
.ampol-header-spacer { height: 4.7rem; }
.ampol-brand { display: inline-flex; min-width: 0; align-items: center; gap: .7rem; color: var(--theme-text); }
.ampol-brand__mark { position: relative; display: grid; width: 2.65rem; height: 2.65rem; flex: 0 0 2.65rem; place-items: center; overflow: hidden; border-radius: .9rem; color: var(--theme-accent-contrast); background: linear-gradient(145deg,var(--theme-accent),var(--theme-accent-2)); box-shadow: 0 10px 26px color-mix(in srgb,var(--theme-accent) 28%,transparent); }
.ampol-brand__mark i { position: absolute; width: 2.2rem; height: 2.2rem; border: 1px solid rgba(255,255,255,.24); border-radius: 999px; }
.ampol-brand__mark b { position: relative; font-size: 1rem; font-weight: 1000; }
.ampol-brand__copy { min-width: 0; line-height: 1; }
.ampol-brand__copy > b { display: block; white-space: nowrap; font-size: 1.03rem; font-weight: 1000; letter-spacing: -.04em; color: var(--theme-text); }
.ampol-brand__copy > b i { color: var(--theme-accent); font-style: normal; }
.ampol-brand__copy small { display: block; margin-top: .42rem; white-space: nowrap; font-size: .43rem; font-weight: 900; letter-spacing: .18em; color: var(--theme-faint); }
.ampol-desktop-nav { display: none; align-items: center; gap: .2rem; padding: .25rem; border: 1px solid var(--theme-line); border-radius: 1rem; background: color-mix(in srgb,var(--theme-panel-strong) 72%,transparent); }
.ampol-desktop-nav a { position: relative; border-radius: .75rem; padding: .65rem .85rem; font-size: .72rem; font-weight: 850; color: var(--theme-muted); transition: .2s ease; }
.ampol-desktop-nav a:hover,
.ampol-desktop-nav a.is-active { color: var(--theme-accent-2); background: var(--theme-accent-soft); }
.ampol-desktop-nav a.is-active::after { content: ''; position: absolute; inset-inline: 30%; bottom: .22rem; height: 2px; border-radius: 99px; background: var(--theme-accent); }
.ampol-header-actions { display: flex; align-items: center; gap: .45rem; }
.ampol-header-icon,
.ampol-menu-button { position: relative; display: inline-flex; width: 2.55rem; height: 2.55rem; align-items: center; justify-content: center; border: 1px solid var(--theme-line); border-radius: .82rem; color: var(--theme-text); background: color-mix(in srgb,var(--theme-panel-strong) 78%,transparent); transition: .2s ease; }
.ampol-header-icon:hover,
.ampol-menu-button:hover { color: var(--theme-accent-2); border-color: var(--theme-line-strong); background: var(--theme-accent-soft); }
.ampol-header-icon svg,
.ampol-menu-button svg { width: 1.15rem; height: 1.15rem; }
.ampol-header-search { width: auto; gap: .42rem; padding-inline: .75rem; }
.ampol-header-search span { display: none; font-size: .64rem; font-weight: 900; }
.ampol-theme-shortcut { display: none; }
.ampol-header-count { position: absolute; inset-inline-end: -.28rem; top: -.3rem; min-width: 1.18rem; padding: .1rem .25rem; border: 2px solid var(--theme-panel-strong); border-radius: 999px; color: var(--theme-accent-contrast); background: var(--theme-accent); text-align: center; font-size: .52rem; font-weight: 1000; }
.ampol-header-alert { display: none; height: 2.55rem; align-items: center; gap: .45rem; border: 1px solid rgba(217,119,6,.26); border-radius: .82rem; padding-inline: .65rem; color: #8a5204; background: #fff4d7; font-size: .6rem; font-weight: 900; }
.ampol-header-alert span { display: grid; width: 1.15rem; height: 1.15rem; place-items: center; border-radius: 99px; color: #fff; background: #d97706; }
.ampol-account-button { display: none; height: 2.55rem; align-items: center; gap: .5rem; border: 1px solid var(--theme-line); border-radius: .82rem; padding: .25rem .4rem .25rem .7rem; color: var(--theme-text); background: var(--theme-panel-strong); }
.ampol-account-button span { display: grid; width: 1.9rem; height: 1.9rem; place-items: center; border-radius: .65rem; color: var(--theme-accent-contrast); background: linear-gradient(145deg,var(--theme-accent),var(--theme-accent-2)); font-size: .65rem; font-weight: 1000; }
.ampol-account-button b { font-size: .62rem; font-weight: 900; }
.ampol-login-button { display: none; align-items: center; justify-content: center; min-height: 2.55rem; border-radius: .82rem; padding: .6rem .9rem; font-size: .66rem; font-weight: 950; }
.ampol-menu-button { display: inline-flex; }
.ampol-mobile-menu { border-top: 1px solid var(--theme-line); background: var(--theme-header); box-shadow: 0 22px 52px var(--theme-shadow); }
.ampol-mobile-menu__grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .5rem; padding-block: .75rem; }
.ampol-mobile-menu__grid a { display: flex; min-height: 2.9rem; align-items: center; justify-content: center; border: 1px solid var(--theme-line); border-radius: .8rem; color: var(--theme-text); background: var(--theme-panel-soft); font-size: .72rem; font-weight: 900; }
.ampol-mobile-menu__grid a.is-primary { color: var(--theme-accent-contrast); border-color: transparent; background: var(--theme-accent); }
.ampol-mobile-menu__grid a.is-warning { grid-column: 1 / -1; color: #855009; border-color: rgba(217,119,6,.25); background: #fff4d7; }

.mobile-app-nav { border-color: var(--theme-line) !important; background: var(--theme-header) !important; box-shadow: 0 14px 45px var(--theme-shadow) !important; }
.mobile-app-nav > a { color: var(--theme-muted) !important; }
.mobile-app-nav > a.is-active { color: var(--theme-accent-2) !important; }
.mobile-app-nav__search > span { border-color: var(--theme-page) !important; color: var(--theme-accent-contrast) !important; background: linear-gradient(145deg,var(--theme-accent),var(--theme-accent-2)) !important; box-shadow: 0 12px 30px color-mix(in srgb,var(--theme-accent) 30%,transparent) !important; }

/* Home */
.ampol-home { min-height: 100vh; color: var(--theme-text); background: linear-gradient(150deg,var(--theme-page),var(--theme-page-alt)); }
.ampol-home-hero { position: relative; min-height: 42rem; overflow: hidden; border-bottom: 1px solid var(--theme-line); background: var(--theme-dark); }
.ampol-home-hero__image,
.ampol-home-hero__image img { position: absolute; inset: 0; width: 100%; height: 100%; }
.ampol-home-hero__image img { object-fit: cover; object-position: center; filter: saturate(.82) contrast(1.08); opacity: .34; }
.ampol-home-hero__overlay { position: absolute; inset: 0; background: radial-gradient(circle at 72% 36%,var(--theme-hero-glow),transparent 29rem),linear-gradient(90deg,color-mix(in srgb,var(--theme-dark) 98%,transparent) 0%,color-mix(in srgb,var(--theme-dark) 80%,transparent) 52%,color-mix(in srgb,var(--theme-dark) 35%,transparent) 100%),linear-gradient(to bottom,transparent 55%,var(--theme-dark)); }
.ampol-home-hero__grid { position: absolute; inset: 0; opacity: .11; background-image: linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px); background-size: 46px 46px; mask-image: linear-gradient(to bottom,black,transparent 85%); }
.ampol-home-hero__layout { position: relative; z-index: 2; display: grid; min-height: 36rem; align-items: center; padding-block: 3.5rem 2rem; }
.ampol-home-hero__copy { position: relative; z-index: 3; max-width: 45rem; }
.ampol-live-chip { display: inline-flex; align-items: center; gap: .55rem; border: 1px solid color-mix(in srgb,var(--theme-accent) 36%,transparent); border-radius: 999px; padding: .45rem .7rem; color: var(--theme-on-dark-muted); background: rgba(0,0,0,.28); backdrop-filter: blur(12px); font-size: .62rem; font-weight: 850; }
.ampol-live-chip i { width: .45rem; height: .45rem; border-radius: 99px; background: var(--theme-accent); box-shadow: 0 0 0 5px var(--theme-accent-soft); }
.ampol-live-chip b { border-inline-start: 1px solid rgba(255,255,255,.14); padding-inline-start: .55rem; color: var(--theme-accent-3); font-size: .55rem; }
.ampol-home-hero h1 { margin-top: 1.25rem; max-width: 43rem; color: var(--theme-on-dark); font-size: clamp(2.4rem,6vw,5.3rem); font-weight: 1000; line-height: 1.12; letter-spacing: -.055em; }
.ampol-home-hero h1 span { color: var(--theme-accent-3); text-shadow: 0 0 34px color-mix(in srgb,var(--theme-accent) 32%,transparent); }
.ampol-home-hero__copy > p { margin-top: 1.15rem; max-width: 39rem; color: var(--theme-on-dark-muted); font-size: .93rem; font-weight: 550; line-height: 2; }
.ampol-home-search { display: flex; max-width: 39rem; align-items: center; gap: .5rem; margin-top: 1.55rem; border: 1px solid rgba(255,255,255,.14); border-radius: 1.15rem; padding: .42rem; background: rgba(4,10,7,.66); box-shadow: 0 22px 70px rgba(0,0,0,.28); backdrop-filter: blur(18px); }
.ampol-home-search svg { width: 1.15rem; height: 1.15rem; flex: 0 0 auto; margin-inline-start: .65rem; color: var(--theme-on-dark-muted); }
.ampol-home-search input { min-width: 0; flex: 1; border: 0 !important; padding: .75rem .2rem !important; color: var(--theme-on-dark) !important; background: transparent !important; box-shadow: none !important; font-size: .75rem; }
.ampol-home-search input::placeholder { color: color-mix(in srgb,var(--theme-on-dark-muted) 65%,transparent) !important; }
.ampol-home-search button { min-height: 2.8rem; border-radius: .85rem; padding-inline: 1.1rem; color: var(--theme-accent-contrast); background: linear-gradient(135deg,var(--theme-accent),var(--theme-accent-2)); font-size: .68rem; font-weight: 950; }
.ampol-home-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.2rem; }
.ampol-home-trust { display: flex; flex-wrap: wrap; gap: .8rem 1rem; margin-top: 1.15rem; color: var(--theme-on-dark-muted); font-size: .61rem; font-weight: 800; }
.ampol-home-trust i { color: var(--theme-accent-3); font-style: normal; }
.ampol-home-hero__visual { position: absolute; z-index: 1; inset-inline-end: 3%; top: 50%; width: 31rem; height: 31rem; transform: translateY(-52%); opacity: .95; }
.ampol-ampoule { position: absolute; inset-inline-start: 50%; top: 50%; width: 9.5rem; height: 23rem; transform: translate(-50%,-50%) rotate(8deg); filter: drop-shadow(0 35px 65px rgba(0,0,0,.45)); animation: ampolV9Float 6s ease-in-out infinite; }
.ampol-ampoule__cap { position: absolute; inset-inline: 2.15rem; top: 0; height: 4rem; border: 1px solid rgba(255,255,255,.28); border-radius: 1.5rem 1.5rem .65rem .65rem; background: linear-gradient(90deg,rgba(255,255,255,.5),rgba(255,255,255,.12),rgba(255,255,255,.35)); }
.ampol-ampoule__glass { position: absolute; inset: 3.35rem .65rem 1.1rem; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; border: 1px solid rgba(255,255,255,.30); border-radius: 1.8rem 1.8rem 3.6rem 3.6rem; color: var(--theme-on-dark); background: linear-gradient(115deg,rgba(255,255,255,.22),rgba(255,255,255,.05) 40%,rgba(255,255,255,.13)); box-shadow: inset 0 0 38px rgba(255,255,255,.08); backdrop-filter: blur(10px); }
.ampol-ampoule__glass::after { content: ''; position: absolute; inset: 43% .3rem .3rem; border-radius: 1.2rem 1.2rem 3.2rem 3.2rem; background: linear-gradient(180deg,color-mix(in srgb,var(--theme-accent) 58%,transparent),var(--theme-accent-2)); box-shadow: 0 -10px 32px var(--theme-hero-glow); }
.ampol-ampoule__glass i { position: absolute; z-index: 2; inset-inline-start: 1rem; top: 1rem; width: .65rem; height: 70%; border-radius: 99px; background: linear-gradient(rgba(255,255,255,.65),transparent); opacity: .5; }
.ampol-ampoule__glass b,
.ampol-ampoule__glass small { position: relative; z-index: 3; }
.ampol-ampoule__glass b { font-size: 4rem; font-weight: 1000; line-height: 1; }
.ampol-ampoule__glass small { margin-top: .45rem; font-size: .55rem; font-weight: 950; letter-spacing: .3em; }
.ampol-ampoule__base { position: absolute; inset-inline: 1.6rem; bottom: 0; height: 1.5rem; border-radius: 999px; background: rgba(255,255,255,.24); filter: blur(.2px); }
.ampol-game-capsule { position: absolute; display: grid; grid-template-columns: 2.8rem 1fr; min-width: 9.5rem; align-items: center; gap: .55rem; border: 1px solid rgba(255,255,255,.15); border-radius: 1rem; padding: .55rem; color: var(--theme-on-dark); background: rgba(7,13,10,.58); box-shadow: 0 18px 48px rgba(0,0,0,.28); backdrop-filter: blur(14px); }
.ampol-game-capsule i { grid-row: 1 / 3; display: grid; width: 2.8rem; height: 2.8rem; place-items: center; border: 1px solid color-mix(in srgb,var(--theme-accent) 40%,transparent); border-radius: .8rem; color: var(--theme-accent-3); background: var(--theme-accent-soft); font-size: .7rem; font-style: normal; font-weight: 1000; }
.ampol-game-capsule b { align-self: end; font-size: .66rem; font-weight: 950; }
.ampol-game-capsule small { align-self: start; color: var(--theme-on-dark-muted); font-size: .5rem; }
.ampol-game-capsule.is-one { inset-inline-start: 0; top: 15%; transform: rotate(-4deg); }
.ampol-game-capsule.is-two { inset-inline-end: 0; top: 38%; transform: rotate(4deg); }
.ampol-game-capsule.is-three { inset-inline-start: 1rem; bottom: 9%; transform: rotate(2deg); }
.ampol-home-stats { position: relative; z-index: 3; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); max-width: 46rem; margin-inline: auto; transform: translateY(-1.25rem); overflow: hidden; border: 1px solid var(--theme-line); border-radius: 1.25rem; background: var(--theme-panel); box-shadow: 0 18px 55px var(--theme-shadow); backdrop-filter: blur(18px); }
.ampol-home-stats span { padding: .85rem; text-align: center; }
.ampol-home-stats span + span { border-inline-start: 1px solid var(--theme-line); }
.ampol-home-stats b { display: block; color: var(--theme-accent-2); font-size: 1.15rem; font-weight: 1000; }
.ampol-home-stats small { display: block; margin-top: .22rem; color: var(--theme-muted); font-size: .55rem; font-weight: 850; }
.ampol-home-section { padding-block: 3.5rem; }
.ampol-home-section.is-soft { border-block: 1px solid var(--theme-line); background: color-mix(in srgb,var(--theme-panel-soft) 74%,transparent); }
.ampol-section-head { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.ampol-section-head h2 { margin-top: .6rem; font-size: clamp(1.45rem,3vw,2.45rem); font-weight: 1000; }
.ampol-section-head div > p:last-child { margin-top: .5rem; font-size: .72rem; line-height: 1.8; }
.ampol-section-head > a { flex: 0 0 auto; color: var(--theme-accent-2); font-size: .68rem; font-weight: 950; }
.ampol-home-services { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .65rem; margin-top: 1.4rem; }
.ampol-home-service { position: relative; min-height: 10.5rem; overflow: hidden; border: 1px solid var(--theme-line); border-radius: 1.2rem; background: var(--theme-dark); box-shadow: 0 16px 42px var(--theme-shadow); transition: .25s ease; }
.ampol-home-service:hover { transform: translateY(-4px); border-color: var(--theme-line-strong); }
.ampol-home-service > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .45; transition: .5s ease; }
.ampol-home-service:hover > img { transform: scale(1.07); opacity: .57; }
.ampol-home-service > span { position: absolute; inset: 0; background: linear-gradient(to top,var(--theme-dark),transparent 75%); }
.ampol-home-service > div { position: absolute; z-index: 2; inset: auto .85rem .85rem; display: grid; grid-template-columns: 2.3rem 1fr; align-items: center; gap: .12rem .55rem; color: var(--theme-on-dark); }
.ampol-home-service i { grid-row: 1 / 3; display: grid; width: 2.3rem; height: 2.3rem; place-items: center; border-radius: .75rem; color: var(--theme-accent-contrast); background: var(--theme-accent); font-size: .6rem; font-style: normal; font-weight: 1000; }
.ampol-home-service b { align-self: end; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .74rem; font-weight: 950; }
.ampol-home-service small { align-self: start; color: var(--theme-on-dark-muted); font-size: .5rem; }
.ampol-empty-block { grid-column: 1 / -1; border: 1px dashed var(--theme-line); border-radius: 1rem; padding: 2rem; color: var(--theme-muted); text-align: center; font-size: .75rem; }
.ampol-home-benefits { display: grid; gap: .75rem; }
.ampol-home-benefits article { display: flex; align-items: flex-start; gap: .8rem; border: 1px solid var(--theme-line); border-radius: 1.2rem; padding: 1.1rem; background: var(--theme-panel); box-shadow: 0 14px 36px var(--theme-shadow); }
.ampol-home-benefits article > span { display: grid; width: 2.45rem; height: 2.45rem; flex: 0 0 auto; place-items: center; border-radius: .8rem; color: var(--theme-accent-contrast); background: linear-gradient(145deg,var(--theme-accent),var(--theme-accent-2)); font-size: .62rem; font-weight: 1000; }
.ampol-home-benefits b { color: var(--theme-text); font-size: .85rem; font-weight: 950; }
.ampol-home-benefits p { margin-top: .35rem; color: var(--theme-muted); font-size: .64rem; line-height: 1.9; }

/* Product cards stay cinematic but use the selected accent. */
.store-product-card { border-color: color-mix(in srgb,var(--theme-accent) 22%,transparent) !important; background: linear-gradient(155deg,var(--theme-dark-2),var(--theme-dark)) !important; box-shadow: 0 18px 48px var(--theme-shadow) !important; }
.store-product-card :where(.text-white,.text-zinc-100,.text-zinc-200) { color: var(--theme-on-dark) !important; }
.store-product-card :where(.text-zinc-400,.text-zinc-500,.text-zinc-600,.text-zinc-700) { color: var(--theme-on-dark-muted) !important; }
.store-product-card__category,
.store-product-card__commercial-badge,
.store-product-card__instant { border-color: color-mix(in srgb,var(--theme-accent) 28%,transparent) !important; color: var(--theme-on-dark) !important; background: color-mix(in srgb,var(--theme-dark) 82%,transparent) !important; }
.store-product-card__arrow { color: var(--theme-accent-3) !important; }
.store-filter-panel,
.store-search-results,
.store-empty-state,
.ampol-orders-table-wrap,
.ampol-orders-empty,
.ampol-mobile-order-card { color: var(--theme-text) !important; border-color: var(--theme-line) !important; background: var(--theme-panel) !important; box-shadow: 0 16px 44px var(--theme-shadow) !important; }
.ampol-mobile-order-card :where(b,strong) { color: var(--theme-text) !important; }
.ampol-mobile-order-card :where(small,span) { color: var(--theme-muted); }

/* Theme picker */
.ampol-theme-current { border: 1px solid var(--theme-line); border-radius: 999px; padding: .45rem .7rem; color: var(--theme-muted); background: var(--theme-panel-soft); font-size: .58rem; font-weight: 850; }
.ampol-theme-current b { color: var(--theme-accent-2); }
.ampol-theme-grid { display: grid; gap: .55rem; grid-template-columns: repeat(2,minmax(0,1fr)); }
.ampol-theme-choice { position: relative; display: flex; min-height: 5.1rem; cursor: pointer; align-items: center; gap: .65rem; border: 1px solid var(--theme-line); border-radius: 1rem; padding: .7rem; background: var(--theme-panel-soft); transition: .2s ease; }
.ampol-theme-choice:hover { transform: translateY(-2px); border-color: var(--theme-line-strong); }
.ampol-theme-choice > input { position: absolute; opacity: 0; pointer-events: none; }
.ampol-theme-choice:has(input:checked) { border-color: var(--theme-accent); background: var(--theme-accent-soft); box-shadow: 0 0 0 3px var(--theme-accent-soft); }
.ampol-theme-choice__swatches { display: flex; width: 2.65rem; height: 2.65rem; flex: 0 0 auto; overflow: hidden; border: 2px solid var(--theme-panel-strong); border-radius: .8rem; box-shadow: 0 7px 18px var(--theme-shadow); }
.ampol-theme-choice__swatches i { flex: 1; background: var(--swatch); }
.ampol-theme-choice__copy { min-width: 0; flex: 1; }
.ampol-theme-choice__copy b { display: block; color: var(--theme-text); font-size: .7rem; font-weight: 950; }
.ampol-theme-choice__copy small { display: block; margin-top: .2rem; color: var(--theme-muted); font-size: .52rem; line-height: 1.65; }
.ampol-theme-choice__check { display: grid; width: 1.35rem; height: 1.35rem; flex: 0 0 auto; place-items: center; border: 1px solid var(--theme-line); border-radius: 99px; color: transparent; font-size: .62rem; }
.ampol-theme-choice:has(input:checked) .ampol-theme-choice__check { color: var(--theme-accent-contrast); border-color: var(--theme-accent); background: var(--theme-accent); }

/* Checkbox system */
.ampol-check-option { color: var(--theme-text) !important; border-color: var(--theme-line) !important; background: var(--theme-panel-soft) !important; }
.ampol-check-option:hover { border-color: var(--theme-line-strong) !important; background: var(--theme-accent-soft) !important; }
.ampol-check-box { border-color: var(--theme-faint) !important; background: var(--theme-panel-strong) !important; }
.ampol-check-copy b { color: var(--theme-text) !important; }
.ampol-check-copy small { color: var(--theme-muted) !important; }
.ampol-check-input:checked ~ .ampol-check-box { color: var(--theme-accent-contrast) !important; border-color: var(--theme-accent) !important; background: linear-gradient(145deg,var(--theme-accent-2),var(--theme-accent)) !important; box-shadow: 0 0 0 4px var(--theme-accent-soft) !important; }
.ampol-check-input:checked ~ .ampol-check-state { color: var(--theme-accent-2) !important; background: var(--theme-accent-soft) !important; }
.ampol-check-option:has(.ampol-check-input:checked) { border-color: var(--theme-line-strong) !important; background: var(--theme-accent-soft) !important; }

/* Admin queue counters and quick view */
.ampol-admin-count { display: inline-flex; min-width: 1.5rem; height: 1.5rem; align-items: center; justify-content: center; border-radius: 999px; padding-inline: .35rem; color: var(--theme-accent-contrast); background: var(--theme-accent); box-shadow: 0 7px 20px color-mix(in srgb,var(--theme-accent) 28%,transparent); font-size: .56rem; font-weight: 1000; }
.ampol-eye-button { display: inline-flex; width: 2.45rem; height: 2.45rem; align-items: center; justify-content: center; border: 1px solid var(--theme-line-strong); border-radius: .8rem; color: var(--theme-accent-2); background: var(--theme-accent-soft); transition: .2s ease; }
.ampol-eye-button:hover { transform: translateY(-2px); color: var(--theme-accent-contrast); background: var(--theme-accent); }
.ampol-eye-button svg { width: 1.2rem; height: 1.2rem; }
.ampol-order-sidebar { color: var(--theme-text); border-color: var(--theme-line) !important; background: var(--theme-panel-strong) !important; box-shadow: 0 22px 70px var(--theme-shadow) !important; }
.ampol-order-sidebar :where(.text-white,.text-zinc-200) { color: var(--theme-text) !important; }
.ampol-order-sidebar :where(.text-zinc-500,.text-zinc-600,.text-zinc-700) { color: var(--theme-muted) !important; }
.ampol-order-sidebar [class*="bg-white"] { color: var(--theme-text); background: var(--theme-panel-soft) !important; }
.ampol-quick-order-drawer { color: var(--theme-text); border-inline-start: 1px solid var(--theme-line); background: var(--theme-panel-strong); box-shadow: -24px 0 90px rgba(0,0,0,.25); }
.ampol-quick-order-drawer__head,
.ampol-quick-order-drawer__foot { flex: 0 0 auto; border-color: var(--theme-line); background: var(--theme-panel-soft); }
.ampol-quick-order-drawer__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--theme-line); padding: 1rem 1.1rem; }
.ampol-quick-order-drawer__head p { color: var(--theme-accent-2); font-size: .55rem; font-weight: 1000; letter-spacing: .16em; }
.ampol-quick-order-drawer__head h2 { margin-top: .25rem; color: var(--theme-text); font-size: 1.25rem; font-weight: 1000; }
.ampol-quick-order-drawer__head button { display: grid; width: 2.3rem; height: 2.3rem; place-items: center; border: 1px solid var(--theme-line); border-radius: .75rem; color: var(--theme-text); background: var(--theme-panel-strong); font-size: 1.25rem; }
.ampol-quick-order-drawer__body { min-height: 0; flex: 1; overflow-y: auto; padding: 1rem; }
.ampol-quick-order-drawer__foot { border-top: 1px solid var(--theme-line); padding: .8rem 1rem calc(.8rem + env(safe-area-inset-bottom)); }
.ampol-quick-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .6rem; border: 1px solid var(--theme-line); border-radius: 1rem; padding: .75rem; background: var(--theme-panel-soft); }
.ampol-quick-summary > div { min-width: 0; }
.ampol-quick-summary small { display: block; color: var(--theme-muted); font-size: .55rem; }
.ampol-quick-summary b { display: block; margin-top: .25rem; overflow: hidden; color: var(--theme-text); text-overflow: ellipsis; white-space: nowrap; font-size: .74rem; font-weight: 950; }
.ampol-quick-summary span:not(.status-pill) { display: block; margin-top: .15rem; overflow: hidden; color: var(--theme-muted); text-overflow: ellipsis; white-space: nowrap; font-size: .54rem; }
.ampol-quick-item { border: 1px solid var(--theme-line); border-radius: 1.1rem; padding: .85rem; background: var(--theme-panel); box-shadow: 0 12px 30px var(--theme-shadow); }
.ampol-quick-item__title { display: flex; align-items: flex-start; justify-content: space-between; gap: .7rem; }
.ampol-quick-item__title small { color: var(--theme-accent-2); font-size: .52rem; font-weight: 950; }
.ampol-quick-item__title h3 { margin-top: .2rem; color: var(--theme-text); font-size: .78rem; font-weight: 950; }
.ampol-quick-data { display: grid; gap: .4rem; margin-top: .75rem; }
.ampol-quick-data > div { display: grid; grid-template-columns: minmax(0,.75fr) minmax(0,1fr) auto; align-items: center; gap: .45rem; border: 1px solid var(--theme-line); border-radius: .75rem; padding: .55rem .6rem; background: var(--theme-panel-soft); }
.ampol-quick-data small { color: var(--theme-muted); font-size: .52rem; font-weight: 800; }
.ampol-quick-data span { overflow: hidden; color: var(--theme-text); text-overflow: ellipsis; white-space: nowrap; font-size: .61rem; font-weight: 850; }
.ampol-quick-data button { border-radius: .55rem; padding: .32rem .48rem; color: var(--theme-accent-2); background: var(--theme-accent-soft); font-size: .5rem; font-weight: 950; }
.ampol-quick-denied { margin-top: .7rem; border: 1px solid rgba(217,119,6,.2); border-radius: .75rem; padding: .65rem; color: #8a5204; background: #fff4d7; font-size: .56rem; font-weight: 850; }
.ampol-copy-toast { position: fixed; z-index: 200; inset-inline-start: 50%; bottom: calc(5.5rem + env(safe-area-inset-bottom)); transform: translate(-50%,1rem); pointer-events: none; border: 1px solid color-mix(in srgb,var(--theme-accent) 38%,transparent); border-radius: 999px; padding: .6rem .9rem; color: var(--theme-accent-contrast); background: var(--theme-accent-2); box-shadow: 0 14px 40px rgba(0,0,0,.25); opacity: 0; font-size: .66rem; font-weight: 950; transition: .2s ease; }
.ampol-copy-toast.is-visible { transform: translate(-50%,0); opacity: 1; }

/* Checkout: all payment choices share one contrast-safe component. */
.is-checkout-route .ampol-checkout-page section,
.is-checkout-route .ampol-checkout-page aside { color: var(--theme-text) !important; border-color: var(--theme-line) !important; background: linear-gradient(150deg,var(--theme-panel),var(--theme-panel-soft)) !important; box-shadow: 0 20px 58px var(--theme-shadow) !important; }
.is-checkout-route .ampol-checkout-page section :where(h1,h2,h3,b,strong,.text-white),
.is-checkout-route .ampol-checkout-page aside :where(h1,h2,h3,b,strong,.text-white) { color: var(--theme-text) !important; }
.is-checkout-route .ampol-checkout-page section :where(p,small,.text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600),
.is-checkout-route .ampol-checkout-page aside :where(p,small,.text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600) { color: var(--theme-muted) !important; }
.ampol-payment-option { position: relative; color: var(--theme-text) !important; border-color: var(--theme-line) !important; background: var(--theme-panel-strong) !important; box-shadow: 0 9px 24px var(--theme-shadow); }
.ampol-payment-option:hover,
.ampol-payment-option:has(input:checked) { border-color: var(--theme-accent) !important; background: var(--theme-accent-soft) !important; box-shadow: 0 0 0 3px var(--theme-accent-soft); }
.ampol-payment-option :where(b,strong,span,small,p) { color: var(--theme-text) !important; }
.ampol-payment-option small,
.ampol-payment-option span[class*="text-"] { color: var(--theme-muted) !important; }
.ampol-payment-option input[type="radio"] { accent-color: var(--theme-accent); }

/* Success, action dialog and dashboard readability. */
.purchase-success-card { color: var(--theme-text) !important; border-color: var(--theme-line-strong) !important; background: var(--theme-panel-strong) !important; box-shadow: 0 26px 75px var(--theme-shadow) !important; }
.purchase-success-card :where(h1,h2,h3,b,strong) { color: var(--theme-text) !important; }
.purchase-success-card :where(p,small,span) { color: var(--theme-muted); }
.success-orbit { color: var(--theme-accent-contrast) !important; background: linear-gradient(145deg,var(--theme-accent),var(--theme-accent-2)) !important; box-shadow: 0 0 0 10px var(--theme-accent-soft),0 18px 44px var(--theme-shadow) !important; }
.ampol-success-metric { color: var(--theme-text) !important; border: 1px solid var(--theme-line); background: var(--theme-panel-soft) !important; }
.ampol-success-page > .page-shell > section + section h2 { color: var(--theme-text) !important; }
.ampol-success-page > .page-shell > section + section > div > a { color: var(--theme-accent-2) !important; }
.ampol-action-dialog__panel { color: var(--theme-text) !important; border-color: var(--theme-line-strong) !important; background: var(--theme-panel-strong) !important; }
.ampol-action-dialog__header,
.ampol-action-dialog__footer { border-color: var(--theme-line) !important; background: var(--theme-panel-soft) !important; }
.ampol-action-dialog :where(b,p,span,label,legend) { color: var(--theme-text) !important; }
.ampol-action-dialog__body { overscroll-behavior: contain; }
.ampol-check-row { color: var(--theme-text) !important; border-color: var(--theme-line) !important; background: var(--theme-panel-soft) !important; }
.ampol-check-row:has(input:checked) { border-color: var(--theme-accent) !important; background: var(--theme-accent-soft) !important; }
.ampol-order-workspace article > .mt-6.grid > div { color: var(--theme-text) !important; border-color: var(--theme-line) !important; background: var(--theme-panel-soft) !important; }
.ampol-order-workspace article > .mt-6.grid > div :where(small,b,span) { color: var(--theme-text) !important; }
.ampol-order-workspace article > .mt-6.grid > div small { color: var(--theme-muted) !important; }
.ampol-correction-required-card,
.ampol-kyc-required-card { border-color: rgba(217,119,6,.30) !important; background: linear-gradient(145deg,#422d0e,#211a0e) !important; }
.ampol-correction-required-card :where(h1,h2,h3,b,strong),
.ampol-kyc-required-card :where(h1,h2,h3,b,strong) { color: #fff9e8 !important; }

@media (min-width: 640px) {
    .ampol-account-button,
    .ampol-login-button { display: inline-flex; }
    .ampol-theme-shortcut { display: inline-flex; }
    .ampol-header-search span { display: inline; }
    .ampol-theme-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .ampol-home-services { grid-template-columns: repeat(4,minmax(0,1fr)); gap: .85rem; }
    .ampol-home-benefits { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (min-width: 800px) {
    .ampol-header-alert { display: inline-flex; }
}

@media (min-width: 1024px) {
    .ampol-desktop-nav { display: flex; }
    .ampol-menu-button { display: none; }
    .ampol-home-hero__layout { grid-template-columns: minmax(0,1fr) 31rem; min-height: 39rem; }
    .ampol-home-hero__visual { position: relative; inset: auto; top: auto; width: 31rem; height: 31rem; transform: none; }
    .ampol-theme-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }
}

@media (max-width: 1023px) {
    .ampol-home-hero__visual { inset-inline-end: -8rem; opacity: .44; }
}

@media (max-width: 640px) {
    .ampol-site-header__bar { height: 4.1rem; }
    .ampol-header-spacer { height: 4.1rem; }
    .ampol-brand__mark { width: 2.35rem; height: 2.35rem; flex-basis: 2.35rem; border-radius: .78rem; }
    .ampol-brand__copy > b { font-size: .86rem; }
    .ampol-brand__copy small { display: none; }
    .ampol-header-search { display: none; }
    .ampol-header-icon,
    .ampol-menu-button { width: 2.35rem; height: 2.35rem; }
    .ampol-home-hero { min-height: 37rem; }
    .ampol-home-hero__layout { min-height: 33rem; padding-block: 2.8rem 1.4rem; }
    .ampol-home-hero__copy { text-align: center; }
    .ampol-live-chip { margin-inline: auto; }
    .ampol-home-hero h1 { margin-inline: auto; margin-top: 1rem; font-size: clamp(2rem,11vw,3rem); }
    .ampol-home-hero__copy > p { margin-inline: auto; font-size: .76rem; line-height: 1.9; }
    .ampol-home-search { margin-top: 1.25rem; border-radius: 1rem; }
    .ampol-home-search svg { display: none; }
    .ampol-home-search input { font-size: .66rem; }
    .ampol-home-search button { min-height: 2.55rem; padding-inline: .8rem; font-size: .6rem; }
    .ampol-home-actions,
    .ampol-home-trust { justify-content: center; }
    .ampol-home-hero__visual { inset-inline-end: -9rem; top: 45%; transform: translateY(-50%) scale(.83); opacity: .25; }
    .ampol-home-stats { width: calc(100% - 1.5rem); border-radius: 1rem; }
    .ampol-home-stats b { font-size: .92rem; }
    .ampol-home-stats small { font-size: .48rem; }
    .ampol-home-section { padding-block: 2.4rem; }
    .ampol-section-head { align-items: flex-start; }
    .ampol-section-head h2 { font-size: 1.25rem; }
    .ampol-section-head div > p:last-child { font-size: .62rem; }
    .ampol-section-head > a { display: none; }
    .ampol-home-service { min-height: 8.7rem; border-radius: 1rem; }
    .ampol-home-service > div { inset: auto .65rem .65rem; }

    .store-product-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: .55rem !important; }
    .store-product-card { border-radius: 1rem !important; }
    .store-product-card__visual { aspect-ratio: 1 / 1 !important; }
    .store-product-card > div { padding: .68rem !important; }
    .store-product-card > div > div:first-child { font-size: .46rem !important; }
    .store-product-card > div > a { min-height: 2.45rem !important; margin-top: .45rem !important; font-size: .66rem !important; line-height: 1.25rem !important; }
    .store-product-card > div > div:last-child { margin-top: .45rem !important; padding-top: .55rem !important; }
    .store-product-card__category,
    .store-product-card__discount,
    .store-product-card__commercial-badge,
    .store-product-card__instant { padding: .25rem .4rem !important; font-size: .45rem !important; }
    .store-product-card__arrow { width: 1.85rem !important; height: 1.85rem !important; }

    .dashboard-grid,
    .dashboard-grid > section { gap: .65rem !important; }
    .account-hero { border-radius: 1.2rem !important; padding: .9rem !important; }
    .account-hero h1 { font-size: 1.35rem !important; line-height: 1.5 !important; }
    .account-hero p { font-size: .64rem !important; line-height: 1.7 !important; }
    .account-metrics { gap: .45rem !important; }
    .account-metrics .metric-card { min-height: 5.2rem !important; border-radius: .9rem !important; padding: .65rem !important; }
    .ampol-theme-panel { border-radius: 1.1rem !important; padding: .85rem !important; }
    .ampol-theme-grid { gap: .42rem; }
    .ampol-theme-choice { min-height: 4.35rem; gap: .45rem; border-radius: .8rem; padding: .5rem; }
    .ampol-theme-choice__swatches { width: 2.1rem; height: 2.1rem; border-radius: .6rem; }
    .ampol-theme-choice__copy b { font-size: .6rem; }
    .ampol-theme-choice__copy small { display: none; }

    .ampol-mobile-order-card { border-radius: 1rem !important; padding: .75rem !important; }
    .ampol-mobile-order-card__main { margin-block: .45rem !important; padding-block: .45rem !important; }
    .ampol-order-metrics { gap: .45rem !important; }
    .ampol-order-metrics article { min-height: 4.2rem !important; border-radius: .85rem !important; padding: .55rem !important; }

    .ampol-action-dialog__panel { width: calc(100vw - .75rem) !important; max-height: calc(100dvh - .75rem) !important; border-radius: 1rem !important; }
    .ampol-action-dialog__header,
    .ampol-action-dialog__footer { position: relative; z-index: 2; padding: .75rem !important; }
    .ampol-action-dialog__body { padding: .75rem !important; }
    .ampol-quick-order-drawer__body { padding: .75rem; }
    .ampol-quick-data > div { grid-template-columns: minmax(0,.7fr) minmax(0,1fr) auto; }
    .ampol-copy-toast { bottom: calc(5.2rem + env(safe-area-inset-bottom)); }
}

@media (max-width: 370px) {
    .store-product-grid { grid-template-columns: minmax(0,1fr) !important; }
    .store-product-card__visual { aspect-ratio: 1.5 / 1 !important; }
}

@media (prefers-reduced-motion: reduce) {
    .ampol-ampoule { animation: none; }
}

@keyframes ampolV9Float {
    0%,100% { transform: translate(-50%,-50%) rotate(8deg); }
    50% { transform: translate(-50%,calc(-50% - 14px)) rotate(5deg); }
}

/* ======================================================================
   AMPOLSHOP V9.1 — global contrast contract
   The older V7/V8 compatibility layers are still loaded for component
   geometry. These selectors deliberately carry enough specificity to make
   the selected theme authoritative on every route.
   ====================================================================== */

html[data-theme] body.ampol-app {
    --ui-text-primary: var(--theme-text);
    --ui-text-secondary: var(--theme-muted);
    --ui-text-muted: var(--theme-faint);
    --ui-border: var(--theme-line);
    --ui-field-bg: var(--theme-panel-strong);
    --ui-field-border: var(--theme-line);
    --ui-soft-bg: var(--theme-panel-soft);
    --ui-soft-hover: var(--theme-accent-soft);
    color: var(--theme-text) !important;
}

/* Every standard application surface follows one foreground/background pair. */
html[data-theme] body.ampol-app :is(
    .premium-panel,
    .glass-panel,
    .glass-panel-hover,
    .metric-card,
    .admin-surface,
    .admin-order-row,
    .ticket-row,
    .account-recent,
    .account-support,
    .account-activity,
    .ampol-product-permission-card,
    .ampol-orders-table-wrap,
    .ampol-orders-empty,
    .ampol-mobile-order-card,
    .store-filter-panel,
    .store-empty-state,
    .product-order-card,
    .product-info-panel,
    .product-support-panel,
    .purchase-success-card,
    .ampol-action-dialog__panel,
    .ampol-order-sidebar,
    .ampol-quick-order-drawer
) {
    --ui-text-primary: var(--theme-text);
    --ui-text-secondary: var(--theme-muted);
    --ui-text-muted: var(--theme-faint);
    --ui-border: var(--theme-line);
    --ui-field-bg: var(--theme-panel-strong);
    --ui-field-border: var(--theme-line);
    --ui-soft-bg: var(--theme-panel-soft);
    --ui-soft-hover: var(--theme-accent-soft);
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: linear-gradient(150deg,var(--theme-panel),var(--theme-panel-soft)) !important;
    color-scheme: normal;
}

/* Admin pages must not be forced back to the old Obsidian palette. */
html[data-theme] body.ampol-app .ampol-admin-ui {
    --ui-text-primary: var(--theme-text);
    --ui-text-secondary: var(--theme-muted);
    --ui-text-muted: var(--theme-faint);
    color: var(--theme-text) !important;
    background:
        radial-gradient(circle at 11% 8%,var(--theme-accent-soft),transparent 28rem),
        radial-gradient(circle at 90% 75%,color-mix(in srgb,var(--theme-accent-2) 10%,transparent),transparent 34rem),
        linear-gradient(150deg,var(--theme-page),var(--theme-page-alt)) !important;
}
html[data-theme] body.ampol-app .ampol-admin-ui :is(.premium-panel,.glass-panel,.admin-surface,.metric-card) {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: linear-gradient(150deg,var(--theme-panel),var(--theme-panel-soft)) !important;
    box-shadow: 0 20px 58px var(--theme-shadow) !important;
}

/* Legacy text utilities become semantic instead of literal colours. */
html[data-theme] body.ampol-app :is(
    .text-white,
    .text-slate-900,.text-slate-800,.text-slate-700,
    .text-gray-900,.text-gray-800,.text-gray-700,
    .text-zinc-900,.text-zinc-800,.text-zinc-700,
    .text-zinc-100,.text-zinc-200
) { color: var(--theme-text) !important; text-shadow: none; }

html[data-theme] body.ampol-app :is(
    .text-slate-600,.text-slate-500,.text-slate-400,
    .text-gray-600,.text-gray-500,.text-gray-400,
    .text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600
) { color: var(--theme-muted) !important; text-shadow: none; }

html[data-theme] body.ampol-app :is(.text-emerald-300,.text-emerald-400,.text-emerald-500,.text-emerald-600,.text-emerald-700,.text-emerald-800) {
    color: var(--theme-accent-text) !important;
}

html[data-theme] body.ampol-app :is(
    .premium-panel,.glass-panel,.glass-panel-hover,.metric-card,.admin-surface,
    .admin-order-row,.ticket-row,.account-recent,.account-support,.account-activity,
    .ampol-product-permission-card,.ampol-orders-table-wrap,.ampol-mobile-order-card,
    .product-order-card,.product-info-panel,.product-support-panel,.purchase-success-card,
    .ampol-action-dialog__panel,.ampol-order-sidebar,.ampol-quick-order-drawer
) :is(
    h1,h2,h3,h4,h5,h6,b,strong,
    .text-white,.text-slate-900,.text-slate-800,.text-slate-700,
    .text-gray-900,.text-gray-800,.text-gray-700,
    .text-zinc-900,.text-zinc-800,.text-zinc-700,.text-zinc-100,.text-zinc-200
) { color: var(--theme-text) !important; text-shadow: none !important; }

html[data-theme] body.ampol-app :is(
    .premium-panel,.glass-panel,.glass-panel-hover,.metric-card,.admin-surface,
    .admin-order-row,.ticket-row,.account-recent,.account-support,.account-activity,
    .ampol-product-permission-card,.ampol-orders-table-wrap,.ampol-mobile-order-card,
    .product-order-card,.product-info-panel,.product-support-panel,.purchase-success-card,
    .ampol-action-dialog__panel,.ampol-order-sidebar,.ampol-quick-order-drawer
) :is(
    p,small,
    .text-slate-600,.text-slate-500,.text-slate-400,
    .text-gray-600,.text-gray-500,.text-gray-400,
    .text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600
) { color: var(--theme-muted) !important; text-shadow: none !important; }

/* Pale utility cards stay theme-aware, including in Graphite. */
html[data-theme] body.ampol-app :is(
    [class~="bg-white"],[class~="bg-white/5"],[class~="bg-white/10"],[class~="bg-white/15"],[class~="bg-white/25"],
    [class~="bg-white/70"],[class~="bg-white/75"],[class~="bg-white/85"],[class~="bg-white/90"],[class~="bg-white/92"],[class~="bg-white/95"],
    [class~="bg-white/[.02]"],[class~="bg-white/[.025]"],[class~="bg-white/[.03]"],[class~="bg-white/[.035]"],
    [class~="bg-white/[.04]"],[class~="bg-white/[.05]"],[class~="bg-white/[.06]"],[class~="bg-white/[.07]"],[class~="bg-white/[.10]"],
    [class~="bg-white/[0.03]"],[class~="bg-white/[0.035]"],
    [class~="bg-slate-50"],[class~="bg-emerald-50"],[class~="bg-emerald-50/40"],
    [class~="bg-emerald-50/50"],[class~="bg-emerald-50/55"],[class~="bg-emerald-50/60"],[class~="bg-emerald-50/70"],
    [class~="bg-emerald-50/90"],[class~="bg-[#eef8f3]"],[class~="bg-[#edf7f2]"],
    [class~="bg-[#e9f5ef]"],[class~="bg-[#effaf4]"],[class~="bg-[#f2faf6]"],
    [class~="bg-[#f2faf5]"],[class~="bg-[#f4faf7]"],[class~="bg-[#f0f7f4]"]
) {
    --ui-text-primary: var(--theme-text);
    --ui-text-secondary: var(--theme-muted);
    --ui-text-muted: var(--theme-faint);
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: var(--theme-panel-soft) !important;
    color-scheme: normal;
}
html[data-theme] body.ampol-app :is(
    [class~="bg-white"],[class~="bg-white/5"],[class~="bg-white/10"],[class~="bg-white/15"],[class~="bg-white/25"],
    [class~="bg-white/70"],[class~="bg-white/75"],[class~="bg-white/85"],[class~="bg-white/90"],[class~="bg-white/92"],[class~="bg-white/95"],
    [class~="bg-white/[.02]"],[class~="bg-white/[.025]"],[class~="bg-white/[.03]"],[class~="bg-white/[.035]"],
    [class~="bg-white/[.04]"],[class~="bg-white/[.05]"],[class~="bg-white/[.06]"],[class~="bg-white/[.07]"],[class~="bg-white/[.10]"],
    [class~="bg-white/[0.03]"],[class~="bg-white/[0.035]"],[class~="bg-slate-50"],
    [class~="bg-emerald-50"],[class~="bg-emerald-50/40"],[class~="bg-emerald-50/50"],
    [class~="bg-emerald-50/55"],[class~="bg-emerald-50/60"],[class~="bg-emerald-50/70"],[class~="bg-emerald-50/90"],
    [class~="bg-[#eef8f3]"],[class~="bg-[#edf7f2]"],[class~="bg-[#e9f5ef]"],
    [class~="bg-[#effaf4]"],[class~="bg-[#f2faf6]"],[class~="bg-[#f2faf5]"],
    [class~="bg-[#f4faf7]"],[class~="bg-[#f0f7f4]"]
) :is(h1,h2,h3,h4,h5,h6,p,span,b,strong,small,label,legend,th,td,a):not(.btn-primary):not(.btn-danger):not(.status-pill) {
    color: var(--theme-text) !important;
    text-shadow: none !important;
}
html[data-theme] body.ampol-app :is(
    [class~="bg-white"],[class~="bg-white/5"],[class~="bg-white/10"],[class~="bg-white/15"],[class~="bg-white/25"],
    [class~="bg-white/70"],[class~="bg-white/75"],[class~="bg-white/85"],[class~="bg-white/90"],[class~="bg-white/92"],[class~="bg-white/95"],
    [class~="bg-white/[.02]"],[class~="bg-white/[.025]"],[class~="bg-white/[.03]"],[class~="bg-white/[.035]"],
    [class~="bg-white/[.04]"],[class~="bg-white/[.05]"],[class~="bg-white/[.06]"],[class~="bg-white/[.07]"],[class~="bg-white/[.10]"],
    [class~="bg-white/[0.03]"],[class~="bg-white/[0.035]"],[class~="bg-slate-50"],
    [class~="bg-emerald-50"],[class~="bg-emerald-50/40"],[class~="bg-emerald-50/50"],
    [class~="bg-emerald-50/55"],[class~="bg-emerald-50/60"],[class~="bg-emerald-50/70"],[class~="bg-emerald-50/90"]
) :is(.text-slate-600,.text-slate-500,.text-slate-400,.text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600,small) {
    color: var(--theme-muted) !important;
}

/* Inputs, selects and textareas always match the containing theme surface. */
html[data-theme] body.ampol-app :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea,.field,.select-field,.textarea-field,.product-order-field) {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: var(--theme-panel-strong) !important;
    caret-color: var(--theme-accent);
    color-scheme: normal;
}
html[data-theme] body.ampol-app :is(input,textarea)::placeholder { color: var(--theme-faint) !important; opacity: 1 !important; }
html[data-theme] body.ampol-app option { color: var(--theme-text) !important; background: var(--theme-panel-strong) !important; }
html[data-theme] body.ampol-app :is(.field-label,.form-label) { color: var(--theme-text) !important; }
html[data-theme] body.ampol-app .field-help { color: var(--theme-muted) !important; }

/* Primary/accent controls use a separately audited foreground pair. */
html[data-theme] body.ampol-app :is(
    .btn-primary,.ampol-login-button,.product-order-submit,.free-fire-verify-button,
    .ampol-admin-count,.ampol-eye-button:hover,.success-orbit,
    .ampol-brand__mark,.ampol-header-count,.ampol-account-button > span,
    .mobile-app-nav__search > span,.ampol-home-search button,
    .ampol-home-service i,.ampol-home-benefits article > span
),
html[data-theme] body.ampol-app .ampol-theme-choice:has(input:checked) .ampol-theme-choice__check {
    color: var(--theme-action-text) !important;
    border-color: transparent !important;
    background: linear-gradient(120deg,var(--theme-action-from),var(--theme-action-to)) !important;
}
html[data-theme] body.ampol-app :is(
    .btn-primary,.ampol-login-button,.product-order-submit,.free-fire-verify-button,
    .ampol-admin-count,.ampol-eye-button:hover,.success-orbit,
    .ampol-brand__mark,.ampol-header-count,.ampol-account-button > span,
    .mobile-app-nav__search > span,.ampol-home-search button,
    .ampol-home-service i,.ampol-home-benefits article > span
) * {
    color: var(--theme-action-text) !important;
}
html[data-theme] body.ampol-app :is(a,button,span,div,section)[class*="text-white"][class*="from-emerald-"]:not(.ampol-payment-option) {
    --tw-gradient-from: var(--theme-action-from) var(--tw-gradient-from-position) !important;
    --tw-gradient-to: var(--theme-action-to) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--theme-action-from),var(--theme-action-to) !important;
    color: var(--theme-action-text) !important;
}
html[data-theme] body.ampol-app :is(a,button,span,div,section)[class*="text-white"][class*="from-emerald-"]:not(.ampol-payment-option) :is(span,b,strong,small,svg) {
    color: var(--theme-action-text) !important;
}
html[data-theme] body.ampol-app :is(.bg-emerald-500,.bg-emerald-600,.bg-emerald-700,.bg-emerald-800) {
    color: var(--theme-action-text) !important;
    background: var(--theme-action-from) !important;
}

/* Deliberately dark/cinematic regions use the inverse foreground tokens. */
html[data-theme] body.ampol-app :is(
    .ampol-dark-surface,.store-product-card,.product-service-artwork,
    .ampol-home-hero,.ampol-home-service,.ampol-home-search,.ampol-game-capsule,
    .ampol-correction-required-card,.ampol-kyc-required-card
) {
    --ui-text-primary: var(--theme-on-dark);
    --ui-text-secondary: var(--theme-on-dark-muted);
    --ui-text-muted: var(--theme-on-dark-muted);
    color: var(--theme-on-dark) !important;
    color-scheme: dark;
}
html[data-theme] body.ampol-app :is(
    .ampol-dark-surface,.store-product-card,.product-service-artwork,
    .ampol-home-hero,.ampol-home-service,.ampol-home-search,.ampol-game-capsule,
    .ampol-correction-required-card,.ampol-kyc-required-card
) :is(h1,h2,h3,h4,b,strong,.text-white,.text-zinc-100,.text-zinc-200,.text-slate-900,.text-slate-800) {
    color: var(--theme-on-dark) !important;
}
html[data-theme] body.ampol-app :is(
    .ampol-dark-surface,.store-product-card,.product-service-artwork,
    .ampol-home-hero,.ampol-home-service,.ampol-home-search,.ampol-game-capsule,
    .ampol-correction-required-card,.ampol-kyc-required-card
) :is(p,small,.text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600,.text-slate-500,.text-slate-400) {
    color: var(--theme-on-dark-muted) !important;
}
html[data-theme] body.ampol-app :is(
    .ampol-dark-surface,.store-product-card,.product-service-artwork,
    .ampol-home-hero,.ampol-home-service,.ampol-home-search,.ampol-game-capsule,
    .ampol-correction-required-card,.ampol-kyc-required-card
) :is(
    [class~="bg-white/5"],[class~="bg-white/10"],[class~="bg-white/15"],[class~="bg-white/25"],
    [class~="bg-white/[.02]"],[class~="bg-white/[.025]"],[class~="bg-white/[.03]"],[class~="bg-white/[.035]"],
    [class~="bg-white/[.04]"],[class~="bg-white/[.05]"],[class~="bg-white/[.06]"],[class~="bg-white/[.07]"],[class~="bg-white/[.10]"]
) {
    color: var(--theme-on-dark) !important;
    border-color: rgba(255,255,255,.14) !important;
    background: rgba(255,255,255,.07) !important;
}
html[data-theme] body.ampol-app :is(
    .ampol-dark-surface,.store-product-card,.product-service-artwork,
    .ampol-home-hero,.ampol-home-service,.ampol-home-search,.ampol-game-capsule,
    .ampol-correction-required-card,.ampol-kyc-required-card
) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea) {
    color: var(--theme-on-dark) !important;
    border-color: rgba(255,255,255,.16) !important;
    background: rgba(0,0,0,.34) !important;
    color-scheme: dark;
}
html[data-theme] body.ampol-app .ampol-home-search input { background: transparent !important; }

/* Tables and rows no longer mix a pale cell with a pale foreground. */
html[data-theme] body.ampol-app .admin-table { color: var(--theme-text) !important; }
html[data-theme] body.ampol-app .admin-table th {
    color: var(--theme-muted) !important;
    border-color: var(--theme-line) !important;
    background: var(--theme-panel-soft) !important;
}
html[data-theme] body.ampol-app .admin-table td {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: transparent !important;
}
html[data-theme] body.ampol-app .admin-table td :is(b,strong,.text-white,.text-slate-900,.text-zinc-100,.text-zinc-200) { color: var(--theme-text) !important; }
html[data-theme] body.ampol-app .admin-table td :is(small,.text-slate-500,.text-slate-400,.text-zinc-400,.text-zinc-500,.text-zinc-600) { color: var(--theme-muted) !important; }
html[data-theme] body.ampol-app .admin-table tbody tr:nth-child(odd) { background: color-mix(in srgb,var(--theme-panel-soft) 64%,transparent) !important; }
html[data-theme] body.ampol-app .admin-table tbody tr:hover { background: var(--theme-accent-soft) !important; }

/* Dashboard, checkout and admin route-specific rules outrank V8.2. */
html[data-theme] body.ampol-app.is-dashboard-route :is(.account-recent,.account-support,.account-activity) { color: var(--theme-text) !important; }
html[data-theme] body.ampol-app.is-dashboard-route .account-recent table :is(td,th) { color: var(--theme-text) !important; }
html[data-theme] body.ampol-app.is-dashboard-route .account-activity :is(p,b,strong,span):not(.status-pill) { color: var(--theme-text) !important; }
html[data-theme] body.ampol-app.is-dashboard-route .account-activity :is(small,.text-zinc-500,.text-zinc-600) { color: var(--theme-muted) !important; }

html[data-theme] body.ampol-app.is-checkout-route .ampol-checkout-page {
    color: var(--theme-text) !important;
    background: linear-gradient(150deg,var(--theme-page),var(--theme-page-alt)) !important;
}
html[data-theme] body.ampol-app.is-checkout-route .ampol-checkout-page form > div > :is(section,aside),
html[data-theme] body.ampol-app.is-checkout-route .ampol-checkout-page section,
html[data-theme] body.ampol-app.is-checkout-route .ampol-checkout-page aside {
    --ui-text-primary: var(--theme-text);
    --ui-text-secondary: var(--theme-muted);
    --ui-text-muted: var(--theme-faint);
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: linear-gradient(150deg,var(--theme-panel),var(--theme-panel-soft)) !important;
}
html[data-theme] body.ampol-app.is-checkout-route .ampol-payment-option {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: var(--theme-panel-strong) !important;
}
html[data-theme] body.ampol-app.is-checkout-route .ampol-payment-option :is(b,strong,h1,h2,h3,.text-white,.text-slate-900) { color: var(--theme-text) !important; }
html[data-theme] body.ampol-app.is-checkout-route .ampol-payment-option :is(p,small,.text-slate-500,.text-zinc-400,.text-zinc-500) { color: var(--theme-muted) !important; }

html[data-theme] body.ampol-app.is-admin-route .ampol-admin-ui :is(h1,h2,h3,h4) { color: var(--theme-text) !important; }
html[data-theme] body.ampol-app.is-admin-route .ampol-admin-ui nav a { color: var(--theme-muted) !important; }
html[data-theme] body.ampol-app.is-admin-route .ampol-admin-ui nav a:hover,
html[data-theme] body.ampol-app.is-admin-route .ampol-admin-ui nav a[class*="text-emerald"] { color: var(--theme-accent-text) !important; }

/* Semantic statuses retain meaning on both light and dark themes. */
html[data-theme] body.ampol-app .status-green { color: #047857 !important; border-color: rgba(5,150,105,.30) !important; background: rgba(16,185,129,.14) !important; }
html[data-theme] body.ampol-app .status-yellow { color: #92400e !important; border-color: rgba(217,119,6,.30) !important; background: rgba(245,158,11,.15) !important; }
html[data-theme] body.ampol-app .status-red { color: #be123c !important; border-color: rgba(225,29,72,.28) !important; background: rgba(244,63,94,.13) !important; }
html[data-theme] body.ampol-app .status-blue { color: #0369a1 !important; border-color: rgba(2,132,199,.28) !important; background: rgba(14,165,233,.13) !important; }
html[data-theme] body.ampol-app .status-purple { color: #7e22ce !important; border-color: rgba(147,51,234,.28) !important; background: rgba(168,85,247,.13) !important; }
html[data-theme] body.ampol-app .status-zinc { color: var(--theme-muted) !important; border-color: var(--theme-line) !important; background: var(--theme-panel-soft) !important; }
:root[data-theme="graphite"] body.ampol-app .status-green { color: #9be4be !important; }
:root[data-theme="graphite"] body.ampol-app .status-yellow { color: #fcd66d !important; }
:root[data-theme="graphite"] body.ampol-app .status-red { color: #fda4af !important; }
:root[data-theme="graphite"] body.ampol-app .status-blue { color: #8ed8ff !important; }
:root[data-theme="graphite"] body.ampol-app .status-purple { color: #d8b4fe !important; }

/* Browser autofill must not reintroduce light text on a light field. */
html[data-theme] body.ampol-app input:-webkit-autofill,
html[data-theme] body.ampol-app textarea:-webkit-autofill,
html[data-theme] body.ampol-app select:-webkit-autofill {
    -webkit-text-fill-color: var(--theme-text) !important;
    box-shadow: 0 0 0 1000px var(--theme-panel-strong) inset !important;
}

/* ======================================================================
   AMPOLSHOP V9.2 — centered operation dialogs, Graphite repair and
   scroll-performance guard. This is the final compatibility layer.
   ====================================================================== */

/* Physical centering is intentional: logical inset-start shifts RTL dialogs. */
html[data-theme] body.ampol-app .ampol-action-dialog__panel {
    inset-inline: auto !important;
    left: 50% !important;
    right: auto !important;
    top: 50% !important;
    width: min(calc(100vw - 2rem), 640px) !important;
    max-height: min(calc(100dvh - 2rem), 780px) !important;
    transform: translate(-50%, -50%) !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    overflow: hidden !important;
}
html[data-theme] body.ampol-app .ampol-action-dialog__backdrop {
    inset: 0 !important;
    background: rgba(3, 8, 6, .78) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}
html[data-theme] body.ampol-app .ampol-action-dialog__body {
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}
html[data-theme] body.ampol-app .ampol-action-dialog__header,
html[data-theme] body.ampol-app .ampol-action-dialog__footer {
    position: relative !important;
    z-index: 2 !important;
    flex: 0 0 auto !important;
}

/* Quick order is a centered modal on both RTL and LTR layouts. */
html[data-theme] body.ampol-app .ampol-quick-order-overlay { isolation: isolate; }
html[data-theme] body.ampol-app .ampol-quick-order-backdrop {
    background: rgba(3, 8, 6, .78) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}
html[data-theme] body.ampol-app .ampol-quick-order-modal {
    --ui-text-primary: var(--theme-text);
    --ui-text-secondary: var(--theme-muted);
    --ui-text-muted: var(--theme-faint);
    max-height: min(calc(100dvh - 2rem), 820px);
    color: var(--theme-text) !important;
    border: 1px solid var(--theme-line-strong) !important;
    border-radius: 1.5rem;
    background: var(--theme-panel-strong) !important;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .36) !important;
    color-scheme: normal;
}
html[data-theme] body.ampol-app .ampol-quick-order-modal :is(h1,h2,h3,b,strong,.text-white,.text-zinc-100,.text-zinc-200) {
    color: var(--theme-text) !important;
}
html[data-theme] body.ampol-app .ampol-quick-order-modal :is(p,small,.text-zinc-400,.text-zinc-500,.text-zinc-600) {
    color: var(--theme-muted) !important;
}

/* Graphite is fully dark: no pale legacy card may leak into this theme. */
:root[data-theme="graphite"] body.ampol-app {
    --ui-text-primary: #f3f7f9;
    --ui-text-secondary: #c5d0d7;
    --ui-text-muted: #9eacb6;
    --ui-field-bg: #202832;
    --ui-field-border: rgba(214, 228, 238, .16);
    color: #f3f7f9 !important;
    background: linear-gradient(150deg, #10151b, #171d25) !important;
}
:root[data-theme="graphite"] body.ampol-app :is(
    .site-canvas,.storefront-page,.product-service-page,.ampol-orders-page,
    .dashboard-shell,.ampol-admin-ui,.ampol-checkout-page
) {
    color: #f3f7f9 !important;
    background: linear-gradient(150deg, #10151b, #171d25) !important;
}
:root[data-theme="graphite"] body.ampol-app :is(
    .premium-panel,.glass-panel,.glass-panel-hover,.metric-card,.admin-surface,
    .admin-order-row,.ticket-row,.account-recent,.account-support,.account-activity,
    .ampol-product-permission-card,.ampol-orders-table-wrap,.ampol-orders-empty,
    .ampol-mobile-order-card,.store-filter-panel,.store-empty-state,.product-order-card,
    .product-info-panel,.product-support-panel,.purchase-success-card,.ampol-action-dialog__panel,
    .ampol-order-sidebar,.ampol-quick-order-modal,.ampol-theme-panel,.ampol-account-level-card
) {
    --ui-text-primary: #f3f7f9;
    --ui-text-secondary: #c5d0d7;
    --ui-text-muted: #9eacb6;
    color: #f3f7f9 !important;
    border-color: rgba(214, 228, 238, .14) !important;
    background: linear-gradient(150deg, #202832, #1a222b) !important;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .24) !important;
    color-scheme: dark;
}
:root[data-theme="graphite"] body.ampol-app :is(
    [class~="bg-white"],[class~="bg-white/5"],[class~="bg-white/10"],[class~="bg-white/15"],
    [class~="bg-white/25"],[class~="bg-white/70"],[class~="bg-white/75"],[class~="bg-white/85"],
    [class~="bg-white/90"],[class~="bg-white/92"],[class~="bg-white/95"],
    [class~="bg-white/[.02]"],[class~="bg-white/[.025]"],[class~="bg-white/[.03]"],
    [class~="bg-white/[.035]"],[class~="bg-white/[.04]"],[class~="bg-white/[.05]"],
    [class~="bg-white/[.06]"],[class~="bg-white/[.07]"],[class~="bg-white/[.08]"],
    [class~="bg-white/[.10]"],[class~="bg-slate-50"],[class~="bg-emerald-50"],
    [class~="bg-emerald-50/40"],[class~="bg-emerald-50/50"],[class~="bg-emerald-50/55"],
    [class~="bg-emerald-50/60"],[class~="bg-emerald-50/70"],[class~="bg-emerald-50/90"],
    [class~="bg-[#eef8f3]"],[class~="bg-[#edf7f2]"],[class~="bg-[#e9f5ef]"],
    [class~="bg-[#effaf4]"],[class~="bg-[#f2faf6]"],[class~="bg-[#f2faf5]"],
    [class~="bg-[#f4faf7]"],[class~="bg-[#f0f7f4]"],[class~="bg-[#f3f8f5]"]
) {
    --ui-text-primary: #f3f7f9;
    --ui-text-secondary: #c5d0d7;
    --ui-text-muted: #9eacb6;
    color: #f3f7f9 !important;
    border-color: rgba(214, 228, 238, .14) !important;
    background: #252e38 !important;
    color-scheme: dark;
}
:root[data-theme="graphite"] body.ampol-app :is(
    .text-white,.text-slate-900,.text-slate-800,.text-slate-700,
    .text-gray-900,.text-gray-800,.text-gray-700,
    .text-zinc-900,.text-zinc-800,.text-zinc-700,.text-zinc-100,.text-zinc-200
) { color: #f3f7f9 !important; text-shadow: none !important; }
:root[data-theme="graphite"] body.ampol-app :is(
    .text-slate-600,.text-slate-500,.text-slate-400,
    .text-gray-600,.text-gray-500,.text-gray-400,
    .text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600
) { color: #b2c0c9 !important; text-shadow: none !important; }
:root[data-theme="graphite"] body.ampol-app :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
    select,textarea,.field,.select-field,.textarea-field,.product-order-field
) {
    color: #f3f7f9 !important;
    border-color: rgba(214, 228, 238, .16) !important;
    background: #202832 !important;
    -webkit-text-fill-color: #f3f7f9 !important;
    color-scheme: dark;
}
:root[data-theme="graphite"] body.ampol-app :is(input,textarea)::placeholder {
    color: #9eacb6 !important;
    -webkit-text-fill-color: #9eacb6 !important;
}
:root[data-theme="graphite"] body.ampol-app option { color: #f3f7f9 !important; background: #202832 !important; }
:root[data-theme="graphite"] body.ampol-app .admin-table th { color: #b2c0c9 !important; background: #252e38 !important; }
:root[data-theme="graphite"] body.ampol-app .admin-table td { color: #f3f7f9 !important; background: transparent !important; }
:root[data-theme="graphite"] body.ampol-app .admin-table tbody tr:nth-child(odd) { background: #1b232c !important; }
:root[data-theme="graphite"] body.ampol-app .account-recent table td > :is(a,div,span) { color: #f3f7f9 !important; background-color: transparent !important; }
:root[data-theme="graphite"] body.ampol-app .btn-secondary,
:root[data-theme="graphite"] body.ampol-app .btn-ghost {
    color: #f3f7f9 !important;
    border-color: rgba(214, 228, 238, .16) !important;
    background: #252e38 !important;
}
:root[data-theme="graphite"] body.ampol-app .btn-secondary:hover,
:root[data-theme="graphite"] body.ampol-app .btn-ghost:hover { color: #b3ebce !important; background: #2b3742 !important; }
:root[data-theme="graphite"] body.ampol-app .status-green { color: #9be4be !important; }
:root[data-theme="graphite"] body.ampol-app .status-yellow { color: #fcd66d !important; }
:root[data-theme="graphite"] body.ampol-app .status-red { color: #fda4af !important; }
:root[data-theme="graphite"] body.ampol-app .status-blue { color: #8ed8ff !important; }
:root[data-theme="graphite"] body.ampol-app .status-purple { color: #d8b4fe !important; }

/* Scroll performance: remove expensive fixed repaints and giant blur layers. */
html { scroll-behavior: auto !important; }
body.ampol-app { background-attachment: scroll !important; }
body.ampol-app::before { display: none !important; animation: none !important; }
body.ampol-app::after { position: absolute !important; animation: none !important; }
body.ampol-app .absolute[class*="blur-["],
body.ampol-app .ampol-cart-animation,
body.ampol-app .ampol-checkout-animation,
body.ampol-app .ampol-order-details-animation { display: none !important; }
body.ampol-app :is(.store-product-card__visual-orb,.service-category-card__glow,.product-service-artwork__orb,.product-support-panel::after) {
    filter: none !important;
    opacity: .07 !important;
}
body.ampol-app :is(
    .ampol-site-header,.ampol-mobile-menu,.mobile-app-nav,.ampol-live-chip,.ampol-home-search,
    .ampol-ampoule__glass,.ampol-game-capsule,.ampol-home-stats,.premium-panel,.glass-panel,
    .metric-card,.product-order-card,.product-mobile-buybar,.store-product-card__category,
    .store-product-card__commercial-badge,.store-product-card__instant
) {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}
body.ampol-app .ampol-site-header { background: var(--theme-panel-strong) !important; }
body.ampol-app :is(.premium-panel,.glass-panel,.metric-card,.store-product-card,.ampol-mobile-order-card) {
    box-shadow: 0 12px 32px var(--theme-shadow) !important;
}
body.ampol-app :is(.store-product-card,.ampol-mobile-order-card) {
    content-visibility: auto;
    contain-intrinsic-size: auto 320px;
}
body.ampol-app :is(
    .ampol-ampoule,.ampol-floating,.storefront-hero__ring,
    .storefront-floating-card,.product-service-artwork__ring,
    .animate-pulse-soft
) {
    animation: none !important;
}

@media (max-width: 640px) {
    html[data-theme] body.ampol-app .ampol-action-dialog__panel,
    html[data-theme] body.ampol-app .ampol-quick-order-modal {
        width: calc(100vw - .75rem) !important;
        max-height: calc(100dvh - .75rem) !important;
        border-radius: 1rem !important;
    }
    html[data-theme] body.ampol-app .ampol-quick-order-overlay { padding: .375rem !important; }
    html[data-theme] body.ampol-app .ampol-quick-data > div {
        grid-template-columns: minmax(0, .72fr) minmax(0, 1fr) auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.ampol-app *,
    body.ampol-app *::before,
    body.ampol-app *::after {
        scroll-behavior: auto !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}

/* source: public/css/ampol-v9.3.css */
/* AMPOLSHOP V9.3 — final contrast layer and Graphite hardening. */

:root[data-theme="graphite"] {
    --theme-text: #f3f7f9;
    --theme-muted: #c5d0d7;
    --theme-faint: #9eacb6;
    --theme-accent-text: #b3ebce;
}

/* Accent utilities are foreground colors. Do not reuse the darker gradient token. */
html[data-theme] body.ampol-app [class*="text-emerald-"] {
    color: var(--theme-accent-text) !important;
}

html[data-theme] body.ampol-app :is(
    .btn-secondary:hover,
    .btn-ghost:hover,
    .copy-chip,
    .ampol-desktop-nav a.is-active,
    .mobile-app-nav > a.is-active,
    .ampol-section-head > a,
    .ampol-theme-current b,
    .ampol-check-state,
    .ampol-eye-button,
    .ampol-quick-order-drawer__head p,
    .ampol-quick-item__title small,
    .ampol-quick-data button
) {
    color: var(--theme-accent-text) !important;
}

/* Graphite must be a consistently dark surface with explicit readable foregrounds. */
:root[data-theme="graphite"] body.ampol-app,
:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui {
    color: #f3f7f9 !important;
    color-scheme: dark;
}

:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui :is(
    .premium-panel,
    .glass-panel,
    .metric-card,
    .admin-surface,
    .admin-order-row,
    .ticket-row
) {
    color: #f3f7f9 !important;
    border-color: rgba(214, 228, 238, .15) !important;
    background: linear-gradient(150deg, #202832, #1a222b) !important;
}

:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui :is(
    .premium-panel,
    .glass-panel,
    .metric-card,
    .admin-surface,
    .admin-order-row,
    .ticket-row
) :is(
    h1,h2,h3,h4,h5,h6,b,strong,
    .text-white,.text-slate-900,.text-slate-800,.text-slate-700,
    .text-gray-900,.text-gray-800,.text-gray-700,
    .text-zinc-900,.text-zinc-800,.text-zinc-700,.text-zinc-100,.text-zinc-200
) {
    color: #f3f7f9 !important;
    -webkit-text-fill-color: #f3f7f9 !important;
    text-shadow: none !important;
}

:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui :is(
    .text-slate-600,.text-slate-500,.text-slate-400,
    .text-gray-600,.text-gray-500,.text-gray-400,
    .text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600
) {
    color: #c5d0d7 !important;
    -webkit-text-fill-color: #c5d0d7 !important;
    text-shadow: none !important;
}

:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui [class*="text-emerald-"],
:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui nav a[class*="text-emerald-"],
:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui a:hover[class*="hover:text-emerald-"] {
    color: #b3ebce !important;
    -webkit-text-fill-color: #b3ebce !important;
}

:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui nav a:not([class*="text-emerald-"]) {
    color: #c5d0d7 !important;
    -webkit-text-fill-color: #c5d0d7 !important;
}

:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui :is(
    [class~="bg-white"],[class~="bg-white/5"],[class~="bg-white/10"],[class~="bg-white/15"],
    [class~="bg-white/[.02]"],[class~="bg-white/[.025]"],[class~="bg-white/[.03]"],
    [class~="bg-white/[.035]"],[class~="bg-white/[.04]"],[class~="bg-white/[.05]"],
    [class~="bg-slate-50"],[class~="bg-gray-50"],
    [class~="bg-emerald-50"],[class~="bg-emerald-50/40"],[class~="bg-emerald-50/50"],
    [class~="bg-emerald-50/60"],[class~="bg-emerald-50/70"],[class~="bg-emerald-50/90"],
    [class~="bg-[#eef8f3]"],[class~="bg-[#edf7f2]"],[class~="bg-[#f3f8f5]"]
):not(.btn-primary):not(.status-pill) {
    color: #f3f7f9 !important;
    border-color: rgba(214, 228, 238, .15) !important;
    background: #252e38 !important;
}

:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui .admin-table th {
    color: #c5d0d7 !important;
    background: #252e38 !important;
}

:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui .admin-table td {
    color: #f3f7f9 !important;
    background: transparent !important;
}

:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui :is(input,select,textarea,option) {
    color: #f3f7f9 !important;
    -webkit-text-fill-color: #f3f7f9 !important;
    border-color: rgba(214, 228, 238, .17) !important;
    background-color: #202832 !important;
}

:root[data-theme="graphite"] body.ampol-app .ampol-admin-ui :is(input,textarea)::placeholder {
    color: #9eacb6 !important;
    -webkit-text-fill-color: #9eacb6 !important;
    opacity: 1 !important;
}

/* Preserve semantic foreground colors after the broad Graphite rules. */
:root[data-theme="graphite"] body.ampol-app .status-green { color: #9be4be !important; -webkit-text-fill-color: #9be4be !important; }
:root[data-theme="graphite"] body.ampol-app .status-yellow { color: #fcd66d !important; -webkit-text-fill-color: #fcd66d !important; }
:root[data-theme="graphite"] body.ampol-app .status-red { color: #fda4af !important; -webkit-text-fill-color: #fda4af !important; }
:root[data-theme="graphite"] body.ampol-app .status-blue { color: #8ed8ff !important; -webkit-text-fill-color: #8ed8ff !important; }
:root[data-theme="graphite"] body.ampol-app .status-purple { color: #d8b4fe !important; -webkit-text-fill-color: #d8b4fe !important; }

/* source: public/css/ampol-v10.css */
/* ======================================================================
   AMPOLSHOP V10.1 — secure auth, Solar theme and final contrast contract
   Loaded after every legacy stylesheet.
   ====================================================================== */

:root[data-theme="solar"] {
    color-scheme: dark;
    --theme-page: #171a1f;
    --theme-page-alt: #22272e;
    --theme-panel: rgba(38, 43, 50, .96);
    --theme-panel-strong: #2d333b;
    --theme-panel-soft: #343a43;
    --theme-text: #f8fafc;
    --theme-muted: #d3d8df;
    --theme-faint: #aab2bd;
    --theme-line: rgba(248, 250, 252, .14);
    --theme-line-strong: rgba(250, 204, 21, .48);
    --theme-accent: #facc15;
    --theme-accent-2: #eab308;
    --theme-accent-3: #fde047;
    --theme-accent-soft: rgba(250, 204, 21, .14);
    --theme-accent-contrast: #171a1f;
    --theme-accent-text: #fde768;
    --theme-action-from: #eab308;
    --theme-action-to: #fde047;
    --theme-action-text: #171a1f;
    --theme-dark: #111318;
    --theme-dark-2: #20242a;
    --theme-on-dark: #ffffff;
    --theme-on-dark-muted: #d6dbe1;
    --theme-header: rgba(27, 30, 35, .94);
    --theme-shadow: rgba(0, 0, 0, .38);
    --theme-hero-glow: rgba(250, 204, 21, .23);
}

/* Dark themes use one explicit surface/foreground contract on every route. */
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app {
    color: var(--theme-text) !important;
    color-scheme: dark;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app :is(
    .premium-panel,.glass-panel,.metric-card,.admin-surface,.admin-order-row,
    .ticket-row,.account-recent,.account-support,.account-activity,
    .ampol-product-permission-card,.checkout-card,.cart-summary,
    .product-info-panel,.product-support-panel,.ampol-mobile-order-card
) {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: linear-gradient(150deg, var(--theme-panel-strong), var(--theme-panel)) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app :is(
    .text-white,.text-slate-900,.text-slate-800,.text-slate-700,
    .text-gray-900,.text-gray-800,.text-gray-700,
    .text-zinc-900,.text-zinc-800,.text-zinc-700,.text-zinc-100,.text-zinc-200
) {
    color: var(--theme-text) !important;
    -webkit-text-fill-color: var(--theme-text) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app :is(
    .text-slate-600,.text-slate-500,.text-slate-400,
    .text-gray-600,.text-gray-500,.text-gray-400,
    .text-zinc-300,.text-zinc-400,.text-zinc-500,.text-zinc-600
) {
    color: var(--theme-muted) !important;
    -webkit-text-fill-color: var(--theme-muted) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app :is(input,select,textarea,option) {
    color: var(--theme-text) !important;
    -webkit-text-fill-color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background-color: var(--theme-panel-strong) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app :is(input,textarea)::placeholder {
    color: var(--theme-faint) !important;
    -webkit-text-fill-color: var(--theme-faint) !important;
    opacity: 1 !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .admin-table th {
    color: var(--theme-muted) !important;
    background: var(--theme-panel-soft) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .admin-table td {
    color: var(--theme-text) !important;
    background: transparent !important;
}

/* Semantic colors survive the broad dark-theme contract. */
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .status-green { color: #9be4be !important; -webkit-text-fill-color: #9be4be !important; }
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .status-yellow { color: #fcd66d !important; -webkit-text-fill-color: #fcd66d !important; }
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .status-red { color: #fda4af !important; -webkit-text-fill-color: #fda4af !important; }
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .status-blue { color: #8ed8ff !important; -webkit-text-fill-color: #8ed8ff !important; }
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .status-purple { color: #d8b4fe !important; -webkit-text-fill-color: #d8b4fe !important; }

/* Checkout and product pages must not retain hard-coded light backgrounds. */
html[data-theme] body.ampol-app.is-checkout-route .ampol-checkout-page {
    color: var(--theme-text) !important;
    background: linear-gradient(150deg, var(--theme-page), var(--theme-page-alt)) !important;
}
html[data-theme] body.ampol-app.is-checkout-route .ampol-checkout-page > .page-shell > header :is(h1,p,span) { color: var(--theme-text) !important; }
html[data-theme] body.ampol-app.is-product-route .product-rich-content,
html[data-theme] body.ampol-app.is-product-route .product-purchase-steps,
html[data-theme] body.ampol-app.is-product-route .product-feature-item { color: var(--theme-text) !important; }

/* Auth experience. */
.ampol-auth-body { min-height: 100vh; background: #0f1318 !important; }
.auth-page { overflow: hidden; background: radial-gradient(circle at 15% 5%,rgba(250,204,21,.12),transparent 25rem),radial-gradient(circle at 90% 85%,rgba(125,211,168,.10),transparent 25rem),linear-gradient(145deg,#0d1116,#171c23) !important; }
.auth-page::before { content: ''; position: absolute; inset: 0; opacity: .18; background-image: linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(to bottom,#000,transparent 90%); }
.auth-main-card { border-color: rgba(255,255,255,.12) !important; background: linear-gradient(145deg,rgba(37,44,53,.94),rgba(22,27,34,.96)) !important; box-shadow: 0 32px 110px rgba(0,0,0,.52),0 0 60px rgba(125,211,168,.07) !important; }
.auth-card-content { position: relative; }
.auth-heading h1 { margin-top: .75rem; color: #f8fafc; font-size: clamp(1.65rem,5vw,2.35rem); font-weight: 1000; line-height: 1.35; letter-spacing: -.035em; }
.auth-heading h1 span { color: #9be4be; }
.auth-heading > p:last-child { margin-top: .65rem; color: #b8c2ca; font-size: .78rem; font-weight: 600; line-height: 2; }
.auth-status { margin-top: 1rem; border: 1px solid rgba(125,211,168,.24); border-radius: .9rem; padding: .75rem; color: #9be4be !important; background: rgba(125,211,168,.08); font-size: .72rem; font-weight: 800; }
.auth-mode-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .35rem; margin-top: 1.25rem; padding: .3rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1rem; background: rgba(0,0,0,.2); }
.auth-mode-tabs button { min-height: 2.8rem; border-radius: .75rem; color: #aab5be; font-size: .72rem; font-weight: 900; transition: .2s ease; }
.auth-mode-tabs button.is-active { color: #102019; background: linear-gradient(120deg,#7dd3a8,#b3ebce); box-shadow: 0 10px 28px rgba(125,211,168,.16); }
.auth-form { display: grid; gap: 1rem; margin-top: 1.25rem; }
.auth-form .field { margin-top: .45rem; min-height: 3.3rem; border-color: rgba(255,255,255,.12) !important; color: #f8fafc !important; background: rgba(9,12,16,.58) !important; }
.auth-field-wrap { position: relative; }
.auth-field-wrap > i { position: absolute; z-index: 2; inset-inline-start: .9rem; top: 50%; transform: translateY(-38%); color: #7dd3a8; font-size: .7rem; font-style: normal; font-weight: 1000; pointer-events: none; }
.auth-field-wrap .field { padding-inline-start: 2.45rem; }
.auth-error { display: block; margin-top: .4rem; color: #fda4af !important; font-size: .68rem; font-weight: 800; line-height: 1.7; }
.auth-form-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.auth-form-row > a,.auth-switch a,.auth-back,.otp-resend button { color: #9be4be; font-size: .7rem; font-weight: 900; }
.auth-remember { display: inline-flex; align-items: center; gap: .5rem; color: #b8c2ca !important; font-size: .7rem; font-weight: 700; }
.auth-remember input { width: 1rem; height: 1rem; border-radius: .3rem; accent-color: #7dd3a8; }
.auth-submit { width: 100%; min-height: 3.25rem; }
.auth-submit > span:last-child { margin-inline-start: auto; }
.auth-submit:disabled { filter: saturate(.2); opacity: .55; }
.auth-security-note { display: flex; align-items: center; gap: .7rem; border: 1px solid rgba(125,211,168,.18); border-radius: 1rem; padding: .75rem; background: rgba(125,211,168,.06); }
.auth-security-note > span { display: grid; width: 2rem; height: 2rem; flex: 0 0 auto; place-items: center; border-radius: .65rem; color: #102019; background: #7dd3a8; font-weight: 1000; }
.auth-security-note b,.auth-security-note small { display: block; }
.auth-security-note b { color: #eef5f1; font-size: .7rem; }
.auth-security-note small { margin-top: .15rem; color: #aab5be; font-size: .58rem; line-height: 1.7; }
.auth-switch { margin-top: 1.25rem; text-align: center; color: #87939e !important; font-size: .72rem; }

/* OTP entry inspired by the supplied compact mobile interaction. */
.otp-card .auth-heading { margin-top: 1rem; }
.otp-card .eyebrow { justify-content: center; }
.otp-icon { position: relative; display: grid; width: 4.4rem; height: 4.4rem; margin-inline: auto; place-items: center; border: 1px solid rgba(125,211,168,.28); border-radius: 1.35rem; color: #b3ebce; background: rgba(125,211,168,.09); box-shadow: 0 0 45px rgba(125,211,168,.13); }
.otp-icon span { position: absolute; inset: .55rem; border: 1px dashed rgba(125,211,168,.35); border-radius: 1rem; animation: ampolOtpSpin 8s linear infinite; }
.otp-icon b { letter-spacing: .13rem; }
.otp-inputs { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: clamp(.3rem,2vw,.55rem); }
.otp-inputs input { width: 100%; min-width: 0; aspect-ratio: .84; border: 1px solid rgba(255,255,255,.13) !important; border-radius: .85rem; color: #f8fafc !important; background: #10151b !important; text-align: center; font-size: clamp(1.15rem,5vw,1.6rem); font-weight: 1000; caret-color: #7dd3a8; outline: none; transition: .18s ease; }
.otp-inputs input:is(:focus,:not(:placeholder-shown)) { border-color: #7dd3a8 !important; box-shadow: 0 0 0 3px rgba(125,211,168,.12),0 0 22px rgba(125,211,168,.12); transform: translateY(-2px); }
.otp-timer { display: flex; align-items: center; justify-content: space-between; border: 1px solid rgba(255,255,255,.09); border-radius: .9rem; padding: .7rem .85rem; background: rgba(0,0,0,.18); }
.otp-timer span { color: #b3ebce; font-family: monospace; font-size: 1rem; font-weight: 1000; direction: ltr; }
.otp-timer small { color: #9ca8b2; font-size: .62rem; }
.otp-timer.is-expired span { color: #fda4af; }
.otp-resend { margin-top: 1rem; text-align: center; }
.otp-resend button:disabled { color: #6f7c87; cursor: not-allowed; }
.auth-back { display: block; margin-top: .85rem; text-align: center; color: #9ca8b2; }
@keyframes ampolOtpSpin { to { transform: rotate(360deg); } }

/* Account phone is never requested again inside product forms. */
.account-phone-notice { display: flex; align-items: center; gap: .7rem; border: 1px solid var(--theme-line-strong); border-radius: 1rem; padding: .8rem; color: var(--theme-text); background: var(--theme-accent-soft); }
.account-phone-notice > span { display: grid; width: 2rem; height: 2rem; flex: 0 0 auto; place-items: center; border-radius: .65rem; color: var(--theme-accent-contrast); background: var(--theme-accent); font-weight: 1000; }
.account-phone-notice b,.account-phone-notice small { display: block; }
.account-phone-notice b { font-size: .7rem; font-weight: 950; }
.account-phone-notice small { margin-top: .15rem; color: var(--theme-muted); font-size: .58rem; }
.account-identity-lock { border: 1px solid var(--theme-line); border-radius: 1rem; padding: 1rem; background: var(--theme-panel-soft); }
.account-identity-lock span,.account-identity-lock b,.account-identity-lock small { display: block; }
.account-identity-lock span { color: var(--theme-muted); font-size: .62rem; font-weight: 900; }
.account-identity-lock b { margin-top: .45rem; color: var(--theme-text); font-size: .86rem; font-weight: 1000; }
.account-identity-lock small { margin-top: .4rem; color: var(--theme-faint); font-size: .58rem; }

/* Order center: clicking the value itself copies it. */
.ampol-quick-data > div.is-copyable span[role="button"] { cursor: copy; border-radius: .65rem; outline: 1px dashed color-mix(in srgb,var(--theme-accent) 38%,transparent); outline-offset: .25rem; transition: .18s ease; }
.ampol-quick-data > div.is-copyable span[role="button"]:is(:hover,:focus-visible) { color: var(--theme-accent-text) !important; background: var(--theme-accent-soft); outline-color: var(--theme-accent); }
.ampol-quick-data > div > i { align-self: center; color: var(--theme-faint); font-size: .5rem; font-style: normal; font-weight: 800; }
.ampol-quick-copy-value { width: fit-content; max-width: 100%; cursor: copy; border-radius: .45rem; outline: 1px dashed transparent; outline-offset: .18rem; }
.ampol-quick-copy-value:is(:hover,:focus-visible) { color: var(--theme-accent-text) !important; outline-color: var(--theme-line-strong); }
.ampol-quick-secrets { margin-top: .65rem; }
.ampol-quick-data > div.is-sensitive { border-color: color-mix(in srgb,#f59e0b 32%,var(--theme-line)); background: color-mix(in srgb,#f59e0b 7%,var(--theme-panel-soft)); }
.ampol-quick-data > div.is-sensitive > small { color: #fcd66d !important; }
.ampol-quick-data > div.is-sensitive span[aria-busy="true"] { opacity: .55; pointer-events: none; }

/* Every long admin dialog remains usable on mobile. */
.ampol-issue-modal,.ampol-dialog-panel { max-height: min(88vh,52rem); overflow: hidden; }
.ampol-issue-modal__body,.ampol-dialog-panel__body { overflow-y: auto; overscroll-behavior: contain; }

@media (max-width: 640px) {
    .auth-page { align-items: flex-start; }
    .auth-main-card { border-radius: 1.45rem !important; padding: 1.1rem !important; }
    .auth-heading h1 { font-size: 1.65rem; }
    .auth-form { gap: .8rem; }
    .otp-inputs { gap: .28rem; }
    .otp-inputs input { border-radius: .65rem; }
    .ampol-quick-data > div.is-copyable span[role="button"] { display: flex; min-height: 2.75rem; align-items: center; }
}

@media (prefers-reduced-motion: reduce) {
    .otp-icon span,.otp-inputs input,.ampol-quick-data > div.is-copyable span[role="button"] { animation: none !important; transition: none !important; }
}

/* ======================================================================
   AMPOLSHOP V10.2 — dark-theme surface closure and theme-aware loader
   ====================================================================== */

/* A dark theme is a complete page contract, not only a body background. */
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app :is(
    .site-canvas,.storefront-page,.product-service-page,.dashboard-shell,
    .ampol-orders-page,.ampol-admin-ui,.ampol-checkout-page
) {
    color: var(--theme-text) !important;
    background:
        radial-gradient(circle at 8% 0%,var(--theme-accent-soft),transparent 29rem),
        linear-gradient(150deg,var(--theme-page),var(--theme-page-alt)) !important;
}

/* Legacy utility cards used a light gradient; replacing background-color
   alone cannot remove that image, so the complete background is reset. */
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app :is(
    [class~="bg-white"],[class~="bg-white/5"],[class~="bg-white/10"],
    [class~="bg-white/70"],[class~="bg-white/75"],[class~="bg-white/85"],
    [class~="bg-white/90"],[class~="bg-white/95"],
    [class~="bg-white/[.02]"],[class~="bg-white/[.025]"],
    [class~="bg-white/[.03]"],[class~="bg-white/[.035]"],
    [class~="bg-white/[.04]"],[class~="bg-white/[.05]"],
    [class~="bg-slate-50"],[class~="bg-gray-50"],
    [class~="bg-emerald-50"],[class~="bg-emerald-50/40"],
    [class~="bg-emerald-50/50"],[class~="bg-emerald-50/60"],
    [class~="bg-emerald-50/70"],[class~="bg-emerald-50/90"]
):not(.btn-primary):not(.status-pill):not(.ampol-brand__mark) {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: var(--theme-panel-soft) !important;
}

/* Storefront hero, statistics, service cards and products. */
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app :is(
    .storefront-hero,.storefront-hero__stats,.store-search-box form,
    .store-search-results,.service-category-card,.store-filter-panel,
    .store-empty-state,.store-product-card,.product-package-chip
) {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: linear-gradient(150deg,var(--theme-panel-strong),var(--theme-panel)) !important;
    box-shadow: 0 18px 48px var(--theme-shadow) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .storefront-hero {
    background:
        radial-gradient(circle at 82% 42%,var(--theme-hero-glow),transparent 25rem),
        linear-gradient(145deg,var(--theme-panel-strong),var(--theme-page-alt)) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app :is(
    .storefront-hero h1,.storefront-hero__core b,.storefront-hero__stats b,
    .service-category-card strong,.store-product-card h3,
    .store-product-card__title,.product-package-chip strong
) {
    color: var(--theme-text) !important;
    -webkit-text-fill-color: var(--theme-text) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app :is(
    .storefront-hero__copy > p,.storefront-trust-row span,
    .storefront-hero__stats small,.service-category-card small,
    .service-category-card > span:last-child > span,
    .store-product-card p,.product-package-chip small
) {
    color: var(--theme-muted) !important;
    -webkit-text-fill-color: var(--theme-muted) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .service-category-card__icon,
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .service-category-card__badge {
    color: var(--theme-accent-text) !important;
    border-color: var(--theme-line-strong) !important;
    background: var(--theme-accent-soft) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .service-category-card svg {
    color: var(--theme-accent-text) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .storefront-hero__core {
    color: var(--theme-text) !important;
    border-color: var(--theme-line-strong) !important;
    background: linear-gradient(145deg,var(--theme-panel-soft),var(--theme-panel-strong)) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .store-product-card__visual-bottom {
    background: linear-gradient(to top,var(--theme-panel-strong),transparent) !important;
}

/* Dashboard table product links and support tickets had a legacy white
   background-image. Reset the shorthand so no pale rectangle survives. */
:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .account-recent table td > :is(a,div,span) {
    color: var(--theme-text) !important;
    background: transparent !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .account-support a {
    color: var(--theme-text) !important;
    border-color: var(--theme-line) !important;
    background: var(--theme-panel-soft) !important;
}

:root:is([data-theme="graphite"],[data-theme="solar"]) body.ampol-app .account-support a :is(p,b,strong) {
    color: var(--theme-text) !important;
    -webkit-text-fill-color: var(--theme-text) !important;
}

/* The navigation loader follows every selected theme, including live theme
   previews in the dashboard. No fixed emerald color remains in its chrome. */
html[data-theme] #ampol-page-loader {
    color: var(--theme-text) !important;
    background: color-mix(in srgb,var(--theme-page) 90%,transparent) !important;
}

html[data-theme] .ampol-v8-loader::before {
    border-color: var(--theme-line-strong) !important;
    box-shadow:
        inset 0 0 60px color-mix(in srgb,var(--theme-accent) 5%,transparent),
        0 0 70px color-mix(in srgb,var(--theme-accent) 10%,transparent) !important;
}

html[data-theme] .ampol-v8-loader__ring {
    border-color: var(--theme-line-strong) !important;
}

html[data-theme] .ampol-v8-loader__ring.is-inner {
    border-color: var(--theme-line) !important;
}

html[data-theme] .ampol-v8-loader__token {
    color: var(--theme-accent-text) !important;
    border-color: var(--theme-line-strong) !important;
    background: linear-gradient(145deg,var(--theme-panel-soft),var(--theme-panel-strong)) !important;
    box-shadow: 0 10px 30px var(--theme-shadow),0 0 25px var(--theme-accent-soft) !important;
}

html[data-theme] .ampol-v8-loader__inner-token {
    color: var(--theme-accent-text) !important;
    background: var(--theme-accent-soft) !important;
    box-shadow: 0 0 25px var(--theme-accent-soft) !important;
}

html[data-theme] .ampol-v8-loader__core {
    color: var(--theme-text) !important;
    border-color: var(--theme-line-strong) !important;
    background: linear-gradient(155deg,var(--theme-panel-strong),var(--theme-panel)) !important;
    box-shadow: 0 25px 80px var(--theme-shadow),0 0 45px var(--theme-accent-soft) !important;
}

html[data-theme] .ampol-v8-loader__mark {
    color: var(--theme-action-text) !important;
    background: linear-gradient(145deg,var(--theme-accent),var(--theme-accent-2)) !important;
    box-shadow: 0 0 28px var(--theme-accent-soft) !important;
}

html[data-theme] .ampol-v8-loader__core b { color: var(--theme-text) !important; }
html[data-theme] .ampol-v8-loader__core small { color: var(--theme-muted) !important; }
html[data-theme] .ampol-v8-loader__dots i { background: var(--theme-accent) !important; }


/* ======================================================================
   AMPOLSHOP V10.3 — premium auth scene and server-driven OTP verification
   ====================================================================== */
.ampol-auth-body {
    min-height: 100vh;
    background: #070a0d !important;
}

.auth-page {
    position: relative;
    display: grid;
    min-height: 100vh;
    place-items: center;
    overflow: auto;
    padding: clamp(1rem,3vw,2.5rem);
    isolation: isolate;
    background:
        radial-gradient(circle at 8% 8%,rgba(33,238,139,.14),transparent 30rem),
        radial-gradient(circle at 92% 88%,rgba(16,94,62,.18),transparent 34rem),
        linear-gradient(145deg,#050709 0%,#0a0e12 46%,#08130f 100%) !important;
}

.auth-page::before {
    display: none;
}

.auth-page__mesh {
    position: fixed;
    z-index: -3;
    inset: 0;
    opacity: .26;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
    background-size: 52px 52px;
    mask-image: radial-gradient(circle at center,#000,transparent 82%);
}

.auth-page__glow {
    position: fixed;
    z-index: -2;
    width: min(38vw,34rem);
    aspect-ratio: 1;
    border-radius: 999px;
    filter: blur(100px);
    opacity: .18;
    pointer-events: none;
    animation: ampolAuthGlow 8s ease-in-out infinite alternate;
}

.auth-page__glow.is-start { top: -16%; left: -10%; background: #17dc80; }
.auth-page__glow.is-end { right: -12%; bottom: -20%; background: #08744b; animation-delay: -4s; }

.auth-shell {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1.06fr) minmax(25rem,.94fr);
    width: min(100%,74rem);
    min-height: min(48rem,calc(100vh - 3rem));
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 2.4rem;
    background: rgba(12,16,20,.88);
    box-shadow: 0 42px 140px rgba(0,0,0,.62),0 0 0 1px rgba(26,232,133,.025);
    backdrop-filter: blur(24px);
}

.auth-showcase {
    position: relative;
    display: flex;
    min-height: 43rem;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: clamp(1.4rem,3vw,2.7rem);
    border-inline-end: 1px solid rgba(255,255,255,.08);
    background:
        radial-gradient(circle at 52% 43%,rgba(31,235,137,.18),transparent 18rem),
        linear-gradient(150deg,rgba(20,34,28,.98),rgba(7,12,11,.98));
}

.auth-showcase::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: .22;
    background-image:
        linear-gradient(115deg,transparent 0 48%,rgba(255,255,255,.045) 49% 50%,transparent 51%),
        radial-gradient(circle at 50% 45%,transparent 0 13rem,rgba(34,239,143,.09) 13.05rem 13.15rem,transparent 13.2rem);
    background-size: 11rem 11rem,auto;
}

.auth-showcase__top {
    position: relative;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: .65rem;
    color: #94a39c;
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .18em;
}

.auth-showcase__top b { margin-inline-start: auto; color: #4d5e55; font-family: monospace; }
.auth-live-dot { width: .55rem; height: .55rem; border-radius: 50%; background: #28e98d; box-shadow: 0 0 0 5px rgba(40,233,141,.09),0 0 24px rgba(40,233,141,.65); animation: ampolLiveDot 1.8s ease-in-out infinite; }

.auth-motion-scene {
    position: relative;
    z-index: 2;
    display: grid;
    min-height: 27rem;
    place-items: center;
    perspective: 1000px;
}

.auth-motion-scene__orbit {
    position: absolute;
    border: 1px solid rgba(53,239,149,.16);
    border-radius: 50%;
    pointer-events: none;
}

.auth-motion-scene__orbit.is-outer { width: 24rem; height: 24rem; animation: ampolAuthOrbit 24s linear infinite; }
.auth-motion-scene__orbit.is-inner { width: 18.2rem; height: 18.2rem; border-style: dashed; animation: ampolAuthOrbit 17s linear infinite reverse; }

.auth-motion-scene__orbit::before,.auth-motion-scene__orbit::after {
    content: '';
    position: absolute;
    width: .7rem;
    height: .7rem;
    border: 2px solid #8cf5be;
    border-radius: 50%;
    background: #0b1510;
    box-shadow: 0 0 20px rgba(56,239,151,.7);
}

.auth-motion-scene__orbit::before { top: 13%; left: 13%; }
.auth-motion-scene__orbit::after { right: 7%; bottom: 25%; }

.auth-motion-scene__particle {
    position: absolute;
    width: .32rem;
    height: .32rem;
    border-radius: 50%;
    background: #baf9d5;
    box-shadow: 0 0 18px rgba(100,246,169,.8);
    animation: ampolAuthParticle 4s ease-in-out infinite alternate;
}

.auth-motion-scene__particle.is-one { top: 12%; left: 22%; }
.auth-motion-scene__particle.is-two { right: 16%; bottom: 18%; animation-delay: -1.4s; }
.auth-motion-scene__particle.is-three { top: 44%; right: 7%; animation-delay: -2.7s; }

.auth-verify-device {
    position: relative;
    width: min(19.5rem,82%);
    padding: 1.2rem;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 2rem;
    background: linear-gradient(155deg,rgba(23,31,28,.97),rgba(8,12,12,.98));
    box-shadow: 0 30px 90px rgba(0,0,0,.55),0 0 55px rgba(31,232,137,.12);
    transform: rotateY(-6deg) rotateX(3deg);
    animation: ampolAuthDevice 5.5s ease-in-out infinite alternate;
}

.auth-verify-device::after {
    content: '';
    position: absolute;
    inset: -60% -20%;
    pointer-events: none;
    background: linear-gradient(105deg,transparent 42%,rgba(255,255,255,.08) 49%,transparent 56%);
    transform: translateX(-55%);
    animation: ampolDeviceSheen 5.5s ease-in-out infinite;
}

.auth-verify-device__head { display: flex; align-items: center; gap: .65rem; }
.auth-verify-device__head > div { min-width: 0; }
.auth-verify-device__head b,.auth-verify-device__head small { display: block; }
.auth-verify-device__head b { color: #f4fbf7; font-size: .72rem; letter-spacing: .025em; }
.auth-verify-device__head small { margin-top: .15rem; color: #687870; font-size: .5rem; }
.auth-verify-device__head > i { width: .45rem; height: .45rem; margin-inline-start: auto; border-radius: 50%; background: #35ee98; box-shadow: 0 0 15px rgba(53,238,152,.8); }

.auth-mini-mark {
    display: grid;
    width: 2.25rem;
    height: 2.25rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: .75rem;
    color: #031009;
    background: linear-gradient(145deg,#57f4a7,#1bbd6e);
    font-size: .9rem;
    font-weight: 1000;
    box-shadow: 0 10px 26px rgba(30,222,128,.2);
}

.auth-verify-device__shield {
    display: grid;
    width: 5.5rem;
    height: 5.5rem;
    margin: 1.35rem auto .8rem;
    place-items: center;
    border: 1px solid rgba(49,238,147,.18);
    border-radius: 1.75rem;
    color: #82f3b8;
    background: rgba(38,220,128,.07);
    box-shadow: inset 0 0 34px rgba(30,222,128,.06),0 0 42px rgba(30,222,128,.08);
}

.auth-verify-device__shield svg { width: 3.45rem; height: 3.45rem; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.auth-verify-device > p { color: #7d8b84; text-align: center; font-size: .56rem; font-weight: 800; }

.auth-demo-code { display: grid; grid-template-columns: repeat(6,1fr); gap: .38rem; margin-top: .8rem; }
.auth-demo-code span { display: grid; aspect-ratio: .82; place-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: .65rem; color: #ecfff5; background: rgba(0,0,0,.3); font-family: monospace; font-size: .9rem; font-weight: 1000; }
.auth-demo-code i { opacity: 0; font-style: normal; transform: translateY(100%) scale(.7); animation: ampolDemoDigit 5.6s ease-in-out infinite; }
.auth-demo-code span:nth-child(2) i { animation-delay: .12s; }
.auth-demo-code span:nth-child(3) i { animation-delay: .24s; }
.auth-demo-code span:nth-child(4) i { animation-delay: .36s; }
.auth-demo-code span:nth-child(5) i { animation-delay: .48s; }
.auth-demo-code span:nth-child(6) i { animation-delay: .60s; }

.auth-demo-verify {
    position: relative;
    display: flex;
    min-height: 2.8rem;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    margin-top: .9rem;
    overflow: hidden;
    border: 1px solid rgba(45,232,141,.18);
    border-radius: .8rem;
    color: #baf8d4;
    background: rgba(34,208,119,.07);
    font-size: .55rem;
    letter-spacing: .12em;
}

.auth-demo-verify::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,transparent,rgba(67,243,156,.12),transparent); transform: translateX(-100%); animation: ampolDemoScan 5.6s ease-in-out infinite; }
.auth-demo-verify__loader { width: .9rem; height: .9rem; border: 2px solid rgba(90,241,164,.18); border-top-color: #65f2aa; border-radius: 50%; animation: ampolDemoLoader 5.6s linear infinite; }
.auth-demo-verify svg { position: absolute; width: 1.1rem; height: 1.1rem; opacity: 0; stroke: #07120c; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; border-radius: 50%; background: #4ff09e; padding: .15rem; animation: ampolDemoCheck 5.6s ease-in-out infinite; }

.auth-showcase__copy { position: relative; z-index: 3; }
.auth-showcase__copy > span { color: #55efa2; font-size: .64rem; font-weight: 950; letter-spacing: .04em; }
.auth-showcase__copy h2 { margin-top: .55rem; color: #f4faf7; font-size: clamp(1.7rem,3.2vw,3rem); font-weight: 1000; line-height: 1.15; letter-spacing: -.04em; }
.auth-showcase__copy h2 strong { color: #4ce99a; font-weight: inherit; }
.auth-showcase__copy p { max-width: 29rem; margin-top: .8rem; color: #8b9992; font-size: .7rem; font-weight: 650; line-height: 2; }

.auth-panel-column {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    padding: clamp(1.2rem,3vw,2.7rem);
    background:
        radial-gradient(circle at 90% 5%,rgba(41,227,137,.07),transparent 18rem),
        linear-gradient(150deg,rgba(20,25,30,.98),rgba(12,16,20,.98));
}

.auth-topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: clamp(1.4rem,3vh,2.5rem); }
.auth-brand { display: inline-flex; align-items: center; gap: .7rem; color: #f4f8f6; font-size: 1rem; font-weight: 1000; letter-spacing: -.02em; }
.auth-brand b { color: #59eaa3; }
.auth-brand__mark { display: grid; width: 2.65rem; height: 2.65rem; place-items: center; border: 1px solid rgba(103,242,170,.35); border-radius: .9rem; color: #04130b; background: linear-gradient(145deg,#6af2ad,#20bd71); box-shadow: 0 12px 28px rgba(31,213,124,.17); }
.auth-language { display: inline-flex; min-height: 2.5rem; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.1); border-radius: .8rem; padding: 0 .8rem; color: #a8b4ae; background: rgba(255,255,255,.035); font-size: .62rem; font-weight: 900; transition: .2s ease; }
.auth-language:hover { color: #dffbed; border-color: rgba(82,238,157,.3); background: rgba(48,224,137,.07); }

.auth-main-card {
    width: 100%;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

.auth-heading h1 { font-size: clamp(1.7rem,4vw,2.35rem); }
.auth-heading h1 span { color: #5bedaa; }
.auth-heading > p:last-child { color: #9facb5; }
.auth-mode-tabs { border-color: rgba(255,255,255,.09); background: rgba(0,0,0,.25); }
.auth-mode-tabs button.is-active { color: #04130b; background: linear-gradient(120deg,#61efa8,#28c779); box-shadow: 0 10px 32px rgba(36,215,126,.16); }
.auth-form .field { border-color: rgba(255,255,255,.105) !important; border-radius: .9rem; background: rgba(5,8,10,.56) !important; }
.auth-form .field:focus { border-color: rgba(82,239,161,.7) !important; box-shadow: 0 0 0 4px rgba(61,228,145,.09) !important; }
.auth-security-note { border-color: rgba(68,235,151,.17); background: rgba(47,216,132,.055); }
.auth-security-note > span { color: #04130b; background: #50e99d; }

.auth-copyright { margin-top: clamp(1.2rem,3vh,2rem); color: #52605a !important; text-align: center; font-size: .56rem; font-weight: 750; }

/* Real OTP result animation: server response controls every state. */
.otp-verification {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: 6.1rem;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 1.25rem;
    padding: .85rem 1rem;
    background: linear-gradient(145deg,rgba(4,8,9,.52),rgba(24,31,29,.55));
    transition: border-color .28s ease,background .28s ease,box-shadow .28s ease;
}

.otp-verification__orb {
    position: relative;
    display: grid;
    width: 4.4rem;
    height: 4.4rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 1.35rem;
    color: #7deeb4;
    background: rgba(53,224,140,.065);
    box-shadow: inset 0 0 28px rgba(38,215,129,.05),0 0 30px rgba(38,215,129,.05);
}

.otp-verification__ring { position: absolute; border: 1px solid currentColor; border-radius: 50%; opacity: .18; }
.otp-verification__ring.is-one { inset: .38rem; border-style: dashed; }
.otp-verification__ring.is-two { inset: .78rem; opacity: .11; }
.otp-verification__symbol { position: absolute; width: 2.65rem; height: 2.65rem; opacity: 0; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; transform: scale(.65); transition: opacity .24s ease,transform .34s cubic-bezier(.2,.8,.2,1); }
.otp-verification.is-idle .otp-verification__symbol.is-idle,
.otp-verification.is-checking .otp-verification__symbol.is-checking,
.otp-verification.is-success .otp-verification__symbol.is-success,
.otp-verification.is-error .otp-verification__symbol.is-error { opacity: 1; transform: scale(1); }

.otp-verification__copy { min-width: 0; }
.otp-verification__copy b,.otp-verification__copy small { display: block; }
.otp-verification__copy b { color: #eef8f3; font-size: .78rem; font-weight: 1000; transition: color .2s ease; }
.otp-verification__copy small { margin-top: .35rem; color: #8c9a93; font-size: .59rem; font-weight: 650; line-height: 1.85; }

.otp-verification.is-checking { border-color: rgba(84,237,161,.24); box-shadow: 0 0 36px rgba(45,224,137,.065); }
.otp-verification.is-checking .otp-verification__ring.is-one { opacity: .58; animation: ampolOtpOrbit .8s linear infinite; }
.otp-verification.is-checking .otp-verification__ring.is-two { opacity: .28; animation: ampolOtpOrbit 1.25s linear infinite reverse; }
.otp-verification.is-checking .otp-verification__symbol.is-checking { animation: ampolOtpBreathe .85s ease-in-out infinite alternate; }

.otp-verification.is-success { border-color: rgba(52,238,146,.4); background: linear-gradient(145deg,rgba(18,89,57,.26),rgba(13,42,31,.56)); box-shadow: 0 0 45px rgba(44,228,139,.11); }
.otp-verification.is-success .otp-verification__orb { color: #71f2ad; background: rgba(46,225,137,.13); animation: ampolOtpSuccessPop .55s cubic-bezier(.18,.89,.32,1.28); }
.otp-verification.is-success .otp-verification__copy b { color: #8af4ba; }
.otp-verification.is-success .otp-verification__symbol.is-success path:last-child { stroke-dasharray: 32; stroke-dashoffset: 32; animation: ampolOtpDraw .5s .16s ease forwards; }

.otp-verification.is-error { border-color: rgba(251,92,113,.42); background: linear-gradient(145deg,rgba(92,20,32,.27),rgba(42,13,20,.56)); box-shadow: 0 0 38px rgba(246,65,93,.1); animation: ampolOtpShake .42s ease; }
.otp-verification.is-error .otp-verification__orb { color: #ff7186; background: rgba(244,63,94,.12); }
.otp-verification.is-error .otp-verification__copy b { color: #ff91a2; }

.otp-card .auth-heading { margin-top: 1.15rem; }
.otp-inputs { gap: clamp(.3rem,1.3vw,.55rem); }
.otp-inputs input { aspect-ratio: .9; border-radius: .75rem; transition: border-color .2s ease,box-shadow .2s ease,transform .2s ease,background .2s ease; }
.otp-inputs input:disabled { cursor: wait; opacity: .78; }
.otp-inputs.is-checking input { border-color: rgba(77,234,155,.3) !important; background: rgba(36,115,77,.13) !important; animation: ampolOtpCell 1s ease-in-out infinite alternate; }
.otp-inputs.is-checking input:nth-child(2) { animation-delay: .08s; }
.otp-inputs.is-checking input:nth-child(3) { animation-delay: .16s; }
.otp-inputs.is-checking input:nth-child(4) { animation-delay: .24s; }
.otp-inputs.is-checking input:nth-child(5) { animation-delay: .32s; }
.otp-inputs.is-checking input:nth-child(6) { animation-delay: .4s; }
.otp-inputs.is-success input { border-color: rgba(69,240,151,.72) !important; color: #8ff5bd !important; background: rgba(30,150,89,.15) !important; box-shadow: 0 0 22px rgba(47,226,137,.09); }
.otp-inputs.is-error input { border-color: rgba(251,88,111,.64) !important; color: #ff97a7 !important; background: rgba(120,24,40,.14) !important; }

.otp-submit { position: relative; gap: .55rem; overflow: hidden; }
.otp-submit__spinner { width: 1rem; height: 1rem; flex: 0 0 auto; border: 2px solid rgba(2,20,11,.24); border-top-color: #02150b; border-radius: 50%; animation: ampolOtpOrbit .65s linear infinite; }
.otp-submit.is-success { color: #02150b !important; background: linear-gradient(120deg,#6ef2ad,#26cd79) !important; box-shadow: 0 14px 35px rgba(46,223,133,.18) !important; }
.otp-submit:disabled { pointer-events: none; }

@keyframes ampolAuthGlow { from { transform: translate3d(-3%,0,0) scale(.9); } to { transform: translate3d(7%,5%,0) scale(1.12); } }
@keyframes ampolLiveDot { 50% { opacity: .48; box-shadow: 0 0 0 9px rgba(40,233,141,0),0 0 30px rgba(40,233,141,.8); } }
@keyframes ampolAuthOrbit { to { transform: rotate(360deg); } }
@keyframes ampolAuthParticle { to { transform: translate3d(1rem,-1.4rem,0) scale(1.6); opacity: .35; } }
@keyframes ampolAuthDevice { to { transform: rotateY(5deg) rotateX(-2deg) translateY(-.65rem); } }
@keyframes ampolDeviceSheen { 0%,25% { transform: translateX(-60%); } 55%,100% { transform: translateX(58%); } }
@keyframes ampolDemoDigit { 0%,8% { opacity: 0; transform: translateY(100%) scale(.7); } 18%,73% { opacity: 1; transform: translateY(0) scale(1); } 83%,100% { opacity: 0; transform: translateY(-100%) scale(.7); } }
@keyframes ampolDemoScan { 0%,38% { transform: translateX(-110%); } 68%,100% { transform: translateX(110%); } }
@keyframes ampolDemoLoader { 0%,40% { opacity: 0; transform: rotate(0); } 46%,66% { opacity: 1; transform: rotate(420deg); } 72%,100% { opacity: 0; transform: rotate(600deg); } }
@keyframes ampolDemoCheck { 0%,66% { opacity: 0; transform: scale(.2); } 73%,84% { opacity: 1; transform: scale(1.15); } 91%,100% { opacity: 0; transform: scale(.7); } }
@keyframes ampolOtpOrbit { to { transform: rotate(360deg); } }
@keyframes ampolOtpBreathe { to { opacity: .5; transform: scale(.86) rotate(22deg); } }
@keyframes ampolOtpSuccessPop { 0% { transform: scale(.65); } 70% { transform: scale(1.09); } 100% { transform: scale(1); } }
@keyframes ampolOtpDraw { to { stroke-dashoffset: 0; } }
@keyframes ampolOtpShake { 20%,60% { transform: translateX(-5px); } 40%,80% { transform: translateX(5px); } }
@keyframes ampolOtpCell { to { transform: translateY(-3px); box-shadow: 0 0 24px rgba(45,227,139,.13); } }

@media (max-width: 900px) {
    .auth-page { display: block; padding: .75rem; }
    .auth-shell { grid-template-columns: 1fr; width: min(100%,36rem); min-height: auto; margin-inline: auto; border-radius: 1.8rem; }
    .auth-showcase { min-height: 15rem; padding: 1.2rem; border-inline-end: 0; border-bottom: 1px solid rgba(255,255,255,.08); }
    .auth-motion-scene { min-height: 11.5rem; }
    .auth-motion-scene__orbit.is-outer { width: 17rem; height: 17rem; }
    .auth-motion-scene__orbit.is-inner { width: 13rem; height: 13rem; }
    .auth-verify-device { width: 18rem; padding: .9rem; border-radius: 1.5rem; transform: scale(.7) rotateY(-4deg); animation-name: ampolAuthDeviceCompact; }
    .auth-verify-device__shield { width: 4rem; height: 4rem; margin: .8rem auto .5rem; border-radius: 1.2rem; }
    .auth-verify-device__shield svg { width: 2.5rem; height: 2.5rem; }
    .auth-showcase__copy { display: none; }
    .auth-panel-column { padding: clamp(1.1rem,5vw,2rem); }
    .auth-topbar { margin-bottom: 1.5rem; }
    @keyframes ampolAuthDeviceCompact { to { transform: scale(.73) rotateY(4deg) translateY(-.35rem); } }
}

@media (max-width: 520px) {
    .auth-page { padding: 0; }
    .auth-shell { min-height: 100vh; border: 0; border-radius: 0; box-shadow: none; }
    .auth-showcase { min-height: 11.25rem; padding: .9rem 1rem; }
    .auth-showcase__top { font-size: .52rem; }
    .auth-motion-scene { min-height: 8.6rem; }
    .auth-motion-scene__orbit.is-outer { width: 13.5rem; height: 13.5rem; }
    .auth-motion-scene__orbit.is-inner { width: 10.5rem; height: 10.5rem; }
    .auth-motion-scene__particle { display: none; }
    .auth-verify-device { width: 17rem; transform: scale(.52); animation-name: ampolAuthDevicePhone; }
    .auth-panel-column { justify-content: flex-start; padding: 1rem; }
    .auth-topbar { margin-bottom: 1.25rem; }
    .auth-brand { font-size: .85rem; }
    .auth-brand__mark { width: 2.25rem; height: 2.25rem; border-radius: .72rem; }
    .auth-language { min-height: 2.25rem; }
    .auth-heading h1 { font-size: 1.55rem; }
    .auth-heading > p:last-child { font-size: .7rem; }
    .auth-form { gap: .78rem; }
    .auth-form .field { min-height: 3.15rem; }
    .otp-verification { min-height: 5.15rem; gap: .7rem; padding: .65rem .72rem; border-radius: 1rem; }
    .otp-verification__orb { width: 3.65rem; height: 3.65rem; border-radius: 1.05rem; }
    .otp-verification__symbol { width: 2.25rem; height: 2.25rem; }
    .otp-verification__copy b { font-size: .68rem; }
    .otp-verification__copy small { font-size: .53rem; }
    .otp-inputs { gap: .28rem; }
    .otp-inputs input { min-height: 3.15rem; aspect-ratio: auto; border-radius: .62rem; font-size: 1.2rem; }
    .auth-copyright { padding-bottom: .5rem; }
    @keyframes ampolAuthDevicePhone { to { transform: scale(.55) translateY(-.25rem); } }
}

@media (prefers-reduced-motion: reduce) {
    .auth-page__glow,.auth-live-dot,.auth-motion-scene__orbit,.auth-motion-scene__particle,
    .auth-verify-device,.auth-verify-device::after,.auth-demo-code i,.auth-demo-verify::after,
    .auth-demo-verify__loader,.auth-demo-verify svg,.otp-verification__ring,
    .otp-verification__symbol,.otp-verification,.otp-inputs input,.otp-submit__spinner {
        animation: none !important;
        transition: none !important;
    }
    .auth-demo-code i { opacity: 1; transform: none; }
    .auth-demo-verify__loader { display: none; }
    .auth-demo-verify svg { position: static; opacity: 1; transform: none; }
}

/* ======================================================================
   AMPOLSHOP V10.4 — theme-aware auth, cinematic OTP and reliable slot flow
   ====================================================================== */
html[data-theme] body.ampol-auth-body {
    --auth-accent: var(--theme-accent);
    --auth-accent-2: var(--theme-accent-2);
    --auth-accent-3: var(--theme-accent-3);
    --auth-accent-soft: var(--theme-accent-soft);
    --auth-line: var(--theme-line);
    --auth-line-strong: var(--theme-line-strong);
    --auth-text: var(--theme-text);
    --auth-muted: var(--theme-muted);
    --auth-faint: var(--theme-faint);
    --auth-panel: var(--theme-panel);
    --auth-panel-strong: var(--theme-panel-strong);
    --auth-panel-soft: var(--theme-panel-soft);
    min-height: 100vh;
    color: var(--auth-text) !important;
    background: var(--theme-page) !important;
}

html[data-theme] .auth-page {
    background:
        radial-gradient(circle at 7% 7%,var(--theme-hero-glow),transparent 31rem),
        radial-gradient(circle at 94% 88%,var(--auth-accent-soft),transparent 34rem),
        linear-gradient(145deg,var(--theme-page),var(--theme-page-alt)) !important;
}
html[data-theme] .auth-page__glow.is-start { background: var(--auth-accent); }
html[data-theme] .auth-page__glow.is-end { background: var(--auth-accent-2); }
html[data-theme] .auth-page__mesh {
    opacity: .22;
    background-image:
        linear-gradient(color-mix(in srgb,var(--auth-text) 7%,transparent) 1px,transparent 1px),
        linear-gradient(90deg,color-mix(in srgb,var(--auth-text) 7%,transparent) 1px,transparent 1px);
}

html[data-theme] .auth-shell {
    color: var(--auth-text);
    border-color: var(--auth-line);
    background: color-mix(in srgb,var(--auth-panel-strong) 94%,transparent);
    box-shadow: 0 42px 140px var(--theme-shadow),0 0 0 1px color-mix(in srgb,var(--auth-accent) 6%,transparent);
}
html[data-theme] .auth-showcase {
    border-color: color-mix(in srgb,var(--theme-on-dark) 10%,transparent);
    background:
        radial-gradient(circle at 52% 43%,color-mix(in srgb,var(--auth-accent) 24%,transparent),transparent 18rem),
        linear-gradient(150deg,var(--theme-dark-2),var(--theme-dark));
}
html[data-theme] .auth-showcase::before {
    background-image:
        linear-gradient(115deg,transparent 0 48%,color-mix(in srgb,var(--theme-on-dark) 7%,transparent) 49% 50%,transparent 51%),
        radial-gradient(circle at 50% 45%,transparent 0 13rem,color-mix(in srgb,var(--auth-accent) 16%,transparent) 13.05rem 13.15rem,transparent 13.2rem);
}
html[data-theme] .auth-showcase__top { color: var(--theme-on-dark-muted); }
html[data-theme] .auth-showcase__top b { color: color-mix(in srgb,var(--theme-on-dark-muted) 55%,transparent); }
html[data-theme] .auth-live-dot {
    background: var(--auth-accent-3);
    box-shadow: 0 0 0 5px var(--auth-accent-soft),0 0 24px var(--auth-accent);
}
html[data-theme] .auth-motion-scene__orbit { border-color: color-mix(in srgb,var(--auth-accent) 28%,transparent); }
html[data-theme] .auth-motion-scene__orbit::before,
html[data-theme] .auth-motion-scene__orbit::after {
    border-color: var(--auth-accent-3);
    background: var(--theme-dark);
    box-shadow: 0 0 20px var(--auth-accent);
}
html[data-theme] .auth-motion-scene__particle {
    background: var(--auth-accent-3);
    box-shadow: 0 0 18px var(--auth-accent);
}
.auth-motion-scene__beam {
    position: absolute;
    z-index: 4;
    inset: 8% 12%;
    overflow: hidden;
    border-radius: 50%;
    pointer-events: none;
}
.auth-motion-scene__beam::before {
    content: '';
    position: absolute;
    inset: -30% 0 auto;
    height: 28%;
    opacity: .38;
    background: linear-gradient(to bottom,transparent,color-mix(in srgb,var(--auth-accent) 34%,transparent),transparent);
    filter: blur(5px);
    animation: ampolAuthBeam 5.8s ease-in-out infinite;
}

html[data-theme] .auth-verify-device {
    border-color: color-mix(in srgb,var(--theme-on-dark) 15%,transparent);
    background: linear-gradient(155deg,color-mix(in srgb,var(--theme-dark-2) 90%,var(--auth-accent) 10%),var(--theme-dark));
    box-shadow: 0 30px 90px rgba(0,0,0,.5),0 0 58px color-mix(in srgb,var(--auth-accent) 17%,transparent);
}
html[data-theme] .auth-mini-mark {
    color: var(--theme-action-text);
    background: linear-gradient(145deg,var(--auth-accent-3),var(--auth-accent-2));
    box-shadow: 0 10px 26px color-mix(in srgb,var(--auth-accent) 23%,transparent);
}
html[data-theme] .auth-verify-device__head b { color: var(--theme-on-dark); }
html[data-theme] .auth-verify-device__head small,
html[data-theme] .auth-verify-device > p { color: var(--theme-on-dark-muted); }
html[data-theme] .auth-verify-device__head > i { background: var(--auth-accent-3); box-shadow: 0 0 15px var(--auth-accent); }
html[data-theme] .auth-verify-device__shield {
    position: relative;
    color: var(--auth-accent-3);
    border-color: color-mix(in srgb,var(--auth-accent) 28%,transparent);
    background: var(--auth-accent-soft);
    box-shadow: inset 0 0 34px var(--auth-accent-soft),0 0 42px var(--auth-accent-soft);
}
.auth-verify-device__shield svg {
    position: absolute;
    opacity: 0;
}
.auth-verify-device__shield svg.is-shield { animation: ampolDemoShieldStage 6.6s ease-in-out infinite; }
.auth-verify-device__shield svg.is-checking { animation: ampolDemoCheckingStage 6.6s ease-in-out infinite; }
.auth-verify-device__shield svg.is-success { animation: ampolDemoSuccessStage 6.6s ease-in-out infinite; }
html[data-theme] .auth-demo-code span {
    color: var(--theme-on-dark);
    border-color: color-mix(in srgb,var(--theme-on-dark) 14%,transparent);
    background: color-mix(in srgb,var(--theme-dark) 72%,transparent);
}
.auth-demo-code i { animation-duration: 6.6s; }
html[data-theme] .auth-demo-verify {
    color: var(--auth-accent-3);
    border-color: color-mix(in srgb,var(--auth-accent) 30%,transparent);
    background: var(--auth-accent-soft);
}
.auth-demo-verify b { position: relative; min-width: 8.4rem; min-height: 1rem; text-align: center; }
.auth-demo-verify b span { position: absolute; inset: 0; display: grid; place-items: center; }
.auth-demo-verify b span:first-child { animation: ampolDemoVerifyLabel 6.6s ease-in-out infinite; }
.auth-demo-verify b span:last-child { opacity: 0; animation: ampolDemoVerifiedLabel 6.6s ease-in-out infinite; }
.auth-demo-verify::after,
.auth-demo-verify__loader,
.auth-demo-verify svg { animation-duration: 6.6s; }
html[data-theme] .auth-demo-verify__loader { border-color: var(--auth-accent-soft); border-top-color: var(--auth-accent-3); }
html[data-theme] .auth-demo-verify svg { stroke: var(--theme-action-text); background: var(--auth-accent-3); }
html[data-theme] .auth-showcase__copy > span,
html[data-theme] .auth-showcase__copy h2 strong { color: var(--auth-accent-3); }
html[data-theme] .auth-showcase__copy h2 { color: var(--theme-on-dark); }
html[data-theme] .auth-showcase__copy p { color: var(--theme-on-dark-muted); }

html[data-theme] .auth-panel-column {
    background:
        radial-gradient(circle at 90% 5%,var(--auth-accent-soft),transparent 18rem),
        linear-gradient(150deg,var(--auth-panel-strong),var(--auth-panel));
}
html[data-theme] .auth-brand { color: var(--auth-text); }
html[data-theme] .auth-brand b,
html[data-theme] .auth-heading h1 span,
html[data-theme] .auth-form-row > a,
html[data-theme] .auth-switch a,
html[data-theme] .auth-back,
html[data-theme] .otp-resend button { color: var(--theme-accent-text); }
html[data-theme] .auth-brand__mark {
    color: var(--theme-action-text);
    border-color: var(--auth-line-strong);
    background: linear-gradient(145deg,var(--auth-accent-3),var(--auth-accent-2));
    box-shadow: 0 12px 28px var(--auth-accent-soft);
}
html[data-theme] .auth-language {
    color: var(--auth-muted);
    border-color: var(--auth-line);
    background: var(--auth-panel-soft);
}
html[data-theme] .auth-language:hover { color: var(--theme-accent-text); border-color: var(--auth-line-strong); background: var(--auth-accent-soft); }
html[data-theme] .auth-heading h1,
html[data-theme] .auth-heading > p:last-child b { color: var(--auth-text); }
html[data-theme] .auth-heading > p:last-child,
html[data-theme] .auth-remember,
html[data-theme] .auth-switch { color: var(--auth-muted) !important; }
html[data-theme] .auth-mode-tabs { border-color: var(--auth-line); background: var(--auth-panel-soft); }
html[data-theme] .auth-mode-tabs button { color: var(--auth-muted); }
html[data-theme] .auth-mode-tabs button.is-active {
    color: var(--theme-action-text);
    background: linear-gradient(120deg,var(--theme-action-from),var(--theme-action-to));
    box-shadow: 0 10px 32px var(--auth-accent-soft);
}
html[data-theme] .auth-form .field {
    color: var(--auth-text) !important;
    -webkit-text-fill-color: var(--auth-text) !important;
    border-color: var(--auth-line) !important;
    background: var(--auth-panel-soft) !important;
}
html[data-theme] .auth-form .field::placeholder { color: var(--auth-faint) !important; -webkit-text-fill-color: var(--auth-faint) !important; }
html[data-theme] .auth-form .field:focus {
    border-color: var(--auth-accent) !important;
    box-shadow: 0 0 0 4px var(--auth-accent-soft) !important;
}
html[data-theme] .auth-field-wrap > i { color: var(--theme-accent-text); }
html[data-theme] .auth-security-note { border-color: var(--auth-line-strong); background: var(--auth-accent-soft); }
html[data-theme] .auth-security-note > span { color: var(--theme-action-text); background: var(--auth-accent); }
html[data-theme] .auth-security-note b { color: var(--auth-text); }
html[data-theme] .auth-security-note small,
html[data-theme] .auth-copyright { color: var(--auth-muted) !important; }

/* The real verification animation uses the submitted digits. */
.otp-cinematic {
    display: grid;
    grid-template-columns: 9.5rem minmax(0,1fr);
    align-items: center;
    gap: 1.25rem;
    min-height: 10.5rem;
    overflow: hidden;
    border: 1px solid var(--auth-line);
    border-radius: 1.55rem;
    padding: 1rem 1.15rem;
    background:
        radial-gradient(circle at 18% 50%,var(--auth-accent-soft),transparent 8rem),
        var(--auth-panel-soft);
    transition: border-color .3s ease,background .3s ease,box-shadow .3s ease;
}
.otp-cinematic__visual {
    position: relative;
    display: grid;
    width: 9rem;
    height: 9rem;
    place-items: center;
}
.otp-cinematic__ring {
    position: absolute;
    border: 1px solid var(--auth-line-strong);
    border-radius: 50%;
    opacity: .28;
}
.otp-cinematic__ring.is-outer { inset: .2rem; border-style: dashed; }
.otp-cinematic__ring.is-inner { inset: 1.45rem; opacity: .18; }
.otp-cinematic__orbit { position: absolute; inset: 0; opacity: .34; transition: opacity .25s ease,transform .4s ease; }
.otp-cinematic__orbit span {
    position: absolute;
    top: 50%;
    left: 50%;
    display: grid;
    width: 1.55rem;
    height: 1.55rem;
    place-items: center;
    margin: -.775rem;
    border: 1px solid var(--auth-line-strong);
    border-radius: .5rem;
    color: var(--theme-accent-text);
    background: var(--auth-panel-strong);
    box-shadow: 0 7px 20px var(--theme-shadow);
    font-family: monospace;
    font-size: .68rem;
    font-weight: 1000;
    transform: rotate(calc(var(--otp-index) * 60deg)) translateY(-3.45rem) rotate(calc(var(--otp-index) * -60deg));
}
.otp-cinematic__core {
    position: relative;
    z-index: 3;
    display: grid;
    width: 4.8rem;
    height: 4.8rem;
    place-items: center;
    border: 1px solid var(--auth-line-strong);
    border-radius: 1.5rem;
    color: var(--theme-accent-text);
    background: var(--auth-panel-strong);
    box-shadow: inset 0 0 28px var(--auth-accent-soft),0 0 35px var(--auth-accent-soft);
}
.otp-cinematic__symbol {
    position: absolute;
    width: 3rem;
    height: 3rem;
    opacity: 0;
    stroke: currentColor;
    stroke-width: 2.7;
    stroke-linecap: round;
    stroke-linejoin: round;
    transform: scale(.55);
    transition: opacity .22s ease,transform .36s cubic-bezier(.18,.89,.32,1.28);
}
.otp-cinematic.is-idle .otp-cinematic__symbol.is-idle,
.otp-cinematic.is-checking .otp-cinematic__symbol.is-checking,
.otp-cinematic.is-success .otp-cinematic__symbol.is-success,
.otp-cinematic.is-error .otp-cinematic__symbol.is-error { opacity: 1; transform: scale(1); }
.otp-cinematic__copy { min-width: 0; }
.otp-cinematic__copy b,
.otp-cinematic__copy small { display: block; }
.otp-cinematic__copy b { color: var(--auth-text); font-size: .86rem; font-weight: 1000; }
.otp-cinematic__copy small { margin-top: .4rem; color: var(--auth-muted); font-size: .62rem; font-weight: 700; line-height: 1.9; }

.otp-cinematic.is-checking {
    border-color: var(--auth-line-strong);
    box-shadow: 0 0 46px var(--auth-accent-soft);
}
.otp-cinematic.is-checking .otp-cinematic__ring.is-outer { opacity: .65; animation: ampolOtpOrbit 1.35s linear infinite; }
.otp-cinematic.is-checking .otp-cinematic__ring.is-inner { opacity: .42; animation: ampolOtpOrbit .85s linear infinite reverse; }
.otp-cinematic.is-checking .otp-cinematic__orbit { opacity: 1; animation: ampolOtpDigitOrbit .95s linear infinite; }
.otp-cinematic.is-checking .otp-cinematic__core { animation: ampolOtpCorePulse .75s ease-in-out infinite alternate; }

.otp-cinematic.is-success {
    border-color: rgba(34,197,94,.52);
    background: linear-gradient(145deg,rgba(34,197,94,.14),var(--auth-panel-soft));
    box-shadow: 0 0 48px rgba(34,197,94,.12);
}
.otp-cinematic.is-success .otp-cinematic__core { color: #16a35a; border-color: rgba(34,197,94,.5); animation: ampolOtpResultPop .6s cubic-bezier(.18,.89,.32,1.28); }
.otp-cinematic.is-success .otp-cinematic__orbit { opacity: 0; transform: scale(1.25); }
.otp-cinematic.is-success .otp-cinematic__copy b { color: #168249; }
.otp-cinematic.is-success .otp-cinematic__symbol.is-success path:last-child { stroke-dasharray: 36; stroke-dashoffset: 36; animation: ampolOtpDraw .52s .12s ease forwards; }

.otp-cinematic.is-error {
    border-color: rgba(244,63,94,.52);
    background: linear-gradient(145deg,rgba(244,63,94,.12),var(--auth-panel-soft));
    box-shadow: 0 0 45px rgba(244,63,94,.1);
    animation: ampolOtpShake .42s ease;
}
.otp-cinematic.is-error .otp-cinematic__core { color: #e11d48; border-color: rgba(244,63,94,.46); animation: ampolOtpResultPop .5s cubic-bezier(.18,.89,.32,1.28); }
.otp-cinematic.is-error .otp-cinematic__orbit { opacity: 0; transform: scale(.72); }
.otp-cinematic.is-error .otp-cinematic__copy b { color: #d51d45; }
.otp-cinematic.is-error .otp-cinematic__symbol.is-error path:last-child { stroke-dasharray: 58; stroke-dashoffset: 58; animation: ampolOtpDraw .42s .08s ease forwards; }

.otp-entry { position: relative; cursor: text; }
.otp-entry__capture {
    position: absolute;
    z-index: 5;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: .001;
    border: 0 !important;
    padding: 0 !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    background: transparent !important;
    caret-color: transparent;
    outline: none !important;
}
.otp-inputs { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: clamp(.3rem,1.3vw,.55rem); pointer-events: none; }
.otp-inputs span {
    position: relative;
    display: grid;
    width: 100%;
    min-width: 0;
    aspect-ratio: .9;
    place-items: center;
    border: 1px solid var(--auth-line);
    border-radius: .78rem;
    color: var(--auth-text);
    background: var(--auth-panel-soft);
    box-shadow: inset 0 1px 0 color-mix(in srgb,var(--auth-text) 5%,transparent);
    font-family: monospace;
    font-size: clamp(1.15rem,5vw,1.55rem);
    font-weight: 1000;
    transition: border-color .2s ease,box-shadow .2s ease,transform .2s ease,background .2s ease;
}
.otp-inputs span.is-active {
    border-color: var(--auth-accent);
    box-shadow: 0 0 0 3px var(--auth-accent-soft),0 0 24px var(--auth-accent-soft);
    transform: translateY(-2px);
}
.otp-inputs span.is-active::after {
    content: '';
    position: absolute;
    bottom: .42rem;
    width: .32rem;
    height: 2px;
    border-radius: 99px;
    background: var(--auth-accent);
    animation: ampolOtpCaret .8s steps(1) infinite;
}
.otp-inputs span.is-filled { color: var(--theme-accent-text); border-color: var(--auth-line-strong); background: var(--auth-accent-soft); }
.otp-entry.is-checking .otp-inputs span { border-color: var(--auth-line-strong); background: var(--auth-accent-soft); animation: ampolOtpSlotWave .8s ease-in-out infinite alternate; }
.otp-entry.is-checking .otp-inputs span:nth-child(2) { animation-delay: .08s; }
.otp-entry.is-checking .otp-inputs span:nth-child(3) { animation-delay: .16s; }
.otp-entry.is-checking .otp-inputs span:nth-child(4) { animation-delay: .24s; }
.otp-entry.is-checking .otp-inputs span:nth-child(5) { animation-delay: .32s; }
.otp-entry.is-checking .otp-inputs span:nth-child(6) { animation-delay: .4s; }
.otp-entry.is-success .otp-inputs span { color: #168249; border-color: rgba(34,197,94,.54); background: rgba(34,197,94,.1); }
.otp-entry.is-error .otp-inputs span { color: #d51d45; border-color: rgba(244,63,94,.54); background: rgba(244,63,94,.09); }

html[data-theme] .otp-timer { border-color: var(--auth-line); background: var(--auth-panel-soft); }
html[data-theme] .otp-timer span { color: var(--theme-accent-text); }
html[data-theme] .otp-timer small { color: var(--auth-muted); }
html[data-theme] .otp-submit.is-success {
    color: #fff !important;
    background: linear-gradient(120deg,#168249,#22c55e) !important;
    box-shadow: 0 14px 35px rgba(34,197,94,.18) !important;
}

@keyframes ampolAuthBeam { 0%,12% { transform: translateY(-120%); opacity: 0; } 35%,70% { opacity: .55; } 88%,100% { transform: translateY(560%); opacity: 0; } }
@keyframes ampolDemoShieldStage { 0%,32% { opacity: 1; transform: scale(1); } 40%,100% { opacity: 0; transform: scale(.65); } }
@keyframes ampolDemoCheckingStage { 0%,30% { opacity: 0; transform: scale(.55) rotate(0); } 40%,65% { opacity: 1; transform: scale(1) rotate(220deg); } 72%,100% { opacity: 0; transform: scale(.65) rotate(420deg); } }
@keyframes ampolDemoSuccessStage { 0%,66% { opacity: 0; transform: scale(.5); } 76%,92% { opacity: 1; transform: scale(1.08); } 100% { opacity: 0; transform: scale(.75); } }
@keyframes ampolDemoVerifyLabel { 0%,35% { opacity: 0; } 44%,68% { opacity: 1; } 76%,100% { opacity: 0; } }
@keyframes ampolDemoVerifiedLabel { 0%,68% { opacity: 0; } 77%,92% { opacity: 1; } 100% { opacity: 0; } }
@keyframes ampolOtpDigitOrbit { to { transform: rotate(360deg); } }
@keyframes ampolOtpCorePulse { to { transform: scale(.88); box-shadow: inset 0 0 34px var(--auth-accent-soft),0 0 48px var(--auth-accent-soft); } }
@keyframes ampolOtpResultPop { 0% { transform: scale(.55); } 72% { transform: scale(1.12); } 100% { transform: scale(1); } }
@keyframes ampolOtpCaret { 0%,48% { opacity: 1; } 49%,100% { opacity: 0; } }
@keyframes ampolOtpSlotWave { to { transform: translateY(-4px); box-shadow: 0 0 24px var(--auth-accent-soft); } }

@media (max-width: 560px) {
    .otp-cinematic { grid-template-columns: 7.3rem minmax(0,1fr); gap: .8rem; min-height: 8.5rem; padding: .72rem; border-radius: 1.15rem; }
    .otp-cinematic__visual { width: 7rem; height: 7rem; }
    .otp-cinematic__orbit span { width: 1.25rem; height: 1.25rem; margin: -.625rem; border-radius: .4rem; font-size: .58rem; transform: rotate(calc(var(--otp-index) * 60deg)) translateY(-2.7rem) rotate(calc(var(--otp-index) * -60deg)); }
    .otp-cinematic__core { width: 3.8rem; height: 3.8rem; border-radius: 1.15rem; }
    .otp-cinematic__symbol { width: 2.4rem; height: 2.4rem; }
    .otp-cinematic__copy b { font-size: .72rem; }
    .otp-cinematic__copy small { font-size: .54rem; line-height: 1.75; }
    .otp-inputs { gap: .28rem; }
    .otp-inputs span { min-height: 3.15rem; aspect-ratio: auto; border-radius: .62rem; font-size: 1.2rem; }
}

@media (prefers-reduced-motion: reduce) {
    .auth-motion-scene__beam::before,
    .auth-verify-device__shield svg,
    .auth-demo-verify b span,
    .otp-cinematic__ring,
    .otp-cinematic__orbit,
    .otp-cinematic__core,
    .otp-cinematic,
    .otp-inputs span,
    .otp-inputs span::after { animation: none !important; transition: none !important; }
    .auth-verify-device__shield svg.is-shield { opacity: 1; transform: none; }
    .auth-verify-device__shield svg.is-checking,
    .auth-verify-device__shield svg.is-success { display: none; }
    .auth-demo-verify b span:first-child { position: static; opacity: 1; }
    .auth-demo-verify b span:last-child { display: none; }
}


/* ======================================================================
   AMPOLSHOP V10.5 — secure cancellation, live operations and theme closure
   ====================================================================== */
html[data-theme] body.ampol-app .ampol-theme-panel{color:var(--theme-text)!important;border-color:var(--theme-line)!important;background:linear-gradient(150deg,var(--theme-panel),var(--theme-panel-soft))!important}
html[data-theme] body.ampol-app .ampol-theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
html[data-theme] body.ampol-app .ampol-theme-choice{position:relative;display:grid;min-height:5.25rem;cursor:pointer;grid-template-columns:3rem minmax(0,1fr) 1.7rem;align-items:center;gap:.7rem;border:1px solid var(--theme-line)!important;border-radius:1rem;padding:.7rem;color:var(--theme-text)!important;background:var(--theme-panel-strong)!important;transition:.2s ease}
html[data-theme] body.ampol-app .ampol-theme-choice input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
html[data-theme] body.ampol-app .ampol-theme-choice:is(:hover,:focus-within){border-color:var(--theme-line-strong)!important;transform:translateY(-1px)}
html[data-theme] body.ampol-app .ampol-theme-choice:has(input:checked){border-color:var(--theme-accent)!important;background:var(--theme-accent-soft)!important;box-shadow:0 0 0 3px var(--theme-accent-soft)!important}
html[data-theme] body.ampol-app .ampol-theme-choice__copy b{display:block;color:var(--theme-text)!important;font-size:.72rem;font-weight:950}
html[data-theme] body.ampol-app .ampol-theme-choice__copy small{display:block;margin-top:.18rem;color:var(--theme-muted)!important;font-size:.55rem;line-height:1.65}
html[data-theme] body.ampol-app .ampol-theme-choice__check{display:grid;width:1.55rem;height:1.55rem;place-items:center;border:1px solid var(--theme-line);border-radius:999px;color:transparent;background:var(--theme-panel-soft)}
html[data-theme] body.ampol-app .ampol-theme-choice:has(input:checked) .ampol-theme-choice__check{color:var(--theme-action-text)!important;border-color:transparent!important;background:linear-gradient(120deg,var(--theme-action-from),var(--theme-action-to))!important}
html[data-theme] body.ampol-app .ampol-theme-current{color:var(--theme-muted)!important;border:1px solid var(--theme-line);border-radius:999px;padding:.55rem .75rem;background:var(--theme-panel-strong);font-size:.62rem;font-weight:850}
html[data-theme] body.ampol-app .ampol-theme-current b{color:var(--theme-accent-text)!important}
html[data-theme] body.ampol-app .ampol-order-detail-page{color:var(--theme-text)!important;background:radial-gradient(circle at 8% 12%,var(--theme-hero-glow),transparent 32%),radial-gradient(circle at 92% 68%,color-mix(in srgb,var(--theme-accent-2) 18%,transparent),transparent 36%),linear-gradient(135deg,var(--theme-page),var(--theme-page-alt))!important}
html[data-theme] body.ampol-app .ampol-order-detail-page .ampol-order-detail-orb.is-start{background:var(--theme-accent)!important;opacity:.28}
html[data-theme] body.ampol-app .ampol-order-detail-page .ampol-order-detail-orb.is-end{background:var(--theme-accent-2)!important;opacity:.24}
html[data-theme] body.ampol-app .ampol-order-detail-page header h1{color:var(--theme-text)!important}
html[data-theme] body.ampol-app .ampol-order-detail-page header p{color:var(--theme-muted)!important}
html[data-theme] body.ampol-app .ampol-order-detail-page header p:first-of-type{color:var(--theme-accent-text)!important}
html[data-theme] body.ampol-app .ampol-order-detail-page header .bg-emerald-500{background:var(--theme-accent)!important}
.ampol-user-cancel-card{display:flex;align-items:center;justify-content:space-between;gap:1rem;border:1px solid color-mix(in srgb,#f43f5e 30%,var(--theme-line));border-radius:1.35rem;padding:1rem;color:var(--theme-text);background:color-mix(in srgb,#f43f5e 7%,var(--theme-panel-strong));box-shadow:0 18px 48px var(--theme-shadow)}
.ampol-user-cancel-card h2{color:var(--theme-text)!important;font-size:1rem;font-weight:950}
.ampol-user-cancel-card p{margin-top:.35rem;color:var(--theme-muted)!important;font-size:.7rem;line-height:1.9}
.ampol-user-cancel-card p b{color:#e11d48!important}.ampol-user-cancel-card.is-locked{border-color:var(--theme-line);background:var(--theme-panel-soft)}
.ampol-order-sync-bar{display:flex;min-height:2.85rem;align-items:center;gap:.55rem;border:1px solid var(--theme-line);border-radius:1rem;padding:.5rem .6rem;color:var(--theme-muted);background:var(--theme-panel);box-shadow:0 12px 32px var(--theme-shadow);font-size:.62rem;font-weight:850}
.ampol-order-sync-dot{width:.48rem;height:.48rem;flex:0 0 auto;border-radius:999px;background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.11),0 0 14px rgba(34,197,94,.45)}
.ampol-order-sync-bar [data-order-sync-status][data-state=offline]{color:#e11d48!important}.ampol-order-sync-bar:has([data-state=offline]) .ampol-order-sync-dot{background:#f43f5e;box-shadow:0 0 0 5px rgba(244,63,94,.11)}
.ampol-order-sync-bar button{margin-inline-start:auto;border:1px solid var(--theme-line-strong);border-radius:.72rem;padding:.45rem .7rem;color:var(--theme-accent-text);background:var(--theme-accent-soft);font-size:.6rem;font-weight:950}.ampol-order-sync-bar button:disabled{cursor:wait;opacity:.55}
.ampol-order-sync-toast{position:fixed;z-index:300;inset-inline-start:50%;top:max(1rem,env(safe-area-inset-top));display:flex;width:min(calc(100vw - 1.5rem),34rem);align-items:center;gap:.7rem;transform:translate(-50%,-1rem);border:1px solid var(--theme-line-strong);border-radius:1rem;padding:.8rem .9rem;color:var(--theme-text);background:var(--theme-panel-strong);box-shadow:0 22px 70px var(--theme-shadow);opacity:0;pointer-events:none;transition:.22s ease}
.ampol-order-sync-toast.is-visible{transform:translate(-50%,0);opacity:1}.ampol-order-sync-toast>span{display:grid;width:2rem;height:2rem;flex:0 0 auto;place-items:center;border-radius:.65rem;color:var(--theme-action-text);background:var(--theme-accent);font-weight:1000}.ampol-order-sync-toast b{color:var(--theme-text)!important;font-size:.7rem;line-height:1.8}.ampol-order-sync-toast.is-danger{border-color:rgba(244,63,94,.38);background:color-mix(in srgb,#f43f5e 8%,var(--theme-panel-strong))}.ampol-order-sync-toast.is-danger>span{color:#fff;background:#e11d48}
@media (min-width:900px){html[data-theme] body.ampol-app .ampol-theme-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){html[data-theme] body.ampol-app .ampol-theme-grid{grid-template-columns:minmax(0,1fr)}html[data-theme] body.ampol-app .ampol-theme-choice{min-height:4.4rem;grid-template-columns:2.5rem minmax(0,1fr) 1.5rem;padding:.58rem}.ampol-user-cancel-card{align-items:stretch;flex-direction:column}.ampol-user-cancel-card form,.ampol-user-cancel-card button{width:100%}.ampol-order-sync-bar{position:sticky;z-index:35;top:.5rem}}

/* source: public/css/ampol-v12.css */
/* AMPOLSHOP V12 — complete visual system and storefront redesign */

html[data-theme] {
    --v12-page: var(--theme-page, #f4faf7);
    --v12-page-alt: var(--theme-page-alt, #e8f2ed);
    --v12-panel: var(--theme-panel, rgba(255,255,255,.94));
    --v12-panel-strong: var(--theme-panel-strong, #fff);
    --v12-panel-soft: var(--theme-panel-soft, #edf6f1);
    --v12-text: var(--theme-text, #102019);
    --v12-muted: var(--theme-muted, #5b7165);
    --v12-accent: var(--theme-accent, #10b981);
    --v12-accent-2: var(--theme-accent-2, #087443);
    --v12-accent-3: var(--theme-accent-3, #63e6a4);
    --v12-accent-soft: var(--theme-accent-soft, rgba(16,185,129,.12));
    --v12-accent-text: var(--theme-accent-text, #067647);
    --v12-action-text: var(--theme-action-text, #fff);
    --v12-line: var(--theme-line, rgba(10,91,60,.16));
    --v12-line-strong: var(--theme-line-strong, rgba(16,185,129,.38));
    --v12-shadow: var(--theme-shadow, rgba(20,67,44,.14));
    --v12-deep: #07110d;
    --v12-deep-2: #0c1b14;
    --v12-deep-3: #14271e;
    --v12-deep-text: #f5fff9;
    --v12-deep-muted: #9ab0a3;
    --v12-radius-sm: .9rem;
    --v12-radius: 1.35rem;
    --v12-radius-lg: 2rem;
    --v12-ease: cubic-bezier(.2,.8,.2,1);
}

html[data-theme="crimson"] { --v12-deep:#170d0b; --v12-deep-2:#27120f; --v12-deep-3:#3a1c16; --v12-deep-muted:#c9aaa1; }
html[data-theme="sapphire"] { --v12-deep:#07131d; --v12-deep-2:#0b2030; --v12-deep-3:#123149; --v12-deep-muted:#9fb8ca; }
html[data-theme="graphite"] { --v12-deep:#080b0e; --v12-deep-2:#121820; --v12-deep-3:#202934; --v12-deep-muted:#aebbc5; }
html[data-theme="violet"] { --v12-deep:#110b1e; --v12-deep-2:#1c1231; --v12-deep-3:#2a1b46; --v12-deep-muted:#b8a9ce; }
html[data-theme="solar"] { --v12-deep:#11100a; --v12-deep-2:#1d1a0c; --v12-deep-3:#2d2710; --v12-deep-muted:#c7bea0; }

html { scroll-padding-top: 6.5rem; }
html[data-theme] body.ampol-app {
    color: var(--v12-text) !important;
    background:
        radial-gradient(circle at 8% 6%, var(--v12-accent-soft), transparent 30rem),
        radial-gradient(circle at 92% 64%, color-mix(in srgb,var(--v12-accent-2) 11%,transparent), transparent 34rem),
        linear-gradient(145deg,var(--v12-page),var(--v12-page-alt)) !important;
    font-feature-settings: "ss01","ss02","tnum";
}
html[data-theme] body.ampol-app::before {
    opacity: .38 !important;
    background-size: 72px 72px !important;
    background-image:
        linear-gradient(color-mix(in srgb,var(--v12-accent) 7%,transparent) 1px,transparent 1px),
        linear-gradient(90deg,color-mix(in srgb,var(--v12-accent) 7%,transparent) 1px,transparent 1px) !important;
}
html[data-theme] body.ampol-app ::selection { color: var(--v12-action-text); background: var(--v12-accent); }

/* Shared surfaces, type and controls */
html[data-theme] body.ampol-app :is(.premium-panel,.glass-panel,.glass-panel-hover,.metric-card,.store-filter-panel,.product-order-card,.product-info-panel,.product-support-panel,.purchase-success-card) {
    color: var(--v12-text) !important;
    border-color: var(--v12-line) !important;
    background: linear-gradient(150deg,var(--v12-panel-strong),var(--v12-panel)) !important;
    box-shadow: 0 18px 55px var(--v12-shadow), inset 0 1px 0 color-mix(in srgb,#fff 52%,transparent) !important;
}
html[data-theme] body.ampol-app :is(.premium-panel,.glass-panel,.glass-panel-hover,.metric-card) :is(h1,h2,h3,h4,strong,b) { color: var(--v12-text) !important; }
html[data-theme] body.ampol-app :is(.premium-panel,.glass-panel,.glass-panel-hover,.metric-card) :is(p,small,label) { color: var(--v12-muted); }
html[data-theme] body.ampol-app .eyebrow { color: var(--v12-accent-text) !important; }
html[data-theme] body.ampol-app .eyebrow::before { background: linear-gradient(90deg,var(--v12-accent),transparent) !important; }

html[data-theme] body.ampol-app :is(.btn-primary,.product-order-submit,.free-fire-verify-button,.v12-button.is-primary) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid color-mix(in srgb,var(--v12-accent-3) 46%,transparent) !important;
    color: var(--v12-action-text) !important;
    background: linear-gradient(118deg,var(--v12-accent-2),var(--v12-accent),var(--v12-accent-3)) !important;
    background-size: 180% 100% !important;
    box-shadow: 0 14px 34px color-mix(in srgb,var(--v12-accent) 28%,transparent),inset 0 1px 0 rgba(255,255,255,.32) !important;
    transition: transform .24s var(--v12-ease),box-shadow .24s ease,background-position .35s ease !important;
}
html[data-theme] body.ampol-app :is(.btn-primary,.product-order-submit,.free-fire-verify-button,.v12-button.is-primary):hover {
    transform: translateY(-3px);
    background-position: 100% 0 !important;
    box-shadow: 0 20px 45px color-mix(in srgb,var(--v12-accent) 38%,transparent),inset 0 1px 0 rgba(255,255,255,.35) !important;
}
html[data-theme] body.ampol-app :is(.btn-primary,.product-order-submit,.free-fire-verify-button,.v12-button.is-primary) * { color: var(--v12-action-text) !important; }
html[data-theme] body.ampol-app :is(.btn-secondary,.v12-button.is-ghost) {
    border-color: var(--v12-line-strong) !important;
    color: var(--v12-accent-text) !important;
    background: color-mix(in srgb,var(--v12-panel-strong) 86%,transparent) !important;
    box-shadow: 0 10px 28px var(--v12-shadow) !important;
}
html[data-theme] body.ampol-app :is(.btn-secondary,.v12-button.is-ghost):hover { border-color: var(--v12-accent) !important; background: var(--v12-accent-soft) !important; transform: translateY(-2px); }
html[data-theme] body.ampol-app :is(button,a,input,select,textarea):focus-visible { outline: 3px solid color-mix(in srgb,var(--v12-accent) 26%,transparent); outline-offset: 3px; }

html[data-theme] body.ampol-app :is(.field,.select-field,.textarea-field,.product-order-field,.store-filter-select,input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea) {
    color: var(--v12-text) !important;
    -webkit-text-fill-color: var(--v12-text) !important;
    border-color: var(--v12-line) !important;
    background-color: var(--v12-panel-strong) !important;
    box-shadow: inset 0 1px 2px color-mix(in srgb,var(--v12-shadow) 45%,transparent),0 1px 0 color-mix(in srgb,#fff 45%,transparent) !important;
    transition: border-color .2s ease,box-shadow .2s ease,transform .2s ease !important;
}
html[data-theme] body.ampol-app :is(.field,.select-field,.textarea-field,.product-order-field,.store-filter-select,input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea):focus {
    border-color: var(--v12-accent) !important;
    box-shadow: 0 0 0 4px var(--v12-accent-soft),inset 0 1px 2px var(--v12-shadow) !important;
}
html[data-theme] body.ampol-app :is(input,textarea)::placeholder { color: color-mix(in srgb,var(--v12-muted) 68%,transparent) !important; -webkit-text-fill-color: color-mix(in srgb,var(--v12-muted) 68%,transparent) !important; }

/* Header */
html[data-theme] .ampol-site-header {
    position: fixed;
    inset: 0 0 auto;
    z-index: 90;
    border-bottom: 1px solid color-mix(in srgb,var(--v12-accent) 11%,transparent) !important;
    background: color-mix(in srgb,var(--v12-panel-strong) 78%,transparent) !important;
    box-shadow: 0 9px 36px color-mix(in srgb,var(--v12-shadow) 62%,transparent);
    backdrop-filter: blur(22px) saturate(1.35);
    transition: background .25s ease,box-shadow .25s ease,transform .25s ease;
}
html[data-theme] .ampol-site-header.is-scrolled { background: color-mix(in srgb,var(--v12-panel-strong) 92%,transparent) !important; box-shadow: 0 14px 45px var(--v12-shadow); }
html[data-theme] .ampol-site-header__bar { min-height: 5.15rem; }
html[data-theme] .ampol-brand__mark { border: 1px solid var(--v12-line-strong) !important; background: linear-gradient(145deg,var(--v12-accent-3),var(--v12-accent)) !important; box-shadow: 0 10px 30px var(--v12-accent-soft) !important; }
html[data-theme] .ampol-brand__mark b { color: var(--v12-action-text) !important; }
html[data-theme] .ampol-brand__copy b { color: var(--v12-text) !important; }
html[data-theme] .ampol-brand__copy i { color: var(--v12-accent-text) !important; }
html[data-theme] .ampol-brand__copy small { color: var(--v12-muted) !important; }
html[data-theme] .ampol-desktop-nav a { color: var(--v12-muted) !important; }
html[data-theme] .ampol-desktop-nav a:is(:hover,.is-active) { color: var(--v12-text) !important; }
html[data-theme] .ampol-desktop-nav a::after { background: var(--v12-accent) !important; box-shadow: 0 0 12px var(--v12-accent); }
html[data-theme] :is(.ampol-header-icon,.ampol-menu-button) { color: var(--v12-muted) !important; border-color: var(--v12-line) !important; background: var(--v12-panel-soft) !important; }
html[data-theme] :is(.ampol-header-icon,.ampol-menu-button):hover { color: var(--v12-accent-text) !important; border-color: var(--v12-line-strong) !important; transform: translateY(-2px); }
html[data-theme] :is(.ampol-login-button,.ampol-account-button) { border-color: var(--v12-line-strong) !important; color: var(--v12-action-text) !important; background: linear-gradient(120deg,var(--v12-accent-2),var(--v12-accent)) !important; box-shadow: 0 11px 30px var(--v12-accent-soft) !important; }
html[data-theme] .ampol-mobile-menu { border-color: var(--v12-line) !important; background: color-mix(in srgb,var(--v12-panel-strong) 96%,transparent) !important; box-shadow: 0 24px 54px var(--v12-shadow); }
html[data-theme] .ampol-mobile-menu a { color: var(--v12-text) !important; border-color: var(--v12-line) !important; background: var(--v12-panel-soft) !important; }

/* V12 home */
.ampol-home-v12 { position: relative; overflow: clip; color: var(--v12-text); }
.v12-hero { position: relative; isolation: isolate; min-height: calc(100svh - 5.15rem); overflow: hidden; color: var(--v12-deep-text); background: linear-gradient(138deg,var(--v12-deep) 0%,var(--v12-deep-2) 58%,color-mix(in srgb,var(--v12-accent-2) 45%,var(--v12-deep)) 100%); }
.v12-ambient { position:absolute; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
.v12-ambient__grid { position:absolute; inset:0; opacity:.23; background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px); background-size:68px 68px; mask-image:linear-gradient(to bottom,#000 10%,transparent 92%); animation:v12GridDrift 28s linear infinite; }
.v12-ambient__noise { position:absolute; inset:0; opacity:.28; background:radial-gradient(circle at 20% 30%,rgba(255,255,255,.04) 0 1px,transparent 1.5px); background-size:18px 18px; mix-blend-mode:soft-light; }
.v12-ambient__orb { position:absolute; display:block; border-radius:50%; filter:blur(85px); opacity:.3; animation:v12Orb 11s ease-in-out infinite alternate; }
.v12-ambient__orb.is-one { width:32rem; height:32rem; top:-17rem; right:-8rem; background:var(--v12-accent); }
.v12-ambient__orb.is-two { width:25rem; height:25rem; bottom:-12rem; left:4%; background:var(--v12-accent-2); animation-delay:-5s; }
.v12-ambient__orb.is-three { width:18rem; height:18rem; top:36%; left:47%; opacity:.13; background:var(--v12-accent-3); animation-delay:-8s; }
.v12-ambient__beam { position:absolute; width:65vw; height:1px; background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--v12-accent) 55%,transparent),transparent); box-shadow:0 0 20px var(--v12-accent-soft); transform:rotate(-13deg); animation:v12Beam 9s ease-in-out infinite; }
.v12-ambient__beam.is-one { top:24%; left:-14%; }.v12-ambient__beam.is-two { right:-18%; bottom:20%; animation-delay:-4.5s; }
.v12-hero__shell { display:grid; min-height:calc(100svh - 11rem); grid-template-columns:minmax(0,1.02fr) minmax(27rem,.98fr); align-items:center; gap:clamp(2rem,5vw,6rem); padding-top:clamp(3.2rem,8vh,7rem); padding-bottom:clamp(3rem,7vh,6rem); }
.v12-hero__copy { position:relative; z-index:4; max-width:48rem; }
.v12-live-chip { display:inline-flex; min-height:2.55rem; align-items:center; gap:.65rem; border:1px solid color-mix(in srgb,var(--v12-accent) 30%,rgba(255,255,255,.1)); border-radius:999px; padding:.35rem .5rem .35rem .8rem; color:#d9e9df; background:rgba(4,11,8,.48); box-shadow:0 12px 40px rgba(0,0,0,.22); backdrop-filter:blur(16px); font-size:.64rem; font-weight:850; }
.v12-live-chip i { width:.48rem; height:.48rem; border-radius:50%; background:var(--v12-accent-3); box-shadow:0 0 0 5px color-mix(in srgb,var(--v12-accent) 12%,transparent),0 0 16px var(--v12-accent); animation:v12Pulse 1.8s ease-in-out infinite; }
.v12-live-chip b { margin-inline-start:.3rem; border-radius:999px; padding:.42rem .7rem; color:var(--v12-action-text) !important; background:linear-gradient(120deg,var(--v12-accent-2),var(--v12-accent)); font-size:.58rem; }
.v12-hero__copy h1 { margin-top:1.55rem; color:#f7fff9 !important; font-size:clamp(3rem,6.4vw,6.8rem); font-weight:1000; line-height:.98; letter-spacing:-.065em; text-wrap:balance; }
[dir="rtl"] .v12-hero__copy h1 { letter-spacing:-.035em; line-height:1.15; }
.v12-hero__copy h1 strong { position:relative; display:inline-block; color:transparent !important; background:linear-gradient(105deg,var(--v12-accent-3),var(--v12-accent),#f2ffe8); background-clip:text; -webkit-background-clip:text; text-shadow:0 12px 50px color-mix(in srgb,var(--v12-accent) 20%,transparent); }
.v12-hero__copy h1 strong::after { content:''; position:absolute; inset:auto 0 -.5rem; height:.18rem; border-radius:999px; background:linear-gradient(90deg,var(--v12-accent),transparent 76%); box-shadow:0 0 18px var(--v12-accent); transform:scaleX(.72); transform-origin:right; }
.v12-hero__copy>p { max-width:42rem; margin-top:1.6rem; color:#b8c9be !important; font-size:clamp(.88rem,1.25vw,1.05rem); font-weight:600; line-height:2.15; }
.v12-hero-search { display:grid; max-width:43rem; min-height:4.3rem; grid-template-columns:1.5rem minmax(0,1fr) auto; align-items:center; gap:.8rem; margin-top:1.8rem; border:1px solid rgba(255,255,255,.13); border-radius:1.35rem; padding:.45rem .65rem .45rem  .45rem; background:rgba(2,8,5,.52); box-shadow:0 22px 70px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter:blur(18px); transition:.25s ease; }
.v12-hero-search:focus-within { border-color:color-mix(in srgb,var(--v12-accent) 65%,white); box-shadow:0 0 0 4px color-mix(in srgb,var(--v12-accent) 11%,transparent),0 25px 75px rgba(0,0,0,.3); transform:translateY(-2px); }
.v12-hero-search>svg { width:1.35rem; color:var(--v12-accent-3); }
html[data-theme] body.ampol-app .v12-hero-search input { min-width:0; border:0 !important; padding:.75rem 0 !important; color:#f3fff8 !important; -webkit-text-fill-color:#f3fff8 !important; background:transparent !important; box-shadow:none !important; font-size:.78rem; font-weight:750; outline:0; }
html[data-theme] body.ampol-app .v12-hero-search input::placeholder { color:#6f8478 !important; -webkit-text-fill-color:#6f8478 !important; }
.v12-hero-search button { display:inline-flex; min-height:3.2rem; align-items:center; gap:.65rem; border-radius:.95rem; padding:0 1.2rem; color:var(--v12-action-text); background:linear-gradient(120deg,var(--v12-accent-2),var(--v12-accent)); box-shadow:0 10px 28px color-mix(in srgb,var(--v12-accent) 26%,transparent); font-size:.7rem; font-weight:950; transition:.2s ease; }
.v12-hero-search button:hover { transform:translateX(-2px); filter:brightness(1.08); }
.v12-hero__actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.2rem; }
.v12-button { display:inline-flex; min-height:3.35rem; align-items:center; justify-content:center; gap:.7rem; border:1px solid rgba(255,255,255,.12); border-radius:1rem; padding:.75rem 1.25rem; color:#eaf7ee; background:rgba(255,255,255,.055); font-size:.72rem; font-weight:950; transition:.24s var(--v12-ease); }
.v12-button svg { width:1.1rem; stroke-width:2; transition:transform .2s ease; }.v12-button:hover svg { transform:translateX(-4px); }
.v12-button.is-ghost { color:#d8e6dc !important; border-color:rgba(255,255,255,.14) !important; background:rgba(255,255,255,.055) !important; box-shadow:none !important; }
.v12-button__pulse { width:.48rem; height:.48rem; border-radius:50%; background:var(--v12-accent-3); box-shadow:0 0 12px var(--v12-accent); }
.v12-hero__trust { display:flex; flex-wrap:wrap; gap:1.1rem; margin-top:1.5rem; }
.v12-hero__trust span { display:inline-flex; align-items:center; gap:.45rem; color:#7f9587; font-size:.62rem; font-weight:800; }.v12-hero__trust i { display:grid; width:1.45rem; height:1.45rem; place-items:center; border:1px solid color-mix(in srgb,var(--v12-accent) 30%,transparent); border-radius:.48rem; color:var(--v12-accent-3); background:color-mix(in srgb,var(--v12-accent) 8%,transparent); font-size:.54rem; font-style:normal; }.v12-hero__trust b { color:#a9bbae !important; font-weight:750; }

.v12-hero__stage { position:relative; min-height:36rem; perspective:1200px; }
.v12-stage__halo { position:absolute; inset:14% 12%; border-radius:50%; background:radial-gradient(circle,var(--v12-accent-soft),transparent 68%); filter:blur(22px); animation:v12Halo 4s ease-in-out infinite alternate; }
.v12-stage__orbit { position:absolute; top:50%; left:50%; border:1px solid color-mix(in srgb,var(--v12-accent) 30%,rgba(255,255,255,.08)); border-radius:50%; transform:translate(-50%,-50%); }
.v12-stage__orbit.is-outer { width:31rem; height:31rem; border-style:dashed; animation:v12Rotate 34s linear infinite; }.v12-stage__orbit.is-inner { width:22rem; height:22rem; opacity:.55; animation:v12Rotate 24s linear infinite reverse; }
.v12-stage__orbit.is-outer :is(i,b,span) { position:absolute; width:.75rem; height:.75rem; border:2px solid var(--v12-deep); border-radius:50%; background:var(--v12-accent-3); box-shadow:0 0 18px var(--v12-accent); }.v12-stage__orbit i{top:8%;left:22%}.v12-stage__orbit b{right:-.35rem;top:48%}.v12-stage__orbit span{left:17%;bottom:5%}
.v12-stage__core { position:absolute; top:50%; left:50%; z-index:3; display:flex; width:18rem; height:22rem; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; border:1px solid rgba(255,255,255,.15); border-radius:3rem; color:#f2fff7; background:linear-gradient(155deg,rgba(255,255,255,.11),rgba(255,255,255,.025)),radial-gradient(circle at 50% 34%,var(--v12-accent-soft),transparent 48%),rgba(5,15,10,.78); box-shadow:0 40px 110px rgba(0,0,0,.43),inset 0 1px 0 rgba(255,255,255,.14),0 0 80px var(--v12-accent-soft); backdrop-filter:blur(20px); transform:translate(-50%,-50%); transform-style:preserve-3d; transition:transform .14s ease-out; }
.v12-stage__core::before { content:''; position:absolute; inset:-50% -90%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent); transform:rotate(22deg); animation:v12Shine 7s ease-in-out infinite; }
.v12-stage__status { position:absolute; top:1.1rem; display:inline-flex; align-items:center; gap:.45rem; border:1px solid rgba(255,255,255,.1); border-radius:999px; padding:.42rem .65rem; color:#92a69a; background:rgba(0,0,0,.2); font-family:monospace; font-size:.52rem; letter-spacing:.12em; }.v12-stage__status i { width:.4rem;height:.4rem;border-radius:50%;background:var(--v12-accent-3);box-shadow:0 0 12px var(--v12-accent); }
.v12-stage__mark { position:relative; display:grid; width:7.5rem; height:7.5rem; place-items:center; border:1px solid color-mix(in srgb,var(--v12-accent) 38%,transparent); border-radius:2.25rem; color:var(--v12-action-text); background:linear-gradient(145deg,var(--v12-accent-3),var(--v12-accent),var(--v12-accent-2)); box-shadow:0 24px 58px color-mix(in srgb,var(--v12-accent) 30%,transparent),inset 0 1px 0 rgba(255,255,255,.45); transform:translateZ(42px) rotate(-5deg); }.v12-stage__mark span { font-family:Figtree,sans-serif;font-size:4rem;font-weight:1000;letter-spacing:-.12em;transform:translateX(-.12em); }.v12-stage__mark i { position:absolute; inset:auto .8rem .7rem; height:.22rem; border-radius:99px; background:rgba(255,255,255,.8); box-shadow:0 0 14px white; }
.v12-stage__core>b { margin-top:1.25rem;color:#f3fff7 !important;font-family:Figtree,sans-serif;font-size:1.35rem;font-weight:1000;letter-spacing:.05em; }.v12-stage__core>b em { color:var(--v12-accent-3);font-style:normal; }.v12-stage__core>small { margin-top:.2rem;color:#667b6d;font-family:monospace;font-size:.48rem;letter-spacing:.16em; }.v12-stage__meter { width:8.5rem;height:.25rem;margin-top:1.05rem;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.08); }.v12-stage__meter span { display:block;width:78%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--v12-accent-2),var(--v12-accent-3));box-shadow:0 0 12px var(--v12-accent);animation:v12Meter 3s ease-in-out infinite alternate; }.v12-stage__core>p { display:flex;align-items:center;gap:.4rem;margin-top:.7rem;color:#789082;font-size:.53rem;font-weight:700; }.v12-stage__core>p i { width:.38rem;height:.38rem;border-radius:50%;background:var(--v12-accent-3); }
.v12-float-card { position:absolute; z-index:5; display:grid; width:13.5rem; grid-template-columns:3rem minmax(0,1fr) 1.5rem; align-items:center; gap:.7rem; border:1px solid rgba(255,255,255,.13); border-radius:1.15rem; padding:.65rem; color:#f1fff6; background:rgba(6,15,10,.72); box-shadow:0 20px 55px rgba(0,0,0,.34); backdrop-filter:blur(18px); transition:transform .14s ease-out,border-color .2s ease,background .2s ease; }.v12-float-card:hover { border-color:color-mix(in srgb,var(--v12-accent) 48%,white);background:rgba(10,25,16,.88); }.v12-float-card.is-1 { top:9%;right:0; }.v12-float-card.is-2 { left:-2%;top:45%; }.v12-float-card.is-3 { right:4%;bottom:5%; }.v12-float-card__icon { display:grid;width:3rem;height:3rem;place-items:center;overflow:hidden;border:1px solid color-mix(in srgb,var(--v12-accent) 38%,transparent);border-radius:.9rem;color:var(--v12-action-text);background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent));font-family:Figtree,sans-serif;font-size:.72rem;font-weight:1000; }.v12-float-card__icon img{width:100%;height:100%;object-fit:cover}.v12-float-card b,.v12-float-card small{display:block}.v12-float-card b{overflow:hidden;color:#effbf3 !important;font-size:.65rem;font-weight:950;white-space:nowrap;text-overflow:ellipsis}.v12-float-card small{margin-top:.18rem;color:#718479;font-size:.49rem}.v12-float-card>i{color:var(--v12-accent-3);font-style:normal}
.v12-signal-bar { position:relative; z-index:6; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) 1.5fr; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:1.4rem 1.4rem 0 0; background:rgba(2,9,5,.58); box-shadow:0 -14px 55px rgba(0,0,0,.14); backdrop-filter:blur(18px); }.v12-signal-bar>div { display:flex;min-height:5.5rem;align-items:center;gap:.7rem;border-inline-end:1px solid rgba(255,255,255,.08);padding:.8rem 1rem; }.v12-signal-bar>div>span { color:var(--v12-accent-3);font-family:monospace;font-size:.55rem; }.v12-signal-bar p b,.v12-signal-bar p small{display:block}.v12-signal-bar p b{color:#f2fff7 !important;font-size:1.1rem;font-weight:1000}.v12-signal-bar p small{margin-top:.18rem;color:#72877a;font-size:.52rem}.v12-signal-bar .v12-signal-bar__live{justify-content:center;border:0}.v12-signal-bar__live i{width:.55rem;height:.55rem;border-radius:50%;background:var(--v12-accent-3);box-shadow:0 0 0 6px var(--v12-accent-soft),0 0 18px var(--v12-accent)}.v12-signal-bar__live span{color:#9fb1a5 !important;font-family:inherit !important;font-size:.62rem !important;font-weight:850}

.v12-marquee { overflow:hidden; border-block:1px solid var(--v12-line); color:var(--v12-accent-text); background:var(--v12-panel-soft); }.v12-marquee>div{display:flex;width:max-content;align-items:center;gap:1.4rem;padding:.85rem 0;animation:v12Marquee 30s linear infinite}.v12-marquee span{font-family:Figtree,sans-serif;font-size:.62rem;font-weight:900;letter-spacing:.18em;white-space:nowrap}.v12-marquee i{color:var(--v12-accent);font-style:normal}
.v12-section { position:relative;padding:clamp(4rem,8vw,7.5rem) 0; }.v12-services-section { background:linear-gradient(180deg,color-mix(in srgb,var(--v12-panel-strong) 65%,transparent),transparent); }.v12-products-section { border-block:1px solid var(--v12-line);background:linear-gradient(150deg,var(--v12-panel-soft),color-mix(in srgb,var(--v12-page) 82%,transparent)); }.v12-latest-section { background:linear-gradient(180deg,transparent,var(--v12-accent-soft)); }
.v12-section-head { display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:2rem; }.v12-section-head>div>p,.v12-flow__copy>p { display:flex;align-items:center;gap:.65rem;color:var(--v12-accent-text);font-family:Figtree,sans-serif;font-size:.62rem;font-weight:950;letter-spacing:.15em; }.v12-section-head>div>p span,.v12-flow__copy>p span { width:3rem;height:1px;background:linear-gradient(90deg,var(--v12-accent),transparent); }.v12-section-head h2 { margin-top:.65rem;color:var(--v12-text) !important;font-size:clamp(1.65rem,3vw,3rem);font-weight:1000;line-height:1.35;letter-spacing:-.035em; }.v12-section-head small { display:block;margin-top:.5rem;color:var(--v12-muted);font-size:.72rem;font-weight:650;line-height:1.9; }.v12-section-head>a { display:inline-flex;flex:0 0 auto;align-items:center;gap:.55rem;border:1px solid var(--v12-line);border-radius:999px;padding:.75rem 1rem;color:var(--v12-accent-text);background:var(--v12-panel-strong);box-shadow:0 9px 25px var(--v12-shadow);font-size:.68rem;font-weight:900;transition:.22s ease; }.v12-section-head>a:hover{border-color:var(--v12-accent);transform:translateY(-2px)}.v12-section-head>a span{font-size:1rem}
.v12-service-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem; }.v12-service-card { position:relative;display:block;min-height:17rem;overflow:hidden;border:1px solid var(--v12-line);border-radius:1.65rem;background:var(--v12-deep);box-shadow:0 18px 50px var(--v12-shadow);transform-style:preserve-3d;transition:transform .14s ease-out,border-color .3s ease,box-shadow .3s ease; }.v12-service-card:hover{border-color:var(--v12-accent);box-shadow:0 27px 65px var(--v12-shadow),0 0 40px var(--v12-accent-soft)}.v12-service-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.84) contrast(1.08) brightness(.68);transition:transform .7s var(--v12-ease),filter .4s ease}.v12-service-card:hover>img{transform:scale(1.09);filter:saturate(1.05) contrast(1.06) brightness(.75)}.v12-service-card__shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(3,9,6,.97) 3%,rgba(3,9,6,.3) 64%,rgba(3,9,6,.08)),linear-gradient(135deg,var(--v12-accent-soft),transparent 52%)}.v12-service-card__index{position:absolute;top:1rem;left:1rem;color:rgba(255,255,255,.42);font-family:monospace;font-size:.58rem;letter-spacing:.12em}.v12-service-card>div{position:absolute;inset:auto .9rem .9rem;display:grid;grid-template-columns:2.8rem minmax(0,1fr) 1.8rem;align-items:center;gap:.65rem;transform:translateZ(30px)}.v12-service-card>div>i{display:grid;width:2.8rem;height:2.8rem;place-items:center;border:1px solid color-mix(in srgb,var(--v12-accent) 42%,transparent);border-radius:.85rem;color:var(--v12-action-text);background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent));box-shadow:0 10px 28px var(--v12-accent-soft);font-size:.65rem;font-style:normal;font-weight:1000}.v12-service-card b,.v12-service-card small{display:block}.v12-service-card b{color:#f5fff9 !important;font-size:.8rem;font-weight:950}.v12-service-card small{margin-top:.24rem;color:#91a297;font-size:.53rem}.v12-service-card em{color:var(--v12-accent-3);font-style:normal;font-size:1.1rem;transition:transform .2s ease}.v12-service-card:hover em{transform:translateX(-4px)}
.v12-empty { grid-column:1/-1;border:1px dashed var(--v12-line-strong);border-radius:1.5rem;padding:3rem;text-align:center;color:var(--v12-muted);background:var(--v12-panel-soft);font-size:.8rem;font-weight:800; }

/* Product card rebuild */
.v12-product-grid { gap:1rem !important; }
html[data-theme] body.ampol-app .store-product-card { position:relative;isolation:isolate;overflow:hidden;border:1px solid rgba(255,255,255,.12) !important;border-radius:1.55rem !important;color:#effaf3 !important;background:linear-gradient(155deg,var(--v12-deep-3),var(--v12-deep)) !important;box-shadow:0 20px 58px color-mix(in srgb,var(--v12-shadow) 72%,rgba(0,0,0,.25)) !important;transform:perspective(950px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(var(--tilt-lift,0));transform-style:preserve-3d;transition:transform .14s ease-out,border-color .3s ease,box-shadow .3s ease !important; }
html[data-theme] body.ampol-app .store-product-card:hover { --tilt-lift:-7px;border-color:color-mix(in srgb,var(--service-accent) 58%,white) !important;box-shadow:0 32px 78px rgba(0,0,0,.3),0 0 45px color-mix(in srgb,var(--service-accent) 18%,transparent) !important; }
html[data-theme] body.ampol-app .store-product-card::before { content:'';position:absolute;z-index:20;inset:0;pointer-events:none;background:radial-gradient(circle at var(--pointer-x,50%) var(--pointer-y,20%),rgba(255,255,255,.16),transparent 30%);opacity:0;transition:opacity .25s ease; }.store-product-card:hover::before{opacity:1}
html[data-theme] body.ampol-app .store-product-card__visual { aspect-ratio:1.18;min-height:0;background:linear-gradient(145deg,color-mix(in srgb,var(--service-accent) 25%,var(--v12-deep-3)),var(--v12-deep)) !important; }
html[data-theme] body.ampol-app .store-product-card__visual-grid{opacity:.16 !important;background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px) !important;background-size:32px 32px !important}.store-product-card__image-wrap::after{background:linear-gradient(to top,var(--v12-deep) 0%,rgba(4,10,7,.12) 58%,rgba(4,10,7,.02)) !important}.store-product-card__image{transition:transform .75s var(--v12-ease),filter .35s ease !important}.store-product-card:hover .store-product-card__image{transform:scale(1.1) !important;filter:saturate(1.1) contrast(1.07) !important}
html[data-theme] body.ampol-app .store-product-card__visual-bottom{background:linear-gradient(to top,var(--v12-deep),transparent) !important}.store-product-card__body{position:relative;z-index:22;background:linear-gradient(180deg,var(--v12-deep),color-mix(in srgb,var(--v12-deep-2) 85%,#000));transform:translateZ(18px)}
html[data-theme] body.ampol-app .store-product-card__body :is(a,strong,b){color:#f4fff8 !important}.store-product-card__body>div:first-child{color:#799084 !important}.store-product-card__body>div:first-child i{background:var(--service-accent) !important;box-shadow:0 0 10px var(--service-accent)}.store-product-card__body>a:not(.store-product-card__cta):hover{color:color-mix(in srgb,var(--service-accent) 65%,white) !important}
html[data-theme] body.ampol-app .store-product-card__category{border-color:rgba(255,255,255,.14) !important;color:#dae8df !important;background:rgba(3,9,6,.64) !important}.store-product-card__discount{color:#fff !important}.store-product-card__instant{color:#a7f3d0 !important;background:rgba(4,40,23,.82) !important}.store-product-card__commercial-badge{color:color-mix(in srgb,var(--service-accent) 60%,white) !important;background:rgba(4,10,7,.7) !important}.store-product-card__value strong{color:#fff !important}.store-product-card__value small{color:color-mix(in srgb,var(--service-accent) 65%,white) !important}
.store-product-card__footer{border-color:rgba(255,255,255,.09) !important}.store-product-card__footer :is(span,b,strong){color:#f3fff7 !important}.store-product-card__footer small{color:#819386 !important}.store-product-card__arrow{width:2.45rem !important;height:2.45rem !important;color:color-mix(in srgb,var(--service-accent) 64%,white) !important;border-color:rgba(255,255,255,.11) !important;background:rgba(255,255,255,.055) !important}.store-product-card__cta{display:flex;min-height:2.75rem;align-items:center;justify-content:space-between;margin-top:.7rem;border:1px solid color-mix(in srgb,var(--service-accent) 34%,transparent);border-radius:.85rem;padding:.55rem .75rem;color:color-mix(in srgb,var(--service-accent) 65%,white) !important;background:color-mix(in srgb,var(--service-accent) 9%,transparent);font-size:.62rem;font-weight:950;transition:.22s ease}.store-product-card__cta:hover{color:#fff !important;background:var(--service-accent);transform:translateY(-1px)}

.v12-flow-section { color:var(--v12-deep-text);background:linear-gradient(135deg,var(--v12-deep),var(--v12-deep-2)); }.v12-flow { display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,7vw,7rem);align-items:center}.v12-flow__copy h2{margin-top:.8rem;color:#f4fff8 !important;font-size:clamp(2rem,4vw,4rem);font-weight:1000;line-height:1.35;letter-spacing:-.04em}.v12-flow__copy h2 strong{color:var(--v12-accent-3) !important}.v12-flow__copy>small{display:block;max-width:35rem;margin-top:1rem;color:#92a59a;font-size:.75rem;line-height:2}.v12-flow__copy .v12-button{margin-top:1.5rem}.v12-flow__steps{display:grid;gap:.75rem}.v12-flow__steps article{display:grid;grid-template-columns:2.3rem 3rem minmax(0,1fr);align-items:center;gap:.85rem;border:1px solid rgba(255,255,255,.1);border-radius:1.25rem;padding:1rem;background:rgba(255,255,255,.035);transition:.25s ease}.v12-flow__steps article:hover{border-color:var(--v12-line-strong);background:var(--v12-accent-soft);transform:translateX(-5px)}.v12-flow__steps>article>span{color:var(--v12-accent-3);font-family:monospace;font-size:.58rem}.v12-flow__steps>article>i{display:grid;width:3rem;height:3rem;place-items:center;border-radius:.9rem;color:var(--v12-action-text);background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent));box-shadow:0 12px 32px var(--v12-accent-soft);font-style:normal;font-weight:1000}.v12-flow__steps b{color:#f2fff7 !important;font-size:.82rem;font-weight:950}.v12-flow__steps p{margin-top:.25rem;color:#83978b !important;font-size:.58rem;line-height:1.8}
.v12-final-cta{position:relative;display:flex;align-items:center;justify-content:space-between;gap:2rem;overflow:hidden;border:1px solid var(--v12-line);border-radius:2rem;padding:clamp(1.4rem,4vw,3rem);color:var(--v12-text);background:linear-gradient(135deg,var(--v12-panel-strong),var(--v12-panel-soft));box-shadow:0 24px 72px var(--v12-shadow)}.v12-final-cta__glow{position:absolute;width:22rem;height:22rem;inset:-10rem auto auto -8rem;border-radius:50%;background:var(--v12-accent-soft);filter:blur(45px)}.v12-final-cta>div:not(.v12-final-cta__glow){position:relative;z-index:2}.v12-final-cta>div:first-of-type p{color:var(--v12-accent-text);font-family:Figtree,sans-serif;font-size:.6rem;font-weight:950;letter-spacing:.18em}.v12-final-cta h2{margin-top:.55rem;color:var(--v12-text)!important;font-size:clamp(1.5rem,3vw,2.8rem);font-weight:1000}.v12-final-cta small{display:block;margin-top:.45rem;color:var(--v12-muted);font-size:.68rem;line-height:1.9}.v12-final-cta>div:last-child{display:flex;flex-wrap:wrap;gap:.7rem}
.v12-final-cta>div:nth-of-type(2) p{color:var(--v12-accent-text);font-family:Figtree,sans-serif;font-size:.6rem;font-weight:950;letter-spacing:.18em}

/* Checkboxes and radios: whole row communicates state */
html[data-theme] body.ampol-app .ampol-check-option{min-height:3.75rem;cursor:pointer;border:1px solid var(--v12-line) !important;border-radius:1rem;padding:.7rem;color:var(--v12-text);background:var(--v12-panel-soft) !important;box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 35%,transparent);transition:.2s ease}.ampol-check-option:hover{border-color:var(--v12-line-strong) !important;background:var(--v12-accent-soft) !important;transform:translateY(-1px)}.ampol-check-option:focus-within{outline:3px solid var(--v12-accent-soft);outline-offset:2px}.ampol-check-box{border:2px solid color-mix(in srgb,var(--v12-muted) 50%,transparent) !important;color:transparent;background:var(--v12-panel-strong) !important;transition:.2s var(--v12-ease)}.ampol-check-copy b{color:var(--v12-text) !important}.ampol-check-copy small{color:var(--v12-muted) !important}.ampol-check-state{color:var(--v12-muted) !important;background:color-mix(in srgb,var(--v12-muted) 10%,transparent) !important}.ampol-check-input:checked~.ampol-check-box{border-color:var(--v12-accent) !important;color:var(--v12-action-text) !important;background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent)) !important;box-shadow:0 0 0 4px var(--v12-accent-soft),0 8px 22px var(--v12-accent-soft) !important;transform:scale(1.04)}.ampol-check-input:checked~.ampol-check-state{color:var(--v12-accent-text) !important;background:var(--v12-accent-soft) !important}.ampol-check-option:has(.ampol-check-input:checked){border-color:var(--v12-accent) !important;background:linear-gradient(145deg,var(--v12-accent-soft),var(--v12-panel-strong)) !important;box-shadow:0 0 0 3px var(--v12-accent-soft),0 12px 30px var(--v12-shadow)}
html[data-theme] body.ampol-app input[type="checkbox"]:not(.ampol-check-input),html[data-theme] body.ampol-app input[type="radio"]{width:1.15rem;height:1.15rem;cursor:pointer;accent-color:var(--v12-accent);border-color:var(--v12-line-strong) !important;background:var(--v12-panel-strong) !important}.store-filter-option:has(input:checked){border-color:var(--v12-line-strong)!important;color:var(--v12-accent-text)!important;background:var(--v12-accent-soft)!important}

/* Store, account, checkout and admin cohesion */
html[data-theme] body.ampol-app :is(.storefront-page,.site-canvas,.dashboard-shell,.ampol-checkout-page,.ampol-order-detail-page){color:var(--v12-text)!important;background:radial-gradient(circle at 8% 8%,var(--v12-accent-soft),transparent 30rem),linear-gradient(145deg,var(--v12-page),var(--v12-page-alt))!important}.storefront-hero{border-radius:2rem !important;overflow:hidden}.storefront-hero::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 55%,transparent)}.storefront-hero h1 span{color:var(--v12-accent-text)!important}.storefront-live-badge,.storefront-version-badge,.store-active-chip{color:var(--v12-accent-text)!important;border-color:var(--v12-line-strong)!important;background:var(--v12-accent-soft)!important}.store-search-box form,.store-search-results{border-color:var(--v12-line)!important;background:var(--v12-panel-strong)!important;box-shadow:0 18px 45px var(--v12-shadow)!important}.store-search-box__button{color:var(--v12-action-text)!important;background:linear-gradient(120deg,var(--v12-accent-2),var(--v12-accent))!important}.service-category-card{border-radius:1.25rem!important;box-shadow:0 13px 35px var(--v12-shadow)!important}.service-category-card:hover{border-color:var(--v12-accent)!important;transform:translateY(-4px)!important}.store-filter-panel{border-radius:1.4rem!important}.store-filter-group+ .store-filter-group{border-color:var(--v12-line)!important}
.account-hero{border-radius:2rem!important}.metric-card{border-radius:1.35rem!important}.metric-card:hover{border-color:var(--v12-line-strong)!important;transform:translateY(-4px);box-shadow:0 24px 58px var(--v12-shadow)!important}.metric-icon{color:var(--v12-accent-text)!important;border-color:var(--v12-line-strong)!important;background:var(--v12-accent-soft)!important}.ampol-theme-choice{border-radius:1.05rem!important}.account-recent,.account-activity,.account-support{border-radius:1.6rem!important}.account-support a,.account-recent a{border-color:var(--v12-line)!important;background:var(--v12-panel-soft)!important}.account-support a:hover{border-color:var(--v12-accent)!important;background:var(--v12-accent-soft)!important}
.ampol-admin-ui .premium-panel{border-radius:1.5rem!important}.ampol-admin-ui aside nav a{color:var(--v12-muted)!important;border:1px solid transparent}.ampol-admin-ui aside nav a:hover{color:var(--v12-text)!important;border-color:var(--v12-line)!important;background:var(--v12-accent-soft)!important}.ampol-admin-ui aside nav a[class*="from-emerald"]{color:var(--v12-accent-text)!important;border-color:var(--v12-line-strong)!important;background:var(--v12-accent-soft)!important}.ampol-admin-count{color:var(--v12-action-text)!important;background:var(--v12-accent)!important;box-shadow:0 0 16px var(--v12-accent-soft)}.admin-table{border-collapse:separate;border-spacing:0}.admin-table th{color:var(--v12-muted)!important;border-color:var(--v12-line)!important;background:var(--v12-panel-soft)!important}.admin-table td{color:var(--v12-text)!important;border-color:var(--v12-line)!important}.admin-table tbody tr{background:var(--v12-panel-strong)!important}.admin-table tbody tr:nth-child(even){background:var(--v12-panel-soft)!important}.admin-table tbody tr:hover{background:var(--v12-accent-soft)!important}
html[data-theme] body.ampol-app :is(.modal-panel,[role="dialog"]>div,.ampol-modal-card){color:var(--v12-text)!important;border-color:var(--v12-line)!important;background:var(--v12-panel-strong)!important;box-shadow:0 32px 100px color-mix(in srgb,var(--v12-shadow) 85%,rgba(0,0,0,.25))!important}

/* Auth enhancement */
html[data-theme] .auth-page{background:radial-gradient(circle at 8% 8%,var(--v12-accent-soft),transparent 30rem),linear-gradient(145deg,var(--v12-deep),var(--v12-deep-2))!important}.auth-showcase{border-radius:2rem!important}.auth-main-card{border-radius:1.6rem!important}.auth-motion-scene{filter:drop-shadow(0 24px 50px var(--v12-accent-soft))}.auth-verify-device{border-radius:1.8rem!important}.auth-panel-column{animation:v12AuthEnter .65s var(--v12-ease) both}.otp-inputs span{border-radius:.85rem!important}

/* Reveal and interactive state */
.ampol-v12-ready [data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .72s var(--v12-ease),transform .72s var(--v12-ease);transition-delay:var(--reveal-delay,0ms)}.ampol-v12-ready [data-reveal].is-revealed{opacity:1;transform:translateY(0)}
.v12-skeleton{position:relative;overflow:hidden}.v12-skeleton::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.32) 50%,transparent 65%);transform:translateX(100%);animation:v12Skeleton 1.4s ease-in-out infinite}

/* Mobile app experience */
@media (max-width: 1100px){.v12-hero__shell{grid-template-columns:minmax(0,1fr) minmax(22rem,.8fr);gap:1rem}.v12-hero__stage{transform:scale(.86)}.v12-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.v12-flow{grid-template-columns:1fr 1.25fr}.v12-signal-bar{grid-template-columns:repeat(3,1fr)}.v12-signal-bar__live{display:none!important}}
@media (max-width: 800px){
    html{scroll-padding-top:5.5rem}.ampol-site-header__bar{min-height:4.6rem!important}.ampol-header-spacer{height:4.6rem!important}
    .v12-hero{min-height:auto}.v12-hero__shell{display:block;min-height:auto;padding-top:3.5rem;padding-bottom:2rem}.v12-hero__copy{max-width:none;text-align:center}.v12-live-chip{margin-inline:auto}.v12-hero__copy h1{font-size:clamp(2.75rem,12vw,5rem);line-height:1.08}.v12-hero__copy h1 strong::after{inset-inline:15%}.v12-hero__copy>p{margin-inline:auto;font-size:.78rem;line-height:2}.v12-hero-search{margin-inline:auto}.v12-hero__actions,.v12-hero__trust{justify-content:center}.v12-hero__stage{min-height:28rem;margin-top:1rem;transform:scale(.82)}.v12-stage__orbit.is-outer{width:27rem;height:27rem}.v12-stage__orbit.is-inner{width:19rem;height:19rem}.v12-stage__core{width:16rem;height:19rem}.v12-float-card{width:12rem}.v12-float-card.is-1{right:2%}.v12-float-card.is-2{left:1%}.v12-signal-bar{margin-bottom:0}.v12-flow{grid-template-columns:1fr}.v12-final-cta{align-items:flex-start;flex-direction:column}.v12-final-cta>div:last-child{width:100%}.v12-final-cta .v12-button{flex:1}.v12-section-head{align-items:flex-start;flex-direction:column;gap:1rem}
}
@media (max-width: 640px){
    body.ampol-app{padding-bottom:calc(4.7rem + env(safe-area-inset-bottom))}.page-shell{padding-inline:.82rem!important}
    .v12-ambient__grid{background-size:42px 42px}.v12-hero__shell{padding-top:2.35rem}.v12-live-chip{min-height:2.25rem;gap:.45rem;padding:.28rem .38rem .28rem .65rem;font-size:.53rem}.v12-live-chip b{padding:.35rem .48rem;font-size:.48rem}.v12-hero__copy h1{margin-top:1.15rem;font-size:clamp(2.55rem,13.5vw,4rem);letter-spacing:-.045em}.v12-hero__copy>p{margin-top:1.05rem;font-size:.71rem;line-height:1.95}.v12-hero-search{min-height:3.65rem;grid-template-columns:1.25rem minmax(0,1fr) auto;gap:.5rem;margin-top:1.3rem;border-radius:1rem;padding:.34rem .55rem .34rem .35rem}.v12-hero-search button{min-height:2.8rem;border-radius:.75rem;padding:0 .75rem;font-size:.6rem}.v12-hero-search button b{display:none}.v12-hero__actions{display:grid;grid-template-columns:1fr 1fr}.v12-button{min-height:2.95rem;border-radius:.85rem;padding:.65rem .75rem;font-size:.62rem}.v12-hero__trust{gap:.55rem;margin-top:1rem}.v12-hero__trust span{gap:.3rem;font-size:.52rem}.v12-hero__trust i{width:1.25rem;height:1.25rem}.v12-hero__stage{min-height:22rem;margin-top:1.2rem;transform:none}.v12-stage__orbit.is-outer{width:19rem;height:19rem}.v12-stage__orbit.is-inner{width:14.5rem;height:14.5rem}.v12-stage__core{width:12.5rem;height:15.5rem;border-radius:2.2rem}.v12-stage__mark{width:5rem;height:5rem;border-radius:1.5rem}.v12-stage__mark span{font-size:2.8rem}.v12-stage__core>b{margin-top:.8rem;font-size:.95rem}.v12-stage__core>small{font-size:.38rem}.v12-stage__meter{width:6.2rem}.v12-stage__core>p{font-size:.42rem}.v12-stage__status{top:.72rem;font-size:.4rem}.v12-float-card{width:9.5rem;grid-template-columns:2.25rem minmax(0,1fr) 1rem;gap:.42rem;border-radius:.85rem;padding:.42rem}.v12-float-card__icon{width:2.25rem;height:2.25rem;border-radius:.65rem;font-size:.55rem}.v12-float-card b{font-size:.52rem}.v12-float-card small{font-size:.4rem}.v12-float-card.is-1{top:5%;right:0}.v12-float-card.is-2{left:0;top:44%}.v12-float-card.is-3{right:2%;bottom:2%}.v12-signal-bar{grid-template-columns:repeat(3,1fr);border-radius:1rem 1rem 0 0}.v12-signal-bar>div{min-height:4.2rem;gap:.35rem;padding:.55rem .45rem}.v12-signal-bar>div>span{display:none}.v12-signal-bar p b{font-size:.8rem}.v12-signal-bar p small{font-size:.43rem;white-space:nowrap}.v12-marquee>div{gap:1rem;padding:.68rem 0}.v12-section{padding:3.3rem 0}.v12-section-head{margin-bottom:1.25rem}.v12-section-head>div>p{font-size:.5rem}.v12-section-head h2{font-size:1.45rem}.v12-section-head small{font-size:.62rem;line-height:1.75}.v12-section-head>a{padding:.6rem .8rem;font-size:.58rem}.v12-service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.v12-service-card{min-height:11.5rem;border-radius:1.1rem}.v12-service-card__index{top:.65rem;left:.65rem;font-size:.45rem}.v12-service-card>div{inset:auto .55rem .55rem;grid-template-columns:2.1rem minmax(0,1fr) 1rem;gap:.42rem}.v12-service-card>div>i{width:2.1rem;height:2.1rem;border-radius:.65rem;font-size:.5rem}.v12-service-card b{font-size:.62rem}.v12-service-card small{font-size:.43rem}.v12-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.6rem!important}.store-product-card{border-radius:1.05rem!important}.store-product-card__visual{aspect-ratio:1.05!important}.store-product-card__body{padding:.65rem!important}.store-product-card__body>div:first-child{font-size:.45rem!important}.store-product-card__body>a:not(.store-product-card__cta){min-height:2.7rem!important;margin-top:.45rem!important;font-size:.69rem!important;line-height:1.55!important}.store-product-card__footer{padding-top:.65rem!important}.store-product-card__arrow{display:none!important}.store-product-card__cta{min-height:2.3rem;margin-top:.5rem;padding:.4rem .55rem;font-size:.52rem}.store-product-card__category,.store-product-card__discount,.store-product-card__commercial-badge,.store-product-card__instant{font-size:.42rem!important}.v12-flow__copy{text-align:center}.v12-flow__copy>p{justify-content:center}.v12-flow__copy h2{font-size:1.75rem}.v12-flow__copy>small{font-size:.65rem}.v12-flow__copy .v12-button{width:100%}.v12-flow__steps article{grid-template-columns:1.5rem 2.5rem minmax(0,1fr);gap:.55rem;padding:.7rem}.v12-flow__steps>article>i{width:2.5rem;height:2.5rem}.v12-flow__steps b{font-size:.7rem}.v12-flow__steps p{font-size:.5rem}.v12-final-cta{border-radius:1.35rem;padding:1.2rem}.v12-final-cta h2{font-size:1.35rem}.v12-final-cta small{font-size:.6rem}.ampol-check-option{min-height:3.2rem!important;padding:.58rem!important}.ampol-check-state{font-size:.48rem!important}.mobile-app-nav{inset-inline:.6rem!important;bottom:max(.5rem,env(safe-area-inset-bottom))!important;width:auto!important;border:1px solid var(--v12-line-strong)!important;border-radius:1.2rem!important;background:color-mix(in srgb,var(--v12-panel-strong) 92%,transparent)!important;box-shadow:0 18px 50px var(--v12-shadow)!important;backdrop-filter:blur(22px)!important}.mobile-app-nav__search>span{border-color:var(--v12-panel-strong)!important;background:linear-gradient(145deg,var(--v12-accent-3),var(--v12-accent-2))!important;box-shadow:0 14px 35px var(--v12-accent-soft)!important}.mobile-app-nav>a{color:var(--v12-muted)!important}.mobile-app-nav>a.is-active{color:var(--v12-accent-text)!important}.flash-message{inset-inline:.75rem!important;top:5.2rem!important;max-width:none!important}
}
@media (max-width: 380px){.v12-hero__actions{grid-template-columns:1fr}.v12-hero__trust b{display:none}.v12-product-grid{gap:.45rem!important}.store-product-card__body{padding:.55rem!important}.v12-service-card{min-height:10.5rem}.v12-float-card.is-2{top:49%}}

@media (hover:none),(pointer:coarse){[data-tilt]{--tilt-x:0deg!important;--tilt-y:0deg!important}.store-product-card:hover{--tilt-lift:0}.v12-service-card:hover>img{transform:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}[data-reveal]{opacity:1!important;transform:none!important}.v12-ambient__grid,.v12-ambient__orb,.v12-ambient__beam{animation:none!important}}

@keyframes v12GridDrift{to{transform:translate3d(68px,68px,0)}}
@keyframes v12Orb{to{transform:translate3d(5rem,2rem,0) scale(1.15)}}
@keyframes v12Beam{0%,100%{opacity:.18;transform:rotate(-13deg) translateX(-8%)}50%{opacity:.7;transform:rotate(-13deg) translateX(10%)}}
@keyframes v12Pulse{50%{opacity:.45;box-shadow:0 0 0 8px transparent,0 0 8px var(--v12-accent)}}
@keyframes v12Halo{to{transform:scale(1.16);opacity:.55}}
@keyframes v12Rotate{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes v12Shine{0%,18%{transform:translateX(-55%) rotate(22deg)}55%,100%{transform:translateX(55%) rotate(22deg)}}
@keyframes v12Meter{to{width:94%}}
@keyframes v12Marquee{to{transform:translateX(50%)}}
@keyframes v12AuthEnter{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
@keyframes v12Skeleton{to{transform:translateX(-100%)}}

/* source: public/css/ampol-v12.1-notifications.css */
/* AMPOLSHOP V12.1 — themed glass notification center */

html[data-theme] {
    --notif-glass: color-mix(in srgb, var(--v12-panel-strong) 78%, transparent);
    --notif-glass-strong: color-mix(in srgb, var(--v12-panel-strong) 91%, transparent);
    --notif-line: color-mix(in srgb, var(--v12-accent) 24%, var(--v12-line));
    --notif-shadow: color-mix(in srgb, var(--v12-shadow) 82%, rgba(0,0,0,.22));
}

.ampol-notification-icon-svg { display:block; width:1.25rem; height:1.25rem; }
.ampol-notification-bell { position:relative; z-index:4; flex:0 0 auto; }
.ampol-notification-trigger { position:relative; display:grid; width:2.78rem; height:2.78rem; place-items:center; border:0; border-radius:50%; color:var(--v12-accent-text); background:transparent; transition:transform .24s var(--v12-ease); }
.ampol-notification-trigger:hover { transform:translateY(-2px); }
.ampol-notification-trigger__ring { position:relative; display:grid; width:2.55rem; height:2.55rem; place-items:center; border:1px solid var(--v12-line-strong); border-radius:50%; color:var(--v12-accent-text); background:linear-gradient(145deg,var(--v12-panel-strong),var(--v12-panel-soft)); box-shadow:0 9px 24px var(--v12-shadow),inset 0 1px 0 color-mix(in srgb,#fff 58%,transparent); }
.ampol-notification-trigger__ring::after { content:''; position:absolute; inset:.22rem; border:1px solid color-mix(in srgb,var(--v12-accent) 18%,transparent); border-radius:inherit; }
.ampol-notification-trigger:hover .ampol-notification-trigger__ring { border-color:var(--v12-accent); box-shadow:0 12px 30px var(--v12-shadow),0 0 0 5px var(--v12-accent-soft); }
.ampol-notification-trigger .ampol-header-count { inset-inline-end:-.1rem; top:-.08rem; display:grid; min-width:1.18rem; height:1.18rem; place-items:center; border:2px solid var(--v12-panel-strong); border-radius:999px; padding:0 .23rem; color:var(--v12-action-text)!important; background:linear-gradient(135deg,var(--v12-accent-2),var(--v12-accent)); box-shadow:0 5px 14px var(--v12-accent-soft); font-size:.52rem; font-weight:1000; line-height:1; }
.ampol-notification-trigger .ampol-header-count.hidden { display:none; }

.ampol-notification-popover { position:absolute; top:calc(100% + .85rem); inset-inline-end:0; z-index:120; width:min(25rem,calc(100vw - 1.5rem)); overflow:hidden; border:1px solid var(--notif-line); border-radius:1.55rem; color:var(--v12-text); background:linear-gradient(145deg,var(--notif-glass-strong),var(--notif-glass)); box-shadow:0 28px 90px var(--notif-shadow),inset 0 1px 0 color-mix(in srgb,#fff 58%,transparent); backdrop-filter:blur(30px) saturate(1.45); -webkit-backdrop-filter:blur(30px) saturate(1.45); transform-origin:top right; }
[dir="ltr"] .ampol-notification-popover { transform-origin:top left; }
.ampol-notification-popover::before { content:''; position:absolute; top:-5rem; inset-inline-end:-4rem; width:12rem; height:12rem; border-radius:50%; background:var(--v12-accent-soft); filter:blur(30px); pointer-events:none; }
.ampol-notification-popover__head { position:relative; display:flex; min-height:4.6rem; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem 1rem; border-bottom:1px solid var(--v12-line); background:linear-gradient(110deg,var(--v12-accent-soft),transparent 60%); }
.ampol-notification-popover__head>div { display:flex; min-width:0; align-items:center; gap:.7rem; }
.ampol-notification-popover__head>div>span { display:grid; width:2.4rem; height:2.4rem; flex:0 0 auto; place-items:center; border:1px solid var(--v12-line-strong); border-radius:.85rem; color:var(--v12-accent-text); background:var(--v12-panel-strong); box-shadow:0 8px 20px var(--v12-shadow); }
.ampol-notification-popover__head p { display:grid; gap:.12rem; min-width:0; }
.ampol-notification-popover__head b { color:var(--v12-text)!important; font-size:.78rem; font-weight:1000; }
.ampol-notification-popover__head small { color:var(--v12-muted)!important; font-size:.55rem; font-weight:750; }
.ampol-notification-popover__head>button { display:grid; width:2rem; height:2rem; flex:0 0 auto; place-items:center; border:1px solid var(--v12-line); border-radius:.7rem; color:var(--v12-muted); background:var(--v12-panel-soft); font-size:1.1rem; }
.ampol-notification-popover__list { position:relative; display:grid; max-height:min(24rem,56vh); overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--v12-accent-soft) transparent; }
.ampol-notification-popover__list>a { position:relative; display:grid; grid-template-columns:2.3rem minmax(0,1fr) .45rem; align-items:start; gap:.7rem; min-height:4.85rem; padding:.78rem 1rem; border-bottom:1px solid var(--v12-line); color:var(--v12-text); background:color-mix(in srgb,var(--v12-panel-strong) 48%,transparent); transition:background .2s ease,transform .2s ease,opacity .2s ease; }
.ampol-notification-popover__list>a:hover { z-index:2; background:color-mix(in srgb,var(--v12-accent) 9%,var(--v12-panel-strong)); transform:translateX(-2px); }
[dir="ltr"] .ampol-notification-popover__list>a:hover { transform:translateX(2px); }
.ampol-notification-popover__list>a.is-read { opacity:.68; }
.ampol-notification-preview__icon { display:grid; width:2.3rem; height:2.3rem; place-items:center; border:1px solid var(--v12-line); border-radius:.8rem; color:var(--v12-accent-text); background:var(--v12-accent-soft); }
.ampol-notification-popover__list>a>span:nth-child(2) { display:grid; min-width:0; gap:.18rem; }
.ampol-notification-popover__list b { overflow:hidden; color:var(--v12-text)!important; font-size:.67rem; font-weight:950; text-overflow:ellipsis; white-space:nowrap; }
.ampol-notification-popover__list small { overflow:hidden; color:var(--v12-muted)!important; font-size:.55rem; font-weight:650; line-height:1.65; text-overflow:ellipsis; white-space:nowrap; }
.ampol-notification-popover__list time { color:color-mix(in srgb,var(--v12-muted) 80%,transparent); font-size:.48rem; font-weight:700; }
.ampol-notification-popover__list>a>i { width:.42rem; height:.42rem; margin-top:.42rem; border-radius:50%; background:var(--v12-accent); box-shadow:0 0 0 4px var(--v12-accent-soft),0 0 14px var(--v12-accent); }
.ampol-notification-popover__empty { display:grid; min-height:13rem; place-items:center; align-content:center; gap:.5rem; padding:2rem; text-align:center; }
.ampol-notification-popover__empty>span { display:grid; width:3.4rem; height:3.4rem; place-items:center; border:1px solid var(--v12-line-strong); border-radius:50%; color:var(--v12-accent-text); background:var(--v12-accent-soft); }
.ampol-notification-popover__empty b { color:var(--v12-text)!important; font-size:.72rem; }
.ampol-notification-popover__empty small { color:var(--v12-muted)!important; font-size:.55rem; }
.ampol-notification-popover__footer { position:relative; display:flex; min-height:3.45rem; align-items:center; justify-content:center; gap:.55rem; color:var(--v12-accent-text)!important; background:color-mix(in srgb,var(--v12-accent) 8%,var(--notif-glass-strong)); font-size:.64rem; font-weight:950; }
.ampol-notification-popover__footer span { transition:transform .2s ease; }
.ampol-notification-popover__footer:hover span { transform:translateX(-4px); }

/* Live toast: bell -> glass card -> bell */
.ampol-live-notification-stack { position:fixed; top:calc(5.75rem + env(safe-area-inset-top)); inset-inline-end:1rem; z-index:260; display:grid; width:min(23rem,calc(100vw - 2rem)); gap:.65rem; pointer-events:none; }
.ampol-live-notification { --notif-tone:var(--v12-accent); position:relative; display:grid; width:3.35rem; min-height:3.35rem; grid-template-columns:3.35rem minmax(0,1fr) 1.5rem; align-items:center; justify-self:end; overflow:hidden; border:1px solid color-mix(in srgb,var(--notif-tone) 35%,var(--v12-line)); border-radius:1.68rem; color:var(--v12-text)!important; background:linear-gradient(140deg,var(--notif-glass-strong),var(--notif-glass)); box-shadow:0 24px 70px var(--notif-shadow),inset 0 1px 0 color-mix(in srgb,#fff 58%,transparent); backdrop-filter:blur(28px) saturate(1.45); -webkit-backdrop-filter:blur(28px) saturate(1.45); opacity:0; transform:translateY(-.8rem) scale(.72); pointer-events:auto; transition:width .48s var(--v12-ease),border-radius .48s var(--v12-ease),opacity .25s ease,transform .48s var(--v12-ease); }
.ampol-live-notification.is-success { --notif-tone:#16a36a; }.ampol-live-notification.is-warning { --notif-tone:#f59e0b; }.ampol-live-notification.is-danger { --notif-tone:#ef445f; }.ampol-live-notification.is-live { --notif-tone:#ef334f; }
.ampol-live-notification.is-ringing { opacity:1; transform:none; }
.ampol-live-notification.is-expanded { width:100%; border-radius:1.25rem; }
.ampol-live-notification.is-leaving { width:3.35rem; border-radius:1.68rem; opacity:0; transform:translateY(-1.2rem) scale(.72); }
.ampol-live-notification__bell { position:relative; z-index:2; display:grid; width:2.58rem; height:2.58rem; place-items:center; justify-self:center; border:1px solid color-mix(in srgb,var(--notif-tone) 45%,var(--v12-line)); border-radius:50%; color:var(--notif-tone); background:color-mix(in srgb,var(--notif-tone) 10%,var(--v12-panel-strong)); box-shadow:0 0 0 5px color-mix(in srgb,var(--notif-tone) 8%,transparent),0 8px 20px var(--v12-shadow); }
.ampol-live-notification.is-ringing:not(.is-expanded) .ampol-live-notification__bell { animation:notifBellRing .58s ease-in-out; }
.ampol-live-notification__copy { display:grid; min-width:15rem; gap:.18rem; padding:.7rem 0; opacity:0; transform:translateX(1rem); transition:opacity .22s .2s ease,transform .35s .16s var(--v12-ease); }
[dir="ltr"] .ampol-live-notification__copy { transform:translateX(-1rem); }
.ampol-live-notification.is-expanded .ampol-live-notification__copy { opacity:1; transform:none; }
.ampol-live-notification__copy b { overflow:hidden; color:var(--v12-text)!important; font-size:.7rem; font-weight:1000; text-overflow:ellipsis; white-space:nowrap; }
.ampol-live-notification__copy small { display:-webkit-box; overflow:hidden; color:var(--v12-muted)!important; font-size:.56rem; font-weight:650; line-height:1.75; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.ampol-live-notification__arrow { color:var(--notif-tone); opacity:0; font-size:.85rem; font-weight:1000; transition:opacity .2s .25s ease,transform .2s ease; }
.ampol-live-notification.is-expanded .ampol-live-notification__arrow { opacity:1; }
.ampol-live-notification__progress { position:absolute; inset:auto 0 0; width:0; height:.16rem; border-radius:999px; background:linear-gradient(90deg,var(--notif-tone),transparent); }
.ampol-live-notification.is-expanded .ampol-live-notification__progress { animation:notifProgress 6.2s linear forwards; }

/* User notification page */
.ampol-notification-page { min-height:100vh; padding:3rem 0 7rem; color:var(--v12-text); background:radial-gradient(circle at 12% 5%,var(--v12-accent-soft),transparent 28rem),linear-gradient(145deg,var(--v12-page),var(--v12-page-alt)); }
.ampol-notification-page__head { display:flex; align-items:flex-end; justify-content:space-between; gap:1.25rem; }
.ampol-notification-page__head h1 { margin-top:.7rem; color:var(--v12-text)!important; font-size:clamp(2rem,4vw,3.2rem); font-weight:1000; }
.ampol-notification-page__head p:not(.eyebrow) { max-width:46rem; margin-top:.55rem; color:var(--v12-muted)!important; font-size:.72rem; font-weight:650; line-height:1.9; }
.ampol-notification-filters { display:flex; gap:.5rem; overflow:auto; margin-top:1.7rem; padding-bottom:.3rem; }
.ampol-notification-filters a { flex:none; border:1px solid var(--v12-line); border-radius:999px; padding:.62rem .9rem; color:var(--v12-muted)!important; background:var(--notif-glass); font-size:.6rem; font-weight:900; backdrop-filter:blur(16px); }
.ampol-notification-filters a.is-active { border-color:var(--v12-line-strong); color:var(--v12-action-text)!important; background:linear-gradient(120deg,var(--v12-accent-2),var(--v12-accent)); box-shadow:0 9px 24px var(--v12-accent-soft); }
.ampol-notification-list { display:grid; gap:.7rem; margin-top:1.15rem; }
.ampol-notification-card { --notif-tone:var(--v12-accent); position:relative; display:grid; grid-template-columns:3rem minmax(0,1fr) .55rem; align-items:start; gap:.9rem; overflow:hidden; border:1px solid color-mix(in srgb,var(--notif-tone) 18%,var(--v12-line)); border-radius:1.25rem; padding:1rem; color:var(--v12-text)!important; background:linear-gradient(140deg,var(--notif-glass-strong),var(--notif-glass)); box-shadow:0 14px 38px var(--v12-shadow),inset 0 1px 0 color-mix(in srgb,#fff 48%,transparent); backdrop-filter:blur(22px); transition:transform .22s ease,border-color .22s ease,opacity .22s ease; }
.ampol-notification-card.is-success { --notif-tone:#16a36a; }.ampol-notification-card.is-warning { --notif-tone:#f59e0b; }.ampol-notification-card.is-danger { --notif-tone:#ef445f; }.ampol-notification-card.is-live { --notif-tone:#ef334f; }
.ampol-notification-card::after { content:''; position:absolute; inset:0 auto 0 0; width:.2rem; background:linear-gradient(180deg,var(--notif-tone),transparent); opacity:.8; }
[dir="ltr"] .ampol-notification-card::after { inset:0 0 0 auto; }
.ampol-notification-card:hover { border-color:color-mix(in srgb,var(--notif-tone) 48%,var(--v12-line)); transform:translateY(-3px); }
.ampol-notification-card.is-read { opacity:.67; }
.ampol-notification-card__icon { display:grid; width:3rem; height:3rem; place-items:center; border:1px solid color-mix(in srgb,var(--notif-tone) 35%,var(--v12-line)); border-radius:1rem; color:var(--notif-tone); background:color-mix(in srgb,var(--notif-tone) 9%,var(--v12-panel-strong)); }
.ampol-notification-card__content { display:grid; min-width:0; gap:.38rem; }
.ampol-notification-card__meta { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.ampol-notification-card__meta b { color:var(--v12-text)!important; font-size:.76rem; font-weight:1000; }
.ampol-notification-card__meta small { flex:0 0 auto; color:var(--v12-muted)!important; font-size:.52rem; }
.ampol-notification-card__body { color:var(--v12-muted)!important; font-size:.63rem; font-weight:650; line-height:1.9; }
.ampol-notification-card__category { display:flex; align-items:center; gap:.45rem; color:color-mix(in srgb,var(--v12-muted) 84%,transparent); font-size:.5rem; font-weight:800; }
.ampol-notification-card__category i { border-radius:999px; padding:.2rem .45rem; color:var(--notif-tone); background:color-mix(in srgb,var(--notif-tone) 10%,transparent); font-style:normal; }
.ampol-notification-card__dot { width:.5rem; height:.5rem; margin-top:.35rem; border-radius:50%; background:var(--notif-tone); box-shadow:0 0 0 5px color-mix(in srgb,var(--notif-tone) 10%,transparent),0 0 16px var(--notif-tone); }
.ampol-notification-empty { display:grid; min-height:18rem; place-items:center; align-content:center; gap:.6rem; border:1px dashed var(--v12-line-strong); border-radius:1.6rem; padding:2rem; color:var(--v12-muted); background:var(--notif-glass); text-align:center; backdrop-filter:blur(18px); }
.ampol-notification-empty>span { display:grid; width:4rem; height:4rem; place-items:center; border:1px solid var(--v12-line-strong); border-radius:50%; color:var(--v12-accent-text); background:var(--v12-accent-soft); }
.ampol-notification-empty h2 { color:var(--v12-text)!important; font-size:1rem; font-weight:1000; }.ampol-notification-empty p { font-size:.62rem; }

/* Owner control center */
.ampol-notification-admin-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(18rem,.65fr); gap:1rem; }
.ampol-notification-compose,.ampol-welcome-settings,.ampol-notification-history { padding:1.2rem; }
.ampol-notification-admin-head { display:flex; align-items:center; gap:.8rem; }
.ampol-notification-admin-head>span { display:grid; width:2.75rem; height:2.75rem; flex:0 0 auto; place-items:center; border:1px solid var(--v12-line-strong); border-radius:.95rem; color:var(--v12-accent-text); background:var(--v12-accent-soft); }
.ampol-notification-admin-head h2 { color:var(--v12-text)!important; font-size:.9rem; font-weight:1000; }.ampol-notification-admin-head p { margin-top:.18rem; color:var(--v12-muted)!important; font-size:.56rem; line-height:1.75; }
.ampol-notification-presets { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:1rem; }
.ampol-notification-presets button { border:1px solid var(--v12-line); border-radius:999px; padding:.5rem .75rem; color:var(--v12-accent-text); background:var(--v12-accent-soft); font-size:.54rem; font-weight:900; transition:.2s ease; }.ampol-notification-presets button:hover { border-color:var(--v12-accent); transform:translateY(-2px); }
.ampol-notification-form { display:grid; gap:.8rem; margin-top:1rem; }
.ampol-notification-targets { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.ampol-notification-targets label { display:flex; min-height:4.1rem; align-items:center; gap:.65rem; border:1px solid var(--v12-line); border-radius:1rem; padding:.7rem; color:var(--v12-text); background:var(--v12-panel-soft); cursor:pointer; }
.ampol-notification-targets label:has(input:checked) { border-color:var(--v12-accent); background:var(--v12-accent-soft); box-shadow:0 0 0 3px color-mix(in srgb,var(--v12-accent) 8%,transparent); }
.ampol-notification-targets input { flex:0 0 auto; }.ampol-notification-targets span { display:grid; gap:.15rem; }.ampol-notification-targets b { color:var(--v12-text)!important; font-size:.62rem; }.ampol-notification-targets small { color:var(--v12-muted)!important; font-size:.49rem; }
.ampol-notification-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:.7rem; }.ampol-notification-field { display:grid; align-content:start; gap:.35rem; }.ampol-notification-field.is-wide { grid-column:1/-1; }.ampol-notification-field>span { color:var(--v12-text); font-size:.57rem; font-weight:900; }.ampol-notification-field>small { color:var(--v12-muted)!important; font-size:.48rem; }.ampol-notification-field textarea { resize:vertical; line-height:1.9; }
.ampol-notification-send { display:flex; min-height:3.3rem; align-items:center; justify-content:center; gap:.55rem; border-radius:1rem; }
.ampol-welcome-settings .btn-secondary { min-height:3rem; border-radius:.9rem; font-size:.6rem; font-weight:950; }
.ampol-notification-history { margin-top:1rem; }.ampol-notification-history-list { display:grid; gap:.6rem; margin-top:1rem; }.ampol-notification-history-list article { display:grid; grid-template-columns:3rem minmax(0,1fr); gap:.8rem; border:1px solid var(--v12-line); border-radius:1rem; padding:.8rem; background:var(--v12-panel-soft); }.ampol-notification-history-list article>div>div { display:flex; justify-content:space-between; gap:1rem; }.ampol-notification-history-list b { color:var(--v12-text)!important; font-size:.66rem; }.ampol-notification-history-list time,.ampol-notification-history-list small { color:var(--v12-muted)!important; font-size:.49rem; }.ampol-notification-history-list p { margin:.3rem 0; color:var(--v12-muted)!important; font-size:.55rem; line-height:1.75; }.ampol-notification-empty.is-compact { min-height:10rem; }

@media(max-width:900px){.ampol-notification-admin-grid{grid-template-columns:1fr}.ampol-notification-popover{inset-inline-end:-3.4rem}}
@media(max-width:700px){
    .ampol-notification-trigger{width:2.45rem;height:2.45rem}.ampol-notification-trigger__ring{width:2.3rem;height:2.3rem}.ampol-notification-trigger__ring .ampol-notification-icon-svg{width:1.05rem;height:1.05rem}
    .ampol-notification-popover{position:fixed;top:calc(4.85rem + env(safe-area-inset-top));inset-inline:.65rem;width:auto;max-height:calc(100svh - 6rem);border-radius:1.25rem}.ampol-notification-popover__list{max-height:52svh}.ampol-notification-popover__head{min-height:4.25rem}
    .ampol-live-notification-stack{top:calc(5rem + env(safe-area-inset-top));inset-inline:.65rem;width:auto}.ampol-live-notification{min-height:3.15rem;grid-template-columns:3.15rem minmax(0,1fr) 1.2rem}.ampol-live-notification__bell{width:2.35rem;height:2.35rem}.ampol-live-notification__copy{min-width:12rem}.ampol-live-notification__copy b{font-size:.64rem}.ampol-live-notification__copy small{font-size:.52rem}
    .ampol-notification-page{padding:1.8rem 0 6rem}.ampol-notification-page__head{align-items:stretch;flex-direction:column}.ampol-notification-page__head form button{width:100%}.ampol-notification-card{grid-template-columns:2.55rem minmax(0,1fr) .45rem;gap:.65rem;padding:.8rem}.ampol-notification-card__icon{width:2.55rem;height:2.55rem;border-radius:.85rem}.ampol-notification-card__meta{display:grid;gap:.2rem}.ampol-notification-card__body{font-size:.58rem}
    .ampol-notification-compose,.ampol-welcome-settings,.ampol-notification-history{padding:.85rem}.ampol-notification-form-grid,.ampol-notification-targets{grid-template-columns:1fr}.ampol-notification-field.is-wide{grid-column:auto}.ampol-notification-history-list article{grid-template-columns:2.55rem minmax(0,1fr)}.ampol-notification-history-list article>div>div{display:grid;gap:.2rem}
}
@media(max-width:390px){.ampol-notification-trigger{width:2.15rem;height:2.15rem}.ampol-notification-trigger__ring{width:2.05rem;height:2.05rem}.ampol-live-notification__copy{min-width:10rem}.ampol-notification-popover__list>a{padding-inline:.75rem}}
@media(prefers-reduced-motion:reduce){.ampol-live-notification,.ampol-live-notification__copy,.ampol-notification-trigger,.ampol-notification-card{transition:none!important}.ampol-live-notification__bell,.ampol-live-notification__progress{animation:none!important}}

@keyframes notifBellRing{0%,100%{transform:rotate(0)}20%{transform:rotate(12deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(7deg)}80%{transform:rotate(-4deg)}}
@keyframes notifProgress{from{width:100%}to{width:0}}

/* source: public/css/ampol-v12.2-storefront.css */
/* AMPOLSHOP V12.2 — themed storefront, availability and Arena contrast */

html[data-theme] body.ampol-app {
    --store-neon: var(--v12-accent);
    --store-neon-2: var(--v12-accent-2);
    --store-neon-soft: color-mix(in srgb, var(--v12-accent) 19%, transparent);
}

html[data-theme] body.is-shop-route .storefront-page {
    background:
        radial-gradient(circle at 12% 10%, color-mix(in srgb,var(--v12-accent) 16%,transparent), transparent 30rem),
        radial-gradient(circle at 88% 48%, color-mix(in srgb,var(--v12-accent-2) 13%,transparent), transparent 34rem),
        linear-gradient(150deg,var(--v12-page),var(--v12-page-alt)) !important;
}
html[data-theme] body.is-shop-route .storefront-hero {
    border-color: var(--v12-line-strong) !important;
    color: var(--v12-text) !important;
    background: linear-gradient(128deg,color-mix(in srgb,var(--v12-panel-strong) 92%,transparent),color-mix(in srgb,var(--v12-panel) 82%,transparent)),radial-gradient(circle at 82% 44%,var(--v12-accent-soft),transparent 27rem) !important;
    box-shadow: 0 30px 90px var(--v12-shadow), inset 0 1px 0 color-mix(in srgb,#fff 65%,transparent) !important;
}
html[data-theme] body.is-shop-route .storefront-hero :is(h1,.storefront-hero__core b,.storefront-hero__stats b) { color: var(--v12-text) !important; }
html[data-theme] body.is-shop-route .storefront-hero :is(p,.storefront-trust-row span,.storefront-hero__stats small) { color: var(--v12-muted) !important; }
html[data-theme] body.is-shop-route .storefront-kicker { color: var(--v12-accent-text) !important; }
html[data-theme] body.is-shop-route :is(h2,h3) { color: var(--v12-text) !important; }

/* One continuous category rail on mobile and desktop. */
.store-service-controls { display:flex;align-items:center;gap:.45rem;flex:0 0 auto; }
.store-service-controls button { display:grid;width:2.35rem;height:2.35rem;place-items:center;border:1px solid var(--v12-line);border-radius:.8rem;color:var(--v12-text);background:var(--v12-panel-strong);box-shadow:0 8px 24px var(--v12-shadow);font-size:1.25rem;transition:.2s ease; }
.store-service-controls button:hover { color:var(--v12-action-text);border-color:var(--v12-accent);background:var(--v12-accent);transform:translateY(-2px); }
.store-service-controls a { margin-inline-start:.25rem;color:var(--v12-accent-text);font-size:.65rem;font-weight:950;white-space:nowrap; }
.store-service-rail { display:flex!important;grid-template-columns:none!important;gap:.8rem;overflow-x:auto;overscroll-behavior-inline:contain;padding:.3rem .15rem 1rem;scroll-padding-inline:.25rem;scroll-snap-type:inline mandatory; }
.store-service-rail::after { content:'';display:block;min-width:.25rem; }
.store-service-rail .service-category-card {
    --service-accent: var(--v12-accent) !important;
    --service-secondary: var(--v12-accent-2) !important;
    width:12.4rem!important;min-width:12.4rem!important;min-height:10.2rem!important;scroll-snap-align:start;
    border:1px solid var(--v12-line-strong)!important;border-radius:1.35rem!important;
    background:linear-gradient(145deg,color-mix(in srgb,var(--v12-accent) 13%,var(--v12-panel-strong)),var(--v12-panel-strong) 72%)!important;
    box-shadow:0 14px 38px var(--v12-shadow),inset 0 1px 0 color-mix(in srgb,#fff 60%,transparent)!important;
}
.store-service-rail .service-category-card:hover { border-color:var(--v12-accent)!important;box-shadow:0 20px 48px var(--v12-shadow),0 0 28px var(--v12-accent-soft)!important; }
.store-service-rail .service-category-card strong { color:var(--v12-text)!important; }
.store-service-rail .service-category-card :is(small,span>span) { color:var(--v12-muted)!important; }
.store-service-rail .service-category-card__icon { color:var(--v12-accent-text)!important;border-color:var(--v12-line-strong)!important;background:var(--v12-accent-soft)!important;box-shadow:0 0 24px var(--v12-accent-soft)!important; }
.store-service-rail .service-category-card__badge { color:var(--v12-accent-text)!important;border-color:var(--v12-line)!important;background:var(--v12-panel)!important; }
.store-service-rail .service-category-card svg { color:var(--v12-accent-text)!important; }

/* Product cards: current theme controls neon, shadows and image tint. */
html[data-theme] body.ampol-app .store-product-card {
    --service-accent: var(--v12-accent) !important;
    --service-secondary: var(--v12-accent-2) !important;
    border:1px solid color-mix(in srgb,var(--v12-accent) 52%,rgba(255,255,255,.12))!important;
    background:linear-gradient(155deg,color-mix(in srgb,var(--v12-deep-3) 85%,var(--v12-accent) 15%),var(--v12-deep))!important;
    box-shadow:0 20px 58px color-mix(in srgb,var(--v12-shadow) 72%,rgba(0,0,0,.28)),0 0 0 1px color-mix(in srgb,var(--v12-accent) 16%,transparent),0 0 24px color-mix(in srgb,var(--v12-accent) 11%,transparent)!important;
}
html[data-theme] body.ampol-app .store-product-card::after { content:'';position:absolute;z-index:24;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 25px color-mix(in srgb,var(--v12-accent) 9%,transparent); }
html[data-theme] body.ampol-app .store-product-card:hover { border-color:var(--v12-accent)!important;box-shadow:0 30px 78px rgba(0,0,0,.3),0 0 40px color-mix(in srgb,var(--v12-accent) 24%,transparent)!important; }
html[data-theme] body.ampol-app .store-product-card__visual { background:linear-gradient(145deg,color-mix(in srgb,var(--v12-deep-3) 68%,var(--v12-accent) 32%),var(--v12-deep))!important; }
html[data-theme] body.ampol-app .store-product-card__image-wrap::before { content:'';position:absolute;z-index:2;inset:0;pointer-events:none;background:linear-gradient(135deg,color-mix(in srgb,var(--v12-accent) 25%,transparent),transparent 45%),linear-gradient(to top,color-mix(in srgb,var(--v12-deep) 88%,var(--v12-accent) 12%),transparent 58%);mix-blend-mode:color;opacity:.72; }
html[data-theme] body.ampol-app .store-product-card__image-wrap::after { z-index:3;background:linear-gradient(to top,var(--v12-deep) 0%,rgba(0,0,0,.08) 58%,rgba(0,0,0,.02))!important; }
html[data-theme] body.ampol-app .store-product-card__body { background:linear-gradient(180deg,var(--v12-deep),color-mix(in srgb,var(--v12-deep-2) 88%,var(--v12-accent) 12%))!important; }
html[data-theme] body.ampol-app .store-product-card__body>div:first-child i { background:var(--v12-accent)!important;box-shadow:0 0 12px var(--v12-accent)!important; }
html[data-theme] body.ampol-app .store-product-card__cta { color:color-mix(in srgb,var(--v12-accent) 68%,white)!important;border-color:color-mix(in srgb,var(--v12-accent) 48%,transparent)!important;background:color-mix(in srgb,var(--v12-accent) 12%,transparent)!important; }
html[data-theme] body.ampol-app .store-product-card__cta:hover { color:var(--v12-action-text)!important;background:linear-gradient(115deg,var(--v12-accent-2),var(--v12-accent))!important; }
.store-product-card__soldout { border:1px solid rgba(251,113,133,.45);border-radius:999px;padding:.34rem .55rem;color:#fff1f2;background:rgba(159,18,57,.78);box-shadow:0 8px 24px rgba(159,18,57,.25);font-size:.5rem;font-weight:1000;backdrop-filter:blur(12px); }
.store-product-card.is-out-of-stock { filter:saturate(.72); }
.store-product-card.is-out-of-stock .store-product-card__image { filter:grayscale(.25) saturate(.65) brightness(.78)!important; }
.store-product-card.is-out-of-stock .store-product-card__visual-orb { opacity:.08!important; }
.store-product-card.is-out-of-stock .store-product-card__cta.is-disabled { cursor:not-allowed;color:#fecdd3!important;border-color:rgba(251,113,133,.2)!important;background:rgba(159,18,57,.14)!important; }

/* Product availability */
.product-service-artwork__soldout { display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:.4rem .65rem;color:#fff;background:rgba(159,18,57,.82);box-shadow:0 10px 28px rgba(159,18,57,.3);font-size:.58rem;font-style:normal;font-weight:1000;backdrop-filter:blur(14px); }
.product-unavailable-panel { display:grid;grid-template-columns:3rem minmax(0,1fr);gap:.85rem;margin-top:1.25rem;border:1px solid color-mix(in srgb,#fb7185 38%,var(--v12-line));border-radius:1.25rem;padding:1rem;color:var(--v12-text);background:linear-gradient(145deg,color-mix(in srgb,#fb7185 8%,var(--v12-panel-strong)),var(--v12-panel));box-shadow:0 18px 45px var(--v12-shadow); }
.product-unavailable-panel>span { display:grid;width:3rem;height:3rem;place-items:center;border-radius:1rem;color:#fff;background:linear-gradient(145deg,#e11d48,#9f1239);font-size:1.2rem;font-weight:1000; }
.product-unavailable-panel b { color:var(--v12-text)!important;font-size:.8rem;font-weight:1000; }
.product-unavailable-panel p { margin-top:.35rem;color:var(--v12-muted)!important;font-size:.62rem;line-height:1.9; }
.product-unavailable-panel a { grid-column:1/-1;display:flex;min-height:2.8rem;align-items:center;justify-content:center;border:1px solid var(--v12-line-strong);border-radius:.85rem;color:var(--v12-accent-text);background:var(--v12-accent-soft);font-size:.65rem;font-weight:950; }
.product-mobile-buybar.is-unavailable>span { display:flex;min-height:2.75rem;align-items:center;justify-content:center;border-radius:.8rem;padding-inline:1rem;color:#fff;background:#9f1239;font-size:.66rem;font-weight:950; }

/* Store filters and the mobile drawer always follow the selected theme. */
html[data-theme] body.is-shop-route :is(.store-filter-panel,[role="dialog"] form) { color:var(--v12-text)!important;border-color:var(--v12-line)!important;background:var(--v12-panel-strong)!important; }
html[data-theme] body.is-shop-route [role="dialog"] form>div:last-child { background:color-mix(in srgb,var(--v12-panel-strong) 94%,transparent)!important; }
html[data-theme] body.is-shop-route :is(.store-filter-option span,.store-filter-group>label,.store-filter-switch b,.store-filter-switch small) { color:var(--v12-muted)!important; }
html[data-theme] body.is-shop-route .store-filter-option:has(input:checked) span { color:var(--v12-accent-text)!important; }

/* Arena builder contrast fix, especially on light themes. */
html[data-theme] body.is-admin-route .arena-admin-console { color:var(--v12-text)!important;border-color:var(--v12-line)!important;background:var(--v12-panel-strong)!important;box-shadow:0 18px 52px var(--v12-shadow)!important; }
html[data-theme] body.is-admin-route .arena-admin-console :is(h1,h2,h3,b,strong) { color:var(--v12-text)!important; }
html[data-theme] body.is-admin-route .arena-admin-console .arena-field>span { color:var(--v12-text)!important;-webkit-text-fill-color:var(--v12-text)!important; }
html[data-theme] body.is-admin-route .arena-admin-console .arena-field :is(input,select,textarea) { color:var(--v12-text)!important;-webkit-text-fill-color:var(--v12-text)!important;border-color:var(--v12-line)!important;background:var(--v12-panel-strong)!important;box-shadow:inset 0 1px 2px var(--v12-shadow)!important; }
html[data-theme] body.is-admin-route .arena-admin-console .arena-field :is(input,textarea)::placeholder { color:var(--v12-muted)!important;-webkit-text-fill-color:var(--v12-muted)!important;opacity:.78; }
html[data-theme] body.is-admin-route .arena-admin-console .arena-field select option { color:var(--v12-text)!important;background:var(--v12-panel-strong)!important; }
html[data-theme] body.is-admin-route .arena-admin-console .arena-field input[type="file"]::file-selector-button { margin-inline-end:.75rem;border:0;border-radius:.65rem;padding:.55rem .75rem;color:var(--v12-action-text);background:var(--v12-accent);font-weight:900; }
html[data-theme] body.is-admin-route .arena-chip--accent { color:var(--v12-action-text)!important;background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent))!important; }

@media (max-width: 767px) {
    .store-service-controls button { display:none; }
    .store-service-controls a { font-size:.57rem; }
    .store-service-rail { margin-inline:-.82rem;padding-inline:.82rem;gap:.6rem; }
    .store-service-rail .service-category-card { width:7.8rem!important;min-width:7.8rem!important;min-height:8.2rem!important;padding:.7rem!important;border-radius:1rem!important; }
    .store-service-rail .service-category-card strong { font-size:.7rem!important; }
    .store-service-rail .service-category-card__icon { width:2.2rem!important;height:2.2rem!important; }
    .store-product-card__soldout { padding:.27rem .42rem;font-size:.42rem; }
    .product-unavailable-panel { grid-template-columns:2.6rem minmax(0,1fr);padding:.8rem; }
    .product-unavailable-panel>span { width:2.6rem;height:2.6rem; }
}

@media (prefers-reduced-motion: reduce) { .store-service-rail { scroll-behavior:auto; } }

/* source: public/css/ampol-v12.3-product-categories.css */
/* AMPOLSHOP V12.3 — themed product experience, premium checks and category visibility */

/* --------------------------------------------------------------------------
   Product page: the selected user theme owns the page. Product colors are
   retained only as a small identity cue, never as the primary surface color.
   -------------------------------------------------------------------------- */
html[data-theme] body.is-product-route .product-service-page-v123 {
    color: var(--v12-text) !important;
    background:
        radial-gradient(circle at 7% 12%, color-mix(in srgb,var(--v12-accent) 20%,transparent), transparent 29rem),
        radial-gradient(circle at 93% 52%, color-mix(in srgb,var(--v12-accent-2) 14%,transparent), transparent 34rem),
        linear-gradient(145deg,var(--v12-page),var(--v12-page-alt)) !important;
}
html[data-theme] body.is-product-route .product-service-ambient i { background:var(--v12-accent)!important;opacity:.2; }
html[data-theme] body.is-product-route .product-service-ambient b { background:var(--v12-accent-2)!important;opacity:.15; }
html[data-theme] body.is-product-route .product-service-ambient span {
    opacity:.34!important;
    background-image:linear-gradient(color-mix(in srgb,var(--v12-accent) 8%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--v12-accent) 8%,transparent) 1px,transparent 1px)!important;
}
html[data-theme] body.is-product-route .product-service-page-v123 nav { color:var(--v12-muted)!important; }
html[data-theme] body.is-product-route .product-service-page-v123 nav a:hover { color:var(--v12-accent-text)!important; }

.product-service-page-v123 .product-service-hero { align-items:stretch;gap:1.15rem;border:0!important;background:transparent!important;box-shadow:none!important; }
.product-service-page-v123 .product-service-artwork {
    isolation:isolate;
    border:1px solid color-mix(in srgb,var(--v12-accent) 55%,rgba(255,255,255,.12))!important;
    background:
        linear-gradient(150deg,rgba(255,255,255,.09),transparent 34%),
        radial-gradient(circle at 52% 44%,color-mix(in srgb,var(--v12-accent-3) 24%,transparent),transparent 32%),
        linear-gradient(145deg,color-mix(in srgb,var(--v12-deep-3) 77%,var(--v12-accent) 23%),var(--v12-deep))!important;
    box-shadow:0 36px 105px color-mix(in srgb,var(--v12-shadow) 78%,rgba(0,0,0,.38)),0 0 48px color-mix(in srgb,var(--v12-accent) 15%,transparent),inset 0 1px 0 rgba(255,255,255,.18)!important;
}
.product-service-page-v123 .product-service-artwork::before {
    content:'';position:absolute;z-index:12;inset:0;pointer-events:none;border-radius:inherit;
    background:linear-gradient(115deg,color-mix(in srgb,var(--v12-accent) 18%,transparent),transparent 38%),linear-gradient(to top,color-mix(in srgb,var(--v12-deep) 72%,transparent),transparent 58%);
    mix-blend-mode:screen;opacity:.75;
}
.product-service-page-v123 .product-service-artwork::after {
    content:'';position:absolute;z-index:30;inset:.65rem;pointer-events:none;border:1px solid color-mix(in srgb,var(--v12-accent-3) 18%,transparent);border-radius:1.35rem;
    clip-path:polygon(0 0,4.8rem 0,4.8rem 1px,calc(100% - 4.8rem) 1px,calc(100% - 4.8rem) 0,100% 0,100% 100%,calc(100% - 4.8rem) 100%,calc(100% - 4.8rem) calc(100% - 1px),4.8rem calc(100% - 1px),4.8rem 100%,0 100%);
}
.product-service-artwork__scan { position:absolute;z-index:15;inset-inline:0;top:-20%;height:30%;pointer-events:none;background:linear-gradient(to bottom,transparent,color-mix(in srgb,var(--v12-accent-3) 13%,transparent),transparent);animation:v123ProductScan 7s ease-in-out infinite; }
.product-service-page-v123 .product-service-artwork__grid { opacity:.22!important;background-image:linear-gradient(color-mix(in srgb,var(--v12-accent-3) 20%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--v12-accent-3) 20%,transparent) 1px,transparent 1px)!important; }
.product-service-page-v123 .product-service-artwork__orb { background:var(--v12-accent)!important;opacity:.28!important;box-shadow:0 0 80px var(--v12-accent-soft); }
.product-service-page-v123 .product-service-artwork__ring { border-color:color-mix(in srgb,var(--v12-accent-3) 35%,transparent)!important;box-shadow:0 0 24px color-mix(in srgb,var(--v12-accent) 8%,transparent); }
.product-service-page-v123 .product-service-artwork__ring--two { border-color:color-mix(in srgb,var(--v12-accent) 55%,transparent)!important; }
.product-service-artwork__nodes i { position:absolute;z-index:14;width:.55rem;height:.55rem;border:2px solid var(--v12-deep);border-radius:50%;background:var(--v12-accent-3);box-shadow:0 0 16px var(--v12-accent); }
.product-service-artwork__nodes i:nth-child(1){top:23%;left:17%}.product-service-artwork__nodes i:nth-child(2){right:13%;top:56%}.product-service-artwork__nodes i:nth-child(3){left:28%;bottom:16%}
.product-service-page-v123 .product-service-artwork__value strong { color:#fff!important;text-shadow:0 18px 60px rgba(0,0,0,.38),0 0 38px var(--v12-accent-soft)!important; }
.product-service-page-v123 .product-service-artwork__value small { color:color-mix(in srgb,var(--v12-accent-3) 72%,#fff)!important; }
.product-service-page-v123 .product-service-artwork__category,
.product-service-page-v123 .product-service-artwork__badge,
.product-service-page-v123 .product-service-artwork__instant { border-color:rgba(255,255,255,.18)!important;color:#fff!important;background:rgba(4,7,6,.45)!important;box-shadow:0 9px 26px rgba(0,0,0,.18); }
.product-service-page-v123 .product-service-artwork__instant b { background:var(--v12-accent-3)!important;box-shadow:0 0 12px var(--v12-accent)!important; }

.product-service-page-v123 .product-service-copy {
    position:relative;overflow:hidden;border:1px solid var(--v12-line)!important;border-radius:1.8rem;padding:clamp(1.15rem,2.4vw,2rem)!important;
    color:var(--v12-text)!important;background:linear-gradient(150deg,var(--v12-panel-strong),color-mix(in srgb,var(--v12-panel) 86%,var(--v12-accent) 14%))!important;
    box-shadow:0 25px 75px var(--v12-shadow),inset 0 1px 0 color-mix(in srgb,#fff 62%,transparent)!important;
}
.product-service-page-v123 .product-service-copy::before { content:'';position:absolute;inset-inline-end:-5rem;top:-5rem;width:12rem;height:12rem;border-radius:50%;background:var(--v12-accent);opacity:.09;filter:blur(28px); }
.product-service-kicker { position:relative;display:flex;align-items:center;gap:.55rem;margin-bottom:1rem;color:var(--v12-muted);font-size:.5rem;font-weight:950;letter-spacing:.12em;direction:ltr; }
.product-service-kicker span { color:var(--v12-accent-text); }.product-service-kicker i{width:2.5rem;height:1px;background:linear-gradient(90deg,var(--v12-accent),transparent)}.product-service-kicker b{margin-left:auto;border:1px solid var(--v12-line-strong);border-radius:999px;padding:.35rem .55rem;color:var(--v12-accent-text)!important;background:var(--v12-accent-soft);letter-spacing:0;direction:rtl}
.product-service-page-v123 .product-service-pill { color:var(--v12-muted)!important;border-color:var(--v12-line)!important;background:var(--v12-panel-soft)!important; }
.product-service-page-v123 .product-service-pill i { background:var(--v12-accent)!important;box-shadow:0 0 10px var(--v12-accent)!important; }
.product-service-page-v123 .product-service-copy h1 { margin-top:1.4rem!important;color:var(--v12-text)!important;font-size:clamp(2rem,4vw,3.65rem)!important;line-height:1.3!important;letter-spacing:-.045em!important;text-wrap:balance; }
.product-service-page-v123 .product-service-copy>p { color:var(--v12-muted)!important;font-size:.76rem!important;font-weight:650!important;line-height:2.15!important; }
.product-service-promises { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-top:1.3rem; }
.product-service-promises span { display:flex;min-width:0;align-items:center;gap:.45rem;border:1px solid var(--v12-line);border-radius:.8rem;padding:.55rem;background:var(--v12-panel-soft); }
.product-service-promises i { display:grid;width:1.65rem;height:1.65rem;flex:0 0 auto;place-items:center;border-radius:.5rem;color:var(--v12-action-text);background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent));font-size:.46rem;font-style:normal;font-weight:1000; }
.product-service-promises b { overflow:hidden;color:var(--v12-text)!important;font-size:.54rem;font-weight:900;white-space:nowrap;text-overflow:ellipsis; }
.product-service-page-v123 .product-service-metrics { border-color:var(--v12-line)!important;background:var(--v12-panel-soft)!important; }
.product-service-page-v123 .product-service-metrics span+span::before { background:var(--v12-line)!important; }
.product-service-page-v123 .product-service-metrics b { color:var(--v12-text)!important; }.product-service-page-v123 .product-service-metrics small{color:var(--v12-muted)!important}
.product-service-page-v123 .product-service-price { border-color:var(--v12-line)!important; }.product-service-page-v123 .product-service-price>div>small{color:var(--v12-muted)!important}.product-service-page-v123 .product-service-price>span{border-color:var(--v12-line-strong)!important;background:var(--v12-accent-soft)!important}.product-service-page-v123 .product-service-price>span b{color:var(--v12-accent-text)!important}
.product-service-primary-action { display:flex;min-height:3.35rem;align-items:center;justify-content:space-between;margin-top:1rem;border:1px solid color-mix(in srgb,var(--v12-accent-3) 40%,transparent);border-radius:1rem;padding:.75rem 1rem;color:var(--v12-action-text)!important;background:linear-gradient(118deg,var(--v12-accent-2),var(--v12-accent),var(--v12-accent-3));box-shadow:0 14px 35px var(--v12-accent-soft);font-size:.7rem;font-weight:1000;transition:.22s ease}.product-service-primary-action i{display:grid;width:2rem;height:2rem;place-items:center;border-radius:.65rem;background:rgba(255,255,255,.16);font-size:1rem;font-style:normal}.product-service-primary-action:hover{transform:translateY(-3px);box-shadow:0 20px 48px color-mix(in srgb,var(--v12-accent) 32%,transparent)}

.product-service-page-v123 .product-order-card { border:1px solid var(--v12-line-strong)!important;color:var(--v12-text)!important;background:linear-gradient(150deg,var(--v12-panel-strong),var(--v12-panel))!important;box-shadow:0 28px 90px var(--v12-shadow),0 0 0 1px var(--v12-accent-soft)!important; }
.product-service-page-v123 .product-order-card::before { height:2px;background:linear-gradient(90deg,transparent,var(--v12-accent),var(--v12-accent-3),transparent)!important;box-shadow:0 0 16px var(--v12-accent); }
.product-service-page-v123 .product-order-card__heading>span { color:var(--v12-action-text)!important;border-color:transparent!important;background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent))!important;box-shadow:0 10px 26px var(--v12-accent-soft); }
.product-service-page-v123 .product-order-card__heading p { color:var(--v12-accent-text)!important; }.product-service-page-v123 .product-order-card__heading h2{color:var(--v12-text)!important}
.product-service-page-v123 .product-order-label { color:var(--v12-text)!important; }.product-service-page-v123 .product-order-label i{color:var(--v12-accent-text)!important}
.product-service-page-v123 .product-variant-picker,.product-service-page-v123 .free-fire-uid-box { border-color:var(--v12-line)!important;background:var(--v12-panel-soft)!important; }
.product-service-page-v123 .product-variant-option { border-color:var(--v12-line)!important;background:var(--v12-panel-strong)!important; }.product-service-page-v123 .product-variant-option b{color:var(--v12-text)!important}.product-service-page-v123 .product-variant-option small{color:var(--v12-muted)!important}.product-service-page-v123 .product-variant-option strong{color:var(--v12-accent-text)!important}.product-service-page-v123 .product-variant-option.is-active{border-color:var(--v12-accent)!important;background:linear-gradient(145deg,var(--v12-accent-soft),var(--v12-panel-strong))!important;box-shadow:0 0 0 3px var(--v12-accent-soft)!important}
.product-service-page-v123 .product-order-confirm { min-height:4rem;border:1px solid var(--v12-line)!important;border-radius:1rem!important;padding:.72rem .78rem!important;background:var(--v12-panel-soft)!important;transition:.2s ease; }
.product-service-page-v123 .product-order-confirm:hover { border-color:var(--v12-line-strong)!important;transform:translateY(-1px); }
.product-service-page-v123 .product-order-confirm b { color:var(--v12-text)!important;font-size:.67rem!important; }.product-service-page-v123 .product-order-confirm small{color:var(--v12-muted)!important;font-size:.54rem!important}
.product-service-page-v123 .product-order-confirm>i { display:grid!important;width:1.65rem!important;height:1.65rem!important;place-items:center;border:2px solid color-mix(in srgb,var(--v12-muted) 45%,transparent)!important;border-radius:.52rem!important;background:var(--v12-panel-strong)!important;box-shadow:inset 0 1px 2px var(--v12-shadow)!important; }
.product-service-page-v123 .product-order-confirm input:checked~i { border-color:var(--v12-accent)!important;background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent))!important;box-shadow:0 0 0 4px var(--v12-accent-soft),0 8px 20px var(--v12-accent-soft)!important;transform:scale(1.04); }
.product-service-page-v123 .product-order-confirm input:checked~i::after { color:var(--v12-action-text)!important;font-size:.84rem!important; }.product-service-page-v123 .product-order-confirm:has(input:checked){border-color:var(--v12-accent)!important;background:linear-gradient(145deg,var(--v12-accent-soft),var(--v12-panel-strong))!important;box-shadow:0 0 0 3px var(--v12-accent-soft)!important}
.product-service-page-v123 .product-order-security { border-color:var(--v12-line)!important;color:var(--v12-muted)!important; }
.product-service-page-v123 .product-info-panel,.product-service-page-v123 .product-support-panel { color:var(--v12-text)!important;border-color:var(--v12-line)!important;background:linear-gradient(150deg,var(--v12-panel-strong),var(--v12-panel))!important;box-shadow:0 20px 60px var(--v12-shadow)!important; }
.product-service-page-v123 :is(.product-info-panel,.product-support-panel) :is(h2,h3,b,strong){color:var(--v12-text)!important}.product-service-page-v123 :is(.product-info-panel,.product-support-panel) :is(p,small,li){color:var(--v12-muted)!important}
.product-service-page-v123 .product-purchase-steps>div>span { color:var(--v12-action-text)!important;background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent))!important;box-shadow:0 9px 23px var(--v12-accent-soft); }
.product-service-page-v123 .product-feature-item { color:var(--v12-text)!important;border-color:var(--v12-line)!important;background:var(--v12-panel-soft)!important; }.product-service-page-v123 .product-feature-item i{color:var(--v12-action-text)!important;background:var(--v12-accent)!important}
.product-service-page-v123 .product-package-chip { --package-accent:var(--v12-accent)!important;color:var(--v12-text)!important;border-color:var(--v12-line)!important;background:var(--v12-panel-strong)!important;box-shadow:0 12px 35px var(--v12-shadow)!important}.product-service-page-v123 .product-package-chip.is-active{border-color:var(--v12-accent)!important;background:var(--v12-accent-soft)!important;box-shadow:0 0 0 3px var(--v12-accent-soft),0 14px 38px var(--v12-shadow)!important}
.product-service-page-v123 .product-mobile-buybar { border-color:var(--v12-line-strong)!important;background:color-mix(in srgb,var(--v12-panel-strong) 94%,transparent)!important;box-shadow:0 -15px 50px var(--v12-shadow)!important;backdrop-filter:blur(22px); }.product-service-page-v123 .product-mobile-buybar small{color:var(--v12-muted)!important}.product-service-page-v123 .product-mobile-buybar b{color:var(--v12-text)!important}.product-service-page-v123 .product-mobile-buybar>a{color:var(--v12-action-text)!important;background:linear-gradient(120deg,var(--v12-accent-2),var(--v12-accent))!important}

/* --------------------------------------------------------------------------
   Shared checkbox: larger state affordance, theme-driven colors and motion.
   -------------------------------------------------------------------------- */
html[data-theme] body.ampol-app .ampol-check-option {
    position:relative!important;isolation:isolate;min-height:4.35rem!important;overflow:hidden;border:1px solid var(--v12-line)!important;border-radius:1.15rem!important;padding:.78rem .82rem!important;color:var(--v12-text)!important;background:linear-gradient(145deg,var(--v12-panel-strong),var(--v12-panel-soft))!important;box-shadow:0 10px 30px color-mix(in srgb,var(--v12-shadow) 62%,transparent),inset 0 1px 0 color-mix(in srgb,#fff 58%,transparent)!important;transition:.22s var(--v12-ease)!important;
}
html[data-theme] body.ampol-app .ampol-check-option::before { content:'';position:absolute;z-index:-1;inset:auto -2rem -3rem auto;width:7rem;height:7rem;border-radius:50%;background:var(--v12-accent);opacity:0;filter:blur(28px);transition:.22s ease; }
html[data-theme] body.ampol-app .ampol-check-option:hover { border-color:var(--v12-line-strong)!important;transform:translateY(-2px)!important;box-shadow:0 15px 38px var(--v12-shadow)!important; }
html[data-theme] body.ampol-app .ampol-check-option:focus-within { outline:3px solid var(--v12-accent-soft)!important;outline-offset:3px!important; }
html[data-theme] body.ampol-app .ampol-check-box { width:1.82rem!important;height:1.82rem!important;border:2px solid color-mix(in srgb,var(--v12-muted) 52%,transparent)!important;border-radius:.58rem!important;color:transparent!important;background:var(--v12-panel-strong)!important;box-shadow:inset 0 1px 2px var(--v12-shadow),0 5px 15px color-mix(in srgb,var(--v12-shadow) 50%,transparent)!important; }
html[data-theme] body.ampol-app .ampol-check-box svg { width:1.15rem!important;height:1.15rem!important; }
html[data-theme] body.ampol-app .ampol-check-copy b { color:var(--v12-text)!important;font-size:.76rem!important;font-weight:1000!important; }
html[data-theme] body.ampol-app .ampol-check-copy small { margin-top:.23rem!important;color:var(--v12-muted)!important;font-size:.57rem!important;line-height:1.7!important; }
html[data-theme] body.ampol-app .ampol-check-state { display:inline-flex!important;min-width:4rem!important;justify-content:center!important;border:1px solid var(--v12-line)!important;border-radius:999px!important;padding:.34rem .58rem!important;color:var(--v12-muted)!important;background:var(--v12-panel-strong)!important;font-size:.52rem!important; }
html[data-theme] body.ampol-app .ampol-check-input:checked~.ampol-check-box { border-color:var(--v12-accent)!important;color:var(--v12-action-text)!important;background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent),var(--v12-accent-3))!important;box-shadow:0 0 0 5px var(--v12-accent-soft),0 10px 25px color-mix(in srgb,var(--v12-accent) 26%,transparent)!important;transform:rotate(-3deg) scale(1.05)!important; }
html[data-theme] body.ampol-app .ampol-check-input:checked~.ampol-check-state { border-color:var(--v12-line-strong)!important;color:var(--v12-accent-text)!important;background:var(--v12-accent-soft)!important; }
html[data-theme] body.ampol-app .ampol-check-option:has(.ampol-check-input:checked) { border-color:var(--v12-accent)!important;background:linear-gradient(145deg,var(--v12-accent-soft),var(--v12-panel-strong))!important;box-shadow:0 0 0 3px var(--v12-accent-soft),0 16px 38px var(--v12-shadow)!important; }
html[data-theme] body.ampol-app .ampol-check-option:has(.ampol-check-input:checked)::before { opacity:.16; }

/* --------------------------------------------------------------------------
   Category control center.
   -------------------------------------------------------------------------- */
.category-control-hero { position:relative;display:grid;grid-template-columns:3.6rem minmax(0,1fr) auto;align-items:center;gap:1rem;overflow:hidden;margin-bottom:1.25rem;border:1px solid var(--v12-line-strong);border-radius:1.5rem;padding:1rem;color:var(--v12-text);background:linear-gradient(135deg,var(--v12-panel-strong),color-mix(in srgb,var(--v12-panel) 82%,var(--v12-accent) 18%));box-shadow:0 20px 60px var(--v12-shadow),inset 0 1px 0 color-mix(in srgb,#fff 60%,transparent); }
.category-control-hero::after { content:'';position:absolute;inset-inline-end:-5rem;top:-7rem;width:15rem;height:15rem;border-radius:50%;background:var(--v12-accent);opacity:.11;filter:blur(34px); }
.category-control-hero__icon { display:grid;width:3.6rem;height:3.6rem;place-items:center;border:1px solid color-mix(in srgb,var(--v12-accent-3) 45%,transparent);border-radius:1.05rem;color:var(--v12-action-text);background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent),var(--v12-accent-3));box-shadow:0 14px 34px var(--v12-accent-soft);font-size:.75rem;font-weight:1000;letter-spacing:.08em; }
.category-control-hero p { color:var(--v12-accent-text)!important;font-size:.57rem;font-weight:1000; }.category-control-hero h2{margin-top:.2rem;color:var(--v12-text)!important;font-size:1.05rem;font-weight:1000}.category-control-hero>div>small{display:block;margin-top:.28rem;color:var(--v12-muted)!important;font-size:.59rem;line-height:1.8}
.category-control-hero__stats { position:relative;z-index:2;display:flex;gap:.45rem; }.category-control-hero__stats span{min-width:5.3rem;border:1px solid var(--v12-line);border-radius:.9rem;padding:.55rem;text-align:center;background:var(--v12-panel-strong)}.category-control-hero__stats b{display:block;color:var(--v12-text)!important;font-size:1rem}.category-control-hero__stats small{display:block;margin-top:.15rem;color:var(--v12-muted)!important;font-size:.47rem}
.category-admin-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem; }
.category-admin-card { position:relative;overflow:hidden;border:1px solid var(--v12-line);border-radius:1.35rem;color:var(--v12-text);background:var(--v12-panel-strong);box-shadow:0 16px 45px var(--v12-shadow);transition:.24s var(--v12-ease); }.category-admin-card:hover{border-color:var(--v12-line-strong);transform:translateY(-3px);box-shadow:0 24px 60px var(--v12-shadow)}.category-admin-card.is-hidden{filter:saturate(.72)}
.category-admin-card__visual { position:relative;display:grid;min-height:8.5rem;place-items:center;overflow:hidden;background:linear-gradient(145deg,color-mix(in srgb,var(--v12-deep-3) 75%,var(--v12-accent) 25%),var(--v12-deep)); }.category-admin-card__visual::before{content:'';position:absolute;inset:0;opacity:.2;background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px);background-size:26px 26px}.category-admin-card__visual::after{content:'';position:absolute;width:10rem;height:10rem;border-radius:50%;background:var(--v12-accent);opacity:.2;filter:blur(38px)}.category-admin-card__visual>img{position:absolute;z-index:2;inset:0;width:100%;height:100%;object-fit:cover}.category-admin-card__visual>span{position:relative;z-index:3;display:grid;width:4.5rem;height:4.5rem;place-items:center;border:1px solid rgba(255,255,255,.2);border-radius:1.35rem;color:#fff;background:rgba(255,255,255,.1);box-shadow:0 18px 45px rgba(0,0,0,.25);backdrop-filter:blur(10px);font-size:1.35rem;font-weight:1000}
.category-admin-card__badges { position:absolute;z-index:6;inset: .65rem .65rem auto;display:flex;justify-content:space-between;gap:.4rem }.category-admin-card__badges i{border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:.33rem .52rem;color:#fff;background:rgba(4,7,6,.58);font-size:.47rem;font-style:normal;font-weight:950;backdrop-filter:blur(12px)}.category-admin-card.is-hidden .category-admin-card__badges i:last-child{background:rgba(159,18,57,.82)}
.category-admin-card__body { padding:.85rem; }.category-admin-card__title{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.category-admin-card__title>div{min-width:0}.category-admin-card__title b{display:block;overflow:hidden;color:var(--v12-text)!important;font-size:.82rem;font-weight:1000;white-space:nowrap;text-overflow:ellipsis}.category-admin-card__title small{display:block;overflow:hidden;margin-top:.15rem;color:var(--v12-muted)!important;font-size:.5rem;white-space:nowrap;text-overflow:ellipsis}.category-admin-card__title>span{display:grid;width:2.2rem;height:2.2rem;flex:0 0 auto;place-items:center;border:1px solid var(--v12-line);border-radius:.7rem;color:var(--v12-accent-text);background:var(--v12-accent-soft);font-size:.58rem;font-weight:1000}
.category-admin-card__metric{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;margin-top:.75rem}.category-admin-card__metric span{border:1px solid var(--v12-line);border-radius:.8rem;padding:.55rem;background:var(--v12-panel-soft)}.category-admin-card__metric b,.category-admin-card__metric small{display:block}.category-admin-card__metric b{color:var(--v12-text)!important;font-size:.68rem}.category-admin-card__metric small{margin-top:.12rem;color:var(--v12-muted)!important;font-size:.46rem}
.category-visibility-action { margin-top:.65rem }.category-visibility-action button{display:flex;width:100%;min-height:3rem;align-items:center;gap:.55rem;border:1px solid var(--v12-line-strong);border-radius:.85rem;padding:.5rem .6rem;color:var(--v12-accent-text);background:var(--v12-accent-soft);transition:.2s ease}.category-visibility-action button:hover{border-color:var(--v12-accent);transform:translateY(-1px);box-shadow:0 10px 28px var(--v12-accent-soft)}.category-visibility-action span{display:grid;width:1.85rem;height:1.85rem;place-items:center;border-radius:.58rem;color:var(--v12-action-text);background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent));font-size:.75rem}.category-visibility-action b{color:inherit!important;font-size:.59rem;font-weight:1000}.category-admin-card.is-visible .category-visibility-action button{color:#be123c;border-color:rgba(244,63,94,.28);background:rgba(244,63,94,.08)}.category-admin-card.is-visible .category-visibility-action span{background:linear-gradient(145deg,#be123c,#f43f5e)}
.category-admin-card__actions { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.45rem;margin-top:.55rem }.category-admin-card__actions :is(.btn-secondary,.btn-danger){min-height:2.65rem!important;border-radius:.8rem!important;padding:.55rem .75rem!important;font-size:.56rem!important}.category-admin-card__actions form,.category-admin-card__actions form button{height:100%}
.category-form-card__head { display:flex;align-items:center;gap:.8rem;margin-bottom:1.25rem;border-bottom:1px solid var(--v12-line);padding-bottom:1rem }.category-form-card__head>span{display:grid;width:3rem;height:3rem;place-items:center;border-radius:.9rem;color:var(--v12-action-text);background:linear-gradient(145deg,var(--v12-accent-2),var(--v12-accent));font-size:.65rem;font-weight:1000}.category-form-card__head b,.category-form-card__head small{display:block}.category-form-card__head b{color:var(--v12-text)!important;font-size:.85rem}.category-form-card__head small{margin-top:.2rem;color:var(--v12-muted)!important;font-size:.56rem;line-height:1.7}.category-visibility-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.category-form-alert{border:1px solid rgba(244,63,94,.3);border-radius:1rem;padding:1rem;color:#be123c;background:rgba(244,63,94,.08);font-size:.7rem;font-weight:800}

@keyframes v123ProductScan { 0%,12%{transform:translateY(-130%);opacity:0}35%,68%{opacity:1}88%,100%{transform:translateY(510%);opacity:0} }

@media (min-width:1280px) {
    .product-service-page-v123 .product-service-hero { grid-template-columns:minmax(0,1.05fr) minmax(0,.82fr) 24rem!important; }
    .product-service-page-v123 .product-service-artwork { min-height:38rem!important; }
}
@media (max-width:900px) {
    .category-admin-grid{grid-template-columns:minmax(0,1fr)}
    .category-control-hero{grid-template-columns:3.2rem minmax(0,1fr)}.category-control-hero__stats{grid-column:1/-1}.category-control-hero__stats span{flex:1}
}
@media (max-width:767px) {
    .product-service-page-v123 .product-service-hero { gap:.75rem!important; }
    .product-service-page-v123 .product-service-artwork { min-height:20rem!important;border-radius:1.25rem!important; }
    .product-service-page-v123 .product-service-copy,.product-service-page-v123 .product-order-card { border-radius:1.2rem!important; }
    .product-service-page-v123 .product-service-copy { padding:1rem!important; }
    .product-service-page-v123 .product-service-copy h1 { margin-top:1rem!important;font-size:2rem!important; }
    .product-service-page-v123 .product-service-copy>p { font-size:.68rem!important;line-height:2!important; }
    .product-service-promises{gap:.35rem}.product-service-promises span{padding:.42rem}.product-service-promises i{width:1.45rem;height:1.45rem}.product-service-promises b{font-size:.48rem}
    .product-service-primary-action{display:none}
    html[data-theme] body.ampol-app .ampol-check-option{min-height:3.75rem!important;padding:.65rem!important}.ampol-check-state{min-width:3.35rem!important;font-size:.46rem!important}.ampol-check-box{width:1.55rem!important;height:1.55rem!important}
    .category-control-hero{border-radius:1.15rem;padding:.75rem}.category-control-hero__icon{width:3.2rem;height:3.2rem}.category-control-hero h2{font-size:.85rem}.category-control-hero>div>small{font-size:.52rem}.category-admin-card{border-radius:1.05rem}.category-admin-card__visual{min-height:7rem}.category-visibility-grid{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce) {
    .product-service-artwork__scan,.product-service-artwork__ring,.product-service-artwork__nodes i{animation:none!important}.category-admin-card,.product-service-primary-action,.ampol-check-option{transition:none!important}
}