:root{--font-ui:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-title:"EB Garamond", Georgia, serif;--bg:#f4f1e8;--panel:#fbfaf5;--line:#d9d4c4;--control-border:#8a8374;--ink:#2b2a26;--muted:#6b675c;--field:#e7e3d4;--grid:#3c3c281a;--grid-major:#3c3c2838;--select:#1d5fa8;--accent:#8c2f22;--error:#b3261e;--ok:#2e6b30;--warn-bg:#fbecd0;--radius:6px}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#1d1c19;--panel:#252420;--line:#3b3932;--control-border:#85806f;--ink:#ece8dc;--muted:#a39e8f;--field:#2b2a24;--grid:#ece8dc0f;--grid-major:#ece8dc24;--select:#7fb2ec;--accent:#e08a6f;--error:#f2786c;--ok:#8fcf8c;--warn-bg:#4a3a1c}}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);font:14px/1.4 var(--font-ui);margin:0}.app{grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr) 360px;height:100vh;display:grid}.toolbar{border-bottom:1px solid var(--line);background:var(--panel);flex-wrap:wrap;grid-column:1;align-items:center;gap:6px 14px;padding:8px 12px;display:flex}.toolbar h1{font:600 19px var(--font-title);letter-spacing:.04em;align-items:center;gap:6px;margin:0 10px 0 0;display:inline-flex}.field{grid-column:1;min-height:0;position:relative}.field canvas:focus-visible{outline:2px solid var(--select);outline-offset:-2px}.field canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.replay{border-top:1px solid var(--line);background:var(--panel);grid-column:1;padding:8px 12px}.side{border-left:1px solid var(--line);background:var(--panel);flex-direction:column;grid-area:1/2/4;display:flex;overflow-y:auto}.side section{border-bottom:1px solid var(--line);padding:12px 14px}.side h2{font:600 17px var(--font-title);margin:0 0 8px}.side h3{font:600 15px var(--font-title);margin:14px 0 6px}.seg{border:1px solid var(--control-border);border-radius:var(--radius);display:inline-flex;overflow:hidden}.seg button{border:0;border-right:1px solid var(--control-border);border-radius:0}.seg button:last-child{border-right:0}.seg button[aria-pressed=true]{background:var(--ink);color:var(--panel)}.group{align-items:center;gap:6px;display:inline-flex}.group>.label{color:var(--muted);font-size:12px}button,select,input{font:inherit;color:var(--ink)}button{background:var(--panel);border:1px solid var(--control-border);border-radius:var(--radius);cursor:pointer;min-height:30px;padding:4px 10px}button:hover:not(:disabled){background:var(--bg)}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--select);outline-offset:1px}input[type=number],input[type=text],select{background:var(--bg);border:1px solid var(--control-border);border-radius:var(--radius);min-height:30px;padding:4px 6px}input[type=number]{width:70px}.row{flex-wrap:wrap;align-items:center;gap:8px;margin:6px 0;display:flex}.row>label{min-width:96px;color:var(--muted)}.companies{margin:0;padding:0;list-style:none}.companies li{border-radius:var(--radius);cursor:pointer;align-items:center;gap:8px;padding:4px 6px;display:flex}.companies li[aria-selected=true]{background:var(--bg);outline:1px solid var(--line)}.swatch{border-radius:3px;flex:none;width:14px;height:14px}.warn{background:var(--warn-bg);border-radius:var(--radius);margin:6px 0;padding:6px 8px;font-size:13px}.orders{counter-reset:order;margin:0;padding:0;list-style:none}.orders li{border-bottom:1px solid var(--line);grid-template-columns:18px 22px 1fr auto;align-items:start;gap:6px;padding:6px 4px;display:grid}.orders li.current{background:var(--bg)}.orders li.error .words{color:var(--error)}.orders li.unreached{opacity:.45}.orders .num{color:var(--muted);font-variant-numeric:tabular-nums;padding-top:5px}.orders .handle{cursor:grab;color:var(--muted);-webkit-user-select:none;user-select:none;padding-top:5px}.orders .words{font-family:var(--font-title);cursor:pointer;text-align:left;background:0 0;border:0;min-height:0;padding:2px 0;font-size:16px;line-height:1.3}.orders .words:hover{background:0 0;text-decoration:underline}.orders .params{color:var(--muted);flex-wrap:wrap;gap:4px 8px;margin-top:4px;font-size:12px;display:flex}.orders .reason{color:var(--error);font-size:12px}.orders .actions{gap:4px;display:flex}.orders .actions button{min-height:26px;padding:2px 7px}.menu{flex-wrap:wrap;gap:4px;margin-top:8px;display:flex}.compare{border-radius:var(--radius);background:var(--bg);font-variant-numeric:tabular-nums;margin-top:10px;padding:8px}.compare .verdict.ok{color:var(--ok);font-weight:600}.compare .verdict.no{color:var(--error);font-weight:600}.replay .bar{align-items:center;gap:8px;display:flex}.replay .track{flex:1;padding-top:14px;position:relative}.replay .track input{width:100%}.replay .ticks{height:14px;position:absolute;inset:0 8px auto}.replay .ticks span{color:var(--muted);font-size:10px;position:absolute;transform:translate(-50%)}.replay .time{font-variant-numeric:tabular-nums;text-align:right;min-width:92px}.replay .note{color:var(--muted);font-size:12px}.toast{background:var(--panel);border:1px solid var(--error);color:var(--ink);border-radius:var(--radius);z-index:2;align-items:center;gap:10px;padding:8px 12px;display:flex;position:absolute;top:10px;left:50%;transform:translate(-50%)}.hint{color:var(--muted);background:color-mix(in srgb, var(--panel) 85%, transparent);border-radius:var(--radius);pointer-events:none;padding:4px 8px;font-size:12px;position:absolute;bottom:10px;right:10px}details{margin:8px 0}details summary{cursor:pointer;color:var(--muted);padding:4px 0;font-size:13px}.replay button svg{display:block}.note{color:var(--muted);margin:4px 0 8px;font-size:13px}.label-text{min-width:96px;color:var(--muted)}.toolbar .help-button{border-color:var(--accent);color:var(--accent);margin-left:auto;font-weight:600}dialog.help{border:1px solid var(--control-border);border-radius:var(--radius);background:var(--panel);max-width:min(600px,100vw - 32px);max-height:calc(100vh - 48px);color:var(--ink);padding:20px 24px;overflow-y:auto}dialog.help::backdrop{background:#14120e73}dialog.help h2{font:600 22px var(--font-title);margin:0 0 8px}dialog.help h3{font:600 16px var(--font-title);margin:16px 0 6px}.help-steps{margin:12px 0;padding-left:22px}.help-steps li{margin:6px 0}.help-controls{border-collapse:collapse;width:100%}.help-controls th,.help-controls td{text-align:left;border-bottom:1px solid var(--line);vertical-align:top;padding:4px 8px 4px 0}.help-controls th{white-space:nowrap;font-weight:600}.help-actions{justify-content:flex-end;margin-top:12px;display:flex}
