:root { --navy:#173e64; --gold:#d5b466; --bg:#f4f7fb; --card:#fff; --line:#e3e8ef; --text:#1d2a38; --muted:#667385;
        --red:#c0392b; --red-bg:#fdecea; --amber:#9a6b00; --amber-bg:#fff6dc; --green:#1e7b4f; --green-bg:#e6f5ec; }
* { box-sizing: border-box; }
body { margin:0; font:15px/1.45 -apple-system, "Segoe UI", Roboto, Arial, sans-serif; background:var(--bg); color:var(--text); }
a { color:var(--navy); }
h1 { font-size:22px; margin:0 0 14px; } h2 { font-size:17px; margin:0 0 10px; }
.topbar { display:flex; align-items:center; gap:16px; flex-wrap:wrap; padding:10px 20px; background:var(--navy); color:#fff; }
.brand { display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none; font-weight:600; font-size:17px; }
.brand img { width:34px; height:34px; border-radius:50%; }
.nav { display:flex; gap:4px; flex-wrap:wrap; flex:1; }
.nav a { color:#fff; text-decoration:none; padding:7px 12px; border-radius:8px; }
.nav a:hover { background:#ffffff1f; }
.nav a.nav-primary { background:var(--gold); color:var(--navy); font-weight:600; }
.userbox { display:flex; gap:10px; align-items:center; margin:0; font-size:14px; }
.page { max-width:1200px; margin:0 auto; padding:18px 16px 60px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px; margin-bottom:14px; }
.card-warn { background:var(--amber-bg); border-color:#f0d68a; }
.card-inner { border-top:1px solid var(--line); padding:12px 0; }
.card-inner:first-child { border-top:0; }
.btn { display:inline-block; border:1px solid var(--line); background:#fff; color:var(--text); padding:8px 14px; border-radius:9px;
       font:inherit; cursor:pointer; text-decoration:none; }
.btn:hover { border-color:var(--navy); }
.btn-primary { background:var(--navy); color:#fff; border-color:var(--navy); }
.btn.link, button.link { border:0; background:none; color:inherit; text-decoration:underline; cursor:pointer; padding:4px; font:inherit; }
.msg { padding:10px 14px; border-radius:9px; margin-bottom:12px; background:var(--green-bg); }
.msg-error { background:var(--red-bg); color:var(--red); } .msg-warning { background:var(--amber-bg); color:var(--amber); }
.stats { display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:10px; margin-bottom:16px; }
.stat { background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px 14px; text-decoration:none; color:var(--text); }
.stat b { display:block; font-size:26px; } .stat span { color:var(--muted); font-size:13px; }
.stat-alert { border-color:#f1b0a8; background:var(--red-bg); } .stat-alert b { color:var(--red); }
.stat-warn { border-color:#f0d68a; background:var(--amber-bg); }
.toolbar { display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.tabs { display:flex; gap:4px; flex-wrap:wrap; }
.tabs a { padding:7px 12px; border-radius:8px; text-decoration:none; color:var(--muted); }
.tabs a.on { background:var(--navy); color:#fff; }
.search { display:flex; gap:6px; } .search input { min-width:220px; }
input, select, textarea { font:inherit; padding:8px 10px; border:1px solid #cdd5df; border-radius:8px; width:100%; background:#fff; }
.search input { width:auto; }
table.list { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.list th, .list td { padding:10px 12px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.list th { background:#f8fafc; font-weight:600; font-size:13px; color:var(--muted); }
.list tbody tr { cursor:pointer; } .list tbody tr:hover { background:#f8fafc; }
.list.compact td, .list.compact th { padding:7px 8px; } .list.compact tbody tr { cursor:default; }
.num { text-align:right !important; white-space:nowrap; }
tr.late td { background:var(--red-bg); } tr.due-today td { background:var(--amber-bg); }
.st { display:inline-block; padding:2px 9px; border-radius:20px; font-size:12.5px; background:#eef2f7; white-space:nowrap; }
.st-draft { background:#eceff3; color:#56606c; } .st-accepted { background:#e6eefa; color:var(--navy); }
.st-in_production, .st-fitting, .st-quality_control { background:#efe7fb; color:#5b3a99; }
.st-ready { background:var(--green-bg); color:var(--green); } .st-delivered, .st-closed { background:#eceff3; }
.st-cancelled { background:var(--red-bg); color:var(--red); }
.tag { font-size:11.5px; padding:1px 7px; border-radius:20px; } .tag-urgent { background:var(--red); color:#fff; }
.empty { color:var(--muted); padding:30px; text-align:center; }
.head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.actions { display:flex; gap:8px; flex-wrap:wrap; } .actions form { margin:0; }
.grid2 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.4fr); gap:14px; }
.props { display:grid; grid-template-columns:130px 1fr; gap:6px 12px; margin:0; } .props dt { color:var(--muted); } .props dd { margin:0; }
.diff { border-collapse:collapse; margin:10px 0; } .diff td, .diff th { padding:5px 12px; border-bottom:1px solid #00000014; text-align:left; }
.decide { display:flex; gap:8px; flex-wrap:wrap; align-items:flex-start; } .decide textarea { flex:1; min-width:220px; }
details.card summary { cursor:pointer; font-weight:600; }
.form .field, .form > div > div { margin:10px 0; } .form label { display:block; font-size:13px; color:var(--muted); margin-bottom:4px; }
.grid-form { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:4px 14px; }
.field-comment { grid-column:1 / -1; }
.field small, .hint { color:var(--muted); font-size:12.5px; }
.has-error input, .has-error select { border-color:var(--red); } .err { color:var(--red); font-size:13px; }
.item-fields { display:grid; grid-template-columns:2fr .6fr .8fr 1.6fr auto; gap:10px; align-items:end; }
.item-fields .field { margin:0; }
.teeth-chart { margin-top:6px; display:inline-block; }
.jaw { display:flex; gap:10px; } .jaw + .jaw { border-top:2px solid var(--line); padding-top:4px; margin-top:4px; }
.q { display:flex; gap:3px; } .q:first-child { border-right:2px solid var(--line); padding-right:10px; }
.tooth { width:34px; height:34px; border:1px solid #cdd5df; border-radius:7px; background:#fff; font-size:12.5px; cursor:pointer; padding:0; }
.tooth.on { background:var(--navy); color:#fff; border-color:var(--navy); }
.submit-bar { display:flex; gap:10px; justify-content:flex-end; position:sticky; bottom:0; padding:12px 0; background:var(--bg); }
.login { max-width:380px; margin:40px auto; } .login .btn { width:100%; margin-top:10px; padding:11px; }
.login label { display:block; margin:10px 0; font-size:13px; color:var(--muted); }
@media (max-width: 760px) {
  .grid2 { grid-template-columns:1fr; } .item-fields { grid-template-columns:1fr 1fr; }
  .search input { min-width:0; flex:1; } .search { width:100%; }
  table.list thead { display:none; } table.list, table.list tbody, table.list tr, table.list td { display:block; width:100%; }
  table.list tr { border-bottom:1px solid var(--line); padding:6px 0; }
  table.list td { border:0; padding:3px 12px; } table.list td[data-l]::before { content:attr(data-l) ": "; color:var(--muted); font-size:12.5px; }
  .num { text-align:left !important; }
  .hide-mobile { display:none !important; }
  table.list tfoot, table.list tfoot tr, table.list tfoot td { display:block; }
  .tooth { width:30px; height:30px; font-size:11.5px; } .q { gap:2px; } .jaw { gap:6px; }
  .props { grid-template-columns:110px 1fr; }
}
.assign { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; } .assign select, .assign input { width:auto; min-width:150px; }
.task-actions form { display:flex; gap:6px; flex-wrap:wrap; margin:0; } .inline-check input { width:auto; min-width:180px; }
.st-task-assigned { background:#e6eefa; color:var(--navy); } .st-task-done { background:var(--amber-bg); color:var(--amber); }
.st-task-confirmed { background:var(--green-bg); color:var(--green); } .st-task-rejected { background:var(--red-bg); color:var(--red); }
tr.muted td { color:var(--muted); text-decoration:line-through; } label.check { display:flex; gap:8px; align-items:center; color:var(--text); }
label.check input { width:auto; }
.bars { display:flex; align-items:flex-end; gap:2px; height:200px; padding:8px 0 26px; border-bottom:1px solid var(--line); position:relative; }
.bar-col { flex:1; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:stretch; position:relative; text-decoration:none; padding:0 3px; }
.bar { display:block; background:#7f97b2; border-radius:4px 4px 0 0; min-height:1px; }
.bar-col.current .bar { background:var(--navy); }
.bar-col:hover .bar { background:var(--navy); }
.bar-label { position:absolute; bottom:-22px; left:0; right:0; text-align:center; font-size:11px; color:var(--muted); white-space:nowrap; }
.bar-col:hover::after { content:attr(data-tip); position:absolute; bottom:calc(100% + 4px); left:50%; transform:translateX(-50%);
  background:var(--text); color:#fff; font-size:12px; padding:4px 8px; border-radius:6px; white-space:nowrap; z-index:2; }
@media (max-width:760px) { .bar-label { font-size:9px; } .bars { height:160px; } }
.export { margin:-2px 0 12px; } .export summary { cursor:pointer; color:var(--muted, #667); font-size:14px; }
.export form { margin-top:8px; } .search label { display:inline-flex; align-items:center; gap:6px; }
.table-scroll { overflow-x:auto; } .edit-items input, .edit-items select { max-width:100%; }
.edit-items select { min-width:200px; } .edit-items .add-row select { color:var(--muted); }
tr.dim td { color:var(--muted); }
.inline { display:inline; margin:0; } .userlink { color:inherit; text-decoration:none; }