.topbar .brand { display:flex; align-items:center; gap:12px; min-width:0; }
.topbar .brand img { object-fit:contain; flex-shrink:0; }
.topbar .brand strong { display:block; font-size:17px; overflow-wrap:anywhere; }
.topbar nav { display:flex; gap:8px; flex-shrink:0; }
.icon-button { width:48px; height:48px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:10px; color:var(--brand); background:var(--card); cursor:pointer; }
.topbar .icon-button { background:transparent; border-color:rgba(255,255,255,.4); color:white; }
.icon-button:focus-visible,.order-row:focus-visible { outline:3px solid var(--brand); outline-offset:3px; }
.icon-button svg { width:22px; height:22px; }
.app { padding:16px; min-height:70vh; }
.sign-in { margin:72px auto; max-width:420px; }
.sign-in h1 { font-size:26px; margin-bottom:24px; }
.page-head { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:8px 0 20px; }
.page-head h1 { font-size:24px; margin:0; flex:1; }
.search { width:100%; max-width:440px; min-height:56px; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); color:var(--ink); font:inherit; }
.order-row { width:100%; min-height:80px; display:grid; grid-template-columns:140px 1fr auto; align-items:center; gap:16px; padding:14px 8px; border:0; border-bottom:1px solid var(--line); background:transparent; color:var(--ink); cursor:pointer; text-align:left; font:inherit; }
.order-row:hover { background:var(--surface-2); }
.order-row .plate { display:inline-block; min-width:110px; text-align:center; }
.order-meta { color:var(--muted); font-size:14px; margin-top:4px; }
.detail-grid { display:grid; grid-template-columns:minmax(0,3fr) minmax(280px,2fr); gap:32px; }
.detail-grid section,.connector section { padding:20px 0; border-top:1px solid var(--line); }
h2 { font-size:18px; margin:0 0 16px; }
.line-row,.note-row,.agent-row { padding:14px 0; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.line-row { display:flex; gap:16px; justify-content:space-between; }
.line-row span { font-variant-numeric:tabular-nums; white-space:nowrap; }
textarea,input:not([type=checkbox]):not([type=file]) { font:inherit; }
textarea { width:100%; min-height:120px; border:1px solid var(--line); border-radius:10px; padding:12px; background:var(--surface-2); color:var(--ink); resize:vertical; }
label { display:block; margin-bottom:8px; }
.form-actions { display:flex; gap:12px; margin-top:12px; flex-wrap:wrap; }
.muted,.empty { color:var(--muted); }
.empty { padding:40px 0; }
#notice { position:fixed; bottom:24px; left:16px; right:16px; z-index:50; padding:16px; background:var(--ink); color:var(--card); border-radius:10px; max-width:650px; margin:auto; }
.connector { max-width:960px; }
.connector .token { font-family:ui-monospace,monospace; word-break:break-all; padding:16px; border:1px solid var(--warn); background:var(--surface-2); margin:16px 0; }
.status-line { padding:12px 0; color:var(--muted); }
.error { color:var(--danger); }
.busy { opacity:.65; pointer-events:none; }
.offline { border-left:6px solid var(--warn); padding:12px; margin:12px 0; background:var(--surface-2); }
.wk-footer { padding:24px 16px; text-align:center; color:var(--muted); }
@media(max-width:700px) { .detail-grid { grid-template-columns:1fr; gap:0; } .order-row { grid-template-columns:120px minmax(0,1fr) 24px; gap:8px; } .topbar { padding:12px; gap:8px; } .topbar .brand strong { font-size:14px; } .topbar .brand img { width:38px; height:38px; } .topbar nav { gap:4px; } .icon-button { width:44px; height:44px; } .page-head h1 { font-size:22px; } }
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; transition:none!important; } }