/* Standalone Studio presentation. Every rule is scoped to the app, not the live site menu. */
#cfs {
  --bg: #f3f6fa;
  --panel: #fff;
  --panel2: #f6f8fb;
  --line: #dce4ed;
  --text: #17334d;
  --muted: #5e7184;
  --accent: #0868ed;
  --accent2: #0056cb;
  --danger: #b3312a;
  --ok: #16734a;
  --cut: #ed25bd;
  width: 100%;
  min-width: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 13px;
  line-height: 1.45;
  isolation: isolate;
}
#cfs :where(button, input, select, textarea) { font-family: inherit; }
#cfs :where(button, input, select, textarea, a, summary):focus-visible {
  outline: 3px solid #0868ed;
  outline-offset: 3px;
}
#cfs :where(p, label, small, button, summary) { overflow-wrap: break-word; }
#cfs > header {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 16px;
  align-items: center;
  min-width: 0;
  box-shadow: 0 1px 0 rgba(23, 51, 77, .03);
  z-index: 8;
}
#cfs > header .logo {
  flex: 0 0 auto;
  margin-right: 5px;
  font-size: 16px;
  line-height: 1.1;
  letter-spacing: -.35px;
  text-transform: none;
}
#cfs > header input#jobName {
  flex: 0 1 185px;
  width: 185px;
  min-width: 100px;
  max-width: 100%;
  min-height: 35px;
  padding: 7px 10px;
  font-size: 13px;
  background: #fff;
}
#cfs button {
  min-height: 35px;
  max-width: 100%;
  padding: 7px 10px;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.4;
  text-transform: none;
  letter-spacing: 0;
  box-shadow: none;
  touch-action: manipulation;
}
#cfs button:hover:not(:disabled) { background: #eaf0f7; border-color: #a7bacd; }
#cfs button.primary:hover:not(:disabled) { background: var(--accent2); color: #fff; border-color: var(--accent2); filter: none; }
#cfs button:disabled { opacity: .52; cursor: not-allowed; }
#cfs button.small { min-height: 29px; padding: 4px 7px; font-size: 11px; }
#cfs #btnExport, #cfs #btnExportPng { min-height: 37px; }
#cfs #cfsHelpBtn { background: #edf4ff; color: #085fce; border-color: #cddff7; }
#cfs .cfs-help { margin: 0 0 0 3px; font-size: 11px; white-space: normal; }
#cfs .cfs-project-controls { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 5px; min-width: 0; }
#cfs .cfs-project-controls button { min-height: 32px; padding: 5px 8px; font-size: 11px; background: #fff; }
#cfs #cfsProjectStatus { max-width: 145px; font-size: 10.5px; color: var(--muted); line-height: 1.3; }
#cfs #cfsProjectStatus:empty { display: none; }

/* A separate canvas toolbar keeps controls and selected-artwork text off the drawing. */
#cfs > main {
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
  grid-template-rows: 52px minmax(0, 1fr);
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  background: #eaf0f6;
}
#cfs > main > aside {
  grid-column: 1;
  grid-row: 1 / -1;
  width: 330px;
  min-width: 0;
  min-height: 0;
  padding: 15px;
  gap: 18px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #bccbd9 transparent;
}
#cfs > main > aside > * { flex-shrink: 0; min-width: 0; }
#cfs h3 { margin-bottom: 8px; color: #4b637a; font-size: 10.5px; font-weight: 750; letter-spacing: .95px; }
#cfs .grid2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
#cfs .field { min-width: 0; }
#cfs .field label { margin-bottom: 5px; color: #53677b; font-size: 11.5px; line-height: 1.35; }
#cfs .field input, #cfs .field select, #cfs .cfs-shape-controls select, #cfs .cfs-shape-controls input[type="number"] {
  min-width: 0;
  max-width: 100%;
  min-height: 35px;
  border: 1px solid #d1dce7;
  border-radius: 6px;
  padding: 6px 8px;
  background: #fff;
  color: var(--text);
  font-size: 13px;
  line-height: 1.35;
}
#cfs .field input:disabled { color: #617184; background: #edf1f5; opacity: 1; }
#cfs input[type="checkbox"], #cfs input[type="radio"] { accent-color: var(--accent); flex-shrink: 0; width: 15px; height: 15px; }
#cfs input[type="range"] { accent-color: var(--accent); width: 100%; min-width: 0; height: 28px; min-height: 28px; padding: 0; border: 0; background: transparent; cursor: pointer; }
#cfs input[type="color"] { height: 30px; padding: 3px; }
#cfs .drop { padding: 18px 10px; background: #f3f7fe; border: 1.5px dashed #aac4e6; color: #506780; font-size: 12px; line-height: 1.55; }
#cfs .drop b { color: #155eae; font-weight: 700; }
#cfs .drop:hover, #cfs .drop.over { background: #eaf3ff; border-color: var(--accent); }
#cfs .drop:focus-within { outline: 3px solid var(--accent); outline-offset: 3px; }
#cfs .piece-item { align-items: flex-start; gap: 9px; padding: 10px; margin-bottom: 9px; background: #fff; border-color: #d7e1ec; border-radius: 9px; }
#cfs .piece-item.sel { border-color: #5a9bed; box-shadow: 0 0 0 2px #e3efff; background: #fbfdff; }
#cfs .piece-item img { flex: 0 0 44px; }
#cfs .piece-item .meta { min-width: 0; }
#cfs .piece-item .meta .nm { color: #203c56; font-size: 12px; }
#cfs .piece-item .meta .sz { font-size: 11px; line-height: 1.5; }
#cfs .piece-item .meta input { min-width: 0; min-height: 29px; padding: 4px 6px; }
#cfs .rowbtns { gap: 5px; margin-top: 7px; }
#cfs .chk { align-items: flex-start; gap: 7px; font-size: 12px; line-height: 1.4; }
#cfs .chk input { margin-top: 2px; }
#cfs details { padding: 11px; border-color: #dce5ee; background: #f7f9fc; }
#cfs details summary { color: #334f68; font-size: 12px; line-height: 1.45; }
#cfs details[open] summary { margin-bottom: 10px; }
#cfs .help { color: var(--muted); font-size: 11.5px; line-height: 1.6; }
#cfs .help b { color: #314d68; }

#cfs .cfs-shape-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 8px; min-width: 0; margin-top: 11px; padding-top: 10px; border-top: 1px solid #e0e8f2; }
#cfs .cfs-shape-controls label { display: flex; flex-direction: column; gap: 5px; min-width: 0; color: #4b637a; font-size: 11px; line-height: 1.4; }
#cfs .cfs-shape-controls label.chk { flex-direction: row; }
#cfs .cfs-shape-controls label:has(input[type="range"]) { grid-column: 1 / -1; }
#cfs .cfs-shape-controls select, #cfs .cfs-shape-controls input[type="number"] { width: 100%; font-size: 12px; }
#cfs .cfs-shape-controls small, #cfs .cfs-shape-controls > p { grid-column: 1 / -1; color: var(--muted); font-size: 10.5px; line-height: 1.5; }
#cfs .cfs-notes { margin: 12px 0 0; }
#cfs .cfs-notes textarea { display: block; width: 100%; min-width: 0; max-width: 100%; min-height: 66px; padding: 8px 9px; border: 1px solid #d1dce7; border-radius: 7px; background: #fff; color: var(--text); font-size: 12px; line-height: 1.45; resize: vertical; }
#cfs .cfs-notes small { display: block; margin-top: 5px; font-size: 10.5px; line-height: 1.5; color: var(--muted); }
#cfs .cfs-resolution { margin-top: 8px; padding: 6px 8px; border-radius: 5px; background: #eef4fb; color: #385d7e; font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }

#cfs #stage { grid-column: 2; grid-row: 2; min-width: 0; min-height: 0; position: relative; overflow: auto; overscroll-behavior: contain; background: radial-gradient(ellipse at 50% 25%, #f4f7fb, #e2e9f1 80%); }
#cfs #stageInner { margin: 26px auto; }
#cfs canvas#board { max-width: none; border-color: #ced9e5; border-radius: 2px; box-shadow: 0 9px 28px rgba(22, 47, 73, .16); }
#cfs #zoombar { position: static; grid-column: 2; grid-row: 1; justify-self: end; align-self: center; display: flex; align-items: center; gap: 5px; margin: 0 12px; min-width: 0; z-index: 5; }
#cfs #zoombar button { min-width: 30px; min-height: 32px; background: #fff; }
#cfs #finishedView { min-width: 0; font-size: 11px; }
#cfs #finishedView[aria-pressed="true"] { color: #075dc4; background: #dfedff; border-color: #72a9ed; }
#cfs #hud { position: static; grid-column: 2; grid-row: 1; align-self: center; justify-self: start; margin: 0 12px; max-width: calc(100% - 300px); min-width: 0; padding: 5px 8px; font-size: 11px; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #526a80; background: rgba(255, 255, 255, .8); border-color: #d8e2ed; pointer-events: none; }
#cfs > footer { flex-wrap: wrap; gap: 4px 16px; min-width: 0; min-height: 36px; max-height: 110px; overflow: auto; padding: 7px 14px; font-size: 11px; line-height: 1.45; }
#cfs .legend { flex-wrap: wrap; gap: 4px 12px; font-size: 10.5px; }
#cfs .legend > span { white-space: nowrap; }
#cfs #warnings { min-width: 0; overflow-wrap: anywhere; }
#cfs #warnings:empty { display: none; }
#cfs #status { margin-left: auto; overflow-wrap: anywhere; }
#cfs.cfs-exporting, #cfs.cfs-exporting button, #cfs.cfs-exporting input { cursor: progress; }
#cfs.cfs-exporting > main { opacity: .65; pointer-events: none; }
#cfs.cfs-exporting #status { color: #085fcf; font-weight: 650; }

#cfs #cfsHelp { padding: 16px; }
#cfs #cfsHelp .cfs-modal { width: 100%; max-width: 440px; max-height: calc(100dvh - 32px); padding: 22px; border: 1px solid #d9e4ef; }
#cfs #cfsHelp h4 { padding-right: 30px; font-size: 18px; line-height: 1.3; }
#cfs #cfsHelp p { font-size: 12px; line-height: 1.6; }
#cfs #cfsHelp .field input, #cfs #cfsHelp textarea { min-width: 0; max-width: 100%; }

@media (max-width: 1100px) {
  #cfs .cfs-help { display: none; }
  #cfs > header { padding: 10px 12px; gap: 7px; }
  #cfs > header .spacer { flex: 1 1 10px; }
}

@media (max-width: 800px) {
  #cfs > header { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; padding: 9px 10px; max-height: 32dvh; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
  #cfs > header .logo { grid-column: span 3; margin: 0; font-size: 16px; }
  #cfs > header input#jobName { grid-column: span 3; width: 100%; min-width: 0; min-height: 35px; font-size: 16px; padding: 6px 8px; }
  #cfs > header .spacer, #cfs .cfs-help { display: none; }
  #cfs .cfs-project-controls { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 5px 6px; }
  #cfs .cfs-project-controls button { min-height: 32px; font-size: 11px; }
  #cfs #cfsProjectStatus { grid-column: 1 / -1; max-width: none; text-align: right; font-size: 10px; }
  #cfs #cfsHelpBtn, #cfs #btnArrange, #cfs #btnClear { grid-column: span 2; width: 100%; min-height: 36px; padding: 6px 4px; font-size: 11px; }
  #cfs #btnExport, #cfs #btnExportPng { grid-column: span 3; width: 100%; min-height: 41px; padding: 6px 7px; font-size: 11.5px; }
  #cfs #warnChip { grid-column: 1 / -1; width: 100%; min-height: 32px; font-size: 11px; }
  #cfs > main { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 40fr) 44px minmax(0, 45fr); }
  #cfs > main > aside { grid-column: 1; grid-row: 1; width: 100%; min-width: 0; min-height: 0; max-height: 40dvh; padding: 12px; gap: 15px; border-right: 0; border-bottom: 1px solid #d7e2ee; }
  #cfs > main > aside > * { flex-shrink: 0; }
  #cfs .field input, #cfs .field select, #cfs .cfs-shape-controls input[type="number"], #cfs .cfs-shape-controls select, #cfs .cfs-notes textarea, #cfs .piece-item .meta input { font-size: 16px; }
  #cfs .field input, #cfs .field select { min-height: 38px; }
  #cfs .field input[type="range"] { min-height: 30px; }
  #cfs .rowbtns button { min-height: 34px; padding: 5px 8px; }
  #cfs .piece-item .meta .nm { font-size: 13px; }
  #cfs .piece-item .meta input { width: 65px; }
  #cfs .drop { padding: 15px 10px; }
  #cfs #zoombar { grid-column: 1; grid-row: 2; justify-self: end; margin: 0 10px; gap: 5px; }
  #cfs #zoombar button { min-height: 34px; min-width: 32px; }
  #cfs #finishedView { min-width: 0; padding-inline: 9px; font-size: 11px; }
  #cfs #stage { grid-column: 1; grid-row: 3; width: 100%; height: 45dvh; max-height: 100%; min-height: 0; }
  #cfs #stageInner { margin: 24px auto; }
  #cfs #hud { position: absolute; top: auto; right: 10px; bottom: 7px; left: 10px; grid-column: auto; grid-row: auto; max-width: calc(100% - 20px); margin: 0; padding: 4px 7px; font-size: 10px; border-radius: 5px; }
  #cfs > footer { padding: 5px 10px; min-height: 32px; max-height: 15dvh; gap: 3px 8px; font-size: 10px; }
  #cfs .legend { gap: 3px 8px; font-size: 9.5px; }
  #cfs .legend i { width: 10px; margin-right: 3px; }
  #cfs #warnings { flex-basis: 100%; order: 2; font-size: 11px; }
  #cfs #cfsHelp { padding: 10px; }
  #cfs #cfsHelp .cfs-modal { max-height: calc(100dvh - 20px); padding: 20px 16px; }
  #cfs #cfsHelp input, #cfs #cfsHelp textarea { font-size: 16px; }
}

@media (max-width: 800px) and (max-height: 600px) {
  #cfs > header { max-height: 29dvh; }
  #cfs > main { grid-template-rows: minmax(0, 35fr) 38px minmax(0, 50fr); }
  #cfs #zoombar button { min-height: 29px; }
  #cfs > footer { max-height: 12dvh; }
}

@media (prefers-reduced-motion: reduce) {
  #cfs *, #cfs *::before, #cfs *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* Product-first workflow and accessible review feedback. */
#cfs [hidden] { display: none !important; }
#cfs .cfs-order-policy { padding: 12px 14px; border-left: 3px solid #1976ff; background: #edf5ff; border-radius: 6px; }
#cfs .cfs-order-problems { color: #a52727; background: #fff1f0; padding: 14px 16px 14px 32px; border-radius: 8px; }
#cfs .cfs-order-problems li, #cfs #cfsOrderWarnings li { margin-bottom: 8px; }
#cfs #cfsOrderStatus { white-space: pre-line; font-weight: 600; }
#cfs .cfs-order-import-notice { flex: 0 0 auto; padding: 10px 16px; color: #173957; background: #eaf3ff; border-bottom: 1px solid #bfd5ef; font-size: 13px; }
#cfs .cfs-order-import-notice a { color: #075abc; font-weight: 700; }
#cfs .cfs-workflow-switch { display: inline-flex; gap: 3px; background: #edf3fa; padding: 3px; border-radius: 9px; }
#cfs .cfs-workflow-switch button { font-size: 11px; min-height: 30px; border-color: transparent; }
#cfs .cfs-product-step { padding: 13px; background: #eef5ff; border: 1px solid #cddff8; border-radius: 10px; }
#cfs .cfs-product-step > label { display: block; font-size: 13px; font-weight: 750; margin-bottom: 8px; }
#cfs .cfs-product-step select { width: 100%; max-width: 100%; min-height: 42px; border: 1px solid #b6cde8; border-radius: 7px; padding: 8px; background: #fff; color: var(--text); font-size: 13px; }
#cfs .cfs-product-step .help { margin: 8px 0; }
#cfs .cfs-product-step > small { display: block; margin-top: 7px; color: #536e87; font-size: 11px; }
#cfs .cfs-layout-summary { font-size: 11px; font-weight: 700; color: #0759ba; }
#cfs .cfs-canvas-hint, #cfs .cfs-step-note { margin: 8px 0; }
#cfs[data-workflow="customer"] .cfs-production-control { display: none !important; }
#cfs[data-workflow="customer"] #btnArrange { display: none !important; }
#cfs .cfs-art-options { margin-top: 9px; padding: 8px; }
#cfs .cfs-art-options > .sz { margin-top: 10px !important; }
#cfs .cfs-art-options > button { margin-top: 9px; }
#cfs .cfs-issue-panel { background: #f1f8f4; border-color: #bfd8c9; }
#cfs .cfs-issue-panel.has-errors { background: #fff6f4; border-color: #edc7c1; }
#cfs #cfsIssueList { display: flex; flex-direction: column; gap: 8px; }
#cfs #cfsIssueList p { font-size: 12px; line-height: 1.6; margin-bottom: 8px; }
#cfs .cfs-issue-item { text-align: left; white-space: normal; font-weight: 500; min-height: 44px; background: #fff; padding: 10px; }
#cfs .cfs-issue-item.error { border-left: 4px solid #c93338; }
#cfs .cfs-issue-item.warning { border-left: 4px solid #bd7b07; }
#cfs .cfs-issue-panel > button { margin-top: 9px; }
#cfs #warnChip[data-severity="warning"] { background: #fff2d4; color: #76501a; border-color: #dfc185; }
#cfs .cfs-issue-piece { border-color: #d32932 !important; box-shadow: 0 0 0 2px #ffe4e5; }
#cfs .cfs-issue-detail { position: sticky; left: 12px; bottom: 12px; width: min(500px,calc(100% - 24px)); margin: 8px 12px; border: 1px solid #e9c0be; border-radius: 8px; background: #fff7f5; box-shadow: 0 3px 15px #17334d15; padding: 10px 13px; color: #8d2427; font-size: 12px; }
#cfs .cfs-history-controls { display: inline-flex; gap: 4px; align-items: center; flex-wrap: wrap; }
#cfs .cfs-history-controls button { font-size: 11px; min-height: 32px; }
#cfs #cfsRecoveryStatus { font-size: 10px; color: #5b7085; max-width: 200px; }
#cfs #cfsRecoveryBanner { flex-basis: 100%; padding: 10px; border: 1px solid #e5cc92; background: #fff6df; border-radius: 8px; font-size: 12px; }
#cfs #cfsRecoveryBanner button { margin: 5px; }
#cfs .cfs-mounting { margin-top: 12px; border-top: 1px solid #dce5ee; padding-top: 10px; }
#cfs .cfs-mounting input { max-width: 100%; min-width: 0; }
#cfs .cfs-mounting :where(label,small,p) { font-size: 11px; line-height: 1.5; }
#cfs .cfs-mounting fieldset { padding: 8px; border: 1px solid #d7e3ef; border-radius: 7px; }
#cfs .cfs-review-dialog { position: fixed; inset: 0; z-index: 99999; padding: 20px; background: #0e233a88; display: flex; align-items: center; justify-content: center; }
#cfs .cfs-review-dialog > :first-child { width: min(560px,100%); max-height: calc(100dvh - 40px); overflow-y: auto; background: #fff; border-radius: 13px; padding: 24px; }
#cfs .cfs-review-dialog :where(h2,h3) { font-size: 18px; line-height: 1.3; margin-bottom: 10px; text-transform: none; letter-spacing: 0; }
#cfs .cfs-review-dialog p { margin: 8px 0; font-size: 12px; line-height: 1.6; }
#cfs .cfs-review-dialog label { display: block; margin-top: 12px; font-size: 12px; font-weight: 650; }
#cfs .cfs-review-dialog input:not([type=checkbox]),#cfs .cfs-review-dialog textarea,#cfs .cfs-review-dialog select { width: 100%; min-height: 40px; padding: 8px; border: 1px solid #c7d7e7; border-radius: 6px; font-size: 14px; }
#cfs .cfs-review-dialog input[type=checkbox] { margin-right: 7px; }
#cfs .cfs-review-dialog button { margin: 10px 5px 0 0; }
#cfs dialog.cfs-review-dialog:not([open]) { display: none; }
#cfs dialog.cfs-review-dialog[open] { display: block; inset: 0; width: min(680px,calc(100% - 32px)); height: fit-content; max-height: calc(100dvh - 32px); margin: auto; padding: 24px; overflow-y: auto; border: 1px solid #cbdbea; border-radius: 13px; background: #fff; color: var(--text); box-shadow: 0 20px 70px #0e233a44; }
#cfs dialog.cfs-review-dialog::backdrop { background: #0e233a88; }
#cfs dialog.cfs-review-dialog > :first-child { width: 100%; max-height: none; overflow: visible; padding: 0; }
#cfs .cfs-review-honeypot { display: none !important; }
#cfs #cfsReviewStatus { overflow-wrap: anywhere; white-space: pre-wrap; font-size: 11px; padding: 10px; background: #eef5fc; border-radius: 7px; }
#cfs .cfs-mounting-controls { margin-top: 12px; }
#cfs .cfs-mounting-measurements,#cfs .cfs-mounting-position { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-top: 8px; }
#cfs .cfs-mounting-controls label { display: flex; flex-direction: column; gap: 5px; font-size: 11px; }
#cfs .cfs-mounting-controls input { width: 100%; min-width: 0; }
#cfs .cfs-mounting-controls small,#cfs .cfs-mounting-controls p { display: block; font-size: 11px; line-height: 1.55; margin: 7px 0; }
#cfs .cfs-mounting-actions { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 8px; }
@media(max-width:800px) {
  #cfs .cfs-workflow-switch { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; }
  #cfs .cfs-history-controls { grid-column: 1 / -1; }
  #cfs .cfs-history-controls button { min-height: 35px; }
  #cfs #cfsRecoveryBanner { grid-column: 1 / -1; }
  #cfs #cfs-send-order { grid-column: 1 / -1; min-height: 42px; }
  #cfs .cfs-product-step select { font-size: 16px; }
  #cfs .cfs-review-dialog { padding: 10px; }
  #cfs .cfs-review-dialog > :first-child { max-height: calc(100dvh - 20px); padding: 20px 16px; }
  #cfs .cfs-review-dialog input:not([type=checkbox]),#cfs .cfs-review-dialog textarea,#cfs .cfs-review-dialog select { font-size: 16px; }
}

/* Keep the phone preview visible; secondary file actions live in a compact drawer. */
@media(max-width:800px) {
  #cfs > header { position: relative; overflow: visible; max-height: none; z-index: 20; }
  #cfs > header .logo { order: 0; grid-column: span 3; }
  #cfs .cfs-project-drawer { order: 1; grid-column: span 3; padding: 8px; background: #fff; }
  #cfs .cfs-project-drawer > summary { min-height: 20px; color: #17334d; font-size: 12px; text-align: center; }
  #cfs .cfs-workflow-switch { order: 2; }
  #cfs .cfs-history-controls { order: 3; grid-column: span 3; }
  #cfs #cfsRecoveryStatus { display: none; }
  #cfs .cfs-history-controls:has(#cfsRecoveryBanner:not([hidden])) { grid-column: 1 / -1; }
  #cfs #cfsRecoveryBanner { max-height: 20dvh; overflow-y: auto; }
  #cfs #cfs-send-order { order: 4; grid-column: span 3; min-height: 36px; }
  #cfs #warnChip { order: 5; }
  #cfs .cfs-project-drawer-body { position: absolute; left: 10px; right: 10px; top: 48px; max-height: 65dvh; overflow-y: auto; z-index: 40; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 14px; border: 1px solid #cad9e8; border-radius: 10px; background: #fff; box-shadow: 0 12px 35px #17334d33; }
  #cfs .cfs-project-drawer-body > input#jobName { grid-column: 1 / -1; width: 100%; max-width: none; }
  #cfs .cfs-project-drawer-body > #cfsHelpBtn, #cfs .cfs-project-drawer-body > #btnClear { grid-column: auto; }
  #cfs .cfs-project-drawer-body > #btnExport, #cfs .cfs-project-drawer-body > #btnExportPng { grid-column: 1 / -1; }
}