:root{
  --bg:var(--tg-theme-bg-color,#121214);
  --surface:var(--tg-theme-secondary-bg-color,#1c1b20);
  --surface-2:#242229;
  --surface-3:#2b2931;
  --text:var(--tg-theme-text-color,#f7f7f8);
  --muted:var(--tg-theme-hint-color,#8e8c95);
  --accent:var(--tg-theme-button-color,#d766f3);
  --accent-text:var(--tg-theme-button-text-color,#fff);
  --line:rgba(255,255,255,.08);
  --green:#66d19e;
  --card-r:28px;
  --image-r:20px;
  --pill:9999px;
  --gap:12px;
  --shadow:0 18px 60px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#0d0d0f;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",Inter,system-ui,sans-serif}
button,input{font:inherit;color:inherit} button,a{-webkit-tap-highlight-color:transparent}.demo-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% -10%,rgba(215,102,243,.13),transparent 35%),#0b0b0d}
.telegram-app{position:relative;width:min(430px,100vw);height:min(900px,100vh);overflow:hidden;background:var(--bg);border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow);border-radius:34px}
.tg-header{height:58px;display:grid;grid-template-columns:48px 1fr 48px;align-items:center;padding:0 8px;border-bottom:1px solid var(--line);background:rgba(18,18,20,.88);backdrop-filter:blur(22px);position:absolute;z-index:20;top:0;left:0;right:0}
.tg-title{text-align:center;line-height:1.05}.tg-title strong{display:block;font-size:15px;letter-spacing:-.2px}.tg-title span{display:block;color:var(--muted);font-size:11px;margin-top:3px}.icon-btn,.round-action,.fav-btn,.filter-icon,.sheet-close{border:0;background:transparent;padding:0;display:grid;place-items:center;cursor:pointer}.icon-btn{width:42px;height:42px;border-radius:50%}.icon-btn svg,.round-action svg,.fav-btn svg,.filter-icon svg,.sheet-close svg,.why-icon svg,.nav-item svg,.menu-row svg,.upload-box svg,.chev{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.ghost:active{background:rgba(255,255,255,.07)}
.app-scroll{height:100%;overflow:auto;padding:82px 16px 104px;scrollbar-width:none}.app-scroll::-webkit-scrollbar{display:none}.shop-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:8px 2px 18px}.eyebrow{margin:0 0 7px;color:#b8b5c0;font-size:10px;font-weight:800;letter-spacing:1.6px}.shop-head h1,.admin-head h1{font-size:34px;line-height:.98;letter-spacing:-1.55px;margin:0;font-weight:750}.round-action{width:48px;height:48px;flex:0 0 auto;background:var(--surface-2);border-radius:50%;position:relative;overflow:hidden}.round-action svg{position:absolute;transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .2s}.close-ico{opacity:0;transform:rotate(-45deg) scale(.75)}.round-action.open .search-ico{opacity:0;transform:rotate(45deg) scale(.7)}.round-action.open .close-ico{opacity:1;transform:rotate(0) scale(1)}
.search-panel{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .35s cubic-bezier(.2,.8,.2,1),opacity .25s;margin-bottom:0}.search-panel>*{overflow:hidden}.search-panel.open{grid-template-rows:1fr;opacity:1;margin-bottom:12px}.search-box{height:50px;border-radius:var(--pill);background:var(--surface-2);border:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:0 16px}.search-box svg{width:19px;height:19px;fill:none;stroke:var(--muted);stroke-width:2}.search-box input{width:100%;border:0;outline:0;background:transparent;font-size:15px}.search-box input::placeholder{color:#817e87}.meta-strip{display:flex;align-items:center;gap:9px;color:#c9c6cf;font-size:11px;white-space:nowrap;overflow:hidden;margin:3px 2px 18px}.meta-strip b{color:#fff;font-weight:700}.meta-strip i{width:3px;height:3px;background:#5d5963;border-radius:50%;flex:0 0 auto}.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -16px 24px;padding:0 16px}.chips::-webkit-scrollbar{display:none}.chip{border:1px solid var(--line);background:var(--surface);color:#b9b6bf;height:38px;border-radius:var(--pill);padding:0 15px;white-space:nowrap;font-size:13px;font-weight:650;cursor:pointer;transition:all .22s}.chip.active{background:#f4f3f6;color:#111;border-color:#f4f3f6}.chip:active{transform:scale(.96)}
.section-row{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:0 2px 14px}.section-kicker{margin:0 0 4px;font-size:11px;color:var(--muted)}.section-row h2{font-size:20px;margin:0;letter-spacing:-.45px}.count{display:grid;place-items:center;min-width:28px;height:28px;border-radius:var(--pill);background:var(--surface-2);color:#bbb8c2;font-size:12px;padding:0 9px}.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.product-card{background:var(--surface);border-radius:var(--card-r);padding:7px 7px 13px;position:relative;cursor:pointer;animation:cardIn .46s both cubic-bezier(.2,.8,.2,1);border:1px solid rgba(255,255,255,.035);transition:transform .18s,background .18s}.product-card:active{transform:scale(.975);background:#211f25}.product-image{position:relative;overflow:hidden;border-radius:var(--image-r);aspect-ratio:.82;background:#242329}.product-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s cubic-bezier(.2,.8,.2,1)}.product-card:hover .product-image img{transform:scale(1.025)}.heart{position:absolute;right:9px;top:9px;width:33px;height:33px;border:0;border-radius:50%;background:rgba(12,12,14,.58);backdrop-filter:blur(9px);display:grid;place-items:center;color:#fff;cursor:pointer}.heart svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9}.heart.active svg{fill:var(--accent);stroke:var(--accent)}.product-copy{padding:10px 4px 0}.product-copy .tag{font-size:10px;color:var(--muted);margin-bottom:4px}.product-copy h3{font-size:14px;line-height:1.15;margin:0 0 8px;letter-spacing:-.25px}.product-foot{display:flex;justify-content:space-between;gap:7px;align-items:flex-end}.price{font-size:14px;font-weight:760;letter-spacing:-.25px}.price small{font-size:9px;font-weight:600;color:var(--muted);margin-left:3px}.sizes{font-size:10px;color:#a8a5ae;white-space:nowrap}.empty-state{grid-column:1/-1;background:var(--surface);border-radius:var(--card-r);padding:34px 24px;text-align:center;color:var(--muted)}@keyframes cardIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.why-card{margin-top:18px;border-radius:24px;background:linear-gradient(145deg,#25212a,#1c1a20);border:1px solid var(--line);padding:15px;display:flex;gap:12px}.why-icon{width:42px;height:42px;flex:0 0 auto;border-radius:15px;background:rgba(215,102,243,.13);color:#e98bff;display:grid;place-items:center}.why-icon svg{width:20px;height:20px}.why-card strong{display:block;font-size:13px;margin:1px 0 4px}.why-card span{display:block;color:#9e9aa4;font-size:11.5px;line-height:1.35}
.bottom-bar{height:76px;position:absolute;bottom:0;left:0;right:0;z-index:15;background:rgba(20,19,23,.9);border-top:1px solid var(--line);backdrop-filter:blur(22px);display:grid;grid-template-columns:repeat(3,1fr);padding:7px 12px calc(7px + env(safe-area-inset-bottom))}.nav-item{position:relative;border:0;background:transparent;color:#7f7b84;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:10px;font-weight:600;cursor:pointer}.nav-item svg{width:21px;height:21px;transition:transform .3s cubic-bezier(.2,1.4,.3,1)}.nav-item.active{color:var(--text)}.nav-item:active svg{transform:scale(.78) rotate(-5deg)}.cart-badge{position:absolute;top:1px;left:calc(50% + 7px);min-width:17px;height:17px;border-radius:9px;padding:0 4px;display:none;place-items:center;background:var(--accent);color:#fff;font-size:9px;font-weight:800;border:2px solid #17161a}.cart-badge.show{display:grid}.cart-badge.pop{animation:pop .34s}@keyframes pop{50%{transform:scale(1.45)}}
.sheet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.54);z-index:29;opacity:0;pointer-events:none;transition:opacity .28s}.sheet-backdrop.show{opacity:1;pointer-events:auto}.product-sheet,.mini-sheet{position:absolute;z-index:30;left:0;right:0;bottom:0;background:#1a191e;border-radius:28px 28px 0 0;box-shadow:0 -24px 70px rgba(0,0,0,.5);transform:translateY(102%);transition:transform .42s cubic-bezier(.18,.83,.31,1);max-height:91%;overflow:auto}.product-sheet.open,.mini-sheet.open{transform:translateY(0)}.sheet-handle{width:38px;height:4px;border-radius:5px;background:#55515b;margin:8px auto 10px}.sheet-close{position:absolute;z-index:2;right:14px;top:18px;width:34px;height:34px;border-radius:50%;background:rgba(18,18,20,.7);color:#fff;backdrop-filter:blur(12px)}.sheet-close.inline{position:static;background:#29272e}.sheet-media{margin:0 10px;border-radius:22px;overflow:hidden;height:350px;background:#2a282e}.sheet-media img{width:100%;height:100%;object-fit:cover}.sheet-copy{padding:17px 18px 24px}.sheet-topline{display:flex;justify-content:space-between;align-items:center;color:#bd87ca;font-size:12px}.fav-btn{width:38px;height:38px;border-radius:50%;background:#27252c;color:#fff}.fav-btn.active{color:var(--accent)}.fav-btn.active svg{fill:currentColor}.sheet-copy h3{font-size:26px;line-height:1.05;margin:5px 0 7px;letter-spacing:-.7px}.sheet-price{font-size:21px;font-weight:780;margin-bottom:20px}.sheet-price span{font-family:Georgia,serif;font-style:italic;color:#a6a2ac;font-size:15px;font-weight:500}.option-block>span{font-size:11px;color:var(--muted);display:block;margin-bottom:8px}.size-row{display:flex;gap:8px;margin-bottom:18px}.size-btn{border:1px solid var(--line);background:#232128;border-radius:var(--pill);min-width:44px;height:39px;padding:0 14px;font-size:12px;cursor:pointer}.size-btn.selected{background:#f4f3f6;color:#101012;border-color:#f4f3f6}.info-list{background:#232128;border-radius:20px;padding:4px 14px;margin-bottom:12px}.info-list div{height:44px;display:flex;align-items:center;justify-content:space-between;font-size:12px;border-bottom:1px solid var(--line)}.info-list div:last-child{border:0}.info-list span{color:var(--muted)}.info-list strong{font-weight:650}.primary-cta{width:100%;height:54px;border:0;border-radius:var(--pill);background:var(--accent);color:var(--accent-text);font-weight:760;font-size:14px;position:relative;overflow:hidden;cursor:pointer}.primary-cta span{position:absolute;inset:0;display:grid;place-items:center;transition:transform .32s cubic-bezier(.2,.8,.2,1),opacity .2s}.cta-alt{transform:translateY(100%);opacity:0}.primary-cta.success .cta-label{transform:translateY(-100%);opacity:0}.primary-cta.success .cta-alt{transform:none;opacity:1}.secondary-link{width:100%;height:44px;border:0;background:transparent;color:#c18ace;font-size:12px;cursor:pointer}.mini-sheet{padding:0 14px 18px}.menu-row{height:52px;color:#fff;text-decoration:none;display:flex;align-items:center;justify-content:space-between;border:0;background:transparent;width:100%;border-bottom:1px solid var(--line);padding:0 7px;font-size:14px;cursor:pointer}.menu-row svg{width:18px;height:18px;color:#8f8b95}.fly-thumb{position:fixed;z-index:9999;width:46px;height:56px;object-fit:cover;border-radius:12px;pointer-events:none;transition:transform .58s cubic-bezier(.3,.7,.2,1),opacity .5s}
/* Admin */
.admin-scroll{padding-bottom:88px}.admin-head{margin:8px 2px 20px}.admin-head p:last-child{color:var(--muted);font-size:13px;line-height:1.4;max-width:315px;margin:12px 0 0}.admin-toolbar{display:grid;grid-template-columns:1fr 48px;gap:9px;margin-bottom:24px}.search-box.compact{height:48px}.filter-icon{height:48px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line)}.admin-list{display:flex;flex-direction:column;gap:9px}.admin-row{background:var(--surface);border:1px solid rgba(255,255,255,.035);border-radius:22px;padding:7px;display:grid;grid-template-columns:64px 1fr auto;gap:11px;align-items:center;animation:cardIn .42s both}.admin-thumb{width:64px;height:72px;border-radius:16px;object-fit:cover}.admin-info h3{font-size:13px;margin:0 0 5px}.admin-info p{font-size:11px;color:var(--muted);margin:0}.admin-info p b{color:#d6d3db}.switch{width:42px;height:25px;background:#3a3740;border:0;border-radius:999px;padding:3px;cursor:pointer;transition:background .2s}.switch i{display:block;width:19px;height:19px;border-radius:50%;background:#fff;transition:transform .3s cubic-bezier(.2,1.3,.3,1)}.switch.on{background:var(--accent)}.switch.on i{transform:translateX(17px)}.status-dot{font-size:10px;color:#98949f;display:flex;align-items:center;gap:5px}.status-dot i,.live-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px rgba(102,209,158,.1)}.admin-add-card{margin-top:13px;width:100%;border:1px dashed rgba(255,255,255,.15);background:rgba(255,255,255,.025);border-radius:22px;padding:13px;display:grid;grid-template-columns:42px 1fr 20px;align-items:center;gap:11px;text-align:left;color:#fff;cursor:pointer}.plus-circle{width:42px;height:42px;border-radius:15px;background:#29262e;display:grid;place-items:center;color:#c584d5}.plus-circle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2}.admin-add-card strong{display:block;font-size:13px;margin-bottom:3px}.admin-add-card small{display:block;color:var(--muted);font-size:10.5px}.chev{width:18px;height:18px;color:#6f6b75}.admin-bottom-note{position:absolute;z-index:12;bottom:0;left:0;right:0;height:58px;display:flex;align-items:center;justify-content:center;gap:7px;background:rgba(20,19,23,.92);border-top:1px solid var(--line);backdrop-filter:blur(22px);font-size:11px;color:#9e9aa4}.admin-form{padding:0 16px 24px}.form-title{display:flex;justify-content:space-between;align-items:center;margin:6px 0 14px}.form-title h3{font-size:23px;margin:0;letter-spacing:-.5px}.upload-box{height:122px;width:100%;border:1px dashed rgba(255,255,255,.16);background:#232128;border-radius:22px;color:#aaa6b0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer}.upload-box svg{width:24px;height:24px}.upload-box span{font-size:11px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:12px 0 9px}.field-grid label,.full-field{background:#232128;border-radius:18px;padding:10px 12px;display:block}.field-grid span,.full-field span{display:block;color:var(--muted);font-size:9px;margin-bottom:4px}.field-grid input,.full-field input{width:100%;border:0;background:transparent;outline:0;font-size:13px}.full-field{margin-bottom:12px}
body.light-demo{--bg:#f2f4f5;--surface:#fff;--surface-2:#fff;--surface-3:#f0eef2;--text:#0e0e10;--muted:#797680;--line:rgba(0,0,0,.08)}body.light-demo .tg-header,body.light-demo .bottom-bar,body.light-demo .admin-bottom-note{background:rgba(247,247,248,.9)}body.light-demo .telegram-app{background:var(--bg)}body.light-demo .product-sheet,body.light-demo .mini-sheet{background:#f8f7f9}body.light-demo .product-card:active{background:#f7f7f8}body.light-demo .why-card{background:#fff}body.light-demo .nav-item.active{color:#111}body.light-demo .cart-badge{border-color:#fff}
@media(max-width:480px){.demo-shell{padding:0;background:var(--bg)}.telegram-app{width:100vw;height:100dvh;border:0;border-radius:0;box-shadow:none}.shop-head h1,.admin-head h1{font-size:33px}.sheet-media{height:42vh}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
