:root{--premium-shadow:0 18px 50px rgba(23,35,59,.10);--premium-ring:0 0 0 4px rgba(40,121,232,.13)}
html,body{max-width:100%;overflow-x:hidden}
.ui-icon{width:1.35em;height:1.35em;display:inline-block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto;vertical-align:-.22em}
.icon-btn{width:44px;height:44px;border-radius:14px;align-items:center;justify-content:center;color:var(--ink)}
.topbar span{display:inline-flex;align-items:center;gap:7px;font-weight:700}.topbar .ui-icon{font-size:13px;color:var(--coral)}
.site-header{box-shadow:0 8px 26px rgba(23,35,59,.04)}
.header-actions a,.header-actions button{min-height:44px;padding:0 7px;border-radius:12px;transition:background .2s,color .2s}.header-actions a:hover,.header-actions button:hover{background:var(--blue-soft);color:var(--blue)}
.header-actions .ui-icon{font-size:18px}.search button{display:grid;place-items:center;border-radius:10px;color:var(--ink)}.search button:hover{background:var(--blue-soft);color:var(--blue)}
.categories-nav a{min-height:42px;padding:0 8px;border-radius:11px;transition:background .2s,color .2s}.categories-nav a:hover{background:var(--blue-soft);color:var(--blue)}.categories-nav .ui-icon{font-size:18px}
.hero{border:1px solid rgba(23,35,59,.05);box-shadow:var(--premium-shadow)}.hero-copy{display:flex;flex-direction:column;justify-content:center}.hero-art>img{width:100%;object-fit:cover;padding:0}.hero-art aside{border:1px solid rgba(255,255,255,.75);box-shadow:0 18px 45px rgba(23,35,59,.15)}.hero-art aside b{display:flex;align-items:center;gap:8px}.hero-art aside .ui-icon{color:var(--blue);font-size:18px}
.benefits{box-shadow:0 12px 34px rgba(23,35,59,.06)}.benefits div{min-width:0}.benefits span{box-shadow:inset 0 0 0 1px rgba(255,111,97,.12)}.benefits .ui-icon{font-size:18px;stroke-width:1.9}
.category-card{position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s}.category-card:after{content:"";position:absolute;inset:auto -22px -36px auto;width:88px;height:88px;border:1px solid currentColor;border-radius:50%;opacity:.08}.category-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(23,35,59,.09);border-color:rgba(40,121,232,.16)}.category-card>span{box-shadow:0 8px 20px rgba(23,35,59,.07)}.category-card .ui-icon{font-size:23px;stroke-width:1.8}.category-card>i{display:grid;place-items:center}.category-card>i .ui-icon{font-size:16px}
.product-card{box-shadow:0 6px 18px rgba(23,35,59,.035)}.product-card:hover{box-shadow:0 18px 42px rgba(23,35,59,.11)}.favorite{display:grid;place-items:center}.favorite .ui-icon{font-size:18px}.favorite.active .ui-icon{fill:currentColor}.product-img img{transition:transform .35s}.product-card:hover .product-img img{transform:scale(1.035)}
.cat-icon .ui-icon{font-size:23px}.filters a span{display:grid;place-items:center}.filters a .ui-icon{font-size:18px}.empty>span .ui-icon{font-size:38px}
.help-banner{border:1px solid #f3dec9;box-shadow:0 10px 26px rgba(238,154,75,.09)}.help-banner>span{width:50px;height:50px;border-radius:16px;background:#fff;display:grid;place-items:center;color:var(--orange);box-shadow:0 8px 20px rgba(23,35,59,.07)}
.bottom-nav .ui-icon{font-size:22px}.bottom-nav a,.bottom-nav button{color:#6b7688;min-width:0;min-height:48px}.bottom-nav a:hover,.bottom-nav button:hover{color:var(--blue)}
.admin-sidebar nav a{min-height:46px;border-radius:12px}.admin-sidebar nav a span{display:grid;place-items:center}.admin-sidebar nav .ui-icon{font-size:19px}.admin-top>button{width:44px;height:44px;border-radius:13px}.admin-top .btn .ui-icon{font-size:17px}
.panel,.auth-page>section,.account-menu{box-shadow:0 10px 30px rgba(23,35,59,.055)}
.btn:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;box-shadow:var(--premium-ring)}
@media(max-width:900px){
  body{padding-bottom:calc(78px + env(safe-area-inset-bottom))}
  .topbar{padding-inline:12px}.topbar span:first-child{font-size:10px}
  .site-header{backdrop-filter:none}.header-main{height:68px}.logo img{width:118px}.header-main>.search{top:72px}.header-main .search input{height:46px;border-radius:14px;padding-left:16px;box-shadow:0 9px 26px rgba(23,35,59,.08)}
  .menu-toggle{display:grid}.header-actions button{width:44px;height:44px;justify-content:center;padding:0}.header-actions .ui-icon{font-size:21px}.search button{width:42px;height:38px}.favorite{width:42px;height:42px;right:6px;top:6px}.favorite .ui-icon{font-size:20px}
  .categories-nav{inset:0 auto 0 0;width:min(86vw,340px)!important;max-width:340px;height:100dvh;min-height:100vh;margin:0;padding:18px 16px calc(24px + env(safe-area-inset-bottom));gap:3px;overflow-y:auto;overscroll-behavior:contain;background:#fff;box-shadow:20px 0 55px rgba(23,35,59,.2);z-index:120}.categories-nav a{min-height:54px;padding:0 14px;border-radius:14px;font-size:15px}.categories-nav .ui-icon{font-size:21px}.categories-nav.open{transform:translateX(0)}
  .mobile-menu-head{display:flex;align-items:center;justify-content:space-between;min-height:58px;padding:0 4px 12px;margin-bottom:8px;border-bottom:1px solid var(--line)}.mobile-menu-head strong{font-size:17px}.mobile-menu-close{width:44px;height:44px;border:1px solid var(--line);border-radius:14px;background:#f8fafc;color:var(--ink);font-size:28px;line-height:1;display:grid;place-items:center}.mobile-menu-close:active{transform:scale(.96);background:var(--blue-soft);color:var(--blue)}
  body.mobile-menu-open{overflow:hidden!important;touch-action:none}body.mobile-menu-open .site-header{z-index:110;background:transparent;border-color:transparent;box-shadow:none}body.mobile-menu-open .header-main{visibility:hidden;pointer-events:none}body.mobile-menu-open .categories-nav{visibility:visible;pointer-events:auto}body.mobile-menu-open .bottom-nav{z-index:30}
  .hero{margin-top:64px;border-radius:20px}.hero-copy{padding:28px 20px 10px}.hero h1{font-size:clamp(27px,8vw,33px);letter-spacing:-.02em}.hero-copy p{font-size:14px;line-height:1.6}.hero-copy .btn{min-height:48px;padding-inline:18px}.hero-art{height:230px;margin-top:10px}.hero-art>img{width:100%;height:100%;object-fit:cover}.benefits{border-radius:18px;padding:12px 4px}.benefits div{min-height:64px;justify-content:center;gap:4px}.benefits span{width:32px;height:32px}.benefits .ui-icon{font-size:17px}.benefits b{font-size:9px;max-width:78px}
  .category-grid{scrollbar-width:none}.category-grid::-webkit-scrollbar{display:none}
  .section-title{align-items:center}.category-card{min-width:174px;border-radius:17px}.category-card>span{width:42px;height:42px}.product-card{border-radius:18px}.product-img{border-radius:14px}.add-mobile{min-height:42px}.help-banner{display:grid;grid-template-columns:46px 1fr;padding:16px;border-radius:18px}.help-banner>span{width:46px;height:46px}.help-banner .btn{grid-column:1/-1;width:100%;min-height:46px}
  .bottom-nav{height:calc(72px + env(safe-area-inset-bottom));padding:5px 8px env(safe-area-inset-bottom);gap:3px;border:1px solid rgba(23,35,59,.08);border-radius:22px 22px 0 0;box-shadow:0 -12px 34px rgba(23,35,59,.12);backdrop-filter:blur(18px);background:rgba(255,255,255,.96)}.bottom-nav a,.bottom-nav button{border-radius:14px;gap:2px}.bottom-nav a:active,.bottom-nav button:active{background:var(--blue-soft);color:var(--blue);transform:scale(.97)}.bottom-nav span{font-size:10px}.bottom-nav b{right:8px;top:1px}
  .toast-area{left:12px;right:12px;bottom:calc(86px + env(safe-area-inset-bottom))}.toast{width:100%;text-align:center}.flash{left:12px;right:12px;top:12px}.cart-drawer{padding-bottom:calc(24px + env(safe-area-inset-bottom))}
  .buy-box{bottom:calc(78px + env(safe-area-inset-bottom));box-shadow:0 -12px 24px #fff}.page{padding-bottom:32px}.page-head h1{line-height:1.15}.panel{border-radius:18px}.form-grid input,.form-grid select,.auth-card input,.stack-form input,.stack-form select{min-height:50px;font-size:16px}
  .admin-main{padding-bottom:calc(26px + env(safe-area-inset-bottom))}.admin-top{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.95);backdrop-filter:blur(16px);margin:-18px -12px 18px;padding:10px 12px;border-bottom:1px solid var(--line)}
}
@media(max-width:390px){.hero-copy>div{display:grid;grid-template-columns:1fr 1fr;gap:8px}.hero-copy .btn{margin:0;padding-inline:10px}.benefits b{font-size:8.5px}.bottom-nav{padding-inline:4px}.bottom-nav span{font-size:9px}.category-card{min-width:164px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation-duration:.01ms!important}}
