/* Reen Coders Premium UI layer — accessible, responsive, no layout framework required. */
:root{--panel:var(--surface);--premium-radius:22px;--premium-ease:cubic-bezier(.2,.75,.25,1)}
html{scroll-padding-top:92px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{background:radial-gradient(ellipse at 9% -6%,color-mix(in srgb,var(--primary) 6%,transparent),transparent 37%),var(--bg);font-feature-settings:"ss01" on,"cv11" on;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
::selection{background:color-mix(in srgb,var(--primary) 25%,transparent);color:var(--text)}
:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 68%,white);outline-offset:3px}
img{height:auto}
.shell{width:min(var(--max),calc(100% - 48px))}
.topline{background:linear-gradient(100deg,#17152d,#241b47 52%,#16313d);letter-spacing:.005em}
.nav-wrap{background:color-mix(in srgb,var(--bg) 84%,transparent);border-bottom-color:color-mix(in srgb,var(--line) 80%,transparent);box-shadow:0 8px 30px rgba(7,8,20,.035)}
.nav{gap:clamp(14px,2vw,28px)}
.brand{gap:12px}.brand-mark{width:42px;height:42px;border-radius:15px;box-shadow:0 8px 24px color-mix(in srgb,var(--primary) 27%,transparent)}
.brand-name{font-size:1.12rem}.brand-tag{font-size:.67rem;letter-spacing:.015em}
.nav-links{gap:clamp(13px,1.6vw,23px);margin-left:clamp(8px,1.5vw,20px)}
.nav-links a{position:relative;padding:8px 0;transition:color .18s ease}
.nav-links a:after{content:"";position:absolute;left:0;right:0;bottom:1px;height:2px;border-radius:3px;background:var(--primary);transform:scaleX(0);transform-origin:left;transition:transform .18s ease}
.nav-links a:hover:after,.nav-links a.active:after{transform:scaleX(1)}
.theme-btn,.cart-btn,.menu-btn{transition:transform .18s var(--premium-ease),border-color .18s ease,background .18s ease}
.theme-btn:hover,.cart-btn:hover,.menu-btn:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--primary) 45%,var(--line));background:var(--surface2)}
.account-menu-trigger{transition:background .18s ease,border-color .18s ease}.account-menu-trigger:hover{border-color:color-mix(in srgb,var(--primary) 42%,var(--line));background:var(--surface2)}
.hero{padding-top:clamp(58px,7vw,94px);padding-bottom:clamp(45px,6vw,76px)}
.hero:before{width:min(760px,65vw);height:min(650px,58vw);top:-18%;right:-12%;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--primary) 20%,transparent),color-mix(in srgb,var(--cyan) 8%,transparent) 43%,transparent 72%)}
.hero-grid{gap:clamp(32px,5vw,72px)}
.hero-copy .eyebrow{padding:8px 12px;border:1px solid color-mix(in srgb,var(--primary) 19%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--surface) 80%,transparent);letter-spacing:.105em;font-size:.7rem}
.hero-copy .eyebrow:before{width:7px;height:7px;border-radius:50%;box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 12%,transparent)}
.hero .h1{max-width:740px;font-size:clamp(2.65rem,5.9vw,5.25rem);letter-spacing:-.067em;line-height:.99;margin:22px 0 22px;text-wrap:balance}
.hero-copy .lead{max-width:590px;line-height:1.75;font-size:clamp(1rem,1.45vw,1.18rem)}
.hero-search{border-radius:17px;padding:6px;box-shadow:0 12px 34px rgba(12,11,36,.07);transition:border-color .18s ease,box-shadow .18s ease}
.hero-search:focus-within{border-color:color-mix(in srgb,var(--primary) 58%,var(--line));box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 11%,transparent),0 14px 36px rgba(12,11,36,.08)}
.hero-search input{font-size:.94rem}
.btn{min-height:43px;border-radius:13px;font-weight:750;letter-spacing:-.01em;transition:transform .18s var(--premium-ease),box-shadow .18s ease,border-color .18s ease,background .18s ease}
.btn:active{transform:translateY(0) scale(.985)}
.btn-primary{background:linear-gradient(130deg,var(--primary),color-mix(in srgb,var(--primary) 58%,#b252f3));box-shadow:0 8px 24px color-mix(in srgb,var(--primary) 22%,transparent)}
.btn-primary:hover{box-shadow:0 13px 31px color-mix(in srgb,var(--primary) 28%,transparent)}
.hero-actions .btn{min-height:49px;padding-inline:20px}
.hero-points{gap:10px 17px}.hero-points span{padding:6px 0}
.hero-art{perspective:1200px}.hero .mock-window{transform:rotate(-1.2deg) translateY(0);border-color:rgba(255,255,255,.2);box-shadow:0 36px 100px rgba(31,25,90,.3),0 4px 18px rgba(0,0,0,.12);transition:transform .45s var(--premium-ease),box-shadow .45s ease}
.hero .mock-window:hover{transform:rotate(0) translateY(-5px);box-shadow:0 45px 115px rgba(31,25,90,.34)}
.float-card{border-radius:17px;padding:14px 16px;backdrop-filter:blur(12px);box-shadow:0 18px 48px rgba(10,9,40,.12)}
.trust-row{border-radius:18px;padding:18px 23px;background:color-mix(in srgb,var(--surface) 76%,transparent);box-shadow:0 10px 32px rgba(10,10,30,.025)}
.section{padding-block:clamp(62px,7vw,90px)}.section-sm{padding-block:clamp(40px,5vw,58px)}
.section-head{gap:22px;margin-bottom:clamp(20px,3vw,32px)}.section-head .h2{max-width:750px;text-wrap:balance}
.arrivals-section-head .h2,.catalog-section-head .h2,.trending-section .h2{text-wrap:balance}
.grid-3,.grid-4{align-items:stretch}.grid-4{gap:clamp(12px,1.5vw,18px)}
.product-card,.category-card,.benefit-card,.panel,.cart-summary,.cart-layout>.panel,.auth-card,.faq-item,.step,.legal-content-card{border-radius:var(--premium-radius);box-shadow:0 10px 32px rgba(11,10,40,.035);transition:border-color .2s ease,box-shadow .25s ease,transform .25s var(--premium-ease)}
.product-card{height:100%;display:flex;flex-direction:column;border-color:color-mix(in srgb,var(--line) 88%,transparent);box-shadow:0 8px 28px rgba(12,10,40,.045)}
.product-card:hover{transform:translateY(-5px);box-shadow:0 20px 52px rgba(12,10,40,.11);border-color:color-mix(in srgb,var(--primary) 38%,var(--line))}
.product-body{display:flex;flex:1;flex-direction:column;gap:0}.product-body h3{font-size:1.08rem;line-height:1.28;text-wrap:pretty}.product-body p{line-height:1.62}.product-foot{margin-top:auto;padding-top:16px;gap:12px}.product-price{font-variant-numeric:tabular-nums;letter-spacing:-.035em}.product-art{background:radial-gradient(circle at 15% 12%,color-mix(in srgb,var(--primary) 18%,transparent),transparent 40%),radial-gradient(circle at 85% 80%,color-mix(in srgb,var(--cyan) 14%,transparent),transparent 40%),var(--surface2)}
.category-card{min-height:185px;padding:23px}.category-card:hover,.benefit-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--primary) 36%,var(--line));box-shadow:var(--shadow)}
.category-art{border-radius:15px}.benefit-card{border:1px solid var(--line);background:var(--surface);padding:25px}
.promo-band{padding:clamp(28px,5vw,54px);box-shadow:0 28px 80px rgba(47,34,115,.22)}
.faq-item{border-radius:16px;padding:17px 19px;background:var(--surface)}.faq-item summary{line-height:1.5}
.field,.newsletter input,.hero-search input{min-height:45px;border-radius:12px}
.field{border-color:var(--line);background:var(--surface);transition:border-color .18s ease,box-shadow .18s ease}
.field:focus{border-color:color-mix(in srgb,var(--primary) 60%,var(--line));box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 10%,transparent);outline:none}
.alert{border-radius:14px;padding:13px 16px;line-height:1.55;overflow-wrap:anywhere}
.table-wrap{border:1px solid var(--line);border-radius:17px;max-width:100%;box-shadow:0 6px 22px rgba(10,10,35,.035)}
table{border-collapse:separate;border-spacing:0}th{font-size:.72rem;letter-spacing:.065em;text-transform:uppercase;color:var(--muted);background:var(--surface2)}td,th{border-bottom:1px solid var(--line)}tr:last-child td{border-bottom:0}
.status-chip{white-space:nowrap}.gateway-test-form{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}.gateway-test-form .field-help{margin:0}
.admin-topbar{backdrop-filter:blur(16px);box-shadow:0 8px 26px rgba(10,10,30,.04)}.admin-main{min-width:0}.admin-side,.admin-main>.panel{box-shadow:0 9px 30px rgba(10,10,30,.035)}.admin-side a{border-radius:12px;transition:background .18s ease,color .18s ease}.admin-side a:hover{background:color-mix(in srgb,var(--primary) 8%,var(--surface));color:var(--text)}
.admin-live-summary-card{border-radius:17px;transition:transform .2s var(--premium-ease),border-color .2s ease,box-shadow .2s ease}.admin-live-summary-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--primary) 35%,var(--line));box-shadow:var(--shadow)}
.footer{background:linear-gradient(180deg,#0b0c18,#080913);color:#f2f1ff}.footer a{transition:color .18s ease}.footer a:hover{color:#b6aaff}.footer-grid{gap:clamp(22px,4vw,55px)}
.cart-summary{border:1px solid var(--line);box-shadow:0 12px 35px rgba(10,10,30,.05)}.checkout-layout .panel,.checkout-layout .cart-summary{border:1px solid var(--line)}.gateway-pay-button{min-height:49px;box-shadow:0 6px 18px rgba(12,10,40,.045)}.gateway-pay-button:disabled{opacity:.7;cursor:wait;transform:none}
.auth-wrap{padding-block:clamp(30px,6vw,72px)}.auth-card{overflow:hidden;border:1px solid var(--line);box-shadow:0 28px 90px rgba(8,8,25,.09)}.auth-form{min-width:0}.auth-aside{background:radial-gradient(ellipse at 20% 20%,color-mix(in srgb,var(--primary) 35%,transparent),transparent 50%),linear-gradient(145deg,#18152f,#222c4b)}
.account-hero,.customer-dashboard,.customer-side,.account-panel{min-width:0}.download-card{border-radius:17px}.download-card-main{overflow-wrap:anywhere}
.legal-hero{box-shadow:0 26px 70px rgba(24,18,75,.18)}.legal-content-card{box-shadow:0 12px 40px rgba(12,10,40,.05)}
/* Prevent accidental horizontal overflow from provider errors, long order IDs or admin forms. */
main,section,article,aside,.panel,.shell,.admin-shell,.admin-main,.admin-content,.form-row,.form-grid,.checkout-layout>*{min-width:0}
pre,code,.muted,.field-help,td,th,p,h1,h2,h3{overflow-wrap:anywhere}
@media(max-width:1100px){.nav-links{gap:13px;margin-left:4px;font-size:.81rem}.hero-grid{gap:30px}.grid-4{grid-template-columns:repeat(3,minmax(0,1fr))}.hero .h1{font-size:clamp(2.6rem,5.2vw,4.7rem)}}
@media(max-width:900px){.nav{gap:12px}.nav-links{gap:11px}.brand-tag{max-width:190px}.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,.9fr)}.float-card.left{left:-1%}.float-card.right{right:-1%}.admin-shell{gap:16px}}
@media(max-width:760px){
 .shell{width:min(var(--max),calc(100% - 30px))}.topline .shell{font-size:.71rem;padding:8px 0;line-height:1.35}
 .nav{height:66px;gap:9px}.brand{min-width:0;gap:9px}.brand-mark{width:37px;height:37px;border-radius:12px}.brand-name{font-size:1rem}.brand-tag{display:none}.nav-actions{gap:6px}.theme-btn,.cart-btn,.menu-btn{width:38px;height:38px;flex:0 0 38px}.nav-links{top:66px;left:10px;right:10px;width:auto;padding:10px;border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 50px rgba(4,5,20,.18)}.nav-links a{padding:13px 12px;border-radius:10px}.nav-links a:after{display:none}.nav-links a.active{background:color-mix(in srgb,var(--primary) 10%,var(--surface));color:var(--primary)}
 .hero{padding:42px 0 35px}.hero-grid{grid-template-columns:minmax(0,1fr);gap:23px}.hero .h1{font-size:clamp(2.45rem,10vw,4rem);line-height:1.02;margin:17px 0 17px;letter-spacing:-.066em}.hero-copy .lead{margin-bottom:18px;font-size:.98rem;line-height:1.7}.hero-copy .eyebrow{font-size:.64rem;letter-spacing:.07em;max-width:100%;white-space:normal}.hero-search{margin:19px 0 15px;width:100%}.hero-search input{font-size:.9rem}.hero-actions{display:grid;grid-template-columns:1fr;gap:9px}.hero-actions .btn{width:100%;min-height:47px}.hero-points{margin-top:17px;gap:7px 14px;font-size:.73rem}.hero-art{min-height:280px;height:auto;width:100%;max-width:570px;margin:0 auto}.hero .mock-window{width:100%;transform:none}.hero .mock-app{grid-template-columns:85px 1fr;min-height:220px}.mock-main{padding:13px}.mock-side{padding:13px 7px}.mock-title{font-size:1rem}.mock-kpi{padding:8px 6px}.float-card{font-size:.67rem;padding:10px 11px;border-radius:12px}.float-card.left{left:-3px;bottom:8px}.float-card.right{right:-3px;top:5px}.float-card strong{font-size:.76rem}
 .trust-row{display:grid;grid-template-columns:1fr 1fr;gap:13px;padding:15px;text-align:left}.trust-label{grid-column:1/-1;text-align:left}.trust-item{font-size:.72rem;align-items:flex-start}
 .section{padding-block:51px}.section-sm{padding-block:34px}.section-head{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:21px}.section-head .btn{margin-top:3px;width:100%}.section-head .h2{font-size:clamp(1.85rem,7.5vw,2.55rem)}.grid-3{grid-template-columns:1fr}.grid-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.product-card{border-radius:16px}.product-art{height:135px}.product-body{padding:12px}.product-body h3{font-size:.94rem}.product-body p{font-size:.79rem;line-height:1.5}.product-foot{padding-top:12px;gap:9px}.product-foot .btn,.card-actions .btn{font-size:.75rem;padding:9px 10px;min-height:39px}.product-price{font-size:1rem}.category-card,.benefit-card{padding:19px;border-radius:17px}.promo-band{padding:23px;border-radius:22px}.promo-band .btn{width:100%}.faq{gap:14px}.faq-item{padding:14px 15px}.footer-grid{grid-template-columns:1fr 1fr;gap:22px}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{gap:8px;text-align:center}.checkout-layout{grid-template-columns:minmax(0,1fr)!important;gap:14px}.checkout-layout>.cart-summary{order:-1}.checkout-layout>.panel,.checkout-layout>.cart-summary{padding:16px;border-radius:17px}.gateway-readiness-list{grid-template-columns:minmax(0,1fr)}.gateway-test-form .btn{width:100%}.gateway-test-form .field-help{width:100%}
 .admin-topbar-inner{gap:10px;padding-inline:14px}.admin-topbar-actions{gap:7px}.admin-live-pill{display:none}.admin-topbar-user>span:last-child{display:none}.admin-shell{grid-template-columns:minmax(0,1fr);padding-inline:15px}.admin-side{position:relative!important;top:auto!important;max-height:none!important;overflow:visible!important}.admin-nav{display:flex;overflow-x:auto;gap:7px;padding-bottom:5px;scrollbar-width:thin}.admin-nav>*{flex:0 0 auto}.admin-main{width:100%;overflow:hidden}.admin-main .panel{padding:16px;border-radius:17px}.admin-title{gap:10px}.admin-title h1{font-size:1.7rem}.admin-form .form-grid{grid-template-columns:minmax(0,1fr)}.admin-main .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}.admin-main table{min-width:690px}.stat-grid,.admin-live-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.stat{padding:14px}.admin-live-summary-card{padding:13px}
 .customer-dashboard{grid-template-columns:minmax(0,1fr)}.customer-side{position:static}.customer-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.account-hero-inner{align-items:flex-start;flex-direction:column}.account-section-head{align-items:flex-start;flex-direction:column}.account-panel{padding:14px}.download-card{align-items:flex-start;flex-wrap:wrap}.download-card-main{min-width:calc(100% - 70px)}.download-card>.btn{width:100%}.cart-layout{grid-template-columns:minmax(0,1fr)!important}.cart-row{grid-template-columns:56px minmax(0,1fr)}.cart-summary{position:static}.newsletter{width:100%;max-width:none}.newsletter input{width:100%;min-width:0}.newsletter .btn{width:100%}.auth-wrap{padding:25px 0}.auth-card{grid-template-columns:minmax(0,1fr);border-radius:19px}.auth-aside{display:none}.auth-form{padding:22px}.profile-form{padding:15px}.legal-hero{padding:22px;border-radius:21px}.legal-hero-symbol{display:none}.support-widget{right:10px;bottom:10px}.support-panel{max-height:calc(100dvh - 80px)}
}
@media(max-width:420px){.shell{width:calc(100% - 24px)}.brand-mark{width:34px;height:34px}.brand-name{font-size:.94rem}.nav-actions{gap:4px}.theme-btn,.cart-btn,.menu-btn{width:35px;height:35px;flex-basis:35px}.account-guest{padding:8px 10px;font-size:.77rem}.hero .h1{font-size:clamp(2.25rem,10vw,2.9rem)}.hero-art{min-height:235px}.mock-app{min-height:200px}.mock-side{display:none}.mock-app{grid-template-columns:1fr}.mock-kpis{gap:5px}.mock-kpi strong{font-size:.72rem}.grid-4,.catalog-product-grid{gap:8px}.product-art{height:112px}.product-body{padding:10px}.product-body h3{font-size:.88rem}.product-body p{font-size:.75rem}.product-foot{align-items:stretch;flex-direction:column}.card-actions{display:flex;width:100%;gap:6px}.card-actions .btn{flex:1;min-width:0}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}.trust-row{grid-template-columns:1fr}.trust-label{grid-column:auto}.admin-topbar-store{font-size:.75rem;padding:8px}.customer-nav{grid-template-columns:1fr 1fr}.gateway-pay-button{font-size:.9rem}.sum-row>strong{max-width:50%;text-align:right;overflow-wrap:anywhere}}
@media(hover:none){.product-card:hover,.category-card:hover,.benefit-card:hover{transform:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero .mock-window,.nav-links a:after,.btn,.product-card,.category-card,.benefit-card{transition:none!important}}
