/* Design system (DESIGN_SYSTEM): navy actions, three surfaces, 8 / 4 / 12 corners, a 1px foot. Loaded only while the switch is on,
   in <head> right after shell.css (lib/shell.mjs dsHead; lib/login.mjs after login.css; app/(tint)/layout.tsx), so the first frame is already new. Every rule starts
   with body[data-ds="1"], so with the switch off nothing here can apply. Placement, sizes, spacing and type do not change here.
   Colours: the token values below (the only #hex in this file); every rule after them uses tokens. The page CSS it sits on has many
   selectors of 3 to 6 classes, so the look rules carry !important instead of copying each selector: this file is an override layer. */

/* ---- 1. token values ------------------------------------------------------------------------------------------------------- */
body[data-ds="1"] {
  --x-bg: #F7F6F3; --x-surface: #FFFFFF; --x-track: #EFEEEA; --x-line: #E6E3DC; --x-line-strong: #D0CCC2;
  --x-ink: #111111; --x-muted: #676767; --x-cancel: #676767; --x-toast-cancel: #676767;
  --x-accent: #0F1E3D; --x-accent-press: #050C1C; --x-accent-bg: #E8ECF4; --x-accent-line: #5671A6;
  --x-done: #1D7A4A; --x-done-bg: #D7F7E2; --x-done-deep: #145C37; --x-code-ok: #145C37;
  --x-mix: #8A6200; --x-warn: #8A6200; --x-mix-deep: #8A6200; --x-code-warn-ink: #8A6200; --x-grade-panel-ink: #8A6200;
  --x-mix-bg: #FFF1C2; --x-warn-bg: #FFF1C2;
  --x-check: #E0B13A; --x-code-warn: #E0B13A; --c7-wait: #E0B13A; --x-c7-wait: #E0B13A;
  --x-warn-row: #FFFBEA;
  --x-late: #C0123C; --x-late-bg: #FFE7F2; --x-late-deep: #9A0E30;
  --x-todo: #533AFD; --x-todo-bg: #E8E5FF; --x-todo-deep: #3A28C9;
  --x-grade-blend-bg: #E6E7FF; --x-grade-blend-ink: #000CE1;
  --x-area-bg: #EFEEEA; --x-area-ink: #111111;
  --x-av-bg: #E8ECF4; --x-av-ink: #0F1E3D;
  --x-finish-bg: #EFEEEA; --x-finish-ink: #3A3A3E;
  --x-shadow-ink: 17,17,17;
  /* step 1 tokens: each takes one of the values above, by what it means */
  --x-ink-deep: #050C1C; --x-mix-press: #050C1C; --x-late-press: #9A0E30;
  --x-wash: #EFEEEA; --x-seg-bg: #EFEEEA; --x-pick-bg: #E8ECF4; --x-off-bg: #EFEEEA; --x-row-hover: #EFEEEA; --x-opt-hover: #EFEEEA; --x-nav-hover: #EFEEEA;
  --x-disabled: #D0CCC2; --x-paper: #FFFFFF; --x-memo-bg: #EFEEEA;
  --x-route-bg: #FFFFFF; --x-route-line: #E6E3DC; --x-route-out-bg: #EFEEEA; --x-route-dash: #D0CCC2;
  --x-th-ink: #676767; --x-box-line: #D0CCC2; --x-on-dark-soft: #EFEEEA;
  --x-toast-sub: #D0CCC2; --x-toast-link: #E8ECF4; --x-toast-x: #D0CCC2; --x-toast-action: #E8ECF4;
  --x-amber: #0F1E3D; --x-amber-deep: #050C1C; --x-hot-line: #5671A6; --x-hot-bg: #E8ECF4;
  --x-todo-tint: #E8E5FF; --x-todo-wash: #FFFFFF; --x-todo-line: #E6E3DC; --x-todo-line-soft: #E6E3DC; --x-todo-mid: #533AFD; --x-todo-press: #3A28C9; --x-todo-tag-line: #533AFD;
  --x-link-bg: #E8ECF4; --x-link-ink: #0F1E3D; --x-link-box-ink: #0F1E3D;
  --x-yel-bg: #FFF1C2; --x-yel-ink: #8A6200;
  --x-flag-line: #5671A6; --x-flag-row: #FFFBEA; --x-flag-ink: #8A6200; --x-note-bg: #FFFFFF; --x-note-ink: #111111;
  --x-late-foot: #E6E3DC; --x-late-ink: #9A0E30; --x-danger: #C0123C; --x-danger-deep: #9A0E30; --x-danger-press: #9A0E30;
  /* tokens that :root builds from other tokens: built again here so they take the values above (a var() resolves where it is set) */
  --x-scrim: rgba(var(--x-shadow-ink),0.40); --x-shadow: 0 12px 32px rgba(var(--x-shadow-ink),0.14);
  --x-side-av-bg: var(--x-av-bg); --x-side-av-ink: var(--x-av-ink);
  /* 조색 zone aliases (app/(tint)/tint.css :root); --action (the [data-primary] fill) becomes the navy */
  --canvas: var(--x-bg); --surface: var(--x-surface); --ink: var(--x-ink); --secondary: var(--x-muted);
  --border: var(--x-line-strong); --action: var(--x-accent); --on-action: var(--x-on-ink);
  --confidence: var(--x-mix-bg); --on-confidence: var(--x-mix-deep); --error: var(--x-late-deep);
  --progress: var(--x-mix-deep); --progress-ink: var(--x-on-ink); --complete: var(--x-done-deep); --brand-x: var(--x-accent); --control-border: var(--x-line-strong);
  --accent: var(--x-accent); --accent-bg: var(--x-accent-bg);
  --control-radius: 8px; --card-shadow: 0 1px 0 var(--x-line);
  --success-bg: var(--x-done-bg); --success-ink: var(--x-done-deep); --warning-bg: var(--x-mix-bg); --warning-ink: var(--x-mix-deep); --error-bg: var(--x-late-bg); --increase: var(--x-done-deep); --decrease: var(--x-late-deep);
}
/* the outer page under the body (overscroll) */
body[data-ds="1"].shell { background: var(--x-bg); }

/* ---- 3. buttons ------------------------------------------------------------------------------------------------------------- */
/* actions: navy fill, white words, a 1px foot (pressed: no foot, 1px down) */
body[data-ds="1"] :is(.b-main, .b-go, .b-go.ok, .b-now, .b-now.go, .b-now.todo, .b-now.ink, .b-now.done, .b-ink, .rth .b-dep, .voc-fix, .rm-open, .tx .tx-btn, .tx .tx-btn.tx-ok, button[data-primary], a[data-primary], .b-main[class*="nx-"]):not(.danger):not(:disabled) {
  background: var(--x-accent) !important; color: var(--x-on-ink) !important; -webkit-text-fill-color: var(--x-on-ink); border-color: var(--x-accent) !important; box-shadow: 0 1px 0 var(--x-accent-press) !important;
}
body[data-ds="1"] :is(.b-main, .b-go, .b-now, .b-ink, .rth .b-dep, .voc-fix, .rm-open, .tx .tx-btn, button[data-primary], a[data-primary]):not(.danger):not(:disabled):active {
  transform: translateY(1px) !important; box-shadow: none !important;
}
body[data-ds="1"] :is(.b-main, .b-go, .b-now, .b-ink, .voc-fix, .tx .tx-btn, button[data-primary]):disabled { box-shadow: none !important; transform: none !important; }
body[data-ds="1"] :is(.b-now, .rth .b-dep):disabled { background: var(--x-disabled) !important; }
/* the tint zone's own primary on chat / toolbar icons stays an icon button (no foot) */
body[data-ds="1"] .chat-composer .chat-icon[data-primary] { box-shadow: none !important; }
body[data-ds="1"] .chat-composer .chat-icon[data-primary]:disabled { background: var(--x-line-strong) !important; color: var(--x-muted) !important; }
/* secondary: white, line-strong, ink words */
body[data-ds="1"] :is(.b-sec, .b-cancel, .b-sub, .b-more, .b-foot, .small-btn, .voc-print-btn, .again, .tx .tx-btn2, .b-wait.c-plain, .adm.prices .toggle) {
  background: var(--x-surface) !important; border-color: var(--x-line-strong) !important; color: var(--x-ink) !important; box-shadow: none !important;
}
body[data-ds="1"] .b-sub:hover:not(:disabled) { background: var(--x-track) !important; }
/* danger (취소, 삭제): white, line-strong, red words; never a red fill */
body[data-ds="1"] :is(.b-danger, .b-sub.danger, .b-foot.danger, .small-btn.warn, .adm .b-main.danger, .adm.prices .b-del) {
  background: var(--x-surface) !important; border: 1.5px solid var(--x-line-strong) !important; color: var(--x-late) !important; -webkit-text-fill-color: var(--x-late); box-shadow: none !important;
}
body[data-ds="1"] :is(.b-danger, .adm .b-main.danger, .adm.prices .b-del):active { transform: translateY(1px) !important; }
/* card secondaries: 인보이스 = navy line + navy words, 할 일 = its purple line + words */
body[data-ds="1"] .b-wait { background: var(--x-surface) !important; border: 1.5px solid var(--x-line-strong) !important; color: var(--x-ink) !important; box-shadow: none !important; }
body[data-ds="1"] .b-wait.c-inv { border: 1px solid var(--x-accent) !important; color: var(--x-accent) !important; }
body[data-ds="1"] .b-wait.c-todo { border: 1.5px solid var(--x-todo) !important; color: var(--x-todo) !important; }
/* the 2nd-step look of a b-sub that meant "go" */
body[data-ds="1"] .adm .b-sub.go { color: var(--x-accent) !important; }

/* ---- 4. corners --------------------------------------------------------------------------------------------------------------- */
/* 8: everything you press or type into */
body[data-ds="1"] :is(.b-main, .b-go, .b-wait, .b-now, .b-sec, .b-cancel, .b-danger, .b-more, .b-sub, .b-ink, .b-del, .b-foot, .small-btn, .voc-print-btn, .voc-fix, .rth .b-dep,
  .input, select, textarea, input[type=text], input[type=search], input[type=number], input[type=tel], input[type=email], input[type=date], .search .input, .vol, .qty button, .freq, .x-btn, .again,
  .menu button, .asg-pop-row, .rt-opt, .rt-same-row, .h-sugg .hs-o,
  .chip, .h-chip, .board-b .tabs-b button:not([data-act="col"]), .tabs-b .mine-chip, .ofd-scope button, .ofd-opt button, .h-dates .chip, .h-cal .cal-g button,
  .adm.prices .toggle, .rm-open, .rm-ctl,
  .tx .tx-btn, .tx .tx-btn2, .tx .tx-check, .tx .tx-keypad button, .tx .tx-input, .tx .tx-amount-input, .tx .tx-select select, .tx-list > li > .tx-btn, .tx-list > li > .tx-btn2,
  button[data-primary], a[data-primary], .keypad button, .number-panel .keypad button, .number-panel input, .tint-zone button:not(.agent-fab):not(.route-back):not(.chat-icon), .question-chips button, .boost-chip, .home-recommend .recommend-actions > button, .toolbar button:not(.agent-fab),
  .c-photos > *, .photos > *, .ph-add, .c-ph, .thumb, .adm .app-band, .adm .sg-opt, .adm .sg-sum) { border-radius: 8px !important; }
/* sidebar rows (open 40px, collapsed 44px, [메뉴 접기], the icon buttons) and the tooltip */
body[data-ds="1"] .pc-side.side-v2 :is(.side-item, .side-brand), body[data-ds="1"] .side-tip { border-radius: 8px !important; }
body[data-ds="1"] .pc-side:not(.side-v2) nav a, body[data-ds="1"] .pc-side .shell-link.is-placeholder { border-radius: 8px !important; }
/* 4: state chips */
body[data-ds="1"] :is(.chip-sq, .chip-w, .todo-badge, .area, .tk-test, .c-res, .mini, .pill, .tag, .tabs3 .lt, .tabs-b .lt, .c-yel .fm, .fm, .left-tag, .qb-direct,
  .mine-seg, .mine-seg button, .seg.mine-seg, .tx .tx-steps li > span, .tx .tx-steps li > .tx-step-open > span, .practice-label, .confidence-chip, .tint-chip-sq, .adm.prices .groups .tag) { border-radius: 4px !important; }
/* 12: sheets (top corners), popups, menus, toasts, the calendar */
body[data-ds="1"] :is(.sheet, .shell-more .sheet, .agent-sheet) { border-radius: 12px 12px 0 0 !important; }
body[data-ds="1"] :is(.adm .sg-row, .app-print-wrap .print-sheet, .adm .qr-box, .modal, .modal.inv-confirm, .modal.voc-sheet, .adm .modal, .menu, .asg-pop, .rt-pop2, .rt-pop, .toast, .toast-host .toast, .adm .toast, .undo-toast, .h-cal, .cal-pop, .rt-same-list) { border-radius: 12px !important; }
@media (max-width:1023.98px) { body[data-ds="1"] .adm .modal { border-radius: 12px 12px 0 0 !important; } }
/* kept: avatars, the phone tab bar pill, the 조색 talk button (round) */
body[data-ds="1"] :is(.av, .side-avatar, .shell-tabbar, .agent-fab, .route-back, .chat-icon, .ph-view .ph-x, .tabs-b .ico) { border-radius: 999px !important; }

/* ---- 5. states and surfaces ----------------------------------------------------------------------------------------------------- */
/* chosen (was an ink fill): light navy, a 1.5px navy line, navy words 600 */
body[data-ds="1"] :is(.chip.mini-chip.on, .chip.on, .board-b .tabs-b button.on:not([data-act="col"]), .tabs-b .mine-chip.on, .tabs-b .ico.on, .ofd-scope button.on, .ofd-opt button.on, .ofd-seg button.on, .vol.on, .b-more.on, .adm.prices .toggle[aria-pressed="true"],
  .tx .tx-btn2[aria-pressed='true'], .tx .tx-check[aria-checked='true'], .boost-chip[aria-pressed=true], .h-cal .cal-g button.on, .h-cal .cal-g button.sel) {
  background: var(--x-accent-bg) !important; border: 1.5px solid var(--x-accent) !important; border-style: solid !important; color: var(--x-accent) !important; -webkit-text-fill-color: var(--x-accent); font-weight: 600 !important; box-shadow: none !important; outline: none !important;
}
/* 주문 입력 Rush (Eric 11/13): off stays a plain chip; on is the one red chip — red fill, white words — not the navy chosen look above */
body[data-ds="1"] .order .chip.rush.on[aria-pressed="true"] { /* beats the chosen :is() above (its specificity is its highest member) */ background: var(--x-late) !important; border-color: var(--x-late) !important; color: var(--x-on-ink) !important; -webkit-text-fill-color: var(--x-on-ink); }
/* the payment sheet's [받음 | 아직 안 받음] (.ofd-seg): the chips' outline (line-strong 1.5px, corner 8) and a line-strong divider; the chosen
   half (light navy, above) lies on the outline with its own 1.5px navy line, its outer corners the outline's */
body[data-ds="1"] .ofd-seg { border: 1.5px solid var(--x-line-strong) !important; border-radius: 8px !important; overflow: visible !important; }
body[data-ds="1"] .ofd-seg button { border-radius: 0 !important; }
body[data-ds="1"] .ofd-seg button:first-child { border-radius: 6.5px 0 0 6.5px !important; }
body[data-ds="1"] .ofd-seg button:last-child { border-radius: 0 6.5px 6.5px 0 !important; }
body[data-ds="1"] .ofd-seg button + button { border-left: 1.5px solid var(--x-line-strong) !important; }
body[data-ds="1"] .ofd-seg button.on { position: relative; z-index: 1; margin: -1.5px; }
body[data-ds="1"] .ofd-seg button.on:first-child { border-radius: 8px 0 0 8px !important; }
body[data-ds="1"] .ofd-seg button.on:last-child { border-radius: 0 8px 8px 0 !important; }
body[data-ds="1"] .tx .tx-check[aria-checked='true'] .tx-box { background: var(--x-accent) !important; border-color: var(--x-accent) !important; }
/* segmented toggles: the chosen one is white on the track */
body[data-ds="1"] .seg { background: var(--x-track) !important; }
body[data-ds="1"] .seg button.on, body[data-ds="1"] .adm .seg button.on { background: var(--x-surface) !important; color: var(--x-ink) !important; box-shadow: 0 1px 0 var(--x-line-strong) !important; }
/* the board's column tabs (phone): the current one is underlined in navy */
body[data-ds="1"] .board-c .tabs-b button[data-act="col"].on { border-bottom-color: var(--x-accent) !important; color: var(--x-accent) !important; }
body[data-ds="1"] .tabs3 button.on { border-bottom-color: var(--x-accent) !important; }
/* 전체 / 내 일 toggle: 4px outside and in */
body[data-ds="1"] .mine-seg { padding: 4px; }
/* 작업판 search / suggestion: the h-chip (a chosen filter) */
body[data-ds="1"] .board-c .h-chip { background: var(--x-accent-bg) !important; color: var(--x-accent) !important; box-shadow: inset 0 0 0 1.5px var(--x-accent); }
body[data-ds="1"] .board-c .h-chip button { background: transparent !important; color: var(--x-accent) !important; }

/* Request (PC column and phone): light navy, accent-line frame; the PC head line navy */
body[data-ds="1"] .board-b .bcol.col-wait.hot .col-body, body[data-ds="1"] .board-b .col-phone.hot .col-phone-body { background: var(--x-accent-bg) !important; border-color: var(--x-accent-line) !important; outline-color: var(--x-accent-line) !important; }
body[data-ds="1"] .board-c .pc-cols.b7.c6 .bcol.col-wait.hot .col-body { border-top-color: var(--x-accent-line) !important; }
body[data-ds="1"] .board-c .bcol.col-wait { --c7-line: var(--x-accent); }
body[data-ds="1"] .board-b .tabs-b button.hot { border-color: var(--x-accent-line) !important; }

/* late card: no fill; white card, line, a 3px red band inside on the left; only the word 늦음 red */
body[data-ds="1"] .tk.late { background: var(--x-surface) !important; border-color: var(--x-line) !important; box-shadow: inset 3px 0 0 var(--x-late), 0 1px 0 var(--x-line) !important; }
body[data-ds="1"] .tk.late .tk-hd { background: transparent !important; border-bottom-color: var(--x-line) !important; }
body[data-ds="1"] .tk.late :is(.late-word, .tk-late, .lt-word, .chip-sq.r) { color: var(--x-late) !important; font-weight: 600; }
/* cards: the 1px foot */
body[data-ds="1"] .tk { box-shadow: 0 1px 0 var(--x-line); }
body[data-ds="1"] .tk.follow { box-shadow: 0 1px 0 var(--x-line) !important; }
body[data-ds="1"] .adm .card, body[data-ds="1"] .tx .tx-card { box-shadow: 0 1px 0 var(--x-line) !important; }

/* 가격표: stats white with a line; the flagged one light navy; flagged rows pale yellow with a 3px band */
body[data-ds="1"] .adm.prices .stat { background: var(--x-surface) !important; box-shadow: inset 0 0 0 1px var(--x-line) !important; }
body[data-ds="1"] .adm.prices .stat.flag { background: var(--x-accent-bg) !important; box-shadow: inset 0 0 0 1px var(--x-accent-line) !important; }
body[data-ds="1"] .adm.prices .stat.flag .w { color: var(--x-accent) !important; }
body[data-ds="1"] .adm.prices tr.flagged td { background: var(--x-warn-row) !important; }
body[data-ds="1"] .adm.prices tr.flagged td:first-child { box-shadow: inset 3px 0 0 var(--x-check); }
body[data-ds="1"] .adm.prices td.flags { color: var(--x-warn) !important; }

/* notices: white, a line, a 4px band inside on the left (주의 yellow, 위험 red, 정보 navy); the icon in the band's colour */
body[data-ds="1"] :is(.adm.prices .checkbox, .coverage-badge, .warnbox, .adm .warnbox, .carry-box, .board-c .c-yel:not(.chip-w), .board-c .c-retry-box, .sales-error, .board-c .dn-unpaid, .c-warn-box) {
  background: var(--x-surface) !important; color: var(--x-ink) !important; border: 1px solid var(--x-line) !important; box-shadow: inset 4px 0 0 var(--x-check) !important;
}
body[data-ds="1"] :is(.sales-error, .board-c .dn-unpaid) { box-shadow: inset 4px 0 0 var(--x-late) !important; }
body[data-ds="1"] :is(.adm.prices .checkbox, .coverage-badge, .warnbox, .carry-box, .board-c .c-yel, .board-c .c-retry-box) svg { color: var(--x-check) !important; }
body[data-ds="1"] :is(.sales-error, .board-c .dn-unpaid) svg { color: var(--x-late) !important; }
body[data-ds="1"] .board-c .h-receipt .hr-cell.on { background: var(--x-surface) !important; box-shadow: inset 4px 0 0 var(--x-check); }
/* 가격표 rejected file: no red fill on the head */
body[data-ds="1"] .adm.prices .reject { border-color: var(--x-line) !important; box-shadow: inset 4px 0 0 var(--x-late), 0 1px 0 var(--x-line) !important; }
body[data-ds="1"] .adm.prices .reject .head { background: var(--x-surface) !important; color: var(--x-ink) !important; }
body[data-ds="1"] .adm.prices .reject .head svg { color: var(--x-late) !important; }
body[data-ds="1"] .adm.prices .reject li { background: var(--x-track) !important; }

/* 인벤토리 (.adm.prices.inv — the 가격표 stats, table and flagged rows above): the phone's flagged card = the notice band, the 실사 notice
   = 정보 navy band, the 실사 sum box = 8 corners, avatars round */
body[data-ds="1"] .adm.inv .p-card.flag { box-shadow: inset 4px 0 0 var(--x-check), 0 1px 0 var(--x-line) !important; }
body[data-ds="1"] .adm.inv .warnbox.info { box-shadow: inset 4px 0 0 var(--x-accent) !important; }
body[data-ds="1"] .adm.inv .count .sum { border-radius: 8px !important; }
/* its red quiet buttons (목록에서 빼기, PO 취소): red words. By id, because the quiet-button rule below carries the specificity of its
   longest member (.adm.prices td.acts button:not(.del)) and would turn them navy */
body[data-ds="1"] :is(#inventory, #inv-modal) .b-text.danger { color: var(--x-late) !important; -webkit-text-fill-color: var(--x-late) !important; }
body[data-ds="1"] :is(#inventory, #inv-modal) .b-text.danger:is(:hover, :focus-visible):not(:disabled) { background: var(--x-late-bg) !important; }

/* 주문 입력 할 일 box and other todo surfaces: white with a line (purple only on the 할 일 badge) */
body[data-ds="1"] [data-task] { background: var(--x-surface) !important; border-color: var(--x-line) !important; }
body[data-ds="1"] :is(.board-c .ofd-todo, .ofd-host .ofd-todo, .board-c .dn-link) { background: var(--x-surface) !important; border-color: var(--x-line) !important; }

/* 거래처: neutral area tags, hover = track, chosen row = light navy */
body[data-ds="1"] .adm .crow:not(.head):hover { background: var(--x-track) !important; }
body[data-ds="1"] .adm .crow.sel { background: var(--x-accent-bg) !important; }

/* beige boxes → track */
body[data-ds="1"] :is(.board-c .c-memo, .modal .what, .adm .facts, .dt-facts, .board-c .chip-w.memo, .board-c .qb-direct, .mini.sys, .look-rows, .tx .tx-memo, .c-memo) { background: var(--x-track) !important; }
body[data-ds="1"] .board-c .c-memo { border-style: solid !important; border-color: var(--x-line) !important; }

/* 매출 chart: the chosen period (this week / month) navy, the other periods accent-line */
body[data-ds="1"] .chart-bar { fill: var(--x-accent-line) !important; }
body[data-ds="1"] .chart-bar.selected { fill: var(--x-accent) !important; }
body[data-ds="1"] .chart-bar.missing { fill: transparent !important; stroke: var(--x-accent-line) !important; }
body[data-ds="1"] .chart-bar.negative { fill: var(--x-late) !important; }
body[data-ds="1"] :is(.chart-bar:hover, .chart-bar:focus) { fill: var(--x-accent) !important; stroke: var(--x-accent-bg); }

/* 조색: the current round = light navy chip with a navy line; the hot angle card light navy; its ΔE navy */
body[data-ds="1"] .tx .tx-steps li[data-step='current'] > span { background: var(--x-accent-bg) !important; border-color: var(--x-accent) !important; color: var(--x-accent) !important; }
body[data-ds="1"] .tx .tx-angle[data-hot] { background: var(--x-accent-bg) !important; border-color: var(--x-accent-line) !important; }
body[data-ds="1"] .tx .tx-angle[data-hot] .tx-angle-v { color: var(--x-accent) !important; }
body[data-ds="1"] .tx .tx-amount-input { border-color: var(--x-accent) !important; }

/* sidebar: tokens only (current row, icons, late chip / dot, avatar, tooltip, hover come from the values above) */

/* ---- 6. quiet buttons: no underline, navy 14/600, 32px min, 8px inside and -8px outside, hover light navy -------------------------- */
body[data-ds="1"] :is(.b-text, .c-tiny, .hist-link, .map-link, .tx .tx-link, .src-link, .inv-lines .ro-add, .rt-same, .gmap, .tint-export, .rm-back, .rm-all, .tk-name-btn, .shell-logout,
  .more-btn, .voc-var, .memo-go, .out-toggle, .look-day > .b-text, .look-more, #all-drivers, .voc-rep-link, .boost-off, button.tertiary, .adm.prices .back, .adm.prices td.acts button:not(.del), .adm.prices td.acts a, .cc-rm, .c-carried-ph, .ph-view .ph-orig) {
  text-decoration: none !important; border: 0 !important; background: transparent !important; box-shadow: none !important;
  color: var(--x-accent) !important; -webkit-text-fill-color: var(--x-accent); font-size: 14px !important; font-weight: 600 !important;
  min-height: 32px; padding-left: 8px !important; padding-right: 8px !important; margin-left: -8px; margin-right: -8px; border-radius: 8px !important;
  display: inline-flex; align-items: center; gap: 4px;
}
body[data-ds="1"] :is(.b-text, .c-tiny, .hist-link, .map-link, .tx .tx-link, .src-link, .inv-lines .ro-add, .rt-same, .gmap, .tint-export, .rm-back, .rm-all, .tk-name-btn, .shell-logout,
  .more-btn, .voc-var, .memo-go, .out-toggle, .look-day > .b-text, .look-more, #all-drivers, .voc-rep-link, .boost-off, button.tertiary, .adm.prices .back, .adm.prices td.acts button:not(.del), .adm.prices td.acts a, .cc-rm, .c-carried-ph):is(:hover, :focus-visible):not(:disabled) {
  background: var(--x-accent-bg) !important; text-decoration: none !important;
}
/* where the line was laid out flush (margin auto at the right end), keep the box inside: no negative outer margin there */
body[data-ds="1"] :is(.board-c .c-yel.row .c-tiny, .board-c .rtrow .c-tiny, .board-c .c-note-h .c-tiny, .board-c .c-addr .gmap, .board-c .col-h.c6-done .hist-link, .carry-box .b-text) { margin-left: auto; margin-right: -8px; }
body[data-ds="1"] .board-c .bcol.has-map > .map-link { margin: 0; }
/* inside the card facts / note lines the old zero padding kept a running line: keep the 8px inside, pull back with the margin */
body[data-ds="1"] :is(.board-c .c-facts .c-tiny, .board-c .c-note-h .c-tiny, .board-c .c-note-meta .c-tiny) { min-height: 32px; }
/* the account's [로그아웃]: grey words, same shape */
body[data-ds="1"] .shell-logout { color: var(--x-muted) !important; -webkit-text-fill-color: var(--x-muted) !important; }
/* take-away / cancel words (라벨에서 빼기, 빼기, 분리 취소, 삭제): red, hover light red */
body[data-ds="1"] :is(.c-tiny.danger, .c-tiny.rm, .b-text.danger, .b-text.rm, .asg-pop-row.rm, .c-note-meta .c-tiny, .voc-ex-btn, [data-act="unsplit"], [data-act="carryOff"], [data-quiet="danger"]) { color: var(--x-late) !important; -webkit-text-fill-color: var(--x-late) !important; }
body[data-ds="1"] :is(.c-tiny.danger, .c-tiny.rm, .b-text.danger, .b-text.rm, .c-note-meta .c-tiny, .voc-ex-btn, [data-act="unsplit"], [data-act="carryOff"], [data-quiet="danger"]):is(:hover, :focus-visible):not(:disabled) { background: var(--x-late-bg) !important; }
/* toast actions stay on the dark toast */
body[data-ds="1"] .toast-host .toast button { color: var(--x-toast-action) !important; }
/* the icons the quiet buttons carry (JS adds them only while data-ds is on) */
body[data-ds="1"] .ds-ic { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* a link inside a sentence keeps its underline, in ink */
body[data-ds="1"] :is(p, li, .note, .a-cap, .sub) > a:not([class]) { color: var(--x-ink) !important; text-decoration: underline !important; }
/* image links (photo thumbnails) and the skip link are not words in a sentence: no underline */
body[data-ds="1"] :is(a.c-thumb, .thumb a, .photos a, .c-photos a, .skip-link, .ph-cell a) { text-decoration: none !important; }
/* 지난 주문 name buttons: no underline on hover either (the row hover shows it) */
body[data-ds="1"] .hrow .hname button:hover { text-decoration: none !important; color: var(--x-accent) !important; }

/* ---- preview fixes (0cfb819) ------------------------------------------------------------------------------------------------- */
/* login: the sidebar's navy logo (lib/brand.mjs; brand colours, not tokens): mark 28px, 8px, wordmark 27px high, then "/ Admin" */
body[data-ds="1"] .login-brand { gap: 8px; }
body[data-ds="1"] .login-brand .login-mark { display: block; flex: none; width: 28px; height: 28px; }
body[data-ds="1"] .login-brand .login-word { display: block; flex: none; height: 27px; width: auto; }
/* 작업판 Completed head: the full column width, History → at the right end, 6px in like Out for Delivery's Map → */
body[data-ds="1"] .board-c .col-h.c6-done { box-sizing: border-box; width: 100% !important; padding-right: 6px !important; }
body[data-ds="1"] .board-c .col-h.c6-done .hist-link { margin-left: auto !important; margin-right: 0 !important; }
body[data-ds="1"] .board-c .bcol.has-map > .map-link { right: 6px !important; margin: 0 !important; }
/* 주문 상세 (C) head: 주문 지역 (예상 완료 or 받는 방법) 고객 희망 fill the width, 4 cells or 3 (.c3: 할 일, 취소); 지역 at least its words
   (up to 160px, then … + title), the rest share what is left equally; the phone keeps its 2-column grid */
@media (min-width:1024px) {
  body[data-ds="1"] .board-c dl.c-sub, body[data-ds="1"] .board-c .pc-panel dl.c-sub { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(max-content, 1fr) minmax(0, 1fr) minmax(0, 1fr) !important; justify-content: stretch !important; gap: 16px !important; }
  body[data-ds="1"] .board-c dl.c-sub.c3, body[data-ds="1"] .board-c .pc-panel dl.c-sub.c3 { grid-template-columns: minmax(0, 1fr) minmax(max-content, 1fr) minmax(0, 1fr) !important; }
  body[data-ds="1"] .board-c dl.c-sub.c2, body[data-ds="1"] .board-c .pc-panel dl.c-sub.c2 { grid-template-columns: minmax(0, 1fr) minmax(max-content, 1fr) !important; }
  body[data-ds="1"] .board-c dl.c-sub > div { min-width: 0; }
  body[data-ds="1"] .board-c dl.c-sub > div:nth-child(2) .ell { max-width: 160px; }
}
/* sidebar (SIDE_NAV): more room under the logo — open 8 → 20px, collapsed 4 → 12px */
body[data-ds="1"] .pc-side.side-v2 .side-brand { margin-bottom: 20px !important; }
@media (min-width:1024px) { body[data-ds="1"]:is(html[data-side=collapsed] *) .pc-side.side-v2 .side-brand { margin-bottom: 12px !important; } }

/* ---- 계산기 (/calc, public/calc.css) — the calculator's own pieces; everything else on the page is 주문 입력's and the order detail's ---- */
body[data-ds="1"] .calc-result .c-lines .dt-line.c2 { border-color: var(--x-line) !important; background: var(--x-surface) !important; }
body[data-ds="1"] .calc-result .c-lines .dt-line.c2:not(.dt-line.c2 + .dt-line.c2) { border-top-left-radius: 8px !important; border-top-right-radius: 8px !important; }
body[data-ds="1"] .calc-result .c-lines .dt-line.c2:not(:has(+ .dt-line.c2)) { border-bottom-left-radius: 8px !important; border-bottom-right-radius: 8px !important; }
body[data-ds="1"] .calc-result .calc-again { color: var(--x-accent) !important; text-decoration: none !important; }
body[data-ds="1"] .calc-result .calc-why { color: var(--x-ink) !important; }
body[data-ds="1"] .calc-result .calc-total { border-top-color: var(--x-line) !important; }
body[data-ds="1"] .calc-result .calc-total .warn { color: var(--x-warn) !important; }
body[data-ds="1"] .board-c.calc-result .dt-line.c2.calc-sub { padding-left: 34px !important; }
body[data-ds="1"] .calc-result .calc-handoff { border-radius: 8px !important; }
body[data-ds="1"] .calc-basis { margin-top: -4px !important; }