/* ProApp's website palette, adapted to the denser demo workspace. */
:root {
  --ink: #191a1c;
  --muted: #626467;
  --line: #e6e6e2;
  --paper: #fff;
  --tint: #f6f6f4;
  --accent: #b69a43;
  --accent-ink: #80651f;
  --accent-soft: #faf7ee;
  --accent-line: #e4d8b5;
  --control-line: #b7b7ae;
  --subtle: #747670;
  --canvas: #f3f2ee;
  --success: #27623c;
  --success-soft: #f5faf6;
  --success-line: #b7d2be;
  --error: #a12b25;
  --error-soft: #fff5f3;
  --error-line: #e5bdb7;
  /* Website's darker gold fill keeps small button labels readable. */
  --action-gold: linear-gradient(118deg,#795218 0%,#967026 28%,#86601c 53%,#967026 78%,#795218 100%);
  --action-gold-hover: linear-gradient(118deg,#704a13 0%,#8e681f 28%,#795218 53%,#906a21 78%,#704a13 100%);
  color: var(--ink);
  background: var(--tint);
  font-family: Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang HK","Noto Sans TC","Microsoft JhengHei",sans-serif;
}
::selection { background:#e8d9aa; color:var(--ink); }
button:focus-visible,a:focus-visible { outline-color:var(--accent-ink); }
.font-links a { color:var(--accent-ink); }
.workspace-brand { display:block; width:86px; height:auto; }
.wordmark { gap:14px; letter-spacing:-.35px; }
.product-name { font-size:16px; font-weight:600; }
.wordmark-divider { background:var(--line); }
.workspace-label,.local-badge,.page-heading p,.file-info>span,.file-stats,
.text-button,.order-sku,.order-price,.field,.field small,.currency-input>span,
.editor-footer,.page-footer,.canvas-meta,.measurement,.preview-footer,
.zoom-value,.orders-footer,.dialog-intro,.format-option>span:last-child,
.help-steps p,.entrance-brand>span,.entrance-intro,.entrance-project span,
.entrance-contact,.entrance-privacy,.entrance-footer,.workspace-privacy,
.exit-preview,.exit-dialog>p { color:var(--muted); }
.eyebrow,.entrance-label { color:var(--accent-ink); }
.brand-mark { background:var(--action-gold); border:1px solid #ba9b43; transform:none; }
.rail-button { color:var(--subtle); }
.rail-button:hover,.rail-button.active { background:var(--accent-soft); color:var(--accent-ink); }
.avatar { background:var(--accent-soft); color:var(--accent-ink); box-shadow:0 0 0 1px var(--accent-line); }
.demo-badge { color:var(--accent-ink); border-color:var(--accent-line); background:var(--accent-soft); }
.button.primary {
  background:var(--action-gold); border-color:#ba9b43; color:#fff;
  box-shadow:0 2px 5px #7d632014; text-shadow:0 1px 1px #59410b55;
}
.button.primary:hover:not(:disabled) {
  background:var(--action-gold-hover); border-color:var(--accent-ink);
  box-shadow:0 4px 9px #7d63201f;
}
.button.secondary { background:var(--paper); border-color:var(--control-line); color:var(--ink); }
.button.secondary:hover { background:var(--accent-soft); border-color:var(--accent); color:var(--accent-ink); }
.text-button:hover { color:var(--accent-ink); }
.file-symbol,.file-symbol span { background:var(--accent-soft); color:var(--accent-ink); }
.file-stats strong { color:var(--ink); }
.green-dot { background:#47875b; }
.entrance-label .green-dot { background:var(--accent); }
.count-pill { border-color:var(--line); background:var(--tint); color:var(--muted); }
.search-box { border-color:var(--line); background:#fcfcfb; color:var(--subtle); }
.search-box:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px #b69a4314; }
.search-box input { color:var(--ink); }
.search-box input::placeholder { color:var(--subtle); }
.order-list,.editor-form { scrollbar-color:#d5d2c9 transparent; }
.order-card:hover { background:var(--tint); }
.order-card.selected { background:var(--accent-soft); border-color:var(--accent-line); }
.order-card.selected:before { background:var(--accent); }
.order-top .order-icon { color:var(--accent-ink); }
.order-no { color:var(--subtle); }
.order-title { color:var(--ink); }
.modified-dot { background:var(--accent); }
.size-badge { background:var(--tint); border-color:var(--line); color:var(--muted); }
.selected .size-badge { background:#f0e7cf; border-color:var(--accent-line); color:var(--accent-ink); }
.orders-footer,.editor-tabs,.field-section { border-color:var(--line); }
.preview-panel,.segmented { background:var(--tint); }
.segmented { border-color:var(--line); }
.segmented button { color:var(--muted); }
.segmented button.selected { color:var(--accent-ink); box-shadow:0 1px 3px #382e1612; }
.icon-button { color:var(--subtle); }
.icon-button:hover { background:var(--accent-soft); color:var(--accent-ink); }
.dimension-button { border-color:var(--line); }
.dimension-button.selected { color:var(--accent-ink); background:var(--accent-soft); border-color:var(--accent-line); }
.preview-canvas { background-color:var(--canvas); background-image:radial-gradient(#d9d6cd .55px,transparent .55px); scrollbar-color:#d5d2c9 transparent; }
.tag-preview { filter:drop-shadow(0 10px 13px #382e1618); }
.measurement.vertical,.measurement.horizontal { border-color:#c8c3b5; }
.measurement.vertical:before,.measurement.vertical:after,
.measurement.horizontal:before,.measurement.horizontal:after { background:#c8c3b5; }
.measurement.vertical span,.measurement.horizontal span { background:var(--canvas); }
.live-label { color:var(--success); }
.editor-tabs button { color:var(--muted); }
.editor-tabs button.selected { color:var(--accent-ink); border-bottom-color:var(--accent); }
.field input,.field textarea,.field select { border-color:var(--control-line); color:var(--ink); }
.field input:hover,.field textarea:hover,.field select:hover { border-color:#96958b; }
.field input:focus,.field textarea:focus,.field select:focus { border-color:var(--accent); box-shadow:0 0 0 3px #b69a4318; }
.field-section { color:var(--subtle); }
.validation-status { color:var(--success); background:var(--success-soft); border-color:var(--success-line); }
.validation-status.warning { color:var(--error); background:var(--error-soft); border-color:var(--error-line); }
.footer-dot { color:#b1afa6; }
.mini-tag,.loading,.empty-list { color:var(--muted); }
.mini-tag:hover { background:#eee7d7; }
.error-banner { color:var(--error); background:var(--error-soft); border-color:var(--error-line); }
.dialog { color:var(--ink); border-color:var(--line); box-shadow:0 25px 100px #382e162e; }
.dialog::backdrop { background:#191a1c40; }
.format-option { border-color:var(--line); }
.format-option:has(input:checked) { border-color:var(--accent); background:var(--accent-soft); }
.format-option input { accent-color:var(--accent-ink); }
.format-name { color:var(--ink); }
.export-summary { color:var(--muted); background:var(--tint); }
.dialog-error,.access-error { color:var(--error); }
.help-steps li:before { color:var(--accent-ink); background:var(--accent-soft); border-color:var(--accent-line); }
.help-note { color:var(--muted); background:var(--accent-soft); }
.help-note svg { color:var(--accent-ink); }
.toast { background:var(--ink); border-color:#41413d; box-shadow:0 5px 20px #191a1c20; }
.drop-overlay { background:#faf7eef5; border-color:var(--accent); color:var(--accent-ink); }
.drop-overlay p { color:var(--muted); }
.preview-entrance { background:radial-gradient(ellipse at 65% 15%,#f2e9d4 0,transparent 58%),var(--tint); }
.entrance-card { border-color:#e0d8c9; box-shadow:0 20px 55px #4f3b130c; }
.entrance-card h1 { letter-spacing:-.035em; font-weight:680; }
.entrance-project { border-color:var(--line); }
.entrance-project>svg { color:var(--accent-ink); }
.entrance-project strong,.access-label { color:var(--ink); }
.access-input input { border-color:var(--control-line); background:#fcfcfb; color:var(--ink); }
.access-input input::placeholder { color:var(--subtle); }
.access-input input:focus { border-color:var(--accent); box-shadow:0 0 0 3px #b69a4318; }
.access-input input[aria-invalid=true] { border-color:var(--error); }
.access-input button { color:var(--muted); }
.access-input button:hover { background:var(--accent-soft); color:var(--accent-ink); }
.entrance-privacy svg,.workspace-privacy svg { color:var(--accent-ink); }
@media(max-width:600px) {
  .wordmark { gap:10px; }
  .workspace-brand { width:68px; }
  .product-name { font-size:13px; }
}