:root {
    --bg: #ececec;
    --ink: #1d1d1f;
    --muted: #6e6e73;
    --accent: #ff5a1f;
    --shadow-d: #cfcfcf;
    --shadow-l: #ffffff;
    --font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body {
    margin: 0;
    font-family: var(--font);
    background: var(--bg);
    color: var(--ink);
}
a { color: var(--accent); }
.admin-shell { display: grid; grid-template-columns: 230px 1fr; min-height: 100vh; }
.admin-nav {
    padding: 24px 16px;
    box-shadow: 8px 0 18px var(--shadow-d);
}
.admin-nav .brand {
    display: block;
    font-weight: 700;
    text-decoration: none;
    color: var(--ink);
    margin-bottom: 22px;
}
.admin-nav nav { display: grid; gap: 6px; }
.admin-nav nav a {
    text-decoration: none;
    color: var(--muted);
    padding: 10px 12px;
    border-radius: 14px;
}
.admin-nav nav a.is-active {
    color: var(--accent);
    background: var(--bg);
    box-shadow: inset 4px 4px 8px var(--shadow-d), inset -4px -4px 8px var(--shadow-l);
}
.nav-foot { margin-top: 28px; display: grid; gap: 6px; color: var(--muted); font-size: 13px; }
.admin-main { padding: 28px 32px 64px; }
h1 { margin: 0 0 18px; letter-spacing: -0.04em; }
h2 { letter-spacing: -0.03em; }
.card, table, .login-card {
    background: var(--bg);
    border-radius: 22px;
    box-shadow: 8px 8px 18px var(--shadow-d), -8px -8px 18px var(--shadow-l);
}
.card, .login-card { padding: 22px; }
.stack { display: grid; gap: 14px; max-width: 720px; }
.row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
label { display: grid; gap: 6px; font-size: 14px; color: var(--muted); }
label.inline { display: flex; align-items: center; gap: 8px; color: var(--ink); }
input, select, textarea, button {
    font: inherit;
    border: 0;
    border-radius: 12px;
    padding: 10px 12px;
}
input, select, textarea {
    background: var(--bg);
    box-shadow: inset 3px 3px 7px var(--shadow-d), inset -3px -3px 7px var(--shadow-l);
}
button, .btn {
    background: var(--accent);
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    width: fit-content;
}
button.link {
    background: none;
    color: var(--accent);
    padding: 0;
    box-shadow: none;
}
table { width: 100%; border-collapse: collapse; overflow: hidden; margin: 18px 0; }
th, td { text-align: left; padding: 12px; border-bottom: 1px solid #e0e0e0; vertical-align: top; }
.actions, .actions form { display: inline-flex; gap: 10px; align-items: center; }
.flash { padding: 12px 14px; border-radius: 14px; margin-bottom: 16px; }
.flash.ok { background: #e8f7ee; }
.flash.err { background: #fdecea; }
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 28px; }
.stat-grid .card { text-align: center; }
.stat-grid strong { font-size: 32px; display: block; }
.filters { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.filters a {
    text-decoration: none;
    color: var(--muted);
    padding: 8px 12px;
    border-radius: 999px;
    box-shadow: 4px 4px 10px var(--shadow-d), -4px -4px 10px var(--shadow-l);
}
.filters a.is-active { color: var(--accent); }
.hint { color: var(--muted); font-size: 13px; }
.login-body { min-height: 100vh; display: grid; place-items: center; }
.login-card { width: min(380px, calc(100% - 32px)); display: grid; gap: 12px; }
.login-card h1 { font-size: 24px; }
@media (max-width: 860px) {
    .admin-shell { grid-template-columns: 1fr; }
    .row, .stat-grid { grid-template-columns: 1fr; }
}
