:root {
    --page: #f5f6f8;
    --surface: #ffffff;
    --surface-soft: #f0f2f5;
    --text: #111318;
    --muted: #69707d;
    --line: #e2e5ea;
    --accent: #2563eb;
    --accent-soft: #eef4ff;
    --dark: #171a21;
    --contrast-bg: #171a21;
    --contrast-text: #ffffff;
    --field: #f9fafb;
    --surface-subtle: #fafbfc;
    --surface-hover: #e6e9ee;
    --header-bg: rgba(255,255,255,.98);
    --order-details-bg: rgba(255,255,255,.88);
    --order-new-bg: #f4f8ff; --order-processing-bg: #fffaf0; --order-success-bg: #f2fbf4;
    --order-shipped-bg: #f5f6ff; --order-cancelled-bg: #fff5f5;
    --comment-bg: #fffdf5; --comment-text: #4c4535;
    --badge-new-bg: #eaf1ff; --badge-new-text: #2159b7;
    --badge-processing-bg: #fff7df; --badge-processing-text: #8a6413;
    --badge-accepted-bg: #ddf7e4; --badge-accepted-text: #18723a;
    --badge-shipped-bg: #eceeff; --badge-shipped-text: #505eaa;
    --danger: #c93636;
    --danger-soft: #fff1f1;
    --success: #15803d;
    --success-soft: #eefbf2;
    --radius: 18px;
    --shadow: 0 1px 2px rgba(16,24,40,.04), 0 10px 28px rgba(16,24,40,.05);
    color-scheme: light;
    font-family: Inter, "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

:root[data-theme="dark"] {
    --page: #0e1014; --surface: #171a20; --surface-soft: #20242c; --text: #f3f5f7;
    --muted: #a3abb7; --line: #303640; --accent: #78a1ff; --accent-soft: #202d47;
    --contrast-bg: #f1f3f6; --contrast-text: #12151a; --field: #1d2128;
    --surface-subtle: #1b1f26; --surface-hover: #292e37; --header-bg: rgba(23,26,32,.98);
    --order-details-bg: rgba(23,26,32,.92); --danger: #ff7777; --danger-soft: #3b2023;
    --order-new-bg: #17263c; --order-processing-bg: #312a18; --order-success-bg: #173024;
    --order-shipped-bg: #20243b; --order-cancelled-bg: #352024;
    --comment-bg: #302b1d; --comment-text: #e7dcae;
    --badge-new-bg: #233d60; --badge-new-text: #a9c8ff;
    --badge-processing-bg: #4a3b18; --badge-processing-text: #f4d87e;
    --badge-accepted-bg: #1d492d; --badge-accepted-text: #91e3a9;
    --badge-shipped-bg: #30375c; --badge-shipped-text: #bac2ff;
    --success: #7ddd9b; --success-soft: #173525;
    --shadow: 0 1px 2px rgba(0,0,0,.24), 0 12px 32px rgba(0,0,0,.28);
    color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) {
        --page: #0e1014; --surface: #171a20; --surface-soft: #20242c; --text: #f3f5f7;
        --muted: #a3abb7; --line: #303640; --accent: #78a1ff; --accent-soft: #202d47;
        --contrast-bg: #f1f3f6; --contrast-text: #12151a; --field: #1d2128;
        --surface-subtle: #1b1f26; --surface-hover: #292e37; --header-bg: rgba(23,26,32,.98);
        --order-details-bg: rgba(23,26,32,.92); --danger: #ff7777; --danger-soft: #3b2023;
        --order-new-bg: #17263c; --order-processing-bg: #312a18; --order-success-bg: #173024;
        --order-shipped-bg: #20243b; --order-cancelled-bg: #352024;
        --comment-bg: #302b1d; --comment-text: #e7dcae;
        --badge-new-bg: #233d60; --badge-new-text: #a9c8ff;
        --badge-processing-bg: #4a3b18; --badge-processing-text: #f4d87e;
        --badge-accepted-bg: #1d492d; --badge-accepted-text: #91e3a9;
        --badge-shipped-bg: #30375c; --badge-shipped-text: #bac2ff;
        --success: #7ddd9b; --success-soft: #173525;
        --shadow: 0 1px 2px rgba(0,0,0,.24), 0 12px 32px rgba(0,0,0,.28);
        color-scheme: dark;
    }
}

* { box-sizing: border-box; }
html { width: 100%; overflow-x: hidden; }
body {
    width: 100%; min-height: 100vh; margin: 0; overflow-x: hidden;
    background: var(--page); color: var(--text); -webkit-font-smoothing: antialiased;
}
body, button, input, select, textarea { font: inherit; }
a { color: inherit; text-decoration: none; }

.admin-header {
    position: sticky; top: 0; z-index: 20; width: 100%; min-height: 68px;
    padding: 12px max(24px, calc((100vw - 1480px) / 2));
    display: grid; grid-template-columns: minmax(190px, 1fr) auto minmax(190px, 1fr);
    align-items: center; gap: 20px;
    background: var(--header-bg); border-bottom: 1px solid var(--line);
}
.admin-brand, .admin-account { min-width: 0; display: flex; align-items: center; gap: 10px; }
.admin-brand strong { font-size: 18px; font-weight: 850; letter-spacing: -.035em; white-space: nowrap; }
.admin-nav {
    display: flex; align-items: center; justify-content: center; gap: 4px;
    padding: 4px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft);
}
.admin-tab {
    position: relative; min-height: 36px; padding: 0 12px; display: inline-flex; align-items: center;
    justify-content: center; border-radius: 9px; color: var(--muted);
    font-size: 13px; font-weight: 720; white-space: nowrap;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}
.admin-tab:hover { color: var(--text); background: var(--surface); }
.admin-tab.active { background: var(--surface); color: var(--text); box-shadow: 0 1px 4px rgba(16,24,40,.1); }
.admin-tab-badge {
    position: absolute; top: -8px; right: -6px; min-width: 19px; height: 19px; padding: 0 5px;
    display: inline-flex; align-items: center; justify-content: center; border: 2px solid #fff;
    border-radius: 999px; background: #dc2626; color: #fff; font-size: 9px; line-height: 1; font-weight: 850;
}
.admin-account { justify-content: flex-end; }
.theme-toggle {
    flex: 0 0 auto; width: 36px; height: 36px; min-height: 36px; padding: 0; display: inline-grid;
    place-items: center; border: 1px solid var(--line); border-radius: 9px;
    background: var(--surface-soft); color: var(--text); font-size: 17px; line-height: 1;
}
.theme-toggle:hover { background: var(--surface-hover); }
.auth-theme-toggle { position: fixed; top: 18px; right: 18px; z-index: 2; width: 42px; height: 42px; }
.admin-logout {
    min-height: 36px; padding: 0 11px; display: inline-flex; align-items: center;
    border-radius: 9px; color: var(--muted); font-size: 13px; font-weight: 720;
}
.admin-logout:hover { background: var(--surface-soft); color: var(--text); }

.admin-grid {
    width: 100%; max-width: 1480px; margin: 0 auto; padding: 26px 24px 56px;
    display: grid; grid-template-columns: 300px minmax(0, 1fr); align-items: start; gap: 22px;
}
.right-col { min-width: 0; display: grid; gap: 22px; }
.card {
    min-width: 0; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius);
    background: var(--surface); box-shadow: var(--shadow);
}
.card.wide, .card.full { grid-column: span 2; }
.card h1, .card h2, .card h3 { color: var(--text); letter-spacing: -.025em; }
.card h2 { margin: 0 0 16px; font-size: 20px; line-height: 1.2; font-weight: 800; }
.card p { margin: 0 0 18px; }
.muted { color: var(--muted); font-size: 13px; line-height: 1.5; }
.link { color: var(--accent); font-weight: 720; }
.link:hover { color: #174eaf; }
.flex-between { display: flex; align-items: center; justify-content: space-between; gap: 16px; }

.stack { display: grid; gap: 13px; margin: 0 0 18px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 15px; }
.grid-2 .full { grid-column: span 2; }
label { display: grid; align-content: start; gap: 7px; color: var(--muted); font-size: 12px; font-weight: 720; }
input, select, textarea {
    width: 100%; min-width: 0; padding: 10px 12px; border: 1px solid var(--line);
    border-radius: 10px; outline: 0; background: var(--field); color: var(--text);
    font-size: 14px; font-weight: 500; transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
input, select { min-height: 43px; }
textarea { min-height: 92px; resize: vertical; line-height: 1.45; }
input:focus, select:focus, textarea:focus {
    border-color: #9db9f7; background: var(--surface); box-shadow: 0 0 0 4px rgba(37,99,235,.08);
}
input[type="file"] { padding: 8px; background: var(--surface); }
select[multiple] { min-height: 76px; }

button, .btn {
    min-height: 42px; padding: 0 15px; display: inline-flex; align-items: center;
    justify-content: center; border: 0; border-radius: 10px; cursor: pointer;
    background: var(--contrast-bg); color: var(--contrast-text); font-size: 13px; font-weight: 760;
    transition: background .18s ease, transform .18s ease, border-color .18s ease;
}
button:hover, .btn:hover { opacity: .88; transform: translateY(-1px); }
button:focus-visible, .btn:focus-visible, a:focus-visible { outline: 3px solid rgba(37,99,235,.28); outline-offset: 2px; }
button:disabled, .btn:disabled { opacity: .55; cursor: wait; transform: none; }
.ghost { border: 1px solid var(--line); background: var(--surface-soft); color: var(--text); }
.ghost:hover { background: var(--surface-hover); }
.danger { background: var(--danger); color: #fff; }
.danger:hover { background: #aa2929; }
.danger.ghost { border-color: #f1c5c5; background: var(--danger-soft); color: #b32d2d; }
.danger.ghost:hover { background: #ffe4e4; }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }

.alert {
    margin: 0 0 14px; padding: 11px 13px; border: 1px solid #f2caca;
    border-radius: 10px; background: var(--danger-soft); color: #a72c2c; font-size: 13px; line-height: 1.45;
}
.alert.success { border-color: #bde8c9; background: var(--success-soft); color: var(--success); }

.list { display: grid; gap: 7px; }
.list-item {
    min-width: 0; min-height: 50px; padding: 8px 8px 8px 12px;
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    border: 1px solid var(--line); border-radius: 11px; background: var(--surface-subtle);
    font-size: 13px; font-weight: 650;
}
.list-item form { flex: 0 0 auto; }
.list-item button { min-height: 34px; padding: 0 10px; font-size: 12px; }

.image-sort {
    display: grid; grid-template-columns: repeat(auto-fill,minmax(110px,1fr));
    gap: 10px; margin-top: 10px;
}
.image-item { padding: 7px; display: grid; gap: 7px; border: 1px solid var(--line); border-radius: 11px; background: var(--field); }
.image-item img { width: 100%; height: 88px; object-fit: cover; border-radius: 8px; }
.image-actions { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; }
.image-actions button { min-height: 32px; padding: 0; }

.table {
    width: 100%; overflow-x: auto; border: 1px solid var(--line);
    border-radius: 12px; background: var(--surface); scrollbar-width: thin;
}
.table-head, .table-row {
    min-width: 720px; padding: 12px 14px; display: grid; align-items: center;
    gap: 14px; border-bottom: 1px solid var(--line); font-size: 13px;
}
.table-head { position: sticky; top: 0; z-index: 1; background: var(--surface-soft); color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.table-row:last-child { border-bottom: 0; }
.table-row:hover { background: var(--surface-subtle); }
.table-row form { margin: 0; }
.table-row button { min-height: 34px; padding: 0 10px; font-size: 12px; }
.products-table .table-head, .products-table .table-row {
    grid-template-columns: 58px minmax(230px,1.5fr) minmax(110px,.7fr) 80px 110px 180px;
    min-width: 900px;
}
.metrics-table .table-head, .metrics-table .table-row { grid-template-columns: repeat(5,minmax(110px,1fr)); }
.top-products-table .table-head, .top-products-table .table-row {
    grid-template-columns: 64px minmax(250px,2fr) repeat(3,minmax(110px,1fr));
}
.table-head.pricing-row, .table-row.pricing-row {
    grid-template-columns: minmax(240px,2fr) 90px minmax(150px,1fr) minmax(140px,1fr);
    min-width: 760px;
}
.pricing-row input, .pricing-row select { min-height: 38px; padding: 7px 10px; }

pre {
    max-width: 100%; max-height: 540px; overflow: auto; margin: 16px 0 0 !important;
    padding: 16px; border: 1px solid var(--line); border-radius: 12px;
    background: #101319; color: #d9e2f2; font: 12px/1.6 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.orders-admin-grid { grid-template-columns: 1fr; }
.orders-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.orders-toolbar h2 { margin-bottom: 6px; }
.orders-toolbar p { margin: 0; }
.orders-settings-stack { width: min(520px, 48vw); display: grid; gap: 8px; }
.np-settings { border: 1px solid var(--line); border-radius: 11px; background: var(--surface-subtle); }
.np-settings summary { padding: 12px 14px; cursor: pointer; color: var(--text); font-size: 12px; font-weight: 750; }
.np-settings-form { padding: 0 14px 14px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 9px; }
.np-settings-form small { grid-column: 1 / -1; }
.telegram-settings-form { grid-template-columns: minmax(0,1.25fr) minmax(150px,.75fr) auto; }
.telegram-test-form { padding: 0 14px 14px; }
.telegram-test-form button { width: 100%; }
.orders-alert { margin: -8px 0 0; }
.orders-list { display: grid; gap: 10px; }
.orders-empty { text-align: center; }
.order-card {
    padding: 0; overflow: hidden; border-color: #dfe4eb;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.order-card[open] { box-shadow: 0 12px 32px rgba(16,24,40,.08); }
.order-card.status-new { border-color: #5579a7; background: var(--order-new-bg); }
.order-card.status-processing { border-color: #9a8242; background: var(--order-processing-bg); }
.order-card.status-accepted { border-color: #4f9062; background: var(--order-success-bg); }
.order-card.status-shipped { border-color: #6773a8; background: var(--order-shipped-bg); }
.order-card.status-completed { border-color: #4f9062; background: var(--order-success-bg); }
.order-card.status-cancelled { border-color: #a35b61; background: var(--order-cancelled-bg); }
.order-summary {
    min-height: 78px; padding: 14px 18px; display: grid;
    grid-template-columns: 76px minmax(220px,1fr) 135px auto 18px;
    align-items: center; gap: 16px; cursor: pointer; list-style: none;
    transition: background .18s ease;
}
.order-summary::-webkit-details-marker { display: none; }
.order-summary:hover { background: var(--surface-soft); }
.order-summary-number { font-size: 19px; font-weight: 850; letter-spacing: -.03em; }
.order-summary-person { min-width: 0; display: grid; gap: 3px; }
.order-summary-person strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.order-summary-person small, .order-summary time { color: var(--muted); font-size: 12px; font-weight: 600; }
.order-summary-chevron {
    width: 9px; height: 9px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted);
    transform: rotate(45deg) translateY(-2px); transition: transform .18s ease;
}
.order-card[open] .order-summary-chevron { transform: rotate(225deg) translate(-2px,-2px); }
.order-details { border-top: 1px solid var(--line); background: var(--order-details-bg); }
.order-card-head { padding: 14px 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); background: var(--surface-subtle); }
.order-detail-label { display: block; margin-bottom: 3px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.order-number { font-size: 16px; font-weight: 820; letter-spacing: -.015em; }
.order-status { padding: 6px 9px; border-radius: 999px; background: var(--surface-soft); color: var(--muted); font-size: 10px; font-weight: 800; }
.order-status.status-new { background: var(--badge-new-bg); color: var(--badge-new-text); }
.order-status.status-processing { background: var(--badge-processing-bg); color: var(--badge-processing-text); }
.order-status.status-accepted { background: var(--badge-accepted-bg); color: var(--badge-accepted-text); }
.order-status.status-shipped { background: var(--badge-shipped-bg); color: var(--badge-shipped-text); }
.order-status.status-completed { background: var(--success-soft); color: var(--success); }
.order-status.status-cancelled { background: var(--danger-soft); color: var(--danger); }
.order-info-grid { padding: 18px 20px; display: grid; grid-template-columns: 1fr 1.35fr 1fr; gap: 22px; border-bottom: 1px solid var(--line); }
.order-info-grid > div { min-width: 0; display: grid; align-content: start; gap: 4px; }
.order-info-grid span { color: var(--muted); font-size: 10px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.order-info-grid strong { font-size: 13px; line-height: 1.4; }
.order-info-grid p, .order-info-grid a { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.order-info-grid a { color: var(--accent); font-weight: 700; }
.order-comment { padding: 14px 20px; border-bottom: 1px solid var(--line); background: var(--comment-bg); }
.order-comment span { color: #8a6b1e; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.order-comment p { margin: 5px 0 0; color: var(--comment-text); font-size: 12px; line-height: 1.55; }
.order-items { padding: 5px 20px; }
.order-item-row { display: grid; grid-template-columns: 74px minmax(0,1fr) 150px 110px; align-items: center; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.order-item-row:last-child { border-bottom: 0; }
.order-item-image { width: 74px; height: 56px; object-fit: contain; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.order-item-product { min-width: 0; display: grid; gap: 3px; }
.order-item-product strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.order-item-product span, .order-item-row > span { color: var(--muted); }
.order-item-product span b { color: var(--text); font-weight: 750; }
.order-item-row > strong { text-align: right; }
.order-card-footer { padding: 15px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); background: var(--surface-subtle); }
.order-total { display: flex; align-items: baseline; gap: 9px; }
.order-total span { color: var(--muted); font-size: 12px; }
.order-total strong { font-size: 20px; }
.order-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.order-status-form { display: flex; align-items: center; gap: 8px; }
.order-status-form select { width: 150px; min-height: 38px; padding: 6px 9px; }
.order-status-form button, .order-delete-form button { min-height: 38px; }
.order-delete-form { margin: 0; }

.auth { min-height: 100vh; padding: 24px; display: grid; place-items: center; background: var(--page); }
.auth-card {
    width: min(420px,100%); padding: 30px; border: 1px solid var(--line);
    border-radius: 20px; background: var(--surface); box-shadow: var(--shadow);
}
.auth-card::before {
    content: "sneakers-underground"; display: block; margin-bottom: 28px;
    font-size: 17px; font-weight: 850; letter-spacing: -.035em;
}
.auth-card h1 { margin: 0 0 20px; font-size: 26px; letter-spacing: -.035em; }
.auth-card form { display: grid; gap: 14px; }
.auth-card button { width: 100%; margin-top: 4px; min-height: 46px; }

.pages-admin-grid { grid-template-columns: 1fr; }
.pages-editor-form { margin: 0; }
.pages-editor-heading { margin-bottom: 20px; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.pages-editor-heading h2 { margin-bottom: 6px; }
.pages-editor-heading p { max-width: 720px; margin: 0; }
.pages-editor-heading > button { flex: 0 0 auto; }
.pages-editor-list { display: grid; gap: 10px; }
.page-editor-item { overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-subtle); }
.page-editor-item summary {
    min-height: 62px; padding: 12px 15px; display: flex; align-items: center; justify-content: space-between; gap: 18px;
    cursor: pointer; list-style: none; background: var(--surface);
}
.page-editor-item summary::-webkit-details-marker { display: none; }
.page-editor-item summary > span:first-child { display: grid; gap: 3px; }
.page-editor-item summary strong { color: var(--text); font-size: 14px; }
.page-editor-item summary small { color: var(--muted); font-size: 11px; font-weight: 600; }
.page-editor-item[open] summary { border-bottom: 1px solid var(--line); }
.page-editor-state { padding: 5px 8px; border-radius: 999px; background: var(--success-soft); color: var(--success); font-size: 10px; font-weight: 800; }
.page-editor-fields { padding: 17px; display: grid; gap: 15px; }
.page-editor-meta { grid-template-columns: minmax(0,2fr) minmax(150px,.5fr); }
.page-content-editor { min-height: 250px; font-size: 14px; line-height: 1.6; }
.page-published-toggle { grid-template-columns: 20px minmax(0,1fr); align-items: center; gap: 9px; color: var(--text); cursor: pointer; }
.page-published-toggle input { width: 18px; min-height: 18px; margin: 0; accent-color: var(--accent); }
.pages-editor-bottom { margin-top: 18px; display: flex; justify-content: flex-end; }

@media (max-width: 1040px) {
    .admin-grid { grid-template-columns: 1fr; }
    .card.wide, .card.full { grid-column: span 1; }
    .order-info-grid { grid-template-columns: 1fr 1fr; }
    .order-summary { grid-template-columns: 62px minmax(180px,1fr) auto 18px; }
    .order-summary time { display: none; }
}
@media (max-width: 720px) {
    .admin-header {
        grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "brand account" "nav nav";
        gap: 9px 12px; padding: 10px 14px; align-items: center;
    }
    .admin-brand { grid-area: brand; }
    .admin-brand strong { font-size: 16px; }
    .admin-brand .muted, .admin-account .muted { display: none; }
    .admin-nav {
        grid-area: nav; width: 100%; min-width: 0; justify-content: flex-start;
        overflow-x: auto; scrollbar-width: none;
    }
    .admin-nav::-webkit-scrollbar { display: none; }
    .admin-tab { min-height: 34px; padding: 0 9px; font-size: 11.5px; }
    .admin-account { grid-area: account; }
    .admin-logout { min-height: 34px; padding: 0 8px; font-size: 12px; }
    .admin-grid { padding: 14px 12px 36px; gap: 14px; }
    .right-col { gap: 14px; }
    .card { padding: 16px; border-radius: 15px; }
    .grid-2 { grid-template-columns: 1fr; }
    .grid-2 .full { grid-column: span 1; }
    .flex-between { align-items: flex-start; }
    .auth { padding: 14px; }
    .auth-card { padding: 22px; }
    .orders-toolbar { flex-direction: column; gap: 14px; }
    .orders-settings-stack { width: 100%; }
    .np-settings { width: 100%; flex-basis: auto; }
    .np-settings-form { grid-template-columns: 1fr; }
    .np-settings-form small { grid-column: auto; }
    .order-summary { min-height: 88px; padding: 13px 14px; grid-template-columns: 50px minmax(0,1fr) auto 14px; gap: 10px; }
    .order-summary-number { font-size: 17px; }
    .order-summary-person strong { font-size: 13px; }
    .order-summary-person small { font-size: 11px; }
    .order-status { padding: 5px 7px; font-size: 9px; }
    .order-card-head { align-items: flex-start; padding: 13px 15px; }
    .order-card-head > .muted { max-width: 48%; text-align: right; }
    .order-info-grid { grid-template-columns: 1fr; gap: 14px; padding: 15px; }
    .order-item-row { grid-template-columns: 64px minmax(0,1fr) auto; gap: 7px 11px; }
    .order-item-image { grid-row: 1 / 3; width: 64px; height: 54px; }
    .order-item-product { grid-column: 2 / -1; }
    .order-item-row > span { grid-column: 2; }
    .order-item-row > strong { grid-column: 3; }
    .order-items { padding: 4px 15px; }
    .order-card-footer { padding: 14px 15px; align-items: stretch; flex-direction: column; }
    .order-actions { width: 100%; justify-content: stretch; }
    .order-status-form { width: 100%; }
    .order-status-form select { min-width: 0; flex: 1 1 auto; }
    .order-delete-form { width: 100%; }
    .order-delete-form button { width: 100%; }
    .pages-editor-heading { flex-direction: column; gap: 12px; }
    .pages-editor-heading > button { width: 100%; }
    .page-editor-meta { grid-template-columns: 1fr; }
    .page-content-editor { min-height: 220px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}