/* ================= Admin dashboard ================= */
body.is-admin .footer { display: none; }
body.is-admin .aura { opacity: .55; }
.admin { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 24px; width: min(1440px, 100% - 32px); margin: 0 auto; padding: 24px 0 60px; align-items: start; }
.admin__side { position: sticky; top: calc(var(--nav-h) + 16px); padding: 12px; max-height: calc(100vh - var(--nav-h) - 32px); overflow: auto; }
.admin__side h4 { font: 600 .7rem/1 var(--font); letter-spacing: .14em; text-transform: uppercase; color: var(--muted-2); margin: 14px 12px 8px; }
.admin__side a { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; color: var(--muted); font-weight: 500; font-size: .93rem; }
.admin__side a svg { width: 18px; height: 18px; flex: none; }
.admin__side a:hover { color: var(--text); background: rgba(139, 92, 246, .12); }
.admin__side a.is-active { color: var(--text); background: var(--grad-soft); box-shadow: inset 0 0 0 1px var(--line); }
.admin__side a .count { margin-left: auto; min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px; background: var(--grad); color: #fff; font: 700 .72rem/22px var(--font); text-align: center; }
.admin__main { min-width: 0; }
.admin__head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.admin__head h1 { font-size: 1.7rem; margin: 0; }
.admin__head p { margin: 4px 0 0; color: var(--muted); font-size: .93rem; }
.panel { padding: 22px; margin-bottom: 20px; }
.panel h2 { font-size: 1.1rem; margin-bottom: 14px; display: flex; align-items: center; gap: 10px; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; margin-bottom: 20px; }
.kpi { padding: 18px 20px; }
.kpi span { font-size: .82rem; color: var(--muted); }
.kpi strong { display: block; font: 700 1.7rem/1.1 var(--display); margin-top: 6px; }
.kpi small { color: var(--muted); font-size: .8rem; }
.kpi--accent { background: linear-gradient(140deg, rgba(139, 92, 246, .32), rgba(236, 72, 153, .2)); }
.grid-2 { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 20px; }
.table-wrap { overflow-x: auto; margin: 0 -22px; padding: 0 22px; }
table.table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.table th { text-align: left; font: 600 .74rem/1 var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--muted-2); padding: 10px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.table td { padding: 12px; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
.table tr.clickable { cursor: pointer; transition: background .15s; }
.table tr.clickable:hover td { background: rgba(139, 92, 246, .08); }
.table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.table img.mini { width: 30px; height: 30px; border-radius: 8px; object-fit: contain; background: #090611; display: inline-block; vertical-align: middle; margin-right: 8px; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85em; }
.toolbar-row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 16px; }
.toolbar-row .input, .toolbar-row select.input { height: 40px; width: auto; min-width: 150px; }
.toolbar-row .search { flex: 1 1 220px; }
.toolbar-row .search input { height: 40px; }
.pager { display: flex; gap: 8px; justify-content: flex-end; align-items: center; margin-top: 14px; font-size: .88rem; color: var(--muted); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.form-grid .full { grid-column: 1 / -1; }
.switch { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-size: .92rem; }
.switch input { appearance: none; width: 42px; height: 24px; border-radius: 999px; background: rgba(169, 154, 191, .25); position: relative; cursor: pointer; transition: background .2s; flex: none; margin: 0; }
.switch input::after { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform .25s var(--ease); }
.switch input:checked { background: var(--grad); }
.switch input:checked::after { transform: translateX(18px); }
.img-pick { display: flex; gap: 14px; align-items: center; }
.img-pick__preview { width: 72px; height: 72px; border-radius: 14px; overflow: hidden; background: #090611; box-shadow: inset 0 0 0 1px var(--line); flex: none; }
.img-pick__preview img, .img-pick__preview svg { width: 100%; height: 100%; object-fit: contain; }
.variant-edit { border-radius: 14px; padding: 14px; background: rgba(9, 6, 17, .45); box-shadow: inset 0 0 0 1px var(--line); margin-bottom: 12px; }
.variant-edit__top { display: grid; grid-template-columns: 1fr 120px 110px auto; gap: 10px; align-items: end; }
.variant-edit textarea.input { min-height: 80px; margin-top: 10px; font-size: .9rem; }
.cat-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: rgba(9, 6, 17, .35); box-shadow: inset 0 0 0 1px var(--line-2); margin-bottom: 8px; }
.cat-row .art { width: 64px; height: 40px; border-radius: 8px; overflow: hidden; flex: none; }
.cat-row .art svg, .cat-row .art img { width: 100%; height: 100%; object-fit: cover; }
.prod-row { display: grid; grid-template-columns: 64px 1fr auto; gap: 14px; align-items: center; padding: 12px 14px; border-radius: 14px; background: rgba(9, 6, 17, .35); box-shadow: inset 0 0 0 1px var(--line-2); margin-bottom: 8px; }
.prod-row .art { width: 64px; height: 40px; border-radius: 8px; overflow: hidden; }
.prod-row .art svg, .prod-row .art img { width: 100%; height: 100%; object-fit: cover; }
.prod-row.is-off { opacity: .6; }
.server-tile { display: grid; grid-template-columns: 64px 1fr auto; gap: 16px; align-items: center; padding: 14px 16px; margin-bottom: 10px; }
.server-tile img { width: 64px; height: 64px; border-radius: 14px; object-fit: contain; background: #090611; }
.drag { cursor: grab; color: var(--muted-2); padding: 4px; }
.bars { position: relative; display: flex; align-items: flex-end; gap: 3px; height: 180px; padding-top: 10px; border-bottom: 1px solid var(--line); }
.bars__bar { flex: 1; min-width: 4px; border-radius: 4px 4px 0 0; background: linear-gradient(180deg, var(--neon-pink), var(--purple)); opacity: .85; position: relative; transition: opacity .15s; }
.bars__bar:hover, .bars__bar:focus { opacity: 1; outline: none; box-shadow: 0 0 14px rgba(255, 79, 216, .6); }
.bars__bar.is-zero { background: rgba(169, 154, 191, .15); height: 2px !important; }
.bars__tip { position: absolute; pointer-events: none; z-index: 5; padding: 8px 10px; border-radius: 10px; background: rgba(28, 16, 45, .97); box-shadow: var(--shadow), inset 0 0 0 1px var(--line); font-size: .82rem; white-space: nowrap; transform: translate(-50%, -110%); }
.bars-axis { display: flex; justify-content: space-between; font-size: .75rem; color: var(--muted-2); margin-top: 6px; }
.hbar { display: grid; grid-template-columns: 140px 1fr auto; gap: 12px; align-items: center; margin-bottom: 10px; font-size: .9rem; }
.hbar__track { height: 10px; border-radius: 4px; background: rgba(169, 154, 191, .1); overflow: hidden; }
.hbar__fill { height: 100%; border-radius: 0 4px 4px 0; background: var(--grad); }
.kv { display: grid; grid-template-columns: 160px 1fr; gap: 8px 16px; font-size: .92rem; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; word-break: break-word; }
.order-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.history { list-style: none; padding: 0; margin: 0; font-size: .88rem; }
.history li { padding: 8px 0; border-bottom: 1px solid var(--line-2); display: flex; justify-content: space-between; gap: 12px; }
.callout { padding: 14px 16px; border-radius: 14px; background: rgba(139, 92, 246, .1); box-shadow: inset 0 0 0 1px var(--line); font-size: .9rem; color: var(--lavender); margin-bottom: 16px; }
.callout code, .panel code { background: rgba(9, 6, 17, .6); padding: 2px 6px; border-radius: 6px; font-size: .85em; }
.ok-line { display: flex; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line-2); font-size: .92rem; }
.ok-line:last-child { border-bottom: 0; }
.ok-line .chip { margin-left: auto; }
@media (max-width: 1100px) { .grid-2 { grid-template-columns: 1fr; } }
@media (max-width: 900px) {
  .admin { grid-template-columns: 1fr; }
  .admin__side { position: static; display: flex; overflow-x: auto; max-height: none; gap: 4px; padding: 8px; }
  .admin__side h4 { display: none; }
  .admin__side a { flex: none; }
  .form-grid { grid-template-columns: 1fr; }
  .variant-edit__top { grid-template-columns: 1fr 1fr; }
  .hbar { grid-template-columns: 90px 1fr auto; }
  .kv { grid-template-columns: 1fr; gap: 2px; }
  .kv dd { margin-bottom: 8px; }
}