/* ==========================================================
   Premium app layer — loaded after admin.css.
   Desktop: website-style panel. Phone: native-app feel.
   ========================================================== */
/* shared helpers (all sizes) */
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.chips::-webkit-scrollbar{display:none}
.chip{flex:none;padding:8px 14px;border-radius:999px;background:var(--bg);border:1px solid var(--line);color:var(--text);font-weight:600;font-size:13px;text-decoration:none!important;white-space:nowrap}
.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.bar-line{height:6px;background:var(--line-2);border-radius:6px;overflow:hidden;margin-top:6px}.bar-line span{display:block;height:100%;border-radius:6px}
.chat{display:flex;flex-direction:column;gap:10px;max-height:56vh;overflow-y:auto;padding:4px 2px 10px}
.bubble{max-width:82%;background:var(--bg);border-radius:16px 16px 16px 4px;padding:10px 14px;align-self:flex-start}
.bubble.me{background:var(--brand);color:#fff;border-radius:16px 16px 4px 16px;align-self:flex-end}.bubble small{display:block;opacity:.65;font-size:11px;margin-top:4px}
.chat-send{display:flex;gap:10px;align-items:flex-end;margin-top:10px}.chat-send textarea{flex:1;border:1px solid var(--line);border-radius:14px;padding:10px 12px;font:inherit;resize:none}
.chat-send .btn{height:46px;width:52px;padding:0;justify-content:center}
.hero{position:relative;border-radius:22px;padding:22px 20px;color:#fff;overflow:hidden;margin-bottom:18px;
  background:radial-gradient(120% 140% at 100% 0%,#2A5190 0%,#1B3A6B 38%,#16233B 100%)}
.hero::after{content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;background:rgba(224,165,38,.16)}
.hero .hi{color:#AFC0DE;font-size:13px;font-weight:600}.hero h2{font-size:1.45rem;margin:2px 0 14px;color:#fff;position:relative;z-index:1}
.hero .hstats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;position:relative;z-index:1}
.hero .hstats div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:10px 12px}
.hero .hstats small{color:#AFC0DE;display:block;font-size:12px}.hero .hstats b{font-size:1.25rem}
.qa{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}
.qa a{display:flex;flex-direction:column;align-items:center;gap:7px;padding:14px 4px 12px;background:#fff;border:1px solid var(--line);border-radius:18px;color:var(--text);font-size:12px;font-weight:700;text-align:center;text-decoration:none!important;line-height:1.2}
.qa a i{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:20px;background:var(--accent-soft);color:#8A5E00}
.qa a:nth-child(4n+2) i{background:#E6EEFB;color:var(--brand-2)}.qa a:nth-child(4n+3) i{background:var(--ok-soft);color:var(--ok)}.qa a:nth-child(4n+4) i{background:var(--bad-soft);color:var(--bad)}
.emergency{background:var(--bad);color:#fff;border-radius:14px;padding:12px 16px;margin-bottom:16px;display:flex;gap:10px;align-items:center;font-weight:700}
.sheet,.install-bar,.splash,.app-logo{display:none}
.hide-m{}
@media print, screen and (min-width:821px){.qa{grid-template-columns:repeat(8,1fr)}.hero{padding:26px 28px}.hero .hstats{grid-template-columns:repeat(4,1fr);max-width:760px}}

/* ------------- PHONE: native app shell ------------- */
@media screen and (max-width:820px){
  html{-webkit-tap-highlight-color:transparent}
  body{background:#F1F3F8}
  .hide-m{display:none!important}
  .topbar{height:calc(60px + env(safe-area-inset-top));background:linear-gradient(135deg,var(--ink) 0%,#1E3560 100%);box-shadow:0 6px 20px rgba(22,35,59,.18)}
  .topbar .icon-btn{border:0;background:rgba(255,255,255,.1);border-radius:12px;width:40px;height:40px}
  .page-title{font-size:1.1rem;font-weight:800;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #menuBtn{display:none!important}
  .back-btn{display:grid!important}
  body.is-home .back-btn{display:none!important}
  .app-logo{display:none}
  body.is-home .app-logo{display:grid;width:36px;height:36px;border-radius:11px;background:var(--accent);color:var(--ink);place-items:center;font-weight:800;font-size:13px}
  .content{animation:pageIn .28s ease both;padding-bottom:calc(110px + env(safe-area-inset-bottom))}
  @keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  .card{border-radius:20px;box-shadow:0 1px 2px rgba(22,35,59,.04),0 8px 24px rgba(22,35,59,.05)}
  .stat{border-radius:18px;box-shadow:0 1px 2px rgba(22,35,59,.04),0 8px 24px rgba(22,35,59,.05)}
  .table-wrap.cards tr{border-radius:18px;box-shadow:0 1px 2px rgba(22,35,59,.04),0 6px 18px rgba(22,35,59,.05)}
  .btn,.qa a,.list-item,.tile,.bottom-nav a,.sheet-grid a{transition:transform .12s ease}
  .btn:active,.qa a:active,a.list-item:active,.tile:active,.sheet-grid a:active{transform:scale(.96)}
  .qa{gap:8px}.qa a{border:0;box-shadow:0 1px 2px rgba(22,35,59,.05);border-radius:18px;font-size:11.5px}
  .hero{margin:-16px -14px 18px;border-radius:0 0 28px 28px;padding:18px 18px 22px}
  .form-actions{bottom:calc(88px + env(safe-area-inset-bottom));border-radius:18px;box-shadow:0 -6px 20px rgba(22,35,59,.06)}
  .toolbar{gap:8px}
  .chat{max-height:none}.chat-send{position:sticky;bottom:calc(86px + env(safe-area-inset-bottom));background:#fff;padding:8px;border-radius:18px;box-shadow:0 6px 20px rgba(22,35,59,.1)}

  /* floating tab bar */
  .bottom-nav{left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));border:0;border-radius:24px;padding:8px 6px;
    background:rgba(255,255,255,.94);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);box-shadow:0 10px 30px rgba(22,35,59,.18);align-items:center}
  .bottom-nav a,.bottom-nav button{gap:3px;font-size:10.5px;position:relative;user-select:none;-webkit-user-select:none}
  .bottom-nav a i,.bottom-nav button i{width:46px;height:30px;border-radius:15px;display:grid;place-items:center;transition:background .2s}
  .bottom-nav a.active{color:var(--ink)}.bottom-nav a.active i{background:var(--accent-soft);color:#8A5E00}
  .bottom-nav .fab{flex:0 0 auto;margin-top:-30px}
  .bottom-nav .fab i{width:58px;height:58px;border-radius:20px;background:linear-gradient(145deg,#F0B83D,#D39514);color:var(--ink);font-size:24px;box-shadow:0 8px 18px rgba(211,149,20,.45);border:4px solid #F1F3F8}
  .bottom-nav .fab span{margin-top:2px;color:var(--ink)}

  /* app drawer (bottom sheet) */
  .sheet{display:flex;flex-direction:column;position:fixed;left:0;right:0;bottom:0;z-index:60;max-height:86vh;background:#fff;border-radius:26px 26px 0 0;
    transform:translateY(105%);transition:transform .3s cubic-bezier(.2,.8,.2,1);box-shadow:0 -10px 40px rgba(0,0,0,.2);padding-bottom:env(safe-area-inset-bottom)}
  body.sheet-open .sheet{transform:none}
  body.sheet-open .scrim{display:block;position:fixed;inset:0;background:rgba(10,18,33,.5);z-index:55;backdrop-filter:blur(2px)}
  .sheet-handle{width:44px;height:5px;border-radius:5px;background:#D5DBE6;margin:10px auto 6px}
  .sheet-head{display:flex;gap:10px;align-items:center;padding:4px 18px 12px}
  .sheet-head input{flex:1;height:44px;border:0;background:var(--bg);border-radius:14px;padding:0 14px 0 38px;font:inherit;font-size:15px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%236B7486' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398l3.85 3.85a1 1 0 0 0 1.415-1.414zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:13px center}
  .sheet-body{overflow-y:auto;padding:0 14px 20px;overscroll-behavior:contain}
  .sheet-body h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:14px 6px 8px}
  .sheet-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
  .sheet-grid a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 2px;border-radius:14px;color:var(--text);font-size:11px;font-weight:600;text-align:center;line-height:1.2;text-decoration:none!important}
  .sheet-grid a i{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;font-size:20px;background:#EEF2F9;color:var(--brand)}
  .sheet-grid a.on i{background:var(--ink);color:var(--accent)}
  .sheet-foot{display:flex;gap:10px;padding:10px 18px 14px;border-top:1px solid var(--line-2)}
  .sheet-foot a{flex:1}
  .sidebar{display:none}

  /* install banner + splash */
  .install-bar{display:flex;position:fixed;left:12px;right:12px;bottom:calc(92px + env(safe-area-inset-bottom));z-index:50;background:var(--ink);color:#fff;border-radius:18px;padding:12px 14px;gap:12px;align-items:center;box-shadow:0 10px 30px rgba(0,0,0,.25);animation:pageIn .3s}
  .install-bar[hidden]{display:none}.install-bar img{width:38px;height:38px;border-radius:10px}.install-bar div{flex:1;font-size:13px}.install-bar b{display:block;font-size:14px}
  .install-bar .btn{height:36px;padding:0 14px}.install-bar button.x{background:none;border:0;color:#8C98B0;font-size:20px}
  .splash{display:grid;position:fixed;inset:0;z-index:100;place-items:center;background:radial-gradient(120% 100% at 50% 0%,#2A5190,#16233B 70%);color:#fff;transition:opacity .35s}
  .splash.gone{opacity:0;pointer-events:none}.splash .mk{width:84px;height:84px;border-radius:26px;background:var(--accent);color:var(--ink);display:grid;place-items:center;font-size:30px;font-weight:800;margin:0 auto 14px;box-shadow:0 12px 30px rgba(0,0,0,.3)}
  .splash .mk img{width:84px;height:84px;border-radius:26px;object-fit:contain;background:#fff}
  .splash p{text-align:center;margin:0;font-weight:800;font-size:18px}.splash small{display:block;text-align:center;color:#AFC0DE;margin-top:4px}
}
@media screen and (display-mode:standalone) and (max-width:820px){.topbar{padding-top:env(safe-area-inset-top)}}
.grid>*{min-width:0}
.bars{overflow-x:auto}
@media screen and (max-width:820px){.main{overflow-x:clip;min-width:0}.content{max-width:100vw}.emergency{margin-top:4px}.hero+.emergency{margin-top:0}}
.push-bar{display:flex;position:fixed;left:12px;right:12px;bottom:calc(92px + env(safe-area-inset-bottom));z-index:51;background:#fff;color:var(--text);border-radius:18px;padding:12px 14px;gap:12px;align-items:center;box-shadow:0 10px 30px rgba(22,35,59,.25);max-width:520px;margin:0 auto}
.push-bar[hidden]{display:none}.push-bar>i{font-size:22px;color:var(--accent)}.push-bar div{flex:1;font-size:13px}.push-bar b{display:block;font-size:14px}.push-bar span{color:var(--muted)}.push-bar button.x{background:none;border:0;font-size:20px;color:var(--muted)}
@media print, screen and (min-width:821px){.push-bar{left:auto;right:24px;bottom:24px;width:420px}}
/* global search (desktop) */
.gsearch{position:relative;flex:0 1 420px;display:flex;align-items:center;height:42px;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:0 10px 0 12px;gap:8px;margin-left:auto}
.gsearch:focus-within{border-color:var(--brand-2);background:#fff;box-shadow:0 0 0 4px rgba(42,81,144,.1)}
.gsearch input{flex:1;border:0;background:transparent;font:inherit;outline:0;min-width:0;height:100%}.gsearch>i{color:var(--muted)}
.gsearch kbd{font:600 11px var(--font);color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:1px 6px;background:#fff}
.gs-res{position:absolute;top:48px;left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 50px rgba(22,35,59,.18);max-height:70vh;overflow:auto;padding:6px;z-index:60}
.gs-res a{display:flex;gap:10px;align-items:center;padding:8px 10px;border-radius:10px;color:var(--text);text-decoration:none}.gs-res a.on,.gs-res a:hover{background:var(--accent-soft)}
.gs-res a i{width:32px;height:32px;border-radius:10px;background:var(--bg);display:grid;place-items:center;flex:none;color:var(--brand)}
.gs-res b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gs-res small{color:var(--muted);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-res .gs-type{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:8px 10px 2px}.gs-res .gs-all{justify-content:center;font-weight:700;color:var(--brand-2)}
.topbar .page-title{flex:0 1 auto}
@media screen and (max-width:820px){.gsearch{display:none!important}}
[hidden]{display:none!important}