:root { --ink:#2e2e2e; --muted:#828282; --line:#e6e6e6; --bg:#f4f5f7; --accent:#eb6b37; --accent-hover:#d85926; --nav:#212121; --green:#33866a; --radius:13px; }
* { box-sizing:border-box; } html, body { height:100%; margin:0; } body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; color:var(--ink); font-size:14px; -webkit-font-smoothing:antialiased; background:var(--bg); }
button,input,textarea,select { font:inherit; } button { cursor:pointer; border:0; transition:background .15s,box-shadow .15s,transform .15s; } button:disabled { cursor:not-allowed; opacity:.5; } button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline:3px solid #edae8e; outline-offset:2px; } input,textarea,select { border:1px solid #e1e1e1; border-radius:9px; padding:11px 13px; color:var(--ink); background:#fff; width:100%; } input,select { height:43px; } textarea { resize:vertical; min-height:92px; line-height:1.58; } input::placeholder,textarea::placeholder { color:#ababab; } button svg { pointer-events:none; }
.app-shell { display:flex; width:100%; height:100%; min-width:1060px; } .sidebar { width:276px; flex:none; background:var(--nav); color:#e2e2e2; display:flex; flex-direction:column; } .title-space { height:49px; flex:none; -webkit-app-region:drag; }
.brand { display:flex; gap:12px; align-items:center; padding:14px 24px 28px; } .brand-mark { width:42px; height:42px; background:#f17a48; color:white; display:flex; align-items:center; justify-content:center; font-size:29px; font-weight:900; border-radius:12px; letter-spacing:-3px; padding-right:2px; } .brand-mark span { color:#212121; } .brand strong { display:block; font-size:24px; letter-spacing:.1px; color:#fff; } .brand small { display:block; font-size:8px; letter-spacing:1.5px; color:#acacac; margin-top:3px; }
.primary { background:var(--accent); color:#fff; font-weight:650; padding:12px 18px; border-radius:9px; } .primary:hover { background:var(--accent-hover); } .new-order { margin:0 20px 20px; display:flex; align-items:center; gap:9px; text-align:left; } .new-order span { font-size:22px; line-height:1; } kbd { font-family:inherit; font-size:10px; padding:3px 5px; background:#ffffff24; border-radius:4px; margin-left:auto; color:#ffe9dc; }
.search-wrap { margin:0 20px 15px; position:relative; } .search-wrap input { background:#303030; border:1px solid #404040; color:#f0f0f0; border-radius:8px; height:39px; padding-left:30px; font-size:12px; } .search-icon { position:absolute; top:5px; left:10px; font-size:22px; color:#a4a4a4; } .filters { display:flex; gap:3px; margin:0 16px 22px; } .filters button { background:transparent; color:#a0a0a0; border-radius:6px; padding:7px 8px; font-size:11px; flex:1; white-space:nowrap; } .filters button.active { color:#fff; background:#424242; }
.list-label { display:flex; justify-content:space-between; padding:0 24px 12px; color:#909090; font-size:9px; font-weight:650; letter-spacing:1.4px; } .order-list { flex:1; overflow-y:auto; padding:0 12px 15px; } .order-card { display:block; width:100%; text-align:left; border:1px solid transparent; color:#dcdcdc; border-radius:10px; background:transparent; padding:15px 13px; margin-bottom:6px; } .order-card:hover { background:#303030; } .order-card.selected { background:#393939; border-color:#585858; box-shadow:inset 3px 0 #ef8050; } .order-top { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:8px; } .order-number { font-size:14px; font-weight:650; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .order-top time { font-size:10px; color:#929292; white-space:nowrap; } .order-model { font-size:12px; color:#b6b6b6; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-bottom:11px; } .order-state { display:flex; align-items:center; gap:5px; font-size:10px; color:#c7c7c7; } .order-state i { height:5px; width:5px; border-radius:50%; background:#e9985c; } .order-state.ready i { background:#61c1a0; } .order-state span { margin-left:auto; color:#878787; } .sidebar-empty { font-size:12px; line-height:1.6; color:#929292; padding:25px 13px; }
.sidebar-bottom { border-top:1px solid #3e3e3e; padding:12px 15px 16px; } .sidebar-action { display:flex; align-items:center; gap:9px; background:transparent; color:#c7c7c7; font-size:17px; padding:9px 9px; border-radius:7px; width:100%; text-align:left; } .sidebar-action:hover { background:#303030; } .sidebar-action span { font-size:12px; } .storage-note { display:flex; align-items:center; gap:6px; padding:15px 9px 0; font-size:9px; color:#919191; } .storage-note i { width:5px;height:5px;border-radius:50%;background:#62b598; } .storage-note i.offline { background:#e88b62; } .storage-note b { margin-left:auto; font-weight:500; }
.workspace { flex:1; min-width:0; display:flex; flex-direction:column; } .drag-titlebar { height:52px; display:flex; justify-content:space-between; align-items:center; padding:0 33px; flex:none; -webkit-app-region:drag; font-size:9px; letter-spacing:1.4px; color:#a1a1a1; } .save-indicator { font-size:11px; letter-spacing:0; color:var(--green); display:flex; align-items:center; gap:6px; } .save-indicator::before { content:''; width:5px; height:5px; background:currentColor; border-radius:50%; } .save-indicator.dirty { color:#786416; } .save-indicator.error { color:#c55345; }
.main-content { display:flex; flex-direction:column; min-height:0; flex:1; } .order-header { display:flex; align-items:flex-start; justify-content:space-between; padding:21px 33px 22px; gap:25px; flex:none; } .eyebrow { font-size:9px; letter-spacing:1.8px; font-weight:700; color:#909090; text-transform:uppercase; margin-bottom:10px; } h1 { margin:0; font-size:31px; line-height:1.12; letter-spacing:-1px; font-weight:730; } .header-title { display:flex; align-items:center; gap:10px; } .header-title h1 { max-width:460px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .subheading { color:#898989; font-size:12px; margin-top:10px; } .header-actions { display:flex; gap:8px; align-items:center; padding-top:9px; } .secondary { background:#fff; border:1px solid #e1e1e1; color:#595959; padding:11px 14px; border-radius:9px; font-size:12px; font-weight:550; white-space:nowrap; } .secondary:hover { background:#f0f0f0; } .icon-button { background:transparent; color:#969696; width:29px; height:29px; padding:0; border-radius:6px; font-size:18px; } .icon-button:hover { background:#e8e8e8; color:#333333; } .danger { color:#bd4f48; } .status-select { width:190px; font-size:11px; height:38px; padding:7px 10px; background:#fff; }
.workflow { display:flex; flex:none; margin:0 33px; border-bottom:1px solid #e1e1e1; } .step { position:relative; padding:18px 10px 19px; display:flex; gap:7px; align-items:center; flex:1; background:transparent; color:#898989; font-size:11px; text-align:center; justify-content:center; white-space:nowrap; } .step:first-child { padding-left:0; justify-content:flex-start; flex:.8; } .step:last-child { padding-right:0; flex:.8; } .step.active { color:#363636; font-weight:650; } .step.active::after { content:'';position:absolute;bottom:-1px;left:0;right:0;height:3px;background:var(--accent);border-radius:2px; } .step-number { font-size:9px; padding:4px 5px; border-radius:5px; color:#898989; background:#ebebeb; } .step.active .step-number { background:#fde4d6; color:#786416; } .step.done .step-number { background:#e0eee8; color:#438b70; } .step.locked { color:#a8a8a8; }
.stage-scroll { flex:1; min-height:0; overflow:auto; padding:24px 33px 40px; scroll-behavior:smooth; } .stage-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; } .stage-heading h2 { font-size:19px; letter-spacing:-.35px; margin:0 0 5px; } .stage-heading p { margin:0; color:#8f8f8f; font-size:12px; } .stage-count { color:#9a9a9a; font-size:11px; background:#ececec; padding:6px 10px; border-radius:18px; }
.card { background:#fff; border:1px solid #e6e6e6; border-radius:var(--radius); padding:22px 24px; margin-bottom:18px; box-shadow:0 2px 4px #2f2f2f03; } .card-head { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:17px; } .card-head h3 { font-size:14px; font-weight:650; margin:0; letter-spacing:-.1px; } .card-head .hint { font-size:10px; color:#9e9e9e; } .form-grid { display:grid; grid-template-columns:1fr 1fr; gap:19px 22px; } .form-grid.triple { grid-template-columns:1.15fr 1fr .55fr; } .field { margin-bottom:21px; } .form-grid .field { margin-bottom:0; } .field:last-child { margin-bottom:0; } .field > label, .plain-label { font-size:11px; font-weight:600; display:block; margin-bottom:8px; color:#747474; } .label-row { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; } .label-row label { font-size:11px; font-weight:600; color:#747474; } .quick-manage { background:transparent; font-size:10px; color:#786416; padding:2px 0; } .quick-manage:hover { color:#786416; } .date-readonly { background:#f5f7f9; border:1px solid #e5e5e5; border-radius:8px; height:43px; padding:12px 13px; font-size:12px; color:#747474; }
.quick-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; } .chip { padding:6px 9px; background:#f5f5f5; color:#757575; border:1px solid #eaeaea; border-radius:6px; font-size:10px; text-align:left; max-width:100%; line-height:1.4; } .chip:hover { background:#fceadf; border-color:#f4d3bf; color:#786416; } .chip.more { color:#786416; background:#fff7f1; }
.dropzone { border:1.5px dashed #d5d5d5; background:#fafbfd; border-radius:10px; min-height:125px; display:flex; align-items:center; justify-content:center; gap:17px; padding:23px; transition:.15s; } .dropzone.dragging { border-color:#e77441; background:#fff3e9; box-shadow:inset 0 0 0 2px #e7744120; } .upload-icon { height:47px; width:47px; border-radius:12px; background:#f0f0f0; color:#8e8e8e; display:flex; align-items:center; justify-content:center; font-size:28px; flex:none; } .drop-text strong { display:block; font-size:12px; color:#616161; font-weight:600; margin-bottom:6px; } .drop-text span { color:#9c9c9c; font-size:10px; line-height:1.6; } .dropzone .secondary { margin-left:auto; padding:10px 13px; font-size:11px; }
.attachment-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:15px; } .attachment-tile { border:1px solid #e5e5e5;border-radius:9px;overflow:hidden;background:#fff; } .attachment-preview { display:block;width:100%;height:145px;background:#f0f0f0;position:relative;padding:0; } .attachment-preview img { width:100%;height:100%;object-fit:cover; } .pdf-cover { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#786416;height:100%;background:#faf0e9; } .pdf-cover b { font-size:31px;letter-spacing:-1px; } .pdf-cover span { font-size:10px; } .attachment-info { padding:10px; } .file-title { font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:550; } .file-details { color:#a1a1a1;font-size:9px;margin-top:4px; } .attachment-actions { display:flex;align-items:center;gap:3px;border-top:1px solid #eef0f3;padding:5px 8px; } .attachment-actions button { background:transparent;color:#8f8f8f;font-size:10px;padding:5px;border-radius:4px; } .attachment-actions button:hover { background:#f1f1f1; } .attachment-actions .remove { margin-left:auto;color:#c16f63; } .caption-note { font-size:10px;color:#898989;line-height:1.5;margin-top:7px;white-space:pre-wrap;overflow-wrap:anywhere; }
.inline-note { background:#f4f4f4;color:#878787;padding:12px 15px;border-radius:8px;line-height:1.55;font-size:11px;margin-top:14px; } .approval-banner { display:flex;gap:15px;align-items:center;background:#edf7f1;border:1px solid #d3e7da;border-radius:10px;padding:18px 20px;margin-bottom:18px; } .approval-icon { width:33px;height:33px;border-radius:50%;background:#d7eadf;color:#397a5c;display:grid;place-items:center;font-size:18px;flex:none; } .approval-banner strong { font-size:12px;color:#3a6952;display:block;margin-bottom:5px; } .approval-banner span { color:#7d9686;font-size:11px; } .approval-banner .secondary { margin-left:auto;background:transparent;font-size:10px;color:#729582;border-color:#c6ddcf; }
.lock-panel { text-align:center;padding:54px 50px;background:#fff;border:1px solid #e5e5e5;border-radius:14px;max-width:720px;margin:22px auto; } .lock-circle { display:grid;place-items:center;width:65px;height:65px;background:#fff0e4;color:#786416;border-radius:20px;margin:0 auto 22px;font-size:28px; } .lock-panel h2 { font-size:24px;letter-spacing:-.5px;margin:0 0 14px; } .lock-panel p { font-size:13px;color:#878787;line-height:1.7;max-width:520px;margin:0 auto 22px; } .lock-panel small { display:block;color:#a3a3a3;font-size:10px;margin-top:18px;line-height:1.6; }
.stage-navigation { display:flex;justify-content:space-between;align-items:center;margin-top:22px; } .text-button { background:transparent;color:#878787;padding:9px 0;font-size:12px; } .text-button:hover { color:#786416; } .archive-banner { padding:12px 18px;background:#fff4e1;border:1px solid #f0dfbd;border-radius:8px;color:#786416;font-size:12px;margin-bottom:17px; }
.welcome { margin:auto;max-width:600px;text-align:center;padding:45px; } .welcome-mark { margin:0 auto 23px;width:83px;height:83px;display:grid;place-items:center;border-radius:24px;background:#f9e8df;color:#da7243;font-size:43px;font-weight:800; } .welcome h1 { font-size:30px;line-height:1.25;letter-spacing:-.8px; } .welcome p { color:#8e8e8e;line-height:1.8;margin:18px 0 28px;font-size:13px; } .welcome .actions { display:flex;gap:10px;justify-content:center; } .welcome small { display:block;margin-top:25px;color:#ababab;font-size:11px; }
.toast { position:fixed;bottom:23px;left:calc(50% + 138px);transform:translateX(-50%) translateY(12px);background:#333333;color:#fff;padding:13px 20px;border-radius:10px;box-shadow:0 8px 30px #24242429;max-width:680px;z-index:100;opacity:0;pointer-events:none;transition:.15s;font-size:12px;line-height:1.6; } .toast.visible { opacity:1;transform:translateX(-50%) translateY(0); } .toast.error { background:#983f37; }
.hidden { display:none!important; } .busy { position:fixed;inset:0;background:#21212155;backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;z-index:90; } .busy-panel { background:white;padding:35px 50px;border-radius:15px;display:flex;align-items:center;flex-direction:column;gap:17px;box-shadow:0 16px 60px #1f1f1f30; } .busy-panel strong { font-size:15px; } .busy-panel span { color:#969696;font-size:11px; } .spinner { width:30px;height:30px;border-radius:50%;border:3px solid #f1e2d9;border-top-color:#dc7547;animation:spin 1s linear infinite; } @keyframes spin { to {transform:rotate(360deg)} }
dialog { border:1px solid #e2e2e2;border-radius:16px;padding:0;background:#fff;color:var(--ink);box-shadow:0 25px 100px #20202040;width:600px;max-width:90vw;max-height:86vh; } dialog::backdrop { background:#1f1f1f70;backdrop-filter:blur(2px); } .modal-head { display:flex;align-items:center;justify-content:space-between;padding:22px 25px;border-bottom:1px solid #eaeaea; } .modal-head h2 { font-size:18px;letter-spacing:-.3px;margin:0; } .modal-head .close { background:#f4f4f4;color:#898989;width:26px;height:26px;border-radius:6px;font-size:18px; } .modal-content { padding:23px 25px;overflow-y:auto;max-height:66vh; } .modal-content p { font-size:12px;color:#8a8a8a;line-height:1.7;margin-top:0; } .modal-actions { padding:17px 25px;border-top:1px solid #eaeaea;display:flex;justify-content:flex-end;gap:9px; } .modal-content .field { margin-bottom:17px; } .modal-content h3 { font-size:13px;margin:25px 0 14px; } .modal-content h3:first-child { margin-top:0; } .quick-editor { display:flex;flex-direction:column;gap:8px; } .quick-edit-row { display:flex;gap:7px;align-items:flex-start; } .quick-edit-row textarea { font-size:12px;min-height:42px;padding:9px 11px; } .quick-edit-row button { flex:none;margin-top:7px;color:#b8786d;background:#fff3ef;width:28px;height:27px;border-radius:5px; } .quick-add { display:flex;gap:8px;margin-top:18px;align-items:flex-start; } .quick-add textarea { min-height:64px;font-size:12px; } .quick-add button { padding:11px; }
.settings-tabs { display:flex;gap:10px;border-bottom:1px solid #e7e7e7;margin-bottom:20px; } .settings-tabs button { background:transparent;color:#959595;padding:0 5px 12px;font-size:12px; } .settings-tabs button.active { border-bottom:2px solid var(--accent);color:#3e3e3e; } .storage-path { background:#f5f5f5;border:1px solid #e6e6e6;border-radius:8px;padding:12px;font-family:ui-monospace,SFMono-Regular,monospace;font-size:10px;line-height:1.6;overflow-wrap:anywhere;color:#7b7b7b;margin:12px 0 17px; } .storage-buttons { display:grid;grid-template-columns:1fr 1fr;gap:10px; } .storage-buttons button { white-space:normal;text-align:left;line-height:1.5; } .history-row { display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ededed;padding:13px 0;gap:15px; } .history-row strong { display:block;font-size:12px;margin-bottom:5px; } .history-row span { color:#9e9e9e;font-size:11px; } .viewer-image { max-height:60vh;max-width:100%;object-fit:contain;display:block;margin:0 auto; } dialog.viewer { width:900px; } .pdf-complete { text-align:center;padding:22px 0; } .pdf-complete .check { color:#399170;font-size:47px;margin-bottom:14px; } .pdf-complete h3 { font-size:22px;margin:0 0 14px; } .error-inline { color:#be5548;font-size:12px;line-height:1.6;margin-top:12px; } .warnings { padding:12px 17px;background:#fff3e9;color:#786416;border-radius:9px;font-size:11px;line-height:1.7;margin-bottom:16px; }
@media(max-width:1180px){ .sidebar{width:250px}.order-header{padding-left:25px;padding-right:25px}.workflow{margin:0 25px}.stage-scroll{padding-left:25px;padding-right:25px}.header-actions{gap:5px}.header-actions .secondary{padding:10px}.status-select{width:157px}.step{font-size:10px;padding:18px 6px}.brand{padding-left:20px}.toast{left:calc(50% + 125px)}.header-title h1{max-width:340px;font-size:27px}.attachment-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.card{padding:19px 20px} }


/* DiZeLiST v0.1.2 — white / graphite / yellow. Local system fonts only. */
:root {
  --ink:#1e211f; --muted:#6c716b; --line:#dddfd8; --bg:#f4f4f1;
  --accent:#f0d443; --accent-hover:#dfc132; --nav:#1b1e1d; --green:#28765a; --radius:8px;
}
body { background:var(--bg); color:var(--ink); }
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline:3px solid #b39718; outline-offset:3px; }
input,textarea,select { border-color:#d5d9d1; border-radius:6px; font-size:14px; }
input::placeholder,textarea::placeholder { color:#858a83; }
input:focus,textarea:focus { border-color:#a58a0c; }
textarea { line-height:1.65; }
.sidebar { background:var(--nav); color:#eceee9; border-right:1px solid #2c302d; }
.title-space { height:44px; }
.brand { padding:18px 23px 26px; }
.brand-wordmark { width:100%; }
.brand strong { font-weight:850; font-size:31px; letter-spacing:-1px; line-height:1.05; color:#fff; }
.brand-service { display:inline-block; color:var(--accent); font-size:9px; letter-spacing:1.3px; margin-left:8px; font-weight:700; vertical-align:middle; }
.brand small { font-size:7.5px; font-weight:600; letter-spacing:1.05px; color:#a6aca4; margin-top:9px; white-space:nowrap; }
.primary { color:#20231c; border-radius:5px; box-shadow:none; font-weight:750; }
.primary:hover { background:var(--accent-hover); }
.new-order { margin-bottom:21px; min-height:46px; }
kbd { background:#1d20121a; color:#424624; border:1px solid #54470620; border-radius:3px; }
.search-wrap input { border-color:#434741; background:#282c29; color:#f6f7f2; border-radius:5px; }
.search-wrap input::placeholder { color:#aab0a7; }
.search-icon { color:#b4baaf; }
.filters { margin-bottom:22px; gap:1px; }
.filters button { color:#afb6aa; border-radius:4px; }
.filters button:hover { background:#282d28; }
.filters button.active { background:#3a4037; color:#fff; }
.list-label { color:#a6b09e; font-size:9px; }
.order-card { color:#f2f4ed; border-radius:6px; padding:16px 13px; }
.order-card:hover { background:#282c28; }
.order-card.selected { background:#31362e; border-color:#535b47; box-shadow:inset 3px 0 var(--accent); }
.order-number { font-size:15px; }
.order-top time { color:#a3ad99; }
.order-model { color:#c0c6b8; }
.order-state { color:#d0d5c9; }
.order-state i { background:var(--accent); }
.order-state span { color:#a2ac97; }
.sidebar-empty { color:#a7b09f; }
.sidebar-bottom { border-color:#3a4037; }
.sidebar-action { color:#d7dcd1; }
.sidebar-action:hover { background:#30352c; }
.storage-note { color:#a1ab97; }
.storage-note b { font-variant-numeric:tabular-nums; font-size:10px; }
.drag-titlebar { height:47px; border-bottom:1px solid #e6e7e0; color:#797f74; font-size:9px; background:#fbfcf7; }
.save-indicator { font-size:11px; }
.order-header { padding-top:25px; padding-bottom:26px; background:#fff; }
.eyebrow { color:#696f63; font-size:9px; letter-spacing:1.7px; }
h1 { font-weight:800; letter-spacing:-1.2px; font-size:33px; }
.subheading { color:#6b7267; }
.secondary { color:#333a2d; border-color:#cfd4c7; border-radius:5px; background:#fff; font-weight:650; }
.secondary:hover { background:#f1f3eb; border-color:#a5af99; }
.icon-button { color:#747e68; }
.icon-button:hover { color:#242b1e; background:#eef0e7; }
.status-select { border-color:#cfd4c7; color:#333a2d; border-radius:5px; }
.workflow { margin:0; padding:0 33px; background:#fff; border-bottom:1px solid #dcded7; }
.step { font-size:11px; padding-top:17px; padding-bottom:18px; color:#72796b; }
.step.active { color:#23291d; font-weight:750; }
.step.active::after { height:4px; border-radius:0; background:var(--accent); }
.step-number { border-radius:4px; color:#68725e; background:#ecefe5; min-width:24px; }
.step.active .step-number { background:var(--accent); color:#22281b; }
.step.done:not(.active) .step-number { background:#e2ede5; color:#386f50; }
.step.locked { color:#7d8476; }
.stage-scroll { padding-top:25px; }
.stage-heading h2 { font-size:23px; font-weight:780; letter-spacing:-.6px; margin-bottom:6px; }
.stage-heading p { color:#6e7667; font-size:12px; line-height:1.5; }
.stage-count { color:#525d45; background:#e8ebdf; border-radius:4px; font-size:10px; padding:7px 9px; white-space:nowrap; }
.card { border-color:#dddfd6; border-radius:8px; padding:23px 24px; box-shadow:0 1px 1px #121a0903; }
.card-head h3 { font-size:15px; font-weight:750; }
.card-head .hint { color:#77826c; font-size:11px; }
.field > label,.plain-label,.label-row label { color:#424a39; font-size:12px; font-weight:650; }
.quick-manage { color:#786513; font-size:11px; border-bottom:1px solid #d8cc8c; }
.quick-manage:hover { color:#282e20; border-color:var(--accent); }
.date-readonly { color:#4e5942; background:#f4f6ed; border-color:#dce1d2; border-radius:6px; }
.quick-chips { gap:7px; margin-top:11px; }
.chip { font-size:11px; padding:7px 10px; color:#58634b; background:#f3f5ed; border-color:#dfe4d4; border-radius:4px; }
.chip:hover { color:#302f12; background:#faf0ae; border-color:#cfb739; }
.chip.more { background:#fcf6d5; color:#6f5a0a; border-color:#e6d78c; }
.dropzone { border-color:#bac3ae; background:#f8faf3; border-radius:6px; min-height:133px; }
.dropzone.dragging { border-color:#978007; background:#fff5b6; box-shadow:inset 0 0 0 2px #d3b62240; }
.upload-icon { color:#343b28; background:var(--accent); border-radius:5px; width:46px; height:46px; font-size:27px; }
.drop-text { min-width:0; }
.drop-text strong { color:#333e26; font-size:13px; }
.drop-text span { color:#727e64; font-size:11px; }
.dropzone .secondary { color:#fff; background:#242c1d; border-color:#242c1d; border-radius:5px; font-size:12px; }
.dropzone .secondary:hover { background:#3c4831; }
.attachment-grid { gap:14px; }
.attachment-tile { border-color:#d7ddcf; border-radius:6px; }
.attachment-preview { background:#eff2e8; }
.attachment-preview img { object-fit:contain; background:#eff2e8; }
.pdf-cover { background:#f8f3d8; color:#716017; }
.pdf-cover b { font-size:29px; }
.file-title { font-size:12px; }
.file-details { font-size:10px; color:#75826a; }
.caption-note { color:#657657; font-size:11px; }
.attachment-actions { border-color:#e5e9dc; }
.attachment-actions button { font-size:11px; color:#657657; }
.attachment-actions button:hover { background:#f4edc8; }
.attachment-actions .remove { color:#a7473d; }
.inline-note { background:#f3f4ee; color:#606d52; border-left:3px solid #e3cf64; border-radius:2px; font-size:11px; line-height:1.7; }
.approval-banner { border-radius:6px; }
.lock-panel { border-color:#dde1d4; border-radius:8px; }
.lock-circle { color:#47400f; background:#f7e98f; border-radius:7px; }
.lock-panel h2 { font-size:26px; font-weight:780; }
.lock-panel p { color:#627154; }
.lock-panel small { color:#78876a; }
.text-button { color:#667857; }
.text-button:hover { color:#756017; }
.welcome { max-width:800px; padding:40px 70px; text-align:left; width:100%; overflow:auto; }
.welcome-mark { display:none; }
.welcome .eyebrow { border-left:4px solid var(--accent); padding-left:13px; margin-bottom:28px; }
.welcome h1 { font-size:clamp(38px,4.3vw,58px); line-height:1.12; font-weight:850; letter-spacing:-2px; }
.welcome h1 span { background:linear-gradient(transparent 64%,var(--accent) 64%); }
.welcome p { font-size:14px; max-width:535px; line-height:1.9; color:#65745a; margin:24px 0 28px; }
.welcome .actions { justify-content:flex-start; }
.welcome small { color:#7d8a74; font-size:11px; }
.toast { background:#242b1e; color:#fff; border-radius:7px; font-size:12px; box-shadow:0 8px 30px #15200825; }
.toast.error { background:#913e34; }
.busy { background:#1c211550; }
.busy-panel { border-radius:9px; }
.busy-panel span { color:#717e65; }
.spinner { border-color:#f0e9bc; border-top-color:#b3960c; }
dialog { border-color:#d6decc; border-radius:9px; box-shadow:0 24px 80px #17250b35; }
dialog::backdrop { background:#1d281565; }
.modal-head { background:#f8faf3; border-bottom-color:#e0e6d7; }
.modal-head h2 { font-size:20px; font-weight:760; }
.modal-head .close { color:#626f55; background:#e9eddf; border-radius:4px; }
.modal-content p { color:#617051; }
.modal-actions { border-top-color:#e1e6d9; }
.settings-tabs button { color:#6e7b62; }
.settings-tabs button.active { color:#26341b; border-bottom-width:3px; }
.storage-path { background:#f3f5ed; border-color:#d8e0cd; color:#586a46; border-radius:4px; }
.history-row span { color:#6e805e; }
@media(max-width:1180px) {
  .brand { padding-left:20px; padding-right:18px; }
  .brand strong { font-size:28px; }
  .brand-service { font-size:8px; margin-left:7px; }
  .brand small { font-size:7px; letter-spacing:.85px; }
  .workflow { margin:0; padding-left:25px; padding-right:25px; }
  .step { font-size:10px; gap:5px; }
  .card { padding:19px 20px; }
  .card-head .hint { font-size:10px; }
  .stage-heading h2 { font-size:21px; }
  .dropzone { gap:13px; padding:18px; }
  .drop-text strong { font-size:12px; }
  .drop-text span { font-size:10px; }
  .dropzone .secondary { font-size:11px; }
  .chip { font-size:10px; }
  .welcome { padding:34px 45px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; scroll-behavior:auto!important; } }