:root{--ink:#1c2430; --ink-soft:#5b6472; --line:#e6e8ec; --paper:#f5f6f8; --accent:#1f8a94;}
*{box-sizing:border-box; margin:0; padding:0;}
body{font-family:'Poppins',sans-serif; background:var(--paper); color:var(--ink); min-height:100vh;}
a{color:inherit; text-decoration:none;}

.admin-topbar{background:#0e1b2c; color:#fff; display:flex; align-items:center; justify-content:space-between; padding:14px 26px;}
.admin-topbar .brand{font-weight:700; font-size:15px; display:flex; align-items:center; gap:8px;}
.admin-topbar nav{display:flex; gap:18px; align-items:center;}
.admin-topbar nav a{font-size:13px; color:#c9d3de; font-weight:600;}
.admin-topbar nav a:hover, .admin-topbar nav a.active{color:#fff;}
.admin-topbar .logout{background:rgba(255,255,255,.1); padding:8px 14px; border-radius:8px; font-size:12.5px;}
.nav-badge{background:#e15656; color:#fff; font-size:10.5px; font-weight:700; padding:1px 6px; border-radius:999px; margin-left:3px;}

.checkbox-group{display:flex; flex-wrap:wrap; gap:8px;}
.checkbox-chip{
  display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border:1px solid var(--line);
  border-radius:999px; font-size:12.5px; cursor:pointer; background:#fff; user-select:none;
}
.checkbox-chip input{ margin:0; }
.checkbox-chip:has(input:checked){ background:#eef6f7; border-color:var(--accent); color:var(--accent); font-weight:600; }

.admin-wrap{max-width:1100px; margin:0 auto; padding:30px 20px 60px;}
.admin-card{background:#fff; border-radius:14px; box-shadow:0 8px 24px -16px rgba(20,30,50,.25); padding:24px; margin-bottom:24px;}
.admin-card h2{font-size:18px; margin-bottom:16px;}

.admin-table{width:100%; border-collapse:collapse; font-size:13.5px;}
.admin-table th{text-align:left; padding:10px 12px; border-bottom:2px solid var(--line); color:var(--ink-soft); font-size:11.5px; text-transform:uppercase; letter-spacing:.4px;}
.admin-table td{padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:middle;}
.admin-table img{width:52px; height:40px; object-fit:cover; border-radius:6px;}
.admin-table .badge{display:inline-block; padding:3px 10px; border-radius:999px; font-size:11px; font-weight:700; color:#fff;}
.admin-table .badge.draft{background:#9aa4b2;}

.btn{display:inline-flex; align-items:center; gap:6px; padding:9px 16px; border-radius:8px; font-size:13px; font-weight:600; border:none; cursor:pointer;}
.btn-primary{background:var(--accent); color:#fff;}
.btn-primary:hover{background:#1a747d;}
.btn-secondary{background:#eef0f3; color:var(--ink);}
.btn-danger{background:#e15656; color:#fff;}
.btn-sm{padding:6px 12px; font-size:12px;}

.form-row{margin-bottom:16px;}
.form-row label{display:block; font-size:12.5px; font-weight:600; margin-bottom:6px; color:var(--ink-soft);}
.form-row input[type=text], .form-row input[type=url], .form-row input[type=number],
.form-row input[type=password], .form-row select, .form-row textarea{
  width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:8px; font-size:13.5px; font-family:inherit;
}
.form-row textarea{min-height:180px; resize:vertical; line-height:1.6;}

.editor-toolbar{
  display:flex; gap:6px; align-items:center; flex-wrap:wrap;
  background:#f5f6f8; border:1px solid var(--line); border-bottom:none;
  border-radius:8px 8px 0 0; padding:8px 10px;
}
.editor-toolbar button{
  width:32px; height:32px; border:1px solid var(--line); background:#fff; border-radius:6px;
  cursor:pointer; font-size:14px; color:var(--ink); display:flex; align-items:center; justify-content:center;
}
.editor-toolbar button:hover{ background:#eef0f3; }
.editor-toolbar select{
  height:32px; border:1px solid var(--line); border-radius:6px; font-size:12.5px; padding:0 8px; background:#fff;
}
.editor-toolbar + textarea{ border-radius:0 0 8px 8px; margin-top:-1px; }
.form-row .hint{font-size:11.5px; color:var(--ink-soft); margin-top:4px;}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:0 20px;}
@media (max-width:640px){.form-grid{grid-template-columns:1fr;}}

.flash{padding:12px 16px; border-radius:8px; font-size:13.5px; margin-bottom:20px;}
.flash-ok{background:#e9f8ee; color:#2c7a45;}
.flash-error{background:#fdecec; color:#c0392b;}

.login-box{max-width:360px; margin:100px auto; background:#fff; padding:36px; border-radius:16px; box-shadow:0 20px 50px -25px rgba(20,30,50,.4);}
.login-box h1{font-size:20px; margin-bottom:6px;}
.login-box p{font-size:13px; color:var(--ink-soft); margin-bottom:22px;}

.stat-row{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:24px;}
.stat-box{flex:1; min-width:140px; background:#fff; border-radius:14px; padding:18px 20px; box-shadow:0 8px 24px -16px rgba(20,30,50,.25);}
.stat-box .num{font-size:26px; font-weight:800;}
.stat-box .label{font-size:12px; color:var(--ink-soft); margin-top:4px;}

.color-swatch{width:16px; height:16px; border-radius:4px; display:inline-block; vertical-align:middle; margin-right:6px;}
