:root{--bg:#09090b;--panel:#121218;--panel2:#17171e;--text:#f5f2ec;--muted:#9b97a1;--line:rgba(255,255,255,.1);--lime:#d8ff52;--violet:#8a6cff;--danger:#ff6f86}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top right,rgba(138,108,255,.11),transparent 28%),#09090b;color:var(--text);font-family:Inter,system-ui,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}.admin-shell{min-height:100vh;display:grid;grid-template-columns:250px 1fr}.sidebar{position:sticky;top:0;height:100vh;padding:22px 16px;border-right:1px solid var(--line);background:rgba(9,9,11,.8);backdrop-filter:blur(18px)}.admin-brand{display:flex;align-items:center;gap:10px;font:800 18px 'Space Grotesk';margin-bottom:22px}.brand-mark{display:grid;place-items:center;width:30px;height:30px;border:1px solid rgba(216,255,82,.5);border-radius:9px;color:var(--lime)}.nav{display:grid;gap:5px}.nav a{padding:12px 13px;border-radius:12px;color:#a6a2ac;font-size:13px}.nav a:hover,.nav a.active{background:rgba(216,255,82,.07);color:#fff}.nav small{margin:18px 13px 7px;color:#5f5b64;font:500 9px 'DM Mono';letter-spacing:.13em;text-transform:uppercase}.sidebar-bottom{position:absolute;bottom:18px;left:16px;right:16px;display:grid;gap:8px}.small-link,.logout{font-size:12px;color:#77737d}.main{padding:26px;min-width:0}.topbar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:24px}.topbar h1{margin:0;font:800 34px/.95 'Space Grotesk';letter-spacing:-.04em}.topbar p{margin:7px 0 0;color:#8f8b95;font-size:12px}.btn{border:1px solid var(--line);background:var(--panel2);color:#fff;padding:11px 14px;border-radius:12px;font-weight:700}.btn.primary{background:var(--lime);color:#101014;border-color:transparent}.btn.danger{color:#fff;border-color:rgba(255,111,134,.35)}.btn:disabled{opacity:.5;cursor:not-allowed}.grid{display:grid;gap:14px}.stats{grid-template-columns:repeat(6,1fr)}.stat,.panel{border:1px solid var(--line);background:rgba(18,18,24,.78);border-radius:18px;box-shadow:0 20px 55px rgba(0,0,0,.15)}.stat{padding:18px}.stat .k{color:#77737d;font:500 10px 'DM Mono';text-transform:uppercase;letter-spacing:.1em}.stat .v{margin-top:8px;font:800 30px 'Space Grotesk'}.panels{grid-template-columns:1.2fr .8fr;margin-top:14px}.panel{padding:18px}.panel h2{margin:0 0 14px;font:700 20px 'Space Grotesk'}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;font-size:12px}.table th,.table td{padding:12px 10px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}.muted{color:#817d87}.badge{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;background:rgba(216,255,82,.09);color:var(--lime);font:500 9px 'DM Mono';letter-spacing:.08em}.badge.demo{background:rgba(138,108,255,.11);color:#b8a9ff}.actions{display:flex;flex-wrap:wrap;gap:6px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-grid .full{grid-column:1/-1}.field{display:grid;gap:7px}.field label{font:500 10px 'DM Mono';text-transform:uppercase;letter-spacing:.1em;color:#86818b}.field input,.field textarea,.field select{width:100%;color:#fff;background:#0d0d12;border:1px solid var(--line);border-radius:12px;padding:12px;outline:none}.field textarea{min-height:120px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-color:rgba(216,255,82,.55);box-shadow:0 0 0 4px rgba(216,255,82,.06)}.form-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.notice{margin:0 0 14px;padding:12px 13px;border-radius:12px;background:rgba(255,255,255,.04);color:#a8a4ad;font-size:12px}.success{color:#d8ff52}.error{color:#ff9aac}.login{min-height:100vh;display:grid;place-items:center;padding:20px}.login-card{width:min(440px,100%);padding:30px;border:1px solid var(--line);border-radius:24px;background:rgba(18,18,24,.92);box-shadow:0 40px 120px rgba(0,0,0,.4)}.login-card h1{margin:0 0 8px;font:800 42px/.95 'Space Grotesk'}.login-card p{color:#8e8a94;line-height:1.5}.login-card .field{margin-top:14px}.hidden{display:none!important}.thumb{width:64px;height:46px;object-fit:cover;border-radius:9px;border:1px solid var(--line)}.toolbar{display:flex;gap:8px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:14px}.toolbar-left,.toolbar-right{display:flex;gap:8px;flex-wrap:wrap}.search{min-width:240px}.check{display:flex!important;align-items:center;gap:8px!important;grid-template-columns:auto 1fr!important}.check input{width:auto}.preview{width:130px;aspect-ratio:1.2;border:1px dashed var(--line);border-radius:12px;object-fit:cover;background:#0d0d12}.empty{padding:28px;text-align:center;color:#75717b;border:1px dashed var(--line);border-radius:14px}.auth-link{color:var(--lime)}@media(max-width:1100px){.stats{grid-template-columns:repeat(3,1fr)}.panels{grid-template-columns:1fr}}@media(max-width:760px){.admin-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto;border-right:0;border-bottom:1px solid var(--line)}.nav{grid-template-columns:repeat(2,1fr)}.sidebar-bottom{position:static;margin-top:15px}.main{padding:14px}.stats{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.topbar{align-items:flex-start}.topbar h1{font-size:28px}.search{min-width:0;width:100%}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Admin mobile usability and dense-data protection */
@media(max-width:760px){
 .main{padding:16px 12px}
 .topbar{align-items:flex-start;flex-direction:column}
 .topbar h1{font-size:30px}
 .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .stat{padding:14px}
 .stat .v{font-size:25px}
 .form-grid{grid-template-columns:1fr}
 .form-grid .full{grid-column:auto}
 .toolbar{align-items:stretch}
 .toolbar-left,.toolbar-right{width:100%}
 .search{min-width:0;width:100%}
 .table-wrap{border-radius:12px}
 .table{min-width:640px}
 .sidebar{padding:12px;overflow-x:auto}
 .nav{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}
 .nav a{white-space:nowrap}
 .sidebar-bottom{position:static;margin-top:12px}
}


/* Admin UI 2.0: responsive, clearer and more comfortable on touch screens. */
:root{--admin-lime:#d9ff55;--admin-cyan:#59e8ff;--admin-violet:#7e64ff;--admin-radius:22px}
body{background:radial-gradient(900px 500px at 90% -10%,rgba(126,100,255,.18),transparent 60%),radial-gradient(700px 450px at -10% 100%,rgba(89,232,255,.08),transparent 60%),#09090b}
.admin-shell{gap:0}
.sidebar{background:linear-gradient(180deg,rgba(17,17,24,.94),rgba(9,9,11,.88));box-shadow:18px 0 60px rgba(0,0,0,.18)}
.admin-brand{font-size:20px;letter-spacing:-.04em;padding:8px 6px 18px}
.nav a{position:relative;display:flex;align-items:center;gap:8px;border:1px solid transparent;transition:background .2s,border-color .2s,transform .2s}
.nav a:hover{transform:translateX(3px);border-color:rgba(217,255,85,.13)}
.nav a.active{background:linear-gradient(90deg,rgba(217,255,85,.13),rgba(126,100,255,.06));border-color:rgba(217,255,85,.16);box-shadow:inset 3px 0 0 var(--lime)}
.main{padding:clamp(16px,3vw,34px);max-width:1700px;width:100%}
.topbar{padding:20px 22px;border:1px solid rgba(255,255,255,.08);border-radius:var(--admin-radius);background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.018));box-shadow:0 22px 70px rgba(0,0,0,.16)}
.topbar h1{font-size:clamp(30px,4vw,46px);letter-spacing:-.055em}
.topbar p{font-size:13px;max-width:520px;line-height:1.5}
.notice:empty{display:none}
.stat,.panel{border-radius:var(--admin-radius);background:linear-gradient(145deg,rgba(25,25,34,.92),rgba(13,13,18,.9));border-color:rgba(255,255,255,.09);box-shadow:0 18px 70px rgba(0,0,0,.2)}
.stat{position:relative;overflow:hidden;transition:transform .2s,border-color .2s}
.stat:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(217,255,85,.06),transparent 48%);pointer-events:none}
.stat:hover{transform:translateY(-3px);border-color:rgba(217,255,85,.22)}
.stat .v{font-size:clamp(25px,3vw,38px);letter-spacing:-.04em}
.panel{padding:clamp(16px,2vw,24px)}
.panel h2{font-size:clamp(20px,2.4vw,27px);letter-spacing:-.035em}
.btn{min-height:42px;border-radius:13px;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);border-color:rgba(217,255,85,.3);box-shadow:0 10px 25px rgba(0,0,0,.18)}
.btn.primary{box-shadow:0 10px 30px rgba(217,255,85,.12)}
.btn:focus-visible,.nav a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid rgba(89,232,255,.8);outline-offset:3px}
.table-wrap{border:1px solid rgba(255,255,255,.07);border-radius:16px}
.table th{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#85818d;background:rgba(255,255,255,.025)}
.table td{padding:15px 12px}
.table tbody tr{transition:background .2s}
.table tbody tr:hover{background:rgba(217,255,85,.035)}
.field input,.field textarea,.field select{min-height:46px;border-radius:14px;background:rgba(5,5,9,.72);border-color:rgba(255,255,255,.1)}
.field textarea{line-height:1.55}
.form-actions{position:sticky;bottom:10px;padding:12px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(9,9,11,.86);backdrop-filter:blur(16px);z-index:5}
.toolbar{padding:12px 0 16px}
.empty{background:rgba(255,255,255,.018);padding:42px 20px}
.login-card{box-shadow:0 35px 120px rgba(0,0,0,.48),0 0 0 1px rgba(217,255,85,.04);background:linear-gradient(145deg,rgba(24,24,33,.96),rgba(10,10,14,.96))}
@media(max-width:1100px){.admin-shell{grid-template-columns:220px 1fr}.stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){
  .admin-shell{display:block}
  .sidebar{position:relative;height:auto;padding:12px;border-right:0;border-bottom:1px solid rgba(255,255,255,.1)}
  .admin-brand{padding:4px 4px 12px;margin-bottom:4px}
  .nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;overflow:visible}
  .nav small{grid-column:1/-1;margin:12px 4px 2px}
  .nav a{min-height:44px;padding:12px;border-radius:12px}
  .sidebar-bottom{display:flex;align-items:center;gap:8px;position:static;margin-top:12px}
  .sidebar-bottom>*{flex:1}
  .main{padding:12px}
  .topbar{padding:18px;gap:12px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .stat{padding:14px}
  .panels{gap:12px}
  .panel{padding:14px}
  .toolbar-left,.toolbar-right{width:100%}
  .toolbar .btn{flex:1}
  .form-actions{position:static}
}
@media(max-width:420px){.nav{grid-template-columns:1fr 1fr}.stat .v{font-size:24px}.topbar h1{font-size:28px}.actions .btn{flex:1}.table{min-width:680px}}
@media(prefers-reduced-motion:reduce){.nav a,.btn,.stat,.table tbody tr{transition:none!important}.stat:hover,.btn:hover,.nav a:hover{transform:none}}