:root { color-scheme: light; --ink:#2A2A32; --muted:#6d6d78; --line:#e6e6eb; --pink:#F48B9C; --ok:#166534; --bad:#9f1239; }
* { box-sizing: border-box; }
body { margin:0; font: 16px/1.5 system-ui, sans-serif; background:#fff; color:var(--ink); }
h1 { font-size: 1.6rem; line-height: 1.2; margin: 0 0 .35rem; font-weight: 700; }
h2 { font-size: 1rem; margin: 1.6rem 0 .5rem; }
a { color: var(--ink); }
p { margin: .35rem 0; }
.muted { color: var(--muted); }
.error { color: var(--bad); font-weight: 650; }
.ok { color: var(--ok); font-weight: 650; }
.feedback { margin: 0 0 1rem; padding: .65rem .8rem; border-left: 3px solid var(--pink); font-weight: 650; }
.mark { display:inline-flex; align-items:center; justify-content:center; width:2.4rem; height:2.4rem; border-radius:8px; background:var(--pink); color:#fff; font-weight:750; letter-spacing:-.04em; text-decoration:none; }
.side { background:#fff; border-bottom:1px solid var(--line); padding:1.1rem 1.1rem .4rem; }
.side nav { display:flex; flex-direction:column; gap:.1rem; margin-top:1rem; }
.side nav a { color:var(--ink); text-decoration:none; font-weight:650; padding:.55rem .7rem; border-radius:8px; }
.side nav a.on { box-shadow: inset 3px 0 0 var(--pink); }
.work { padding: 1.25rem 1.1rem 5rem; }
.gate { max-width: 24rem; margin: 0 auto; padding: 3rem 1.25rem 4rem; }
.signin .mark { margin-bottom: 1rem; }
.card { display:block; background:#fff; border:1px solid var(--line); border-radius:12px; padding: .9rem 1rem; margin: .7rem 0; text-decoration:none; color:inherit; }
.order-card { border:1px solid var(--line); border-radius:12px; padding:.9rem 1rem; margin:.7rem 0; }
.order-card > a { font-weight:750; text-decoration:none; }
.meta { display:block; color:var(--muted); font-size:.88rem; margin-top:.15rem; }
.label { display:inline-block; font-size:.78rem; font-weight:700; line-height:1.2; border-bottom:2px solid var(--pink); }
label { display:block; font-weight:650; margin: .8rem 0 .3rem; }
input, textarea, select { width:100%; font:inherit; padding:.75rem; border-radius:10px; border:1px solid var(--line); background:#fff; color:var(--ink); }
textarea { min-height: 6rem; }
button, .button { display:block; width:100%; min-height:3rem; margin-top:.6rem; border-radius:10px; border:0; font: inherit; font-weight:700; text-align:center; text-decoration:none; cursor:pointer; }
.primary { background:var(--ink); color:#fff; }
.danger { background:#fff; color:var(--bad); border:1px solid var(--line); }
.quiet { background:#fff; color:var(--ink); border:1px solid var(--line); width:auto; min-height:2.5rem; padding:0 .8rem; }
button.signout { width:auto; min-height:0; margin:1rem .7rem .4rem; padding:.4rem 0; background:transparent; color:var(--ink); border:0; font-weight:650; text-align:left; }
td.actions form, .actions form { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; margin:.4rem 0 0; }
.actions .act { display:inline-flex; align-items:center; justify-content:center; width:auto; min-height:2.75rem; margin:0; padding:0 .8rem; border-radius:8px; border:1px solid var(--line); background:#fff; color:var(--ink); font-weight:650; }
.actions .act.solid { background:var(--ink); color:#fff; border-color:var(--ink); }
.actions input.note { width:100%; min-height:2.75rem; margin:0; padding:.35rem .55rem; }
.tid, pre { font-family: ui-monospace, monospace; white-space: pre-wrap; word-break: break-word; }
pre { background:#f7f7f8; padding:.7rem; border-radius:10px; }
.records-wrap { overflow-x:auto; margin-top:.8rem; }
table.board { width:100%; border-collapse:collapse; font-size:.92rem; min-width:46rem; background:#fff; }
table.board th, table.board td { text-align:left; padding:.75rem .7rem; border-bottom:1px solid var(--line); vertical-align:top; }
table.board th { font-size:.75rem; color:var(--muted); font-weight:700; white-space:nowrap; }
.pill { display:inline-block; font-size:.78rem; font-weight:700; border-bottom:2px solid var(--pink); }
.pill.bad { color:var(--bad); }
.pill.ok { color:var(--ok); }
.wide { display:none; }
.narrow { display:block; }
#alerts.alerts-on { border:0; background:transparent; color:var(--muted); font-weight:650; min-height:0; margin-top:.2rem; padding:0; width:auto; max-width:100%; cursor:default; white-space:normal; text-align:left; }
.arrived { position:fixed; left:0; right:0; bottom:0; z-index:30; display:flex; align-items:center; justify-content:space-between; gap:.8rem; background:#1c1917; color:#fffdf8; padding:.85rem 1rem calc(.85rem + env(safe-area-inset-bottom)); }
.arrived p { margin:0; font-weight:650; }
.arrived a { color:#fdba74; font-weight:700; white-space:nowrap; }
.arrived[hidden] { display:none; }
@media (min-width: 960px) {
  .side { position: fixed; top:0; left:0; bottom:0; width:220px; border-bottom:0; border-right:1px solid var(--line); padding:1.4rem 1rem; overflow:auto; }
  .work { margin-left:220px; padding:2rem 2.25rem 5rem; }
  .wide { display:block; }
  .narrow { display:none; }
  .actions input.note { width:8.5rem; }
}