/* assets/css/ui.css — طبقة الواجهة الموحّدة (هادئة ومرتبة) */
:root{--u-navy:#22333f;--u-or:#d9822b;--u-or2:#EA9E50;--u-line:#f1e8da;--u-mut:#64748b}

/* شريط التقدم أعلى الصفحة عند التنقل */
#uProg{position:fixed;top:0;right:0;left:0;height:3px;z-index:100000;pointer-events:none;transform-origin:right;transform:scaleX(0);background:linear-gradient(90deg,var(--u-or2),var(--u-or));opacity:0;transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .2s}
#uProg.on{opacity:1;transform:scaleX(.82)}

/* ألوان الحالات الموحدة (شارات Bootstrap) */
.badge.bg-success,.badge.text-bg-success{background:#dcfce7!important;color:#047857!important}
.badge.bg-danger,.badge.text-bg-danger{background:#fee2e2!important;color:#b91c1c!important}
.badge.bg-warning,.badge.text-bg-warning{background:#fef3c7!important;color:#92400e!important}
.badge.bg-info,.badge.text-bg-info,.badge.bg-primary,.badge.text-bg-primary{background:#e0f2fe!important;color:#0369a1!important}
.badge.bg-secondary,.badge.text-bg-secondary{background:#f1f5f9!important;color:#475569!important}
.badge{font-weight:800;border-radius:999px;padding:.38em .75em;letter-spacing:0}

/* ظهور ناعم للكروت */
@media (prefers-reduced-motion:no-preference){
  .u-in{animation:uIn .35s ease backwards}
  @keyframes uIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
}

/* نافذة التأكيد */
.u-ov{position:fixed;inset:0;z-index:100001;background:rgba(15,23,32,.42);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;transition:opacity .15s}
.u-ov.on{opacity:1}
.u-dlg{width:100%;max-width:380px;background:#fff;border-radius:20px;box-shadow:0 30px 60px rgba(15,23,32,.25);padding:22px 20px 16px;text-align:center;direction:rtl;font-family:inherit;transform:translateY(8px) scale(.98);transition:transform .15s}
.u-ov.on .u-dlg{transform:none}
.u-dlg .ic{width:52px;height:52px;margin:0 auto 12px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:20px;background:#fdf1e4;color:var(--u-or)}
.u-dlg.danger .ic{background:#fee2e2;color:#dc2626}
.u-dlg p{margin:0 0 18px;font-size:15px;font-weight:700;color:var(--u-navy);line-height:1.8}
.u-dlg .bt{display:flex;gap:8px}
.u-dlg button{flex:1;height:44px;border-radius:13px;border:0;font-weight:800;font-size:14px;cursor:pointer;font-family:inherit}
.u-dlg .no{background:#f1f5f9;color:#475569}
.u-dlg .yes{background:var(--u-navy);color:#fff}
.u-dlg.danger .yes{background:#dc2626}

/* الإشعارات المنبثقة (Toast) */
#uToasts{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:100002;display:flex;flex-direction:column;gap:8px;width:min(440px,calc(100vw - 24px));pointer-events:none}
.u-toast{pointer-events:auto;display:flex;align-items:flex-start;gap:10px;background:#fff;border:1px solid var(--u-line);border-radius:14px;padding:11px 14px;box-shadow:0 14px 34px rgba(15,23,32,.14);font-size:13.5px;font-weight:700;color:var(--u-navy);direction:rtl;animation:uT .2s ease}
.u-toast i.s{margin-top:2px}
.u-toast.ok i.s{color:#16a34a}.u-toast.err i.s{color:#dc2626}.u-toast.warn i.s{color:#d97706}.u-toast.info i.s{color:#0284c7}
.u-toast .x{margin-right:auto;border:0;background:none;color:#94a3b8;cursor:pointer;padding:0 0 0 2px}
.u-toast.out{opacity:0;transform:translateY(-6px);transition:all .25s}
@keyframes uT{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* البحث الشامل */
.u-sr{position:fixed;inset:0;z-index:100000;background:rgba(15,23,32,.35);display:none;align-items:flex-start;justify-content:center;padding:70px 16px 16px}
.u-sr.on{display:flex}
.u-sb{width:100%;max-width:620px;background:#fff;border-radius:20px;box-shadow:0 30px 70px rgba(15,23,32,.28);overflow:hidden;direction:rtl}
.u-si{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid #f1f5f9}
.u-si i{color:#94a3b8}
.u-si input{flex:1;border:0;outline:0;font-family:inherit;font-size:16px;color:var(--u-navy);background:transparent;min-width:0}
.u-si kbd{font-family:inherit;font-size:11px;color:#94a3b8;border:1px solid #e2e8f0;border-radius:6px;padding:2px 6px}
.u-res{max-height:min(60vh,460px);overflow:auto;padding:6px}
.u-g{font-size:11.5px;font-weight:800;color:#94a3b8;padding:10px 10px 4px}
.u-it{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:12px;text-decoration:none!important;color:var(--u-navy)}
.u-it.on,.u-it:hover{background:#f8f4ec}
.u-it .ii{width:34px;height:34px;border-radius:10px;background:#f8f4ec;color:var(--u-or);display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0}
.u-it.on .ii{background:#fff}
.u-it .tt{flex:1;min-width:0}
.u-it b{display:block;font-size:13.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.u-it small{display:block;font-size:12px;color:#94a3b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.u-bd{font-size:11px;font-weight:800;padding:3px 8px;border-radius:999px;white-space:nowrap}
.u-bd.ok{background:#dcfce7;color:#047857}.u-bd.wt{background:#fef3c7;color:#92400e}.u-bd.no{background:#fee2e2;color:#b91c1c}
.u-emp{padding:26px;text-align:center;color:#94a3b8;font-size:13px;font-weight:700}
.u-ft{display:flex;gap:14px;padding:9px 16px;border-top:1px solid #f1f5f9;font-size:11.5px;color:#94a3b8}

/* زر الوضع الليلي في الشريط العلوي */
.u-dm{width:38px;height:38px;border-radius:12px;border:1px solid var(--u-line);background:#fff;color:var(--u-navy);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}

/* الشريط السفلي — الموبايل فقط */
.u-nav{display:none}
@media (max-width:700px){
  .u-nav{position:fixed;right:0;left:0;bottom:0;z-index:9990;display:grid;grid-template-columns:repeat(5,1fr);align-items:end;background:rgba(255,255,255,.97);border-top:1px solid var(--u-line);box-shadow:0 -8px 24px rgba(15,23,32,.06);padding:6px 6px calc(6px + env(safe-area-inset-bottom));direction:rtl}
  .u-nav a,.u-nav button{display:flex;flex-direction:column;align-items:center;gap:3px;border:0;background:none;color:#94a3b8;font-family:inherit;font-size:10.5px;font-weight:700;text-decoration:none!important;padding:4px 0;cursor:pointer}
  .u-nav i{font-size:17px}
  .u-nav .on{color:var(--u-navy)}
  .u-nav .on i{color:var(--u-or)}
  .u-nav .plus{margin-top:-22px}
  .u-nav .plus span{width:50px;height:50px;border-radius:17px;background:linear-gradient(135deg,var(--u-or2),var(--u-or));color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 22px rgba(217,130,43,.35)}
  .u-nav .plus i{font-size:19px;color:#fff!important}
  body.u-has-nav{padding-bottom:calc(72px + env(safe-area-inset-bottom))!important}
  body.u-has-nav .kai-fab,body.u-has-nav #kaiFab,body.u-has-nav .kai-launcher{bottom:calc(84px + env(safe-area-inset-bottom))!important}
  .u-sr{padding:12px 10px}
  .u-sb{border-radius:18px}
  .u-si input{font-size:16px}
  .u-si kbd,.u-ft{display:none}
  .u-dm{width:36px;height:36px}
}

/* الوضع الليلي (نسخة أولى هادئة) */
html.u-dark{filter:invert(.9) hue-rotate(180deg);background:#fff}
html.u-dark img,html.u-dark video,html.u-dark canvas,html.u-dark [style*="background-image"],html.u-dark .u-noinv,html.u-dark .sidebar,html.u-dark [class$="-hero"],html.u-dark [class*="-hero "],html.u-dark .kai-fab,html.u-dark .kai-h,html.u-dark .ig-k.sale,html.u-dark .da-kpi.hero,html.u-dark .sc-ic,html.u-dark .hm-ro .n,html.u-dark .ihc-header{filter:invert(1) hue-rotate(180deg)}
/* العناصر الداكنة أصلًا تبقى كما هي، وصورها لا تُعكس مرتين */
html.u-dark .sidebar img,html.u-dark [class$="-hero"] img,html.u-dark [class*="-hero "] img,html.u-dark .kai-fab img,html.u-dark .kai-h img,html.u-dark .ihc-header img{filter:none}

/* إبقاء الشريط العلوي ثابتًا: overflow-x:hidden على html/body يكسر sticky */
html:root,html:root>body{overflow-x:clip!important;overflow-y:visible}

/* تنقل هادئ بين الصفحات: إلغاء طبقة التحميل وحركات الظهور */
.loader-overlay,#loader-overlay,.page-loader{display:none!important}
.u-in,.tab-panel.active{animation:none!important}

/* ===== قائمة الموبايل المنظمة ===== */
.um-ov{display:none}
@media (max-width:700px){
  html.um-lock,html.um-lock body{overflow:hidden!important}
  .um-ov{display:block;position:fixed;inset:0;z-index:100000;background:rgba(15,23,32,.38);opacity:0;pointer-events:none;transition:opacity .2s}
  .um-ov.open{opacity:1;pointer-events:auto}
  .um-sh{position:absolute;inset:auto 0 0 0;max-height:92vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#fbf8f3,#f4eee4);border-radius:26px 26px 0 0;box-shadow:0 -18px 40px rgba(15,23,32,.18);transform:translateY(24px);transition:transform .22s ease;direction:rtl}
  .um-ov.open .um-sh{transform:none}
  .um-hd{display:flex;align-items:center;gap:12px;padding:14px 16px 12px;margin:10px 12px 0;background:linear-gradient(135deg,#fffdf9,#f8efe2);border:1px solid rgba(234,158,80,.35);border-radius:20px;box-shadow:inset 0 1px 0 #fff,0 8px 20px rgba(217,130,43,.10)}
  .um-hd img{width:46px;height:46px;object-fit:contain}
  .um-hd b{display:block;font-size:16px;font-weight:800;color:#1f2f3b}
  .um-hd small{font-size:10px;letter-spacing:2.2px;color:#c2782f;font-weight:800}
  .um-x{margin-right:auto;width:38px;height:38px;border-radius:12px;border:1px solid rgba(41,63,76,.12);background:#fff;color:#22333f;font-size:16px;display:flex;align-items:center;justify-content:center}
  .um-bd{overflow-y:auto;padding:4px 12px calc(18px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch}
  .um-sec{margin-top:14px}
  .um-sec h4{display:flex;align-items:center;gap:8px;margin:0 4px 8px;font-size:12px;font-weight:800;color:#8a7a66}
  .um-sec h4::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(234,158,80,.35),transparent)}
  .um-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .um-t{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px 9px;border-radius:16px;text-decoration:none!important;background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(250,242,230,.9));border:1px solid rgba(234,158,80,.28);box-shadow:inset 0 1px 0 #fff,0 4px 10px rgba(217,130,43,.08);min-height:82px}
  .um-t:active{transform:scale(.97)}
  .um-i{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,#fff,#f6ead8);box-shadow:0 2px 6px rgba(217,130,43,.18);font-size:15px;color:#d9822b}
  .um-sec:nth-of-type(even) .um-t:nth-child(odd) .um-i,.um-sec:nth-of-type(odd) .um-t:nth-child(even) .um-i{color:#22333f}
  .um-t b{font-size:11px;font-weight:800;color:#1f2f3b;text-align:center;line-height:1.35}
  .um-t.on{background:linear-gradient(150deg,#EA9E50,#d9822b);border-color:#d9822b}
  .um-t.on b{color:#fff}.um-t.on .um-i{background:rgba(255,255,255,.95);color:#d9822b}
  .um-out{display:flex;align-items:center;justify-content:center;gap:8px;margin:18px 0 4px;height:46px;border-radius:14px;background:#fff5f5;border:1px solid #fecaca;color:#b91c1c;font-weight:800;font-size:13.5px;text-decoration:none!important}
}
@media (max-width:360px){.um-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* قائمة أصغر وأهدأ + سطر تاريخ الفاتورة في البيع السريع */
@media (max-width:700px){
  .um-sh{max-height:80vh;border-radius:22px 22px 0 0}
  .um-hd{padding:9px 12px;margin:8px 10px 0;border-radius:16px;gap:10px}
  .um-hd img{width:34px;height:34px}
  .um-hd b{font-size:14px}.um-hd small{font-size:9px;letter-spacing:1.8px}
  .um-x{width:32px;height:32px;border-radius:10px;font-size:14px}
  .um-bd{padding:2px 10px calc(14px + env(safe-area-inset-bottom))}
  .um-sec{margin-top:10px}.um-sec h4{font-size:11px;margin:0 2px 6px}
  .um-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
  .um-t{min-height:62px;padding:7px 3px 6px;gap:4px;border-radius:13px}
  .um-i{width:26px;height:26px;font-size:12px;box-shadow:0 1px 4px rgba(217,130,43,.16)}
  .um-t b{font-size:10px;line-height:1.3}
  .um-out{height:40px;margin-top:12px;font-size:12.5px;border-radius:12px}
  #qsMore .qs-date{flex-wrap:wrap}
  #qsMore .qs-date input{flex:1 1 100%;min-width:0}
  #qsMore .qs-date button{flex:1 1 0}
}

/* القائمة كدرج جانبي ينسدل من اليمين */
@media (max-width:700px){
  .um-sh{inset:0 0 0 auto;width:min(84vw,340px);max-height:none;height:100%;border-radius:22px 0 0 22px;transform:translateX(105%);transition:transform .26s cubic-bezier(.2,.8,.2,1);box-shadow:-16px 0 40px rgba(15,23,32,.22)}
  .um-ov.open .um-sh{transform:none}
  .um-hd{margin:calc(10px + env(safe-area-inset-top)) 10px 0}
  .um-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .um-bd{flex:1}
}

/* ===== التابلت: نفس القائمة الجانبية بدل الشريط الطويل ===== */
@media (min-width:701px) and (max-width:1023px), (min-width:701px) and (max-width:1400px) and (pointer:coarse){
  html.um-lock,html.um-lock body{overflow:hidden!important}
  .um-ov{display:block;position:fixed;inset:0;z-index:100000;background:rgba(15,23,32,.38);opacity:0;pointer-events:none;transition:opacity .2s}
  .um-ov.open{opacity:1;pointer-events:auto}
  .um-sh{position:absolute;inset:auto 0 0 0;max-height:92vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#fbf8f3,#f4eee4);border-radius:26px 26px 0 0;box-shadow:0 -18px 40px rgba(15,23,32,.18);transform:translateY(24px);transition:transform .22s ease;direction:rtl}
  .um-ov.open .um-sh{transform:none}
  .um-hd{display:flex;align-items:center;gap:12px;padding:14px 16px 12px;margin:10px 12px 0;background:linear-gradient(135deg,#fffdf9,#f8efe2);border:1px solid rgba(234,158,80,.35);border-radius:20px;box-shadow:inset 0 1px 0 #fff,0 8px 20px rgba(217,130,43,.10)}
  .um-hd img{width:46px;height:46px;object-fit:contain}
  .um-hd b{display:block;font-size:16px;font-weight:800;color:#1f2f3b}
  .um-hd small{font-size:10px;letter-spacing:2.2px;color:#c2782f;font-weight:800}
  .um-x{margin-right:auto;width:38px;height:38px;border-radius:12px;border:1px solid rgba(41,63,76,.12);background:#fff;color:#22333f;font-size:16px;display:flex;align-items:center;justify-content:center}
  .um-bd{overflow-y:auto;padding:4px 12px calc(18px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch}
  .um-sec{margin-top:14px}
  .um-sec h4{display:flex;align-items:center;gap:8px;margin:0 4px 8px;font-size:12px;font-weight:800;color:#8a7a66}
  .um-sec h4::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(234,158,80,.35),transparent)}
  .um-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .um-t{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px 9px;border-radius:16px;text-decoration:none!important;background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(250,242,230,.9));border:1px solid rgba(234,158,80,.28);box-shadow:inset 0 1px 0 #fff,0 4px 10px rgba(217,130,43,.08);min-height:82px}
  .um-t:active{transform:scale(.97)}
  .um-i{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,#fff,#f6ead8);box-shadow:0 2px 6px rgba(217,130,43,.18);font-size:15px;color:#d9822b}
  .um-sec:nth-of-type(even) .um-t:nth-child(odd) .um-i,.um-sec:nth-of-type(odd) .um-t:nth-child(even) .um-i{color:#22333f}
  .um-t b{font-size:11px;font-weight:800;color:#1f2f3b;text-align:center;line-height:1.35}
  .um-t.on{background:linear-gradient(150deg,#EA9E50,#d9822b);border-color:#d9822b}
  .um-t.on b{color:#fff}.um-t.on .um-i{background:rgba(255,255,255,.95);color:#d9822b}
  .um-out{display:flex;align-items:center;justify-content:center;gap:8px;margin:18px 0 4px;height:46px;border-radius:14px;background:#fff5f5;border:1px solid #fecaca;color:#b91c1c;font-weight:800;font-size:13.5px;text-decoration:none!important}
  .sidebar,.sidebar-backdrop{display:none!important}
  .app-main{margin-right:0!important}
  #hamburgerBtn,.hamburger-btn{display:flex!important}
  .um-sh{inset:0 0 0 auto;width:min(60vw,420px);max-height:none;height:100%;border-radius:24px 0 0 24px;transform:translateX(105%);transition:transform .26s cubic-bezier(.2,.8,.2,1);box-shadow:-16px 0 40px rgba(15,23,32,.22)}
  .um-ov.open .um-sh{transform:none}
  .um-hd{margin:12px 12px 0;padding:10px 14px;border-radius:18px}
  .um-hd img{width:38px;height:38px}.um-hd b{font-size:15px}
  .um-bd{flex:1;padding:4px 12px 18px}
  .um-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .um-t{min-height:70px;padding:9px 4px 8px;gap:5px;border-radius:14px}
  .um-i{width:30px;height:30px;font-size:13px}
  .um-t b{font-size:11px}
  .um-sec h4{font-size:12px}
}

/* tablet fallback for touch tablets */
@media (min-width:701px){
html.u-tab.um-lock,html.u-tab.um-lock body{overflow:hidden!important}
html.u-tab .um-ov{display:block;position:fixed;inset:0;z-index:100000;background:rgba(15,23,32,.38);opacity:0;pointer-events:none;transition:opacity .2s}
html.u-tab .um-ov.open{opacity:1;pointer-events:auto}
html.u-tab .um-sh{position:absolute;inset:auto 0 0 0;max-height:92vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#fbf8f3,#f4eee4);border-radius:26px 26px 0 0;box-shadow:0 -18px 40px rgba(15,23,32,.18);transform:translateY(24px);transition:transform .22s ease;direction:rtl}
html.u-tab .um-ov.open .um-sh{transform:none}
html.u-tab .um-hd{display:flex;align-items:center;gap:12px;padding:14px 16px 12px;margin:10px 12px 0;background:linear-gradient(135deg,#fffdf9,#f8efe2);border:1px solid rgba(234,158,80,.35);border-radius:20px;box-shadow:inset 0 1px 0 #fff,0 8px 20px rgba(217,130,43,.10)}
html.u-tab .um-hd img{width:46px;height:46px;object-fit:contain}
html.u-tab .um-hd b{display:block;font-size:16px;font-weight:800;color:#1f2f3b}
html.u-tab .um-hd small{font-size:10px;letter-spacing:2.2px;color:#c2782f;font-weight:800}
html.u-tab .um-x{margin-right:auto;width:38px;height:38px;border-radius:12px;border:1px solid rgba(41,63,76,.12);background:#fff;color:#22333f;font-size:16px;display:flex;align-items:center;justify-content:center}
html.u-tab .um-bd{overflow-y:auto;padding:4px 12px calc(18px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch}
html.u-tab .um-sec{margin-top:14px}
html.u-tab .um-sec h4{display:flex;align-items:center;gap:8px;margin:0 4px 8px;font-size:12px;font-weight:800;color:#8a7a66}
html.u-tab .um-sec h4::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(234,158,80,.35),transparent)}
html.u-tab .um-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
html.u-tab .um-t{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px 9px;border-radius:16px;text-decoration:none!important;background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(250,242,230,.9));border:1px solid rgba(234,158,80,.28);box-shadow:inset 0 1px 0 #fff,0 4px 10px rgba(217,130,43,.08);min-height:82px}
html.u-tab .um-t:active{transform:scale(.97)}
html.u-tab .um-i{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,#fff,#f6ead8);box-shadow:0 2px 6px rgba(217,130,43,.18);font-size:15px;color:#d9822b}
html.u-tab .um-sec:nth-of-type(even) .um-t:nth-child(odd) .um-i,html.u-tab .um-sec:nth-of-type(odd) .um-t:nth-child(even) .um-i{color:#22333f}
html.u-tab .um-t b{font-size:11px;font-weight:800;color:#1f2f3b;text-align:center;line-height:1.35}
html.u-tab .um-t.on{background:linear-gradient(150deg,#EA9E50,#d9822b);border-color:#d9822b}
html.u-tab .um-t.on b{color:#fff}
html.u-tab .um-t.on .um-i{background:rgba(255,255,255,.95);color:#d9822b}
html.u-tab .um-out{display:flex;align-items:center;justify-content:center;gap:8px;margin:18px 0 4px;height:46px;border-radius:14px;background:#fff5f5;border:1px solid #fecaca;color:#b91c1c;font-weight:800;font-size:13.5px;text-decoration:none!important}
html.u-tab .sidebar,html.u-tab .sidebar-backdrop{display:none!important}
html.u-tab .app-main{margin-right:0!important}
html.u-tab #hamburgerBtn,html.u-tab .hamburger-btn{display:flex!important}
html.u-tab .um-sh{inset:0 0 0 auto;width:min(60vw,420px);max-height:none;height:100%;border-radius:24px 0 0 24px;transform:translateX(105%);transition:transform .26s cubic-bezier(.2,.8,.2,1);box-shadow:-16px 0 40px rgba(15,23,32,.22)}
html.u-tab .um-ov.open .um-sh{transform:none}
html.u-tab .um-hd{margin:12px 12px 0;padding:10px 14px;border-radius:18px}
html.u-tab .um-hd img{width:38px;height:38px}
html.u-tab .um-hd b{font-size:15px}
html.u-tab .um-bd{flex:1;padding:4px 12px 18px}
html.u-tab .um-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
html.u-tab .um-t{min-height:70px;padding:9px 4px 8px;gap:5px;border-radius:14px}
html.u-tab .um-i{width:30px;height:30px;font-size:13px}
html.u-tab .um-t b{font-size:11px}
html.u-tab .um-sec h4{font-size:12px}
}