/* CNP Admin: app-style mobile layer */
:root{--safe-b:env(safe-area-inset-bottom,0px);--tab-h:62px}
.m-tabbar{display:none}
@media(max-width:760px){
:root{--safe-b:env(safe-area-inset-bottom,0px)}
html{-webkit-text-size-adjust:100%;scroll-padding-top:70px;scroll-padding-bottom:calc(var(--tab-h) + var(--safe-b) + 24px)}
.toasts{pointer-events:none}.toasts>*{pointer-events:auto}
body{-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}
main{padding:16px 14px calc(var(--tab-h) + var(--safe-b) + 28px)!important}
.topbar{position:sticky;top:0;z-index:40;height:56px!important;padding:env(safe-area-inset-top,0px) 12px 0!important;backdrop-filter:blur(16px);background:color-mix(in srgb,var(--card) 88%,transparent)}
.top-actions a:not(.icon-button){font-size:12px}.top-actions{gap:8px!important}
.menu-toggle{min-width:44px;min-height:44px}
.sidebar{z-index:90;width:min(290px,82vw)!important;padding-bottom:calc(var(--tab-h) + 20px)}
.sidebar.open::after{content:"";position:fixed;inset:0 0 0 min(290px,82vw);background:#0007;z-index:-1}
.page-heading h1{font-size:24px}.page-heading p{font-size:12px}
/* horizontally scrolling pills instead of wrapping blocks */
.page-tabs,.flow-steps{flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden;gap:8px;margin:0 -14px 16px!important;padding:2px 14px 6px!important;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.page-tabs::-webkit-scrollbar,.flow-steps::-webkit-scrollbar{display:none}
.page-tabs .tab,.flow-steps .fs{flex:0 0 auto;padding:10px 16px!important;min-height:40px;scroll-snap-align:start}
/* controls */
input,select,textarea{font-size:16px!important;min-height:46px}
.button,button,.tab{min-height:44px}
.button.small{min-height:40px}
.card{border-radius:18px}
.actions{flex-wrap:wrap;gap:8px}
.actions .button{flex:1 1 auto;justify-content:center;text-align:center}
.table-wrap{margin:0 -4px;border-radius:12px;-webkit-overflow-scrolling:touch}
table{font-size:13px}
.result-flag{font-size:12px}
.page-footer{display:none}
/* bottom tab bar */
.m-tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:80;min-height:calc(var(--tab-h) + var(--safe-b));padding:6px 6px var(--safe-b);background:color-mix(in srgb,var(--card) 92%,transparent);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);border-top:1px solid var(--line);box-shadow:0 -8px 30px #0b1f3a14}
.m-tabbar a,.m-tabbar button{all:unset;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:50px;border-radius:14px;font-size:10.5px;font-weight:700;color:var(--muted);cursor:pointer;position:relative}
.m-tabbar svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.m-tabbar .on{color:var(--blue)}.m-tabbar .on::before{content:"";position:absolute;top:-7px;width:26px;height:3px;border-radius:0 0 3px 3px;background:var(--blue)}
.m-tabbar a:active,.m-tabbar button:active{transform:scale(.93)}
.m-tabbar .badge-dot{position:absolute;top:4px;right:calc(50% - 20px);min-width:16px;height:16px;border-radius:8px;background:#e5484d;color:#fff;font-size:9px;display:grid;place-items:center;padding:0 4px}
.toasts{top:64px!important;right:12px!important}
}
@media(max-width:380px){.m-tabbar a,.m-tabbar button{font-size:9.5px}}
@media(display-mode:standalone){.page-footer{display:none}}
