/* Admin: plain, high contrast, big tap targets (warehouse phones/tablets), light and dark. */
:root { --bg:#fff; --surface:#f3f5f8; --text:#14202e; --muted:#4a5a6c; --line:#d5dce5; --brand:#0b2a4a; --on-brand:#fff; --ok:#1b6e3c; --bad:#b3261e; --warn:#8a5a00; --link:#0b4a8f; --focus:#1a73e8; color-scheme: light; }
@media (prefers-color-scheme: dark) { :root { --bg:#0d151e; --surface:#16212d; --text:#e8eef5; --muted:#a9b7c6; --line:#2a3a4b; --brand:#0a1f38; --ok:#7bd39a; --bad:#ff8a80; --warn:#f2c46b; --link:#8ab8f5; --focus:#8ab4f8; color-scheme: dark; } }
*,*::before,*::after { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:1rem/1.5 system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif; }
a { color:var(--link); } a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid var(--focus); outline-offset:2px; }
.skip { position:absolute; left:-999px; } .skip:focus { left:0; background:var(--brand); color:var(--on-brand); padding:.6rem 1rem; z-index:9; }
.top { background:var(--brand); color:var(--on-brand); display:flex; flex-wrap:wrap; gap:.5rem 1.25rem; align-items:center; padding:.6rem 1rem; }
.top a { color:inherit; text-decoration:none; padding:.4rem .2rem; border-bottom:2px solid transparent; } .top a[aria-current=page] { border-bottom-color:currentColor; }
.top .brand { font-weight:700; margin-right:.5rem; display:inline-flex; align-items:center; gap:.5rem; } .top .brand .logo { height:2rem; width:auto; display:block; } .top .grow { flex:1; } .top button { background:transparent; color:inherit; border:1px solid rgba(255,255,255,.5); }
main { max-width:80rem; margin:0 auto; padding:1rem; outline:none; }
h1 { font-size:1.5rem; margin:.25rem 0 1rem; } h2 { font-size:1.15rem; margin:1.5rem 0 .5rem; }
.photos { display:flex; flex-wrap:wrap; gap:.75rem; margin:.5rem 0 1rem; } .photos figure { margin:0; display:grid; gap:.35rem; justify-items:start; } .photos img { display:block; width:9rem; height:auto; border:1px solid var(--line); border-radius:.35rem; background:#fff; }
.bar { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin-bottom:.75rem; }
input,select,button { font:inherit; padding:.6rem .75rem; border:1px solid var(--line); border-radius:.4rem; background:var(--bg); color:var(--text); min-height:2.75rem; }
button { cursor:pointer; background:var(--brand); color:var(--on-brand); border-color:var(--brand); font-weight:600; } button.secondary { background:transparent; color:var(--link); border-color:currentColor; } button.danger { background:var(--bad); border-color:var(--bad); color:#fff; } button[disabled] { opacity:.5; cursor:not-allowed; }
.chip { display:inline-block; padding:.4rem .8rem; border:1px solid var(--line); border-radius:2rem; text-decoration:none; color:var(--text); background:var(--surface); } .chip[aria-current=true] { border-color:var(--link); color:var(--link); font-weight:600; }
.scroll { overflow-x:auto; } table { border-collapse:collapse; width:100%; } th,td { text-align:left; padding:.5rem .6rem; border-bottom:1px solid var(--line); vertical-align:top; white-space:nowrap; } th { color:var(--muted); font-weight:600; font-size:.85rem; } td.wrap { white-space:normal; }
.num { text-align:right; font-variant-numeric:tabular-nums; }
.badge { display:inline-block; padding:.05rem .5rem; border-radius:2rem; border:1px solid currentColor; font-size:.8rem; } .ok { color:var(--ok); } .bad { color:var(--bad); } .warn { color:var(--warn); }
.card { border:1px solid var(--line); border-radius:.5rem; padding:1rem; margin:.75rem 0; background:var(--surface); } .grid { display:grid; gap:.75rem 1rem; grid-template-columns:repeat(auto-fit,minmax(14rem,1fr)); } label { display:grid; gap:.25rem; font-size:.9rem; color:var(--muted); }
.msg { padding:.6rem .8rem; border-radius:.4rem; margin:.5rem 0; border:1px solid currentColor; } .msg.err { color:var(--bad); } .msg.good { color:var(--ok); }
.pick { font-size:1.3rem; font-weight:700; letter-spacing:.02em; } .pick small { display:block; font-weight:400; font-size:.9rem; color:var(--muted); letter-spacing:0; }
.login { max-width:26rem; margin:2rem auto; } .muted { color:var(--muted); } code { background:var(--surface); padding:.1rem .35rem; border-radius:.25rem; word-break:break-all; }
.excel th { text-align:left; width:16rem; color:var(--muted); font-weight:600; vertical-align:top; } .excel pre { white-space:pre-wrap; word-break:break-word; max-height:24rem; overflow:auto; background:var(--surface); padding:.6rem; border-radius:.3rem; font-size:.8rem; }
.check { display:flex; align-items:center; gap:.4rem; font-weight:400; } fieldset.card { border:1px solid var(--line); } fieldset.card legend { font-weight:700; padding:0 .3rem; } textarea { width:100%; font:inherit; }

button.passkey { width:100%; padding:.8rem; font-size:1.05rem; }
a.sort { color:inherit; text-decoration:none; white-space:nowrap; } a.sort:hover { text-decoration:underline; } a.sort.on { color:var(--link); }
