[hidden]{display:none!important}
:root{font-family:Inter,system-ui,-apple-system,sans-serif;color:#edf4ff;background:#07101d}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#07101d}body{overflow-x:hidden}.login{min-height:100dvh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at top,#173b69,#07101d 58%)}.card,.modal-card{background:#101c2d;border:1px solid #26374d;border-radius:18px;padding:24px;box-shadow:0 20px 60px #0008}.login-card{width:min(420px,100%)}.logo,.brand{font-size:24px;font-weight:900}.logo span,.brand span{color:#2f91ff}.login h1{margin:16px 0 4px;font-size:22px}.login p{margin:0 0 16px;color:#91a2ba}input,select,textarea{width:100%;background:#0a1422;border:1px solid #2c3e55;color:#fff;border-radius:10px;padding:12px;margin:7px 0;font:inherit}textarea{min-height:90px;resize:vertical}button{border:0;border-radius:10px;padding:11px 14px;background:#1976ff;color:#fff;font-weight:700;cursor:pointer}.primary{width:100%;margin-top:8px}#loginMsg{min-height:22px;margin-top:10px;color:#ff9a9a}#app{min-height:100dvh;display:grid;grid-template-columns:230px minmax(0,1fr)}aside{position:sticky;top:0;height:100dvh;padding:22px 14px;border-right:1px solid #1d2a3b;background:#0a1422;display:flex;flex-direction:column;gap:20px;z-index:30}nav{display:grid;gap:7px}nav button{text-align:left;background:transparent;color:#aebbd0}nav button.active{background:#153257;color:#fff}.logout{margin-top:auto;background:#172235}main{min-width:0}header{min-height:76px;padding:14px 24px;border-bottom:1px solid #1d2a3b;display:flex;align-items:center;gap:14px}header>div:first-of-type{flex:1}h2{margin:0}.admin-email{max-width:38vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#9fb0c7;font-size:13px}.menu{display:none;background:#172235;font-size:20px;padding:8px 11px}#content{padding:24px;max-width:1500px}.stats{display:grid;grid-template-columns:repeat(5,minmax(140px,1fr));gap:14px}.stat{background:#101c2d;border:1px solid #24354a;border-radius:16px;padding:18px}.stat b{font-size:28px;display:block;margin-top:10px}.toolbar{display:flex;gap:10px;justify-content:flex-end;margin:0 0 16px}.table-wrap{width:100%;overflow:auto;border:1px solid #24354a;border-radius:14px}table{width:100%;border-collapse:collapse;background:#0e1929}th,td{padding:13px;text-align:left;border-bottom:1px solid #1d2a3b;white-space:nowrap}th{color:#8ea1ba;font-size:12px;text-transform:uppercase}.empty{padding:40px;text-align:center;color:#8292a8}dialog{border:0;background:transparent;color:#fff;padding:16px;max-width:none;width:100%;height:100%}dialog::backdrop{background:#0009}.modal-card{width:min(560px,100%);position:relative;margin:auto;max-height:calc(100dvh - 32px);overflow:auto}.x{position:absolute;right:12px;top:12px;background:#1d2a3b}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}#scrim{display:none}
@media(max-width:850px){#app{display:block}aside{position:fixed;left:0;top:0;width:260px;transform:translateX(-105%);transition:.2s ease;box-shadow:20px 0 50px #0008}body.nav-open aside{transform:translateX(0)}#scrim{position:fixed;inset:0;background:#0008;z-index:20}body.nav-open #scrim{display:block}.menu{display:block}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}#content{padding:14px}header{padding:12px 14px}.admin-email{max-width:32vw}}
@media(max-width:520px){.stats{grid-template-columns:1fr}.grid2{grid-template-columns:1fr}.login{padding:14px}.card,.modal-card{padding:20px}.admin-email{display:none}.toolbar button{width:100%}}
.notice{padding:14px 16px;border:1px solid #29405d;border-radius:14px;background:#0c1a2b;margin-bottom:14px;color:#c9d7e8}.section{padding:18px}.section-head{display:flex;justify-content:space-between;align-items:center}.muted{opacity:.7}.badge{display:inline-block;padding:4px 9px;border-radius:999px;background:#23334a;font-size:12px}.badge.active{background:#123b2a}.badge.expired,.badge.inactive{background:#492128}.badge.expiring-soon{background:#4a3b16}.mini,.secondary{padding:7px 10px;font-size:12px}.danger{background:#7c2430!important;margin-top:8px}.detail{display:grid;gap:5px;padding:12px;border-radius:12px;background:#0d1725;margin-bottom:12px}.check{display:flex!important;align-items:center;gap:8px}.check input{width:auto!important}.msg{min-height:20px;color:#ff9ca8}.search{max-width:280px}hr{border:0;border-top:1px solid #24354a;margin:20px 0}

/* Auth visibility + mobile login fix */
body:not(.authenticated) #app{display:none!important}
body.authenticated #login{display:none!important}
@media(max-width:520px){.login{min-height:100dvh;align-items:center;padding:20px}.login-card{width:100%;max-width:420px;margin:auto}.login-card input{min-height:54px}.login-card .primary{min-height:54px}}

/* Service form clarity */
#modal form>label:not(.check){display:block;margin:14px 0 7px;font-weight:700;color:#b8c7da;font-size:14px}
#modal .field-help{display:block;margin:-6px 0 10px;color:#7f93aa;font-size:12px;line-height:1.4}
#modal textarea[name="custom_fields"],#modal textarea[name="custom_buttons"]{min-height:112px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px}

/* V5 mobile polish */
@media(max-width:700px){
  .toolbar{display:grid;grid-template-columns:1fr 1fr;align-items:stretch}
  .toolbar .search{grid-column:1/-1;max-width:none}
  .toolbar button{width:100%}
  .table-wrap{overflow:visible;border:0;background:transparent}
  .table-wrap table,.table-wrap thead,.table-wrap tbody,.table-wrap tr,.table-wrap td{display:block;width:100%}
  .table-wrap thead{display:none}
  .table-wrap tbody{display:grid;gap:12px}
  .table-wrap tr{background:#0e1929;border:1px solid #24354a;border-radius:14px;padding:12px;overflow:hidden}
  .table-wrap td{border:0;padding:7px 4px;white-space:normal;overflow-wrap:anywhere;display:flex;justify-content:space-between;gap:14px;align-items:center}
  .table-wrap td::before{content:attr(data-label);color:#8ea1ba;font-size:11px;text-transform:uppercase;font-weight:700;flex:0 0 86px}
  .table-wrap td:last-child button{width:100%}
  .table-wrap td.empty{display:block;text-align:center;padding:28px}
  .table-wrap td.empty::before{display:none}
  .section-head{gap:12px}.section-head h3{min-width:0}
  .modal-card{max-height:calc(100dvh - 20px);padding:18px;margin:0 auto}
  #modal form>label:not(.check){margin-top:11px}
  #modal textarea[name="custom_fields"],#modal textarea[name="custom_buttons"]{min-height:70px;max-height:120px}
  #modal textarea[name="description"]{min-height:84px}
  .field-grid{gap:8px}
}
