/* Shared operational shell. Page-specific layout and application behavior stay local. */
:root{--ui-bg:#101619;--ui-surface:#1a2226;--ui-raised:#222d32;--ui-input:#121a1e;--ui-line:#344147;--ui-text:#f0f5f4;--ui-muted:#a1b1b7;--ui-primary:#23b58b;--ui-info:#72bbef;--ui-gold:#e3c77c;--ui-danger:#ff99a5;--ui-sidebar:250px;color-scheme:dark}
html{background:var(--ui-bg);scroll-padding-top:90px;-webkit-text-size-adjust:100%}
body.panel-app{background:var(--ui-bg)!important;color:var(--ui-text);font-family:"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.5;min-height:100vh;margin:0;overflow-x:clip;letter-spacing:0;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
.panel-app *, .panel-app *:before,.panel-app *:after{box-sizing:border-box;letter-spacing:0!important}
.panel-app img{max-width:100%}
.panel-app button,.panel-app input,.panel-app select,.panel-app textarea{font-family:inherit;font-size:inherit}
.panel-app button,.panel-app a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.panel-app button:disabled{cursor:not-allowed;opacity:.55}
.panel-app a,.panel-app button{transition:background-color .16s,color .16s,border-color .16s,box-shadow .16s}
.panel-app :focus-visible{outline:2px solid var(--ui-primary);outline-offset:3px}
.panel-app [hidden]{display:none!important}
.panel-app .panel-main{width:100%;max-width:1440px;margin:0 auto;padding:28px 28px 44px;min-width:0;overflow:visible}
.panel-app .panel-main>*{min-width:0}
.panel-app .panel-main .grid>*{min-width:0}
.panel-app .panel-main>h1,.panel-app .panel-main h1{font-size:24px;line-height:1.3;font-weight:700}
.panel-app .panel-main h2{font-size:17px;line-height:1.4}
.panel-app .text-gray-400,.panel-app .text-slate-400,.panel-app .text-gray-500,.panel-app .text-slate-500{color:var(--ui-muted)}
.panel-app .text-indigo-300,.panel-app .text-indigo-400,.panel-app .text-blue-400,.panel-app .text-sky-400{color:var(--ui-info)}
.panel-app .text-yellow-300,.panel-app .text-yellow-400{color:var(--ui-gold)}
.panel-app .glass,.panel-app .panel,.panel-app .card:not(.product-card),.panel-app .pd-card,.panel-app .r-card,.panel-app .refill-surface,.panel-app .h-key-card,.panel-app .h-seller,.panel-app .rank-card{background:var(--ui-surface)!important;border-color:var(--ui-line)!important;border-radius:8px!important;box-shadow:none!important;backdrop-filter:none!important}
.panel-app .rounded-xl,.panel-app .rounded-2xl,.panel-app .rounded-3xl{border-radius:8px}
.panel-app .shadow-glow{box-shadow:none}
.panel-app .panel-main .bg-panel,.panel-app .panel-main .bg-gray-800,.panel-app .panel-main .bg-slate-800{background-color:var(--ui-raised)}
.panel-app input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color]),.panel-app select,.panel-app textarea{border-color:var(--ui-line)!important;background-color:var(--ui-input);color:var(--ui-text);border-radius:6px!important;min-height:42px;max-width:100%}
.panel-app input::placeholder,.panel-app textarea::placeholder{color:#809299;opacity:1}
.panel-app input:focus,.panel-app select:focus,.panel-app textarea:focus{border-color:var(--ui-primary)!important;box-shadow:0 0 0 3px #23b58b20!important;outline:0}
.panel-app input[type=checkbox],.panel-app input[type=radio]{accent-color:var(--ui-primary);width:16px;height:16px;flex-shrink:0}
.panel-app select option{background:var(--ui-input);color:var(--ui-text)}
.panel-app input[type=file]{max-width:100%;font-size:12px}
.panel-app input[type=file]::file-selector-button{border:1px solid var(--ui-line);border-radius:5px;padding:8px 10px;color:var(--ui-text);background:var(--ui-raised);margin-right:10px}
.panel-app button[class*="bg-blue-"],.panel-app button[class*="bg-indigo-"],.panel-app button[class*="bg-green-"],.panel-app button[class*="bg-emerald-"],.panel-app a[class*="bg-blue-6"],.panel-app a[class*="bg-green-5"]{background:#128362!important;color:#fff!important;border-color:#1fa57d!important}
.panel-app button[class*="bg-blue-"]:hover,.panel-app button[class*="bg-indigo-"]:hover,.panel-app button[class*="bg-emerald-"]:hover{background:#169b73!important}
.panel-app .glass:is(button,a){background:var(--ui-raised)!important}
.panel-app button[class*="px-"],.panel-app a[class*="px-"][class*="bg-"]{min-height:38px;border-radius:6px!important;font-weight:600}
.panel-app table{width:100%;font-size:13px;border-collapse:collapse;border-spacing:0}
.panel-app th{background:#202c31;color:#bdcbd0;text-align:left;font-weight:600;font-size:11px;text-transform:uppercase;white-space:nowrap}
.panel-app td,.panel-app th{padding:12px 14px;border-bottom:1px solid #34414770;vertical-align:middle}
.panel-app tbody tr{background:transparent;transition:background .14s}
.panel-app tbody tr:hover{background:#ffffff04}
.panel-app td .truncate{max-width:240px}
.panel-app .panel-table-scroll{overflow:auto;max-width:100%;overscroll-behavior-x:contain;scrollbar-width:thin}
.panel-app .panel-table-scroll>table{min-width:680px}
.panel-app .panel-table-scroll:focus-visible{outline-offset:-2px}
.panel-app .tb-serial-badge{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:22px;padding:0 7px;border:1px solid #e3c77c40;border-radius:5px;background:#e3c77c12;color:var(--ui-gold);font:600 11px/1 ui-monospace,monospace;white-space:nowrap}
.panel-app .panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
.panel-app .panel-heading h1{margin:0;font-size:24px}
.panel-app .panel-heading small{display:block;color:var(--ui-muted);font-size:12px;margin-top:5px}
.panel-app .panel-heading-icon{width:40px;height:40px;display:grid;place-items:center;border:1px solid #23b58b45;background:#23b58b15;border-radius:8px;color:#7fe4c2;font-size:20px}
.panel-app .panel-section-label{font-size:10px;text-transform:uppercase;color:#798e96;padding:18px 12px 5px;font-weight:700}
.panel-skip{position:fixed;left:16px;top:-70px;z-index:150;background:#128362;color:#fff;padding:10px 14px;border-radius:6px}.panel-skip:focus{top:10px}
/* Navigation */
.tb-topbar{position:sticky;top:0;z-index:70;background:#171f23;border-bottom:1px solid var(--ui-line)}
.tb-topbar-inner{height:72px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 28px}
.tb-brand{display:flex;align-items:center;gap:10px;min-width:0}
.tb-brand-link{display:flex;align-items:center;min-width:0;text-decoration:none}
.tb-brand-logo{width:40px;height:40px;object-fit:contain;border-radius:6px}
.tb-brand-title{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.tb-brand-main{display:block;font-size:13px;font-weight:800;background:linear-gradient(100deg,#f4f9f8 10%,#8be8c9 40%,#e3c77c 65%,#f4f9f8 90%);background-size:220% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:panelBrand 7s ease-in-out infinite}
.tb-brand-sub{font-size:10px;font-weight:600;color:#b4c5c9;margin-top:3px}
.tb-brand-monogram{width:38px;height:38px;display:grid;place-items:center;border:1px solid #23b58b40;background:#23b58b15;color:#80e2c0;border-radius:6px;font-weight:800}
.tb-nav-actions{display:flex;align-items:center;gap:8px;min-width:0;margin-left:auto}
.tb-balance{display:flex;align-items:center;gap:8px;height:40px;padding:0 12px;border:1px solid var(--ui-line);border-radius:6px;background:#202b30;font-size:12px;white-space:nowrap}
.tb-balance .label{color:var(--ui-muted)}.tb-balance i{color:#72bbef;font-size:17px}.tb-balance strong{font-size:14px;color:#f4f9f8;font-variant-numeric:tabular-nums}
.tb-menu-btn,.tb-icon-btn,.tb-redeem-btn,.tb-close,.tb-redeem-close{display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border:1px solid var(--ui-line);border-radius:6px;background:#202b30;color:#dce8e9;cursor:pointer}
.tb-menu-btn i{font-size:23px}.tb-redeem-btn{background:#23b58b16;border-color:#23b58b48;color:#82e3c3;font-size:19px}
.tb-menu-btn:hover,.tb-close:hover{background:#304048}.tb-redeem-btn:hover{background:#23b58b30}
.tb-overlay{position:fixed;inset:0;z-index:89;opacity:0;visibility:hidden;background:#070d10bd;transition:opacity .2s,visibility .2s}
.tb-overlay.open{opacity:1;visibility:visible}
.tb-drawer{position:fixed;inset:0 auto 0 0;width:var(--ui-sidebar);height:100dvh;z-index:90;display:flex;flex-direction:column;background:#161e22;border-right:1px solid var(--ui-line);transform:translateX(-105%);transition:transform .22s ease;overflow:hidden}
.tb-drawer.open{transform:none}
.tb-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:16px;min-height:72px;border-bottom:1px solid var(--ui-line);gap:10px}
.tb-drawer-logo{width:38px;height:38px;object-fit:contain;border-radius:6px}
.tb-drawer-head .tb-brand-title{margin-left:10px}
.tb-profile{margin:16px 12px 4px;padding:12px;background:#202b30;border:1px solid var(--ui-line);border-radius:8px}
.tb-profile-row{display:flex;align-items:center;gap:10px;min-width:0}
.tb-avatar{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;background:#23b58b22;border-radius:6px;color:#8be8c9;font-weight:700;font-size:16px}
.tb-profile-name{font-size:13px;font-weight:600;color:#eef5f4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-profile-mail{font-size:10px;color:#9aadb3;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-nav-scroll{flex:1;min-height:0;overflow-y:auto;padding:5px 10px 16px;overscroll-behavior:contain;scrollbar-width:thin}
.tb-menu-item{display:flex;align-items:center;gap:10px;min-height:42px;padding:8px 10px;margin:3px 0;border:1px solid transparent;border-radius:6px;color:#acbec5;text-decoration:none}
.tb-menu-item:hover{background:#ffffff06;color:#eef5f4}.tb-menu-item.active{background:#23b58b14;border-color:#23b58b30;color:#8be8c9}
.tb-menu-icon{width:26px;height:26px;display:grid;place-items:center;flex:0 0 26px;font-size:17px}
.tb-menu-copy{min-width:0;flex:1}.tb-menu-title{font-size:12px;font-weight:600;display:block}.tb-menu-sub{display:none!important}.tb-menu-arrow{font-size:10px;opacity:.4}
.tb-count{min-width:20px;height:20px;display:grid;place-items:center;padding:0 5px;background:#e3c77c22;border:1px solid #e3c77c50;color:#e3c77c;border-radius:5px;font-size:10px;font-weight:700}
.tb-lang{padding:10px 12px}.tb-lang label{color:#9aadb3;font-size:11px;display:block;margin-bottom:5px}.tb-lang select{width:100%;padding:8px;min-height:36px}
.tb-logout{display:flex;align-items:center;gap:10px;padding:10px 12px;margin:14px 0 0;border:1px solid #ff99a530;border-radius:6px;color:#ffabb5;background:#ff99a50a;font-size:12px;font-weight:600;text-decoration:none}
.tb-drawer>.tb-logout{margin:5px 12px 16px}.tb-logout:hover{background:#ff99a519}
.tb-bottom-nav{display:none}
.panel-route-label{display:none;align-items:center;gap:8px;font-size:13px;color:#a1b1b7}.panel-route-label strong{font-weight:600;color:#eef5f4}
/* Dialogs are bounded by viewport, with a single scrollable body. */
.tb-redeem-modal{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:20px;background:#070d10c9}
.tb-redeem-modal.open{display:flex}
.tb-redeem-card,.panel-app .tb-product-dialog,.panel-app .h-key-dialog,.panel-app .modal-content{width:min(480px,100%);max-height:calc(100dvh - 40px);overflow:auto;border:1px solid var(--ui-line);border-radius:8px!important;background:var(--ui-surface)!important;color:var(--ui-text);box-shadow:0 20px 80px #0006;animation:panelDialog .22s ease-out}
.tb-redeem-card{padding:24px}.tb-redeem-input{width:100%;padding:12px;font:600 19px/1.4 ui-monospace,monospace;text-transform:uppercase}
.tb-redeem-submit{margin-top:16px;width:100%;border:1px solid #1fa57d;background:#128362;border-radius:6px;padding:12px;color:white;font-size:13px;font-weight:600}
.panel-app .tb-product-modal{background:#070d10c9;backdrop-filter:none!important}.panel-app .tb-product-dialog{width:min(560px,100%)}
.panel-app .tb-product-video{border-radius:6px}.panel-app .tb-product-info-item{border-radius:6px;background:transparent;padding:12px 0;border:0;border-bottom:1px solid var(--ui-line)}
.panel-app .h-key-dialog::backdrop{background:#070d10c9;backdrop-filter:none}
.panel-app div.fixed.inset-0[id]{z-index:120;padding:16px;overflow-y:auto}
.panel-app div.fixed.inset-0[id]>.glass{max-height:calc(100dvh - 32px);overflow-y:auto}
.panel-app .modal-shell{background:var(--ui-surface);border-color:var(--ui-line);border-radius:8px;box-shadow:0 20px 70px #0006;max-height:calc(100dvh - 32px)}
.panel-app .h-detail-head,.panel-app .tb-product-modal-head{border-bottom-color:var(--ui-line)}
.panel-app .h-detail-field{background:var(--ui-input);border-color:var(--ui-line)}
.panel-app .h-detail-key code{background:var(--ui-input);border-color:var(--ui-line)}
/* Catalog */
.panel-app .product-list-card{background:var(--ui-surface)!important;border:1px solid var(--ui-line)!important;border-radius:8px!important;padding:20px!important;box-shadow:none!important;min-width:0}
.panel-app .product-title{font-size:17px;color:var(--ui-text);line-height:1.4;letter-spacing:0}
.panel-app .product-desc{font-size:12px;line-height:1.6;color:var(--ui-muted)}
.panel-app .product-thumb{border-radius:8px;border:1px solid var(--ui-line);box-shadow:none;width:70px;height:70px;object-fit:cover}
.panel-app .product-thumb-wrap{width:70px;flex:0 0 70px}.panel-app .product-header{gap:14px}
.panel-app .platform-mini-badge{font-size:9px;padding:4px 7px;color:#8fe8cc;background:#173e33;border-color:#347862;box-shadow:none;border-radius:4px}
.panel-app .variant-box{gap:7px;margin-top:18px}.panel-app .variant-item{min-height:44px;padding:10px 12px;background:var(--ui-raised);border-color:var(--ui-line);border-radius:6px;font-size:13px}
.panel-app .variant-item:hover{background:#2c3b40;border-color:#23b58b80}
.panel-app .variant-name{white-space:normal;line-height:1.45;overflow-wrap:anywhere;min-width:0}.panel-app .variant-price{font-size:14px;color:#91e7ca;flex-shrink:0;max-width:52%;white-space:normal;overflow-wrap:anywhere;text-align:right}
.panel-app .product-action-button{width:32px;height:32px;border-radius:5px}
.panel-app .simple-link{padding:10px 12px;min-height:44px;border-radius:6px;box-shadow:none;background:var(--ui-raised);border:1px solid var(--ui-line);color:#dce8e9;font-size:12px}.panel-app .simple-link i{font-size:14px}
.panel-app .category-filter{padding-bottom:8px}.panel-app .game-pill{padding:8px 12px;min-height:40px;background:var(--ui-surface);border-color:var(--ui-line);border-radius:6px;font-size:12px}.panel-app .game-pill.active{background:#128362;border-color:#23b58b;color:#fff}
.panel-app .status-grid{margin:12px 0 20px;padding:0;background:transparent;border:0;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;border-radius:0}
.panel-app .status-pill{min-height:42px;border-radius:6px;background:var(--ui-surface);border-color:var(--ui-line);font-size:12px;gap:8px}.panel-app .status-pill.active{background:#23b58b10;border-color:#23b58b65}
.panel-app .status-ico{width:24px;height:24px;font-size:13px;background:none!important;border:0}.panel-app .tb-telegram-float{width:44px;height:44px;right:20px;bottom:20px;background:#1c94b4;box-shadow:0 3px 12px #0004}
.panel-app.page-buy .panel-main>.glass:last-child,.panel-app.page-dashboard.role-admin .panel-main>.glass:last-child{background:transparent!important;border:0!important;padding:0!important}
.panel-app .panel-product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:16px}
.panel-app .panel-product-grid>*{margin:0!important;min-width:0}
/* Account, history, refill and reset */
.panel-app .h-wrap,.panel-app .r-wrap,.panel-app .pd-wrap,.panel-app .refill-wrap,.panel-app .rank-wrap,.panel-app .page-wrap{max-width:1000px}
.panel-app .h-tabs{background:transparent;border-bottom:1px solid var(--ui-line);border-radius:0;padding:0 0 12px;gap:8px}
.panel-app .h-panel,.panel-app .h-key-list{background:transparent;border:0;border-radius:0;box-shadow:none;padding-left:0;padding-right:0}
.panel-app .h-key-list{gap:12px}
.panel-app .h-card,.panel-app .h-box{background:var(--ui-surface);border-color:var(--ui-line);border-radius:8px}
.panel-app .rank-panel{background:var(--ui-surface);border-color:var(--ui-line);border-radius:8px;box-shadow:none}
.panel-app .rank-hero{border-color:#e3c77c60;background:#e3c77c08}
.panel-app .rank-progress-card,.panel-app .rank-metric,.panel-app .rank-points{background:var(--ui-input);border-color:var(--ui-line);border-radius:6px}
.panel-app .rank-tier-icon,.panel-app .leader-position{border-radius:6px;box-shadow:none}
.panel-app .h-tab{border:1px solid var(--ui-line);background:var(--ui-surface);border-radius:6px;font-size:12px;padding:10px 16px}
.panel-app .h-tab.active{background:#23b58b18;border-color:#23b58b60;color:#8be8c9}
.panel-app .h-key-card{padding:16px}.panel-app .h-keycode{border-color:var(--ui-line);background:var(--ui-input);color:var(--ui-gold);font-size:12px}.panel-app .h-keybtn{border-color:var(--ui-line);background:var(--ui-raised);border-radius:5px;color:#c8dce1;font-size:17px}
.panel-app .h-keybtn:hover{border-color:#23b58b90;color:#8be8c9}.panel-app .h-30{background:var(--ui-input);border-color:var(--ui-line)}
.panel-app .r-hero,.panel-app .pd-head,.panel-app .refill-hero,.panel-app .welcome{background:transparent!important;border-radius:0!important;border:0!important;box-shadow:none!important;padding:0 0 20px!important}
.panel-app .pd-head{padding:22px!important;border-bottom:1px solid var(--ui-line)!important}.panel-app .r-kicker,.panel-app .pd-kicker{color:#8ca8ad;font-size:10px}
.panel-app .r-title,.panel-app .pd-title,.panel-app .refill-title{font-size:22px;line-height:1.35}
.panel-app .r-mark,.panel-app .pd-mark,.panel-app .refill-mark,.panel-app .stat-icon,.panel-app .section-icon{border-radius:8px;background:#23b58b15;border-color:#23b58b40;color:#8be8c9;box-shadow:none;animation:none}
.panel-app .refill-hero:after{display:none}.panel-app .refill-balance{padding:16px;background:#23b58b10;border:1px solid #23b58b40;border-radius:8px;margin-top:22px}.panel-app .refill-balance-value{font-size:28px;color:#8be8c9}
.panel-app .refill-button,.panel-app .r-submit,.panel-app .pd-save{background:#128362;border-radius:6px;box-shadow:none;font-size:13px;font-weight:600}
.panel-app .refill-surface{background:transparent!important;border:0!important;border-radius:0!important}.panel-app .refill-form{padding:22px;background:var(--ui-surface);border:1px solid var(--ui-line);border-radius:8px}
.panel-app .summary-stat{border-radius:6px;background:var(--ui-surface);border-color:var(--ui-line)}
.panel-app .refill-summary{padding:0 0 16px;border-color:var(--ui-line)}.panel-app .refill-list{padding:0}.panel-app .refill-code{font-size:13px}.panel-app .refill-date{font-size:11px;color:var(--ui-muted)}
.panel-app .r-request{background:var(--ui-surface);border-color:var(--ui-line);border-radius:8px;padding:14px}.panel-app .r-keys{border-color:var(--ui-line);font-size:12px}
.panel-app .r-select-button{background:var(--ui-raised);color:var(--ui-text);border:1px solid var(--ui-line);border-radius:6px}
.panel-app .r-product-menu,.panel-app .pd-product-list{background:var(--ui-surface);border-color:var(--ui-line);border-radius:6px;box-shadow:0 8px 30px #0005}
.panel-app .r-product-search,.panel-app .pd-select-shell{background:var(--ui-input);border-color:var(--ui-line)}
.panel-app .r-option,.panel-app .pd-product-option{background:var(--ui-surface);color:var(--ui-text);border-color:var(--ui-line)}
.panel-app .r-option:hover,.panel-app .pd-product-option:hover,.panel-app .pd-product-option.active{background:#23b58b15}
.panel-app .pd-grid .pd-upload{background:var(--ui-input);border-color:var(--ui-line);border-radius:6px}
.panel-app .stat-card,.panel-app .recent-card{background:var(--ui-surface);border-color:var(--ui-line);border-radius:8px;box-shadow:none}
.panel-app .quick a{background:var(--ui-surface);border-color:var(--ui-line);border-radius:6px;min-height:44px}.panel-app .section-head{border-color:var(--ui-line)}
.panel-app .page .hero,.panel-app .api-card{background:var(--ui-surface)!important;border-radius:8px!important;box-shadow:none!important}
.panel-app .hero:before,.panel-app .hero:after,.panel-app .tb-profile:after{display:none!important}
.panel-app .sticky-topbar{top:84px!important;background:var(--ui-bg)!important;border:1px solid var(--ui-line);border-radius:8px!important;box-shadow:none!important;backdrop-filter:none!important}
.panel-app .product-block{border-color:var(--ui-line)!important}
.panel-variant-toggle{display:none;width:30px;height:30px;flex:0 0 30px;border:1px solid var(--ui-line);border-radius:5px;background:var(--ui-raised);color:var(--ui-muted)}
.panel-variant-toggle i{transition:transform .2s}.panel-variant-toggle[aria-expanded=true] i{transform:rotate(180deg)}
.panel-app .notif-bar{background:#e3c77c0d;border-color:#e3c77c45;border-radius:6px;box-shadow:none}
.panel-app .ts-dropdown{z-index:85!important}.panel-app .ts-control{border-radius:6px!important}
.mapping-filter-row{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.mapping-search{display:flex;align-items:center;gap:10px;flex:1;min-width:180px;background:var(--ui-input);border:1px solid var(--ui-line);border-radius:6px;padding:0 12px}
.mapping-search i{color:var(--ui-muted)}.panel-app .mapping-search input{border:0;background:transparent;width:100%;min-height:40px;padding:8px 0;box-shadow:none!important}
.mapping-filter-row select{padding:8px 12px;min-width:130px}.mapping-table{max-height:620px;isolation:isolate}.mapping-table thead{position:sticky;top:0;z-index:5}
.panel-app.page-owner-api .panel-table-scroll{max-height:620px}
.panel-catalog-toolbar{flex-wrap:wrap}
.panel-app .panel-catalog-toolbar button{padding:8px 10px;gap:6px}
@keyframes panelBrand{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
@keyframes panelDialog{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(min-width:1100px){
  body.panel-app{padding-left:var(--ui-sidebar)}
  .tb-drawer{transform:none;z-index:75;box-shadow:none}.tb-close{display:none}
  .tb-drawer-head{justify-content:flex-start}.tb-drawer-head>div{display:flex;align-items:center}
  .tb-overlay{display:none}.tb-topbar>.tb-topbar-inner>.tb-brand{display:none}.panel-route-label{display:flex}
  .tb-topbar{z-index:70}
  body.panel-app.panel-compact{padding-left:76px}.panel-compact .tb-drawer{width:76px}
  .panel-compact .tb-drawer-head{padding:16px 18px}.panel-compact .tb-drawer-head .tb-brand-title,.panel-compact .tb-drawer-head>.tb-brand-title{display:none}
  .panel-compact .tb-profile{padding:8px;margin:16px 10px 4px}.panel-compact .tb-profile-row>div:not(.tb-avatar),.panel-compact .tb-profile-row>i{display:none}
  .panel-compact .tb-menu-copy,.panel-compact .tb-menu-arrow,.panel-compact .panel-section-label,.panel-compact .tb-count,.panel-compact .tb-lang{display:none!important}
  .panel-compact .tb-menu-item{justify-content:center;padding:8px}.panel-compact .tb-logout{justify-content:center;font-size:0;padding:12px}.panel-compact .tb-logout i{font-size:18px}
}
@media(max-width:1099px){.tb-drawer{width:min(290px,88vw)}.tb-drawer-head .tb-brand-title{max-width:150px}.panel-app .panel-main{padding:24px 20px 40px}}
@media(max-width:767px){
  body.panel-app{padding-bottom:80px!important;font-size:13px}
  .panel-app .panel-main{padding:20px 14px 24px;max-width:100%}
  .tb-topbar-inner{height:64px;padding:0 12px;gap:8px}.tb-brand{gap:7px}.tb-brand-logo{width:32px;height:32px}.tb-brand-main{font-size:11px}.tb-brand-sub{font-size:9px}.tb-brand-title{display:flex!important}
  .tb-balance{padding:0 8px;height:36px;gap:6px}.tb-balance .label{display:none}.tb-balance strong{font-size:12px}.tb-balance i{font-size:15px}
  .tb-menu-btn,.tb-redeem-btn{width:36px;height:36px;flex-basis:36px}.tb-nav-actions{gap:6px}
  .tb-bottom-nav{position:fixed;inset:auto 0 0;z-index:75;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;padding:7px 8px max(7px,env(safe-area-inset-bottom));border-top:1px solid var(--ui-line);background:#171f23;min-height:66px}
  .tb-bottom-nav-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .tb-bottom-item{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:49px;min-width:0;gap:4px;color:#8ea4ac;font-size:10px;font-weight:600;text-decoration:none;border-radius:6px}.tb-bottom-item i{font-size:19px}.tb-bottom-item.active{background:#23b58b15;color:#8be8c9}
  .panel-app .panel-main h1,.panel-app .panel-heading h1{font-size:21px}
  .panel-app .panel-product-grid{grid-template-columns:1fr;gap:12px}
  .panel-app .status-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .panel-app .product-list-card{padding:16px!important}.panel-app .product-title{font-size:15px}.panel-app .product-thumb,.panel-app .product-thumb-wrap{width:60px;height:60px;flex-basis:60px}
  .panel-app .product-header{gap:12px}.panel-app .product-desc{font-size:11px}
  .panel-app .variant-item{font-size:12px;min-height:44px}.panel-app .variant-price{font-size:13px}
  .panel-app .tb-telegram-float{right:14px;bottom:83px}
  .panel-app .sticky-topbar{top:72px!important}.panel-app .refill-form{padding:16px}
  .panel-app .h-key-card{padding:12px}.panel-app .h-keybar{grid-template-columns:minmax(0,1fr) repeat(3,40px);gap:5px}.panel-app .h-keybtn,.panel-app .h-keycode{height:42px}
  .panel-app .pd-grid{grid-template-columns:1fr}.panel-app .tb-product-info-grid{grid-template-columns:1fr}
  .panel-app .variant-row{display:grid;grid-template-columns:minmax(0,1fr) 48px 72px;padding:12px;gap:8px}
  .panel-app .variant-row>div{width:auto;min-width:0}
  .panel-app .variant-row>div:nth-child(3){grid-column:1/-1;grid-row:2;display:flex;justify-content:flex-end;gap:20px;padding-top:6px;border-top:1px solid #34414760}
  .panel-app .variant-row>div:last-child{grid-column:3;grid-row:1}
  .panel-app .product-block>.flex{flex-wrap:wrap;gap:10px;padding:12px}
  .panel-variant-toggle{display:grid;place-items:center}
  .panel-app .tb-product-dialog,.panel-app .tb-redeem-card{max-height:calc(100dvh - 32px)}
  .panel-app .tb-redeem-modal{padding:16px}.tb-redeem-card{padding:20px}
}
@media(max-width:360px){.tb-brand-logo{width:28px;height:28px}.tb-brand{gap:5px}.tb-brand-main{font-size:10px}.tb-brand-sub{font-size:8px}.tb-topbar-inner{padding:0 9px;gap:5px}.tb-balance{padding:0 6px}.tb-balance i{display:none}.tb-nav-actions{gap:5px}.panel-app .product-title-row{flex-wrap:wrap}.panel-app .product-action-buttons{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.panel-app *, .panel-app *:before,.panel-app *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
