:root{
  --navy:#0b2e5c;--navy2:#174f7a;--ink:#16283a;--muted:#6d7d8e;--line:#dce4eb;
  --soft:#f4f7f9;--white:#fff;--green:#1c8a5b;--red:#bd433c;--gold:#b9873f;
}
*{box-sizing:border-box}
[hidden]{display:none !important;}
html,body{margin:0;min-height:100%;font-family:"Segoe UI","Microsoft YaHei",Arial,sans-serif;color:var(--ink);background:#eaf0f4}
button,input,select,textarea{font:inherit}
button,a.primary{cursor:pointer}
.sp{flex:1}
.brand-mark{display:grid;place-items:center;width:48px;height:48px;border-radius:12px;color:#fff;background:linear-gradient(145deg,var(--navy),var(--navy2));font-weight:900;letter-spacing:.08em;box-shadow:0 10px 24px rgba(11,46,92,.22)}
.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;border-radius:8px;padding:10px 15px;text-decoration:none;font-weight:700;border:1px solid transparent}
.primary{background:var(--navy);color:#fff}
.primary:hover{background:var(--navy2)}
.secondary{background:#fff;color:var(--ink);border-color:var(--line)}
.secondary:hover{border-color:#b7c5d1}
.admin-login,.access-denied{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 10%,rgba(23,79,122,.18),transparent 35%),#eaf0f4}
.login-card,.denied-card{width:min(420px,100%);padding:30px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 28px 80px rgba(17,46,74,.16)}
.login-brand{display:flex;align-items:center;gap:12px;margin-bottom:26px}
.login-brand div,.header-brand div{display:flex;flex-direction:column}
.login-brand strong,.header-brand strong{font-size:16px}
.login-brand small,.header-brand small,.panel-title small,.modal-head small{font-size:10px;font-weight:800;letter-spacing:.16em;color:var(--gold)}
.login-card h1,.denied-card h1{margin:0 0 8px;font-size:26px}
.login-card p,.denied-card p{margin:0 0 22px;color:var(--muted);font-size:13px;line-height:1.7}
.login-card label{display:flex;flex-direction:column;gap:7px;margin:14px 0;font-size:12px;font-weight:700}
.login-card input{padding:12px;border:1px solid var(--line);border-radius:8px;outline:none}
.login-card input:focus{border-color:var(--navy2);box-shadow:0 0 0 3px rgba(23,79,122,.10)}
.login-card .primary{width:100%;margin-top:12px}
.login-error,.modal-error{padding:10px;border:1px solid #efc6c3;border-radius:7px;background:#fff4f3;color:var(--red);font-size:12px}
.back-link{display:block;margin-top:18px;text-align:center;color:var(--muted);font-size:12px;text-decoration:none}
.denied-card{text-align:center}
.denied-card .brand-mark{margin:0 auto 18px}
.denied-card div{display:flex;justify-content:center;gap:10px}
.admin-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;min-height:68px;padding:10px 28px;color:#fff;background:var(--navy);box-shadow:0 5px 20px rgba(7,27,53,.2)}
.header-brand{display:flex;align-items:center;gap:10px}
.main-tabs{display:flex;gap:4px;padding:4px;border-radius:9px;background:rgba(255,255,255,.1)}
.main-tabs .tab{padding:9px 15px;border:0;border-radius:7px;color:rgba(255,255,255,.7);background:transparent;font-weight:700}
.main-tabs .tab.on{color:var(--navy);background:#fff}
.admin-header .secondary{color:#fff;background:transparent;border-color:rgba(255,255,255,.25)}
.admin-user{font-size:12px;color:rgba(255,255,255,.75)}
.admin-main{width:min(1480px,calc(100% - 36px));margin:24px auto 50px}
.panel{display:none;padding:26px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 12px 35px rgba(17,46,74,.07)}
.panel.on{display:block}
.panel-title{display:flex;align-items:center;gap:18px;margin-bottom:22px}
.panel-title h1{margin:2px 0 0;font-size:24px}
.panel-title p{margin:6px 0 0;color:var(--muted);font-size:12px}
.updated,.count{color:var(--muted);font-size:12px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.kpi{padding:18px;border:1px solid var(--line);border-radius:11px;background:linear-gradient(145deg,#fff,var(--soft))}
.kpi span{display:block;color:var(--muted);font-size:11px;font-weight:700}
.kpi strong{display:block;margin-top:7px;font-size:30px}
.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.quick-card{display:grid;grid-template-columns:48px 1fr;grid-template-rows:auto auto;text-align:left;gap:2px 14px;padding:20px;border:1px solid var(--line);border-radius:12px;background:#fff}
.quick-card:hover{border-color:#aebdca;box-shadow:0 10px 25px rgba(17,46,74,.08)}
.quick-card span{grid-row:1/3;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;color:#fff;background:var(--navy);font-weight:900}
.quick-card strong{font-size:16px}
.quick-card small{color:var(--muted)}
.toolbar{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.toolbar input,.toolbar select{min-width:240px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;outline:none}
.toolbar input:focus,.toolbar select:focus{border-color:var(--navy2)}
.toolbar .count{margin-left:auto}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:10px}
table{width:100%;border-collapse:collapse;font-size:12px}
th{padding:11px 12px;text-align:left;color:#536679;background:var(--soft);font-size:10px;letter-spacing:.04em;white-space:nowrap}
td{padding:12px;border-top:1px solid #e8edf1;vertical-align:middle}
tbody tr:hover{background:#fafcfd}
.right{text-align:right}
.empty{padding:38px!important;text-align:center;color:var(--muted)}
.badge{display:inline-flex;padding:4px 8px;border-radius:20px;font-size:10px;font-weight:800;background:#eaf0f5;color:#4d6175}
.badge.admin{background:#fff3dc;color:#8b6328}
.badge.template{background:#f0eafa;color:#654a9a}
.badge.off{background:#fae8e7;color:var(--red)}
.badge.on{background:#e5f5ed;color:var(--green)}
.row-actions{display:flex;justify-content:flex-end;gap:6px}
.mini{padding:6px 9px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink)}
.mini:hover{border-color:#aebdca}
.mini.danger{color:var(--red)}
.modal-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:rgba(8,25,43,.55);backdrop-filter:blur(3px)}
.modal{width:min(560px,100%);padding:24px;border-radius:14px;background:#fff;box-shadow:0 30px 90px rgba(0,0,0,.28)}
.modal-wide{width:min(860px,100%)}
.modal-head{display:flex;align-items:center;margin-bottom:18px}
.modal-head h2{margin:2px 0 0}
.icon-btn{width:34px;height:34px;border:0;border-radius:50%;background:var(--soft);font-size:23px;line-height:1}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-grid label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:700}
.form-grid label.wide{grid-column:1/-1}
.form-grid label small{color:var(--muted);font-weight:400}
.form-grid input,.form-grid select{width:100%;padding:10px 11px;border:1px solid var(--line);border-radius:7px;background:#fff}
.check-field{flex-direction:row!important;align-items:center;margin-top:25px}
.modal textarea{width:100%;height:440px;resize:vertical;padding:13px;border:1px solid var(--line);border-radius:8px;background:#f8fafb;font:12px/1.6 Consolas,monospace;outline:none}
.modal-note{margin:-7px 0 12px;color:var(--muted);font-size:12px}
.modal-error{margin-top:14px}
.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}
.toast{position:fixed;right:22px;bottom:22px;z-index:80;padding:12px 16px;border-radius:8px;color:#fff;background:#173d61;box-shadow:0 14px 35px rgba(0,0,0,.25);font-size:12px}
@media(max-width:900px){.admin-header{flex-wrap:wrap;padding:10px 14px}.kpis{grid-template-columns:1fr 1fr}.quick-grid{grid-template-columns:1fr}.admin-user{display:none}.toolbar{flex-wrap:wrap}.toolbar input,.toolbar select{min-width:100%}.form-grid{grid-template-columns:1fr}.panel{padding:18px}}
