:root {
    color-scheme: light;
    --ink: #211a20;
    --muted: #665b50;
    --paper: #fff8e6;
    --panel: #ffffff;
    --border: #ddcc9f;
    --accent: #39783b;
    --accent-dark: #27582c;
    --highlight: #f4df24;
    --danger-bg: #fff0ed;
    --danger: #8f241d;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    min-height: 100vh;
    background: var(--paper);
    color: var(--ink);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    border-top: 6px solid var(--highlight);
}

.login-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 1.5rem;
}

.login-card {
    width: min(100%, 27rem);
    padding: 2rem;
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 0.85rem;
    box-shadow: 0 1rem 2.5rem rgb(71 49 29 / 10%);
}

h1 { margin: 0 0 0.4rem; font-size: 1.75rem; }
.subtitle { margin: 0 0 1.6rem; color: var(--muted); }

label {
    display: block;
    margin: 1rem 0 0.4rem;
    font-weight: 650;
}

input {
    width: 100%;
    padding: 0.8rem 0.9rem;
    border: 1px solid var(--border);
    border-radius: 0.45rem;
    color: var(--ink);
    background: #fff;
    font: inherit;
}

input:focus { outline: 3px solid rgb(57 120 59 / 22%); border-color: var(--accent); }
textarea:focus { outline: 3px solid rgb(57 120 59 / 22%); border-color: var(--accent); }

button, .button {
    display: inline-block;
    width: 100%;
    margin-top: 1.25rem;
    padding: 0.85rem 1rem;
    border: 0;
    border-radius: 0.45rem;
    background: var(--accent);
    color: #fff;
    font: inherit;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

button:hover, .button:hover { background: var(--accent-dark); }
.button.danger, button.danger { background: var(--danger); }
.button.danger:hover, button.danger:hover { background: #681813; }
.button.secondary, button.secondary { background: #6f6256; }
.compact-form { display:inline-block; margin:0; }
.compact-form button { width:auto; margin:0; padding:.55rem .75rem; }
.user-actions { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }

.alert {
    margin-top: 1rem;
    padding: 0.75rem 0.9rem;
    border: 1px solid #e2aaa5;
    border-radius: 0.45rem;
    background: var(--danger-bg);
    color: var(--danger);
}
.alert.success { border-color: #91bc9b; background: #edf8ef; color: #235d30; }

.admin-shell { width: min(72rem, calc(100% - 2rem)); margin: 2rem auto; }
.admin-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.admin-header h1, .login-card h1 { color: var(--accent-dark); }
.admin-header form { margin: 0; }
.admin-header button { width: auto; margin: 0; }
.panel { margin-top: 1.5rem; padding: 1.5rem; background: #fff; border: 1px solid var(--border); border-top: 4px solid var(--highlight); border-radius: 0.75rem; }
.admin-nav { display:flex; align-items:center; gap:1rem; }
.admin-nav a { color:var(--accent-dark); font-weight:700; }
.admin-nav form { margin:0; }
.stats-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:1.5rem; }
.stat { padding:1.2rem; background:#fff; border:1px solid var(--border); border-radius:.75rem; }
.stat strong { display:block; font-size:1.75rem; }
.stat span,.metadata { color:var(--muted); }
.inline-form { display:flex; align-items:end; gap:.75rem; flex-wrap:wrap; }
.inline-form label { flex-basis:100%; margin-top:0; }
.inline-form select,.inline-form input { flex:1 1 20rem; }
select { padding:.8rem; border:1px solid var(--border); border-radius:.45rem; background:#fff; font:inherit; }
.inline-form button,.action-grid button,.save-button { width:auto; margin-top:0; }
.action-grid { display:flex; flex-wrap:wrap; gap:.75rem; }
.action-grid form { margin:0; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; }
th,td { padding:.7rem; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
th { color:var(--muted); font-size:.85rem; text-transform:uppercase; }
.status { display:inline-block; padding:.2rem .45rem; border-radius:999px; font-size:.78rem; font-weight:750; }
.status.succeeded { background:#e2f4e6; color:#235d30; }
.status.failed { background:#fae2df; color:#8f241d; }
.status.running { background:#fff2cf; color:#765815; }
.product-heading { display:flex; align-items:center; gap:1.25rem; flex-wrap:wrap; }
.product-heading h2 { margin-right:auto; }
.product-heading label:not(.check) { margin:0; }
.product-heading select { min-width:12rem; }
.product-heading .order-input { width:6rem; padding:.65rem; }
.check { display:flex; align-items:center; gap:.4rem; margin:0; }
.check input,td input[type=checkbox] { width:1.1rem; height:1.1rem; }
.save-button { margin-top:1rem; }
.editor-grid { display:grid; grid-template-columns:minmax(15rem,22rem) 1fr; gap:1.5rem; }
.product-image { width:100%; aspect-ratio:1; object-fit:contain; background:#f8f3eb; border:1px solid var(--border); border-radius:.6rem; }
.image-placeholder { display:grid; place-items:center; width:100%; aspect-ratio:1; color:var(--muted); background:#f8f3eb; border:1px dashed var(--border); border-radius:.6rem; }
textarea { width:100%; min-height:12rem; resize:vertical; padding:.8rem .9rem; border:1px solid var(--border); border-radius:.45rem; color:var(--ink); background:#fff; font:inherit; }
fieldset { min-width:0; padding:1rem; border:1px solid var(--border); border-radius:.6rem; }
legend { padding:0 .4rem; font-weight:750; }
.help { color:var(--muted); font-size:.9rem; }
.back-link { color:var(--accent-dark); font-weight:700; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media(max-width:700px){.admin-header{align-items:flex-start;flex-direction:column}.admin-nav{flex-wrap:wrap}.stats-grid{grid-template-columns:1fr}}
@media(max-width:760px){.editor-grid,.form-grid{grid-template-columns:1fr}}