/* Lacak's dialogs (scripts/dialogs.js): one frame for every modal over the page, loaded last.
   The frame: a white card, 16px corners, the CRM's lifted shadow. Its head is the dialog's name at 15px and
   ✕; then the plate, the one fact read first, on a ground that says what kind of dialog it is; then what
   follows from it; then the foot, the quiet action at the left and the action at the right, 44px tall.
   A sale's plate is the sale mark's yellow wash and rule (lacak.css .message-line.marked); a destructive
   dialog has a red edge across its top, a pale red plate with the red rule and a red action; anything else
   has the CRM's soft ground. Placed under the top of the screen and centred across it, so a refusal that
   appears grows it downward and nothing above moves; on a phone, a bottom sheet with the sale form's head.
   Type is the page's Inter; figures are tabular. Colour never carries a meaning alone: the struck figure,
   the marks before each line and the action's words say it too. */
.lk-dialog {
  --lkd-ink: #172033; --lkd-muted: #687386; --lkd-line: #e5e3df; --lkd-soft: #f7f7f5;
  --lkd-navy: #18243a; --lkd-navy-hover: #23324d;
  --lkd-red: #c9363e; --lkd-red-hover: #ae2931; --lkd-red-ink: #9b2a30; --lkd-red-wash: #fdf1f0;
  --lkd-green: #147a52;
  --lkd-pad: 22px;
  position: fixed; z-index: 119; top: clamp(32px, 13vh, 120px); right: 0; left: 0;
  display: flex; flex-direction: column;
  width: min(420px, calc(100vw - 32px)); max-height: calc(100dvh - clamp(32px, 13vh, 120px) - 24px);
  margin: 0 auto; overflow: hidden;
  border-radius: 16px; background: #fff; color: var(--lkd-ink);
  box-shadow: 0 1px 2px rgba(23, 32, 51, .08), 0 24px 64px rgba(23, 32, 51, .22);
  font-variant-numeric: tabular-nums; outline: none;
}
.lk-dialog.size-wide { width: min(560px, calc(100vw - 32px)); }
.lk-dialog:focus, .lk-dialog:focus-visible { outline: none; }
/* A destructive dialog: the red edge across its top, inside the corners. */
.lk-dialog.tone-danger { box-shadow: inset 0 3px 0 var(--lkd-red), 0 1px 2px rgba(23, 32, 51, .08), 0 24px 64px rgba(23, 32, 51, .22); }
.lkd-scrim { position: fixed; z-index: 118; inset: 0; width: 100%; padding: 0; border: 0; background: rgba(23, 32, 51, .42); cursor: default; }
#layer > .lkd-scrim, #links-layer .lkd-scrim { z-index: 118; }
#layer > .lk-dialog, #links-layer .lk-dialog { z-index: 119; }
/* Over the link drawer: its own layer above the drawer and the drawer's scrim. */
#links-layer .lacak-discard-layer { position: fixed; z-index: 300; inset: 0; }
#links-layer .lacak-discard-layer > .lkd-scrim { z-index: 0; background: rgba(23, 32, 51, .3); }
#links-layer .lacak-discard-layer > .lk-dialog { z-index: 1; }

/* ---------- Head ---------- */
.lkd-head { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; padding: 14px 12px 0 var(--lkd-pad); }
.lkd-name { flex: 1 1 auto; min-width: 0; }
.lkd-name h2 { margin: 0; color: var(--lkd-ink); font-size: 15px; font-weight: 700; line-height: 1.35; letter-spacing: -.01em; }
.lkd-name p { margin: 1px 0 0; overflow: hidden; color: var(--lkd-muted); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.lkd-close, .lkd-back { display: grid; flex: 0 0 36px; width: 36px; height: 36px; place-items: center; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--lkd-muted); cursor: pointer; transition: background-color var(--m-hover) ease, color var(--m-hover) ease; }
.lkd-back { margin-left: -10px; }
.lkd-close:hover, .lkd-back:hover { background: var(--lkd-soft); color: var(--lkd-ink); }
.lkd-close .icon, .lkd-back .icon { width: 18px; height: 18px; }
.lk-dialog :is(.lkd-close, .lkd-back, .lkd-foot button, .lk-step):focus-visible { outline: 3px solid rgba(47, 98, 164, .3); outline-offset: 2px; }
/* A source row sits inside a list that clips its overflow, so its ring is drawn inside its edges. */
.lk-dialog .touch-row:focus-visible { outline: 2px solid #82aef1; outline-offset: -2px; }

/* ---------- The middle: plate, lines, fields; it scrolls when the screen is short ---------- */
.lkd-scroll { display: grid; flex: 1 1 auto; align-content: start; gap: 14px; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 14px var(--lkd-pad) 20px; }

/* The plate: the one fact, read first. */
.lkd-plate { position: relative; margin: 0; border-radius: 12px; background: var(--lkd-soft); color: var(--lkd-ink); }
.tone-sale .lkd-plate { background: var(--yellow-wash); box-shadow: inset 4px 0 0 var(--yellow); }
.tone-danger .lkd-plate { background: var(--lkd-red-wash); box-shadow: inset 4px 0 0 var(--lkd-red); }

/* A figure: the tag of the mark it makes, the amount large, its date under it. */
.lkd-plate.is-figure { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 2px 12px; padding: 16px 18px 15px 20px; }
.lkd-plate-tag { display: grid; grid-row: 1 / span 2; width: 38px; height: 38px; place-items: center; border-radius: 50%; background: var(--yellow); color: var(--yellow-ink); }
.lkd-plate-tag .icon { width: 18px; height: 18px; }
.tone-danger .lkd-plate-tag { background: #eceef2; color: #5b6578; }
.lkd-figure { min-width: 0; font-size: 30px; font-weight: 800; line-height: 1.1; letter-spacing: -.025em; overflow-wrap: anywhere; }
.lkd-figure s { color: var(--lkd-red-ink); text-decoration-thickness: 2.5px; text-decoration-color: var(--lkd-red); }
.lkd-plate.is-figure:not(:has(.lkd-plate-meta)) .lkd-plate-tag { grid-row: auto; }
.lkd-plate-meta { display: inline-flex; align-items: center; gap: 6px; color: #5d5440; font-size: 13px; font-weight: 600; }
.lkd-plate-meta .icon { width: 13px; height: 13px; }

/* An object: its mark in a white tile, then its name and the line that tells it apart. */
.lkd-plate.is-object, .lkd-plate.is-file { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 14px; padding: 15px 18px 15px 18px; }
.tone-danger .lkd-plate.is-object, .tone-sale .lkd-plate.is-object { padding-left: 20px; }
.lkd-plate-mark { display: grid; width: 44px; height: 44px; place-items: center; border: 1px solid var(--lkd-line); border-radius: 12px; background: #fff; color: var(--lkd-ink); }
.lkd-plate-mark .icon, .lkd-plate-mark .brand-icon, .lkd-plate-mark .source-icon, .lkd-plate-mark .provider-brand-logo { width: 22px; height: 22px; flex: 0 0 22px; }
.lkd-plate-mark .source-icon { color: #2d68b2; }
.lkd-plate-mark .source-icon.organic { color: #219065; }
.lkd-plate-mark .lacak-link-mark { width: 100%; height: 100%; border-radius: 11px; font-size: 13px; }
.lkd-plate-mark:has(.lacak-link-mark) { border: 0; }
.lkd-plate-copy { display: grid; gap: 2px; min-width: 0; }
.lkd-plate-copy small { color: var(--lkd-muted); font-size: 11.5px; font-weight: 650; }
.lkd-plate-copy strong { min-width: 0; font-size: 18px; font-weight: 750; line-height: 1.3; letter-spacing: -.015em; overflow-wrap: anywhere; }
.lkd-plate-copy > span { color: #46536a; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
.tone-danger .lkd-plate-copy strong { color: var(--lkd-red-ink); }

/* A sentence: the mark, and what the action does, at the plate's reading size. */
.lkd-plate.is-sentence { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 14px; padding: 15px 18px 15px 20px; }
.lkd-plate.is-sentence p { margin: 0; font-size: 15px; font-weight: 650; line-height: 1.45; letter-spacing: -.005em; }
.tone-danger .lkd-plate.is-sentence .lkd-plate-mark { border-color: #f1d2d0; color: var(--lkd-red); }

/* The correction: the figure now, struck as the card keeps it; the chevron; the figure it becomes, typed
   in Lite's amount field set at the plate's size on the mark's yellow. */
.lkd-plate.is-change { display: grid; grid-template-columns: minmax(0, .85fr) 18px minmax(0, 1.15fr); align-items: stretch; gap: 8px; padding: 0; background: none; box-shadow: none; }
.lkd-change-from, .lkd-change-to { display: grid; align-content: start; gap: 8px; min-width: 0; padding: 14px 14px 15px; border-radius: 12px; }
.lkd-change-from { background: var(--lkd-soft); }
.lkd-change-to { padding-left: 16px; background: var(--yellow-wash); box-shadow: inset 4px 0 0 var(--yellow); }
.lkd-change-from small, .lkd-change-to label { color: var(--lkd-muted); font-size: 11.5px; font-weight: 700; }
.lkd-change-to label { color: #5d5440; }
.lkd-change-from s { display: flex; min-height: 46px; align-items: center; color: var(--lkd-muted); font-size: 18px; font-weight: 700; line-height: 1.3; letter-spacing: -.015em; text-decoration-thickness: 1.5px; overflow-wrap: anywhere; }
.lkd-change-arrow { display: grid; place-items: center; color: #9aa5b5; }
.lkd-change-arrow .icon { width: 16px; height: 16px; }
.lkd-money { border-color: #e7cf8f; background: #fff; }
.lkd-money:focus-within { border-color: var(--yellow-edge); box-shadow: 0 0 0 3px rgba(245, 195, 59, .32); }
.lkd-money span { padding-left: 10px; font-weight: 650; }
.lkd-money input { min-height: 44px; padding: 0 10px 0 6px; color: var(--lkd-ink); font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.lkd-money:has([aria-invalid="true"]) { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(165, 61, 61, .12); }

/* The file: what it holds, and over which period. */
.lkd-plate.is-file strong { font-size: 15px; font-weight: 700; line-height: 1.4; }
.lkd-plate.is-file .lkd-plate-copy > span { margin-top: 6px; }
.lkd-chip { display: inline-flex; align-items: center; gap: 4px; min-height: 26px; padding: 0 10px; border: 1px solid var(--lkd-line); border-radius: 999px; background: #fff; color: var(--lkd-muted); font-size: 12px; font-weight: 600; }
.lkd-chip b { color: var(--lkd-ink); font-weight: 750; }
/* Its columns as the spreadsheet heads them: each under its letter, in file order, two to a row. */
.lkd-sheet h3 { margin: 0 0 8px; color: var(--lkd-muted); font-size: 11.5px; font-weight: 700; }
.lkd-sheet ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 0; overflow: hidden; border: 1px solid var(--lkd-line); border-radius: 10px; list-style: none; }
.lkd-sheet li { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; min-height: 36px; border-bottom: 1px solid #eeede9; color: var(--lkd-ink); font-size: 13px; line-height: 1.3; }
.lkd-sheet li:nth-child(odd) { border-right: 1px solid #eeede9; }
.lkd-sheet li:nth-last-child(-n + 2):nth-child(odd), .lkd-sheet li:last-child { border-bottom: 0; }
.lkd-sheet li > span { display: grid; align-self: stretch; place-items: center; margin-right: 10px; border-right: 1px solid #eeede9; background: var(--lkd-soft); color: var(--lkd-muted); font-size: 11px; font-weight: 700; }

/* The download: the file's name over its sheets, a row each, read as a spreadsheet's tabs: the sheet's mark
   in a white tile, its name, what a row is, and its row count large at the right in tabular figures. */
.lkd-plate.is-workbook { display: grid; padding: 0 18px 4px; }
.lkd-file-name { display: flex; align-items: center; gap: 7px; min-width: 0; margin: 0; padding: 11px 0 10px; border-bottom: 1px solid #e9e7e2; color: var(--lkd-muted); font-size: 12.5px; font-weight: 650; }
.lkd-file-name .icon { flex: 0 0 15px; width: 15px; height: 15px; }
.lkd-file-name span { min-width: 0; overflow-wrap: anywhere; }
.lkd-sheets { display: grid; margin: 0; padding: 0; list-style: none; }
.lkd-sheets li { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 1px 12px; padding: 12px 0; }
.lkd-sheets li + li { border-top: 1px solid #e9e7e2; }
.lkd-sheet-mark { display: grid; grid-row: 1 / span 2; width: 36px; height: 36px; place-items: center; border: 1px solid var(--lkd-line); border-radius: 10px; background: #fff; color: var(--lkd-ink); }
.lkd-sheet-mark .icon { width: 18px; height: 18px; }
.lkd-sheets strong { min-width: 0; font-size: 15px; font-weight: 750; line-height: 1.3; letter-spacing: -.01em; overflow-wrap: anywhere; }
.lkd-sheets p { grid-column: 2; margin: 0; color: #46536a; font-size: 12.5px; line-height: 1.45; }
.lkd-count { display: grid; grid-column: 3; grid-row: 1 / span 2; justify-items: end; align-self: center; }
.lkd-count b { font-size: 22px; font-weight: 800; line-height: 1.1; letter-spacing: -.02em; }
.lkd-count span { color: var(--lkd-muted); font-size: 11.5px; font-weight: 650; }

/* The format: two choices side by side, Excel first. Each is a white card holding the file's mark, a round
   tick at its corner, its name and what the file is. Hover lays the soft ground; the chosen card takes a
   navy edge and a filled navy tick; the keyboard's ring goes round the card. */
.lkd-formats { min-width: 0; margin: 0; padding: 0; border: 0; }
.lkd-formats legend { margin: 0 0 8px; padding: 0; color: var(--lkd-muted); font-size: 11.5px; font-weight: 700; }
.lkd-format-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.lkd-format { position: relative; display: grid; align-content: start; gap: 2px; min-width: 0; padding: 13px 14px 14px; border: 1px solid var(--lkd-line); border-radius: 12px; background: #fff; cursor: pointer; transition: background-color var(--m-hover) ease, border-color var(--m-hover) ease, box-shadow var(--m-hover) ease; }
.lkd-format:hover { background: var(--lkd-soft); }
.lkd-format input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.lkd-format:has(:checked) { border-color: var(--lkd-navy); background: #fff; box-shadow: inset 0 0 0 1px var(--lkd-navy); }
.lkd-format:has(:focus-visible) { outline: 3px solid rgba(47, 98, 164, .3); outline-offset: 2px; }
.lkd-format-mark { display: grid; width: 36px; height: 36px; margin-bottom: 8px; place-items: center; border: 1px solid var(--lkd-line); border-radius: 10px; background: #fff; color: var(--lkd-ink); }
.lkd-format-mark .icon { width: 20px; height: 20px; }
/* Excel's mark wears Excel's green, so the workbook is known at a glance; its name says it too. */
.lkd-format.is-xlsx .lkd-format-mark { border-color: #cfe5d8; background: #edf6f0; color: #1d6f42; }
.lkd-format-tick { position: absolute; top: 12px; right: 12px; display: grid; width: 20px; height: 20px; place-items: center; border: 1.5px solid #c9ced8; border-radius: 50%; background: #fff; color: transparent; transition: background-color var(--m-hover) ease, border-color var(--m-hover) ease, color var(--m-hover) ease; }
.lkd-format-tick .icon { width: 12px; height: 12px; stroke-width: 2.6px; }
.lkd-format:has(:checked) .lkd-format-tick { border-color: var(--lkd-navy); background: var(--lkd-navy); color: #fff; }
.lkd-format strong { font-size: 14px; font-weight: 750; line-height: 1.3; letter-spacing: -.005em; }
.lkd-format small { color: var(--lkd-muted); font-size: 12.5px; line-height: 1.4; }

/* The QR: the code on a white card, large enough to scan from the screen; the name and link under it. */
.lkd-plate.is-qr { display: grid; justify-items: center; gap: 4px; padding: 14px 18px 18px; border: 1px solid var(--lkd-line); background: #fff; }
.lkd-plate.is-qr .qr-code { width: min(260px, 100%); height: auto; }
.lkd-plate.is-qr figcaption { display: grid; justify-items: center; gap: 2px; max-width: 100%; text-align: center; }
.lkd-plate.is-qr strong { max-width: 100%; font-size: 16px; font-weight: 750; letter-spacing: -.01em; overflow-wrap: anywhere; }
.lkd-plate.is-qr span { color: var(--lkd-muted); font-size: 12.5px; }

/* Target ROAS: Bisnis's widget (pengaturan.css .lk-target-value, .lk-scale, .lk-target-list) with its value
   on the plate, − the figure + centred on the soft ground; the track and the accounts under it. The middle is
   a container, so on a phone's sheet the widget takes the narrow form it takes in a narrow Bisnis card. */
.lkd-plate.is-target { display: grid; place-items: center; padding: 16px 18px; }
.lkd-plate.is-target .lk-target-value { margin: 0; }
#overlay-roas .lkd-scroll { container-type: inline-size; }
/* The dialog opens with the figure selected in the field; its focus is the underline turning navy and
   thicker, as the dialog's other fields show theirs, not a box over the plate. */
.lkd-plate.is-target .lk-target-field input:focus-visible { border-radius: 0; outline: none; border-bottom-color: var(--w-navy); box-shadow: 0 1px 0 var(--w-navy); }
.lkd-plate.is-target .lk-target-field input[aria-invalid="true"] { border-bottom-color: var(--w-bad); box-shadow: 0 1px 0 var(--w-bad); }
.lkd-roas > .lk-target-help { margin-top: 0; }
.lkd-roas > .lk-target-error { margin: -4px 0 8px; }
.lkd-roas .lk-scale { margin-top: 16px; }
.lkd-roas .lk-target-list { margin-bottom: -9px; }

/* Detail sumber's path: the panel's ladder (lacak.css .attr-path) at the dialog's reading size. */
.lkd-path { display: grid; gap: 8px; margin: 0 0 0 21px; padding: 2px 0 2px 16px; border-left: 1.5px solid #dbe3ee; }
.lkd-path > div { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 12px; align-items: baseline; }
.lkd-path dt { color: var(--lkd-muted); font-size: 12px; font-weight: 650; }
.lkd-path dd { min-width: 0; margin: 0; color: #24334e; font-size: 13.5px; font-weight: 650; line-height: 1.4; overflow-wrap: anywhere; }

/* What follows, a line each, its mark before it: goes (red ✕), stays (green ✓), is so (grey i). */
.lkd-facts { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.lkd-facts li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; align-items: start; color: #46536a; font-size: 13px; line-height: 1.5; }
.lkd-facts li > span { display: grid; width: 20px; height: 20px; margin-top: 0; place-items: center; border-radius: 50%; background: #eef0f4; color: var(--lkd-muted); }
.lkd-facts li > span .icon { width: 11px; height: 11px; stroke-width: 2.4px; }
.lkd-facts li.is-lost { color: var(--lkd-ink); font-weight: 600; }
.lkd-facts li.is-lost > span { background: var(--lkd-red-wash); color: var(--lkd-red); }
.lkd-facts li.is-kept > span { background: #e3f3ea; color: var(--lkd-green); }
.lkd-note { margin: 0; color: var(--lkd-muted); font-size: 12.5px; line-height: 1.55; }

/* Fields: the CRM's textarea field, its label at the plate labels' size. */
.lk-dialog .lkd-field { display: grid; gap: 6px; margin: 0; }
.lk-dialog .lkd-field > span { margin: 0; color: var(--lkd-muted); font-size: 11.5px; font-weight: 700; }
.lk-dialog .lkd-field textarea { min-height: 72px; padding: 10px 11px; border: 1px solid #d5d3cf; border-radius: 10px; font-size: 13px; line-height: 1.5; resize: vertical; }
.lk-dialog .lkd-field textarea:focus { border-color: #8fa9cc; box-shadow: 0 0 0 3px rgba(47, 98, 164, .14); }
.lk-dialog .lkd-field textarea[aria-invalid="true"] { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(165, 61, 61, .12); }
.lkd-error { margin: -6px 0 0; color: var(--danger); font-size: 12.5px; font-weight: 600; line-height: 1.45; }
.lkd-error:empty { display: none; }

/* Riwayat sumber's rows and its empty form, inside the scroll. */
.lk-dialog .lacak-touch-list { margin: 0; }
.lk-dialog .lacak-empty.compact { min-height: 0; padding: 22px 12px; }

/* ---------- Foot ---------- */
.lkd-foot { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 10px; padding: 14px var(--lkd-pad) 18px; border-top: 1px solid #efeeea; background: #fff; }
.lk-dialog .lkd-foot button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 8px; padding: 0 18px; border-radius: 10px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.lk-dialog .lkd-foot .lkd-quiet { border: 1px solid var(--lkd-line); background: #fff; color: var(--lkd-ink); }
.lk-dialog .lkd-foot .lkd-quiet:hover { background: var(--lkd-soft); }
.lk-dialog .lkd-foot .lkd-action { min-width: 156px; margin-left: auto; border: 1px solid var(--lkd-navy); background: var(--lkd-navy); color: #fff; }
.lk-dialog .lkd-foot .lkd-action:hover { border-color: var(--lkd-navy-hover); background: var(--lkd-navy-hover); }
.lk-dialog .lkd-foot .lkd-action.danger-button { border-color: var(--lkd-red); background: var(--lkd-red); }
.lk-dialog .lkd-foot .lkd-action.danger-button:hover { border-color: var(--lkd-red-hover); background: var(--lkd-red-hover); }
.lk-dialog .lkd-foot .lkd-action .icon { width: 16px; height: 16px; }
/* A dialog with one action carries it across its foot. */
.lk-dialog .lkd-foot > .lkd-action:only-child { flex: 1 1 auto; }

/* ---------- Motion ----------
   In: the card rises 12px into place over 220ms on the decelerating curve as the scrim fades in over 160ms.
   Out: it sinks 8px and fades over 160ms on the accelerating curve, the scrim with it. */
.lk-dialog.entering { animation: lkd-in var(--m-move) var(--m-in) both; }
.lkd-scrim.entering, .lacak-discard-layer.entering > .lkd-scrim { animation: lacak-fade-in 160ms linear both; }
.lacak-discard-layer.entering > .lk-dialog { animation: lkd-in var(--m-move) var(--m-in) both; }
.lk-dialog.is-leaving, .is-leaving > .lk-dialog { animation: lkd-out 160ms var(--m-out) forwards; pointer-events: none; }
.lkd-scrim.is-leaving, .is-leaving > .lkd-scrim { animation: lacak-fade-out 160ms linear forwards; }
@keyframes lkd-in { from { opacity: 0; transform: translateY(12px) scale(.985); } }
@keyframes lkd-out { to { opacity: 0; transform: translateY(8px) scale(.99); } }

/* ---------- Phone: the bottom sheet, as the sale form's ----------
   Full width from the bottom edge, 18px top corners, the head as the sale form's sheet head (17px name,
   the bordered 36px ✕, a rule under it), the foot's two actions side by side within the thumb's reach,
   the action the wider. It slides up from the bottom edge and back down. */
@media (max-width: 640px) {
  .lk-dialog, .lk-dialog.size-wide { --lkd-pad: 18px; top: auto; bottom: 0; width: 100%; max-height: min(88dvh, 720px); border-radius: 18px 18px 0 0; box-shadow: 0 -18px 50px rgba(23, 32, 51, .18); }
  .lk-dialog.tone-danger { box-shadow: inset 0 3px 0 var(--lkd-red), 0 -18px 50px rgba(23, 32, 51, .18); }
  .lkd-head { padding: 13px 14px 12px var(--lkd-pad); border-bottom: 1px solid var(--lkd-line); }
  .lkd-name h2 { font-size: 17px; }
  .lkd-close { border: 1px solid var(--lkd-line); border-radius: 9px; color: var(--lkd-ink); }
  .lkd-back { margin-left: -6px; }
  .lkd-scroll { padding-top: 16px; }
  .lkd-foot { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); padding: 12px var(--lkd-pad) calc(12px + env(safe-area-inset-bottom)); }
  .lkd-foot > :only-child { grid-column: 1 / -1; }
  .lk-dialog .lkd-foot .lkd-action { min-width: 0; margin: 0; }
  .lk-dialog .lkd-foot button { min-height: 48px; padding: 0 12px; }
  .lkd-figure { font-size: 28px; }
  .lkd-plate.is-change { grid-template-columns: minmax(0, 1fr) 14px minmax(0, 1.25fr); gap: 6px; }
  .lkd-change-from, .lkd-change-to { padding: 12px 10px 12px 12px; }
  .lkd-change-to { padding-left: 14px; }
  .lkd-change-from s { font-size: 15px; }
  .lkd-money input { font-size: 17px; }
  .lkd-sheet ol { grid-template-columns: minmax(0, 1fr); }
  .lkd-sheet li:nth-child(odd) { border-right: 0; }
  .lkd-sheet li:nth-last-child(-n + 2):nth-child(odd) { border-bottom: 1px solid #eeede9; }
  .lkd-path > div { grid-template-columns: 84px minmax(0, 1fr); }
  .lk-dialog.entering, .lacak-discard-layer.entering > .lk-dialog { animation: lkd-sheet-in 260ms var(--m-in) both; }
  .lk-dialog.is-leaving, .is-leaving > .lk-dialog { animation: lkd-sheet-out 160ms var(--m-out) forwards; }
}
@keyframes lkd-sheet-in { from { transform: translateY(100%); } }
@keyframes lkd-sheet-out { to { transform: translateY(100%); } }

@media (prefers-reduced-motion: reduce) {
  .lk-dialog, .lk-dialog *, .lkd-scrim, .lacak-discard-layer { animation: none !important; transition: none !important; }
}