/* Karte Controller (Stage 2) — layout from mock v3 */
#karte-controller-shell {
  --kc-bg: #eef0f4;
  --kc-card: #fff;
  --kc-line: #dfe3ea;
  --kc-ink: #151a21;
  --kc-muted: #6d7683;
  --kc-blue: #1f5fd0;
  --kc-amber: #c86a00;
  --kc-amber-bg: #fff5e6;
  --kc-red: #cf2020;
  --kc-red-bg: #ffeded;
  --kc-teal: #0d6f74;
  --kc-teal-bg: #eafafa;
  --kc-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .08);
  position: fixed;
  top: var(--app-top, 0px);
  left: 0;
  right: 0;
  bottom: auto;
  height: var(--app-h, 100dvh);
  max-height: var(--app-h, 100dvh);
  z-index: var(--z-controller, 10050);
  display: none;
  flex-direction: column;
  background: var(--kc-bg);
  color: var(--kc-ink);
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
  font-size: 15px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
  isolation: isolate;
  contain: layout style;
}
#karte-controller-shell.is-on { display: flex; }
#karte-controller-shell * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
#karte-controller-shell .kc-num { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }

/* コントローラー表示中は従来カルテの操作ボタンが前面に出ないようにする */
/* シェル表示中だけページ本体を止める。カルテ本体へ戻したら外れる */
html.kc-controller-on,
body.kc-controller-on {
  overflow: hidden !important;
  overscroll-behavior: none;
  height: var(--app-h, 100dvh);
  max-height: var(--app-h, 100dvh);
}
body.kc-controller-on > header,
body.kc-controller-on #detail-ui,
body.kc-controller-on #list-ui,
body.kc-controller-on #karte-autosave-status {
  visibility: hidden !important;
  pointer-events: none !important;
}

.kc-mbtns,
.kc-mbtns .kc-btn,
.kc-cRow .kc-btn {
  position: relative;
  z-index: var(--z-base, 0);
}

.kc-topbar {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  padding-top: max(8px, env(safe-area-inset-top));
  background: #1b2027;
  color: #fff;
  font-size: 12px;
}
.kc-topbar b { font-size: 13px; letter-spacing: .04em; }
.kc-topbar .kc-sp { flex: 1; }
.kc-topbar .kc-btn {
  border: 1px solid #4b5563;
  background: #2b323b;
  color: #fff;
  border-radius: 7px;
  padding: 6px 11px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.kc-stage {
  flex: 1;
  min-height: 0;
  display: flex;
  justify-content: center;
  padding: 10px;
  overflow: hidden;
  overscroll-behavior: contain;
}
.kc-frame {
  width: 100%;
  max-width: 1180px;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
@media (min-width: 900px) {
  .kc-frame {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
  }
}
/* スマホ: 入れ子スクロールをやめ、stage だけを1本のスクロールにする */
@media (max-width: 899px) {
  .kc-stage {
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    align-items: flex-start;
    padding-bottom: max(12px, env(safe-area-inset-bottom));
  }
  .kc-frame {
    height: auto;
    min-height: 0;
    flex: 0 0 auto;
  }
  .kc-frame > .kc-pane:first-child {
    position: sticky;
    top: 0;
    z-index: var(--z-sticky, 100);
    flex: 0 0 auto;
    max-height: 180px;
    overflow: hidden;
    box-shadow: 0 6px 12px rgba(16, 24, 40, .08);
  }
  .kc-frame > .kc-pane:first-child .kc-body {
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .kc-frame > .kc-pane:last-child {
    flex: 0 0 auto;
    overflow: visible;
    max-height: none;
  }
  .kc-frame > .kc-pane:last-child .kc-body {
    overflow: visible;
    max-height: none;
    min-height: 0;
  }
  .kc-l2sticky,
  .kc-l3sticky {
    top: var(--kc-top-sticky-h, 0px);
  }
}
@media (max-width: 899px) {
  [data-theme="dark"] #karte-controller-shell .kc-frame > .kc-pane:first-child {
    box-shadow: 0 6px 14px rgba(0, 0, 0, .45);
  }
}

.kc-pane {
  background: var(--kc-card);
  border: 1px solid var(--kc-line);
  border-radius: 12px;
  box-shadow: var(--kc-shadow);
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  position: relative;
}
.kc-pane h2 {
  margin: 0;
  padding: 9px 13px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .09em;
  color: var(--kc-muted);
  border-bottom: 1px solid var(--kc-line);
  display: flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
}
.kc-pane h2 .kc-cnt {
  background: #eceff4;
  color: #4a535f;
  border-radius: 20px;
  padding: 1px 8px;
  font-size: 11px;
}
.kc-body {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding: 8px;
  min-height: 0;
}

.kc-prow {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  background: #fff;
  border: 1px solid var(--kc-line);
  border-radius: 10px;
  padding: 11px 12px;
  margin-bottom: 8px;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.kc-prow:active { background: #f6f8fb; }
.kc-prow.over, .kc-prow.waitover { border-color: #f0b9b9; background: var(--kc-red-bg); }
.kc-prow.soon { border-color: #f0d3a2; background: var(--kc-amber-bg); }
.kc-prow.wait { border-color: #bfe0e2; background: var(--kc-teal-bg); }
.kc-prow .kc-who { font-size: 17px; font-weight: 700; }
.kc-prow .kc-sub {
  font-size: 12px;
  color: var(--kc-muted);
  margin-top: 2px;
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}
.kc-tag {
  background: #eef1f6;
  border-radius: 4px;
  padding: 1px 6px;
  font-size: 11px;
  color: #4a535f;
}
.kc-tag.asst { background: #e6f0ff; color: #1f4fa8; font-weight: 600; }
.kc-tag.wt { background: #d7f0f1; color: #0d6f74; font-weight: 700; }
.kc-prow .kc-t { text-align: right; line-height: 1.1; }
.kc-prow .kc-t .kc-big { font-size: 25px; font-weight: 700; }
.kc-prow .kc-t .kc-lbl { font-size: 10px; color: var(--kc-muted); letter-spacing: .06em; }
.kc-prow.over .kc-t .kc-big, .kc-prow.waitover .kc-t .kc-big { color: var(--kc-red); }
.kc-prow.soon .kc-t .kc-big { color: var(--kc-amber); }
.kc-prow.wait .kc-t .kc-big { color: var(--kc-teal); }
.kc-prow.hands .kc-t .kc-big { color: #2b323b; }

.kc-divider {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 12px 2px 8px;
  color: var(--kc-muted);
  font-size: 11px;
  letter-spacing: .06em;
}
.kc-divider:before, .kc-divider:after { content: ""; height: 1px; background: var(--kc-line); flex: 1; }

.kc-resbox {
  border: 1px dashed #ccd3dd;
  border-radius: 12px;
  padding: 8px 8px 6px;
  background: #f7f8fb;
  margin-bottom: 4px;
}
.kc-reslab {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  margin: 2px 4px 8px;
}
.kc-reslab.over { color: var(--kc-red); }
.kc-reslab.soon { color: #8b939d; margin-top: 10px; }

.kc-arow {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  background: #fff;
  border: 1px dashed #ccd3dd;
  border-radius: 10px;
  padding: 9px 11px;
  margin-bottom: 7px;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.kc-arow.is-over {
  border-color: #f0b9b9;
  background: var(--kc-red-bg);
}
.kc-arow.is-soon {
  border-color: #d5dae3;
  background: #f3f5f8;
  color: #5c6570;
}
.kc-arow .kc-hhmm { font-size: 13px; font-weight: 700; color: #4a535f; }
.kc-arow.is-over .kc-hhmm { color: var(--kc-red); }
.kc-arow.is-soon .kc-hhmm { color: #8b939d; }
.kc-arow .kc-mid { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.kc-arow .kc-nm { font-size: 14px; font-weight: 600; }
.kc-arow .kc-menu {
  font-size: 11px;
  color: #7a838f;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kc-arow .kc-overtag {
  display: inline-block;
  align-self: flex-start;
  margin-top: 2px;
  font-size: 10px;
  font-weight: 700;
  color: var(--kc-red);
  background: #ffd6d6;
  border-radius: 4px;
  padding: 1px 6px;
}
.kc-arow .kc-go {
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: var(--kc-blue);
  border-radius: 7px;
  padding: 6px 12px;
  flex: 0 0 auto;
}
.kc-arow.is-soon .kc-go {
  background: #6b7787;
}
.kc-resmore {
  width: 100%;
  border: 0;
  background: transparent;
  color: #5b6572;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 6px 4px;
  cursor: pointer;
  text-align: center;
}
.kc-resmore:active { opacity: .75; }
.kc-empty { color: var(--kc-muted); font-size: 13px; text-align: center; padding: 22px 10px; }
.kc-hist-pick .kc-mlist { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.kc-hist-pick .kc-mname {
  width: 100%;
  text-align: left;
  white-space: normal;
  line-height: 1.35;
}
.kc-hist-pick .kc-hist-lead {
  font-size: 14px;
  font-weight: 700;
  color: var(--kc-ink);
  line-height: 1.45;
  margin: 0 0 6px;
}
.kc-hist-pick .kc-hist-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px;
}
.kc-hist-pick .kc-hist-open {
  width: 100%;
  min-height: 48px;
  white-space: normal;
  text-align: left;
  line-height: 1.35;
  padding: 12px 14px;
  font-size: 14px;
  font-weight: 800;
}
.kc-hist-pick .kc-hist-secondary {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 10px;
}
.kc-hist-pick .kc-hist-secondary-btn {
  width: 100%;
  min-height: 40px;
  font-size: 13px;
  font-weight: 600;
  background: transparent;
  border: 1px solid #c5ccd6;
  color: #4a5563;
}
.kc-prow.is-current {
  border-color: #067a56;
  box-shadow: inset 0 0 0 1px rgba(6, 122, 86, 0.35);
  background: #f1faf6;
}
.kc-prow .kc-tag.now {
  background: #0a5c45;
  color: #fff;
  border-color: #0a5c45;
}

.kc-cust { padding: 10px 13px 9px; border-bottom: 1px solid var(--kc-line); flex: 0 0 auto; }
.kc-cust .kc-l1 { display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap; }
.kc-cust .kc-nm { font-size: 21px; font-weight: 700; }
.kc-cust .kc-mt { font-size: 12px; color: var(--kc-muted); }
.kc-lastv {
  border: 1px solid #cfd9e8;
  background: #f4f8ff;
  color: #1f4fa8;
  border-radius: 20px;
  padding: 3px 11px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.kc-lastv .kc-dd { color: #5b7bb5; font-weight: 600; }
.kc-draft {
  margin-top: 6px;
  font-size: 11px;
  color: #0d6f74;
  background: var(--kc-teal-bg);
  border: 1px solid #cfe9ea;
  border-radius: 6px;
  padding: 3px 8px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.kc-block { padding: 4px 2px 2px; }
.kc-arrived {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: #f5f7fa;
  border: 1px solid var(--kc-line);
  border-radius: 10px;
  padding: 10px 12px;
  margin-bottom: 9px;
}
.kc-arrived .kc-lab { font-size: 13px; color: var(--kc-muted); }
.kc-arrived .kc-val { font-size: 17px; font-weight: 700; }
.kc-arrived .kc-el { font-size: 12px; color: var(--kc-muted); margin-left: 6px; font-weight: 400; }

.kc-btn {
  border: 1px solid var(--kc-line);
  background: #fff;
  border-radius: 10px;
  font: inherit;
  cursor: pointer;
  color: var(--kc-ink);
}
.kc-btn:active { transform: translateY(1px); }
.kc-btn.pri { background: #1b2027; border-color: #1b2027; color: #fff; font-weight: 700; }
.kc-hist-pick .kc-btn.pri,
.kc-hist-pick .kc-hist-open {
  background: #145c45;
  border: 2px solid #3dd68c;
  color: #fff;
  font-weight: 800;
}
[data-theme="light"] .kc-hist-pick .kc-btn.pri,
[data-theme="light"] .kc-hist-pick .kc-hist-open,
[data-theme="light"] #karte-controller-shell .kc-hist-pick .kc-btn.pri {
  background: #0a5c45;
  border: 2px solid #067a56;
  color: #ffffff;
  font-weight: 800;
}
.kc-hist-pick .kc-hist-secondary-btn,
[data-theme="light"] .kc-hist-pick .kc-hist-secondary-btn {
  background: transparent;
  border: 1px solid #c5ccd6;
  color: #4a5563;
  font-weight: 600;
}
.kc-btn.start { background: var(--kc-blue); border-color: var(--kc-blue); color: #fff; font-weight: 700; }
.kc-btn.rest { background: #fff; border-color: #e2b676; color: var(--kc-amber); font-weight: 700; }
.kc-btn.rest.on { background: var(--kc-amber); border-color: var(--kc-amber); color: #fff; }
.kc-cRow { margin-bottom: 8px; }
.kc-cRow .kc-btn { width: 100%; padding: 14px 10px; font-size: 15px; }
.kc-tools { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 12px; }
.kc-tools .kc-btn {
  padding: 11px 8px;
  font-size: 14px;
  font-weight: 600;
  color: #3d4653;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}
.kc-tools .kc-btn.on { background: #1b2027; border-color: #1b2027; color: #fff; }

.kc-panel {
  border: 1px solid var(--kc-line);
  border-radius: 11px;
  background: #fbfcfe;
  padding: 11px;
  margin: -4px 0 12px;
}
.kc-panel textarea {
  width: 100%;
  min-height: 78px;
  border: 1px solid var(--kc-line);
  border-radius: 9px;
  padding: 9px;
  font: inherit;
  font-size: 14px;
  resize: vertical;
  background: #fff;
}
.kc-panel .kc-prow2 { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 8px; }
.kc-panel .kc-prow2 .kc-btn { padding: 10px; font-size: 13px; font-weight: 700; }
.kc-mic {
  background: #fff;
  border: 1px solid #cbd3de;
  border-radius: 9px;
  padding: 10px 14px;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
}
.kc-mic.rec { background: var(--kc-red); border-color: var(--kc-red); color: #fff; animation: kc-pulse 1s infinite; }
@keyframes kc-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .65; } }

.kc-mlist { margin: 2px 0 4px; }
.kc-mrow {
  border: 1px solid var(--kc-line);
  border-radius: 12px;
  padding: 11px 12px;
  margin-bottom: 14px;
  background: #fff;
}
.kc-mrow.running { border-color: #9db7e8; box-shadow: 0 0 0 3px rgba(31, 95, 208, .09); }
.kc-mrow.resting { border-color: #e2b676; box-shadow: 0 0 0 3px rgba(200, 106, 0, .09); }
.kc-mrow .kc-mtop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.kc-mname {
  background: none;
  border: 0;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  padding: 0;
  text-align: left;
  color: var(--kc-ink);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.kc-mname .kc-chev { color: #9aa3af; font-size: 13px; }
.kc-genre {
  font-size: 11px;
  font-weight: 600;
  color: #7a838f;
  background: #f0f2f6;
  border-radius: 4px;
  padding: 2px 6px;
}
.kc-mstat { font-size: 20px; font-weight: 700; text-align: right; line-height: 1.1; }
.kc-mstat small { display: block; font-size: 10px; font-weight: 600; color: var(--kc-muted); letter-spacing: .06em; }
.kc-mstat.over { color: var(--kc-red); }
.kc-mstat.rest { color: var(--kc-amber); }
.kc-mstat.hands { color: var(--kc-blue); }
.kc-mstat.done { color: var(--kc-ink, #1a1d21); }
.kc-mstat .kc-mprev,
.kc-mstat .kc-mcount {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: var(--kc-muted);
  margin-top: 2px;
  letter-spacing: 0;
}
.kc-arrived .kc-txsum {
  margin-left: 10px;
  color: var(--kc-ink, #1a1d21);
  font-weight: 700;
}
.kc-csum {
  margin-top: 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--kc-muted);
  text-align: center;
}
.kc-mbtns { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; align-items: stretch; }
.kc-mbtns .kc-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.4em;
  padding: 8px 6px;
  font-size: 14px;
  line-height: 1.25;
  white-space: normal;
  text-align: center;
  box-sizing: border-box;
}
.kc-btn-2l {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1.25;
  font-weight: inherit;
}
.kc-btn-2l > span {
  display: block;
  white-space: nowrap;
}
.kc-cRow .kc-btn.start {
  min-height: 3.4em;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: normal;
  text-align: center;
  line-height: 1.25;
}
@media (max-width: 380px) {
  .kc-mbtns .kc-btn,
  .kc-cRow .kc-btn.start { font-size: 13px; padding: 7px 4px; }
}
@media (orientation: landscape) and (max-height: 500px) {
  .kc-mbtns .kc-btn,
  .kc-cRow .kc-btn.start { min-height: 3.1em; font-size: 13px; padding: 6px 4px; }
}

.kc-tset { margin-top: 10px; border-top: 1px dashed var(--kc-line); padding-top: 10px; }
.kc-tset .kc-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.kc-tset .kc-head span { font-size: 12px; color: var(--kc-muted); font-weight: 700; }
.kc-tset input {
  width: 74px;
  border: 1px solid #e2b676;
  border-radius: 9px;
  padding: 8px;
  font: inherit;
  font-size: 19px;
  font-weight: 700;
  text-align: center;
  background: #fff;
  color: var(--kc-amber);
}
.kc-tset .kc-g { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 7px; }
.kc-tset .kc-g .kc-btn {
  padding: 11px 6px;
  font-size: 13.5px;
  font-weight: 700;
  color: #7a5a2a;
  border-color: #ecd9bb;
  background: #fffaf2;
}
.kc-tset .kc-g .kc-btn.clr {
  color: #8b939d;
  background: #fff;
  border-color: var(--kc-line);
  grid-column: 1 / -1;
}
.kc-tset-plan {
  font-size: 13px;
  font-weight: 800;
  color: var(--kc-ink, #1b2027);
  margin: 0 0 8px;
}
.kc-limitalert {
  margin-top: 8px;
  width: 100%;
  border: 1px solid var(--kc-line);
  background: #fff;
  color: var(--kc-ink, #1b2027);
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.kc-limitalert.on {
  border-color: #2a9a8e;
  background: var(--kc-teal-bg, #e8f7f5);
  color: #0d6f74;
}
.kc-limitwarn {
  margin-top: 8px;
  font-size: 12.5px;
  font-weight: 800;
  color: #b45309;
  background: #fff7ed;
  border: 1px solid #fdba74;
  border-radius: 8px;
  padding: 8px 10px;
}

.kc-rec { margin-top: 10px; border-top: 1px dashed var(--kc-line); padding-top: 9px; }
.kc-rec .kc-rh {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 7px;
  flex-wrap: wrap;
}
.kc-rec .kc-rh .kc-ttl {
  background: none;
  border: 0;
  font: inherit;
  font-size: 12px;
  letter-spacing: .05em;
  color: #3d4653;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 5px;
}
.kc-rec .kc-rh .kc-sp { flex: 1; }
.kc-cost {
  font-size: 13px;
  font-weight: 700;
  color: #0d6f74;
  background: var(--kc-teal-bg);
  border: 1px solid #cfe9ea;
  border-radius: 7px;
  padding: 3px 9px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.kc-cost-tog,
.kc-cost .kc-cost-tog,
.kc-l3cost .kc-cost-tog {
  border: 1px solid var(--kc-line, #c9d0da);
  background: #fff;
  color: var(--kc-ink, #1b2027);
  border-radius: 6px;
  padding: 2px 8px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  line-height: 1.4;
  opacity: 1;
}
.kc-cost .kc-eye { display: none; }
.kc-rline {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 8px;
  align-items: baseline;
  padding: 3px 0;
  font-size: 13.5px;
}
.kc-rline .kc-pr {
  font-size: 11px;
  font-weight: 700;
  background: #eaf1ff;
  color: #1f4fa8;
  border-radius: 4px;
  padding: 2px 7px;
  white-space: nowrap;
}
.kc-rline .kc-it { color: #2a3038; }
.kc-rline .kc-amt {
  font-weight: 700;
  color: #0d6f74;
  white-space: nowrap;
}
.kc-rline .kc-cs { font-size: 12px; color: #5f6b78; white-space: nowrap; }
.kc-cost .kc-totamt,
.kc-l3cost .kc-totamt {
  font-weight: 700;
  color: inherit;
}
.kc-cost .kc-cost-sep,
.kc-l3cost .kc-cost-sep {
  opacity: .75;
  font-weight: 600;
}
.kc-rec .kc-none { font-size: 12.5px; color: var(--kc-muted); padding: 3px 0 5px; }

.kc-note {
  font-size: 11.5px;
  color: var(--kc-muted);
  padding: 6px 4px 16px;
  line-height: 1.65;
}
.kc-note b { color: #49525e; }

.kc-file-hidden { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.kc-photo-panel { margin-bottom: 12px; }
.kc-photo-count {
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 8px;
  color: var(--kc-text, #1b2027);
}
.kc-photo-preview {
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--kc-line, #d7dee8);
  background: #111;
  margin-bottom: 8px;
}
.kc-photo-preview img {
  display: block;
  width: 100%;
  max-height: 280px;
  object-fit: contain;
  background: #111;
}
.kc-photo-status {
  font-size: 12px;
  color: var(--kc-muted, #6b7280);
  margin-bottom: 8px;
  line-height: 1.4;
}
.kc-photo-actions { margin-top: 8px; margin-bottom: 6px; }

/* —— Stage 3: layer 2 / accounting wait —— */
.kc-unassigned {
  display: block;
  width: 100%;
  margin: 4px 0 6px;
  padding: 4px 8px;
  border: none;
  background: transparent;
  color: #b45309;
  font-size: 11px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
.kc-linkish {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 4px 0;
  border: none;
  background: transparent;
  color: var(--kc-muted);
  font-size: 12px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}
.kc-acctbox {
  border: 1.5px dashed #c5cad3;
  border-radius: 12px;
  padding: 8px;
  margin: 0 0 10px;
  background: #fafbfd;
}
.kc-acct-div .kc-cnt { margin-left: 6px; font-size: 12px; color: var(--kc-muted); }
.kc-arow.kc-resrow {
  display: flex;
  align-items: stretch;
  gap: 6px;
  margin-bottom: 6px;
  padding: 0;
  border: none;
  background: transparent;
}
.kc-arow.kc-resrow .kc-res-go {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--kc-line);
  border-radius: 10px;
  background: #fff;
  padding: 8px 10px;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.kc-arow.kc-resrow.is-over .kc-res-go {
  border-color: #f0a0a0;
  background: #fff5f5;
}
.kc-arow.kc-resrow .kc-go.kc-arrive-btn {
  flex-shrink: 0;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  border: none;
  border-radius: 10px;
  background: #2e7d32;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  padding: 0 10px;
}
.kc-arow.kc-resrow.is-soon .kc-go.kc-arrive-btn {
  background: #388e3c;
}
.kc-arrived.is-editable {
  width: 100%;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  position: relative;
}
.kc-arrived.is-editable:hover {
  border-color: var(--kc-accent, #5b8def);
}
.kc-arrived-hint {
  display: block;
  font-size: 11px;
  color: var(--kc-muted);
  margin-top: 4px;
  font-weight: 500;
}
.kc-arrived-edit {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal, 10100);
  background: rgba(0,0,0,0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.kc-arrived-edit-card {
  width: min(360px, 100%);
  background: #fff;
  border-radius: 14px;
  padding: 18px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.18);
}
.kc-arrived-edit-title {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 12px;
}
.kc-arrived-time {
  width: 100%;
  box-sizing: border-box;
  font-size: 18px;
  padding: 10px 12px;
  border: 1px solid var(--kc-line, #d0d5dd);
  border-radius: 8px;
  margin-bottom: 10px;
}
.kc-arrived-warn {
  color: #c62828;
  font-size: 13px;
  margin: 0 0 12px;
  line-height: 1.4;
}
.kc-arrived-edit-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.kc-arrived-edit-actions .kc-btn.danger {
  background: #c62828;
  color: #fff;
  border: none;
}
.kc-arow.kc-acct {
  display: flex;
  align-items: stretch;
  gap: 6px;
  margin-bottom: 6px;
}
.kc-arow.kc-acct .kc-acct-go {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--kc-line);
  border-radius: 10px;
  background: #fff;
  padding: 8px 10px;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.kc-arow.kc-acct.is-over .kc-acct-go {
  border-color: #f0a0a0;
  background: #fff5f5;
}
.kc-arow.kc-acct .kc-go.kc-reg {
  flex: 0 0 auto;
  align-self: center;
  border: none;
  border-radius: 9px;
  background: #1b2027;
  color: #fff;
  font-weight: 700;
  padding: 12px 14px;
  cursor: pointer;
}
.kc-donebox {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0 0 10px;
}
.kc-done-div .kc-cnt { margin-left: 6px; font-size: 12px; color: var(--kc-muted); }
.kc-arow.kc-done {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.kc-arow.kc-done .kc-done-go {
  flex: 1;
  display: flex;
  gap: 10px;
  align-items: center;
  text-align: left;
  border: 1px solid var(--kc-line);
  border-radius: 12px;
  background: var(--kc-card);
  padding: 10px 12px;
  cursor: pointer;
  color: inherit;
}
.kc-night-note {
  font-size: 12px;
  color: var(--kc-muted);
  line-height: 1.45;
  margin: 0 0 10px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(31, 95, 208, 0.08);
  border: 1px solid rgba(31, 95, 208, 0.2);
}
.kc-btn.is-locked,
.kc-locked-time .kc-btn {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}
.kc-ended-banner {
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  margin: 18px 0 14px;
}
.kc-l2nav { display: flex; gap: 8px; margin-bottom: 8px; }
.kc-l2nav .kc-btn { flex: 1; padding: 10px; font-size: 13px; font-weight: 700; }
.kc-l2sticky {
  position: sticky;
  top: 0;
  z-index: var(--z-sticky, 100);
  background: var(--kc-bg, #f4f6f9);
  padding: 10px 0 12px;
  border-bottom: 1px solid var(--kc-line);
  margin-bottom: 10px;
}
.kc-l2title { font-size: 17px; font-weight: 800; margin-bottom: 6px; }
.kc-l2live {
  text-align: right;
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 10px;
  line-height: 1.15;
}
.kc-l2live small {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: var(--kc-muted);
  letter-spacing: .06em;
}
.kc-l2row {
  border: 1px solid var(--kc-line);
  border-radius: 12px;
  background: #fff;
  padding: 10px;
  margin-bottom: 8px;
}
.kc-l2row.live { border-color: #9ec0f5; background: #f5f9ff; }
.kc-l2row.focus { box-shadow: 0 0 0 2px #f0a04a; }
.kc-l2r1 {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
}
.kc-l2seq {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #eef1f5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
}
.kc-l2kind { color: var(--kc-muted); font-size: 11px; }
.kc-l2range { flex: 1; }
.kc-l2dur { font-weight: 800; }
.kc-l2x {
  border: none;
  background: transparent;
  color: #a0a8b4;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  padding: 0 4px;
}
.kc-l2plan {
  font-size: 11px;
  color: var(--kc-amber);
  font-weight: 700;
  margin: 4px 0 0 28px;
}
.kc-l2r2 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
}
.kc-stepbtn { flex: 1 1 auto; padding: 8px 10px !important; font-size: 12px !important; }
.kc-stepbtn.warn {
  border-color: #f0c070 !important;
  color: #9a6700 !important;
  background: #fff8eb !important;
}
.kc-l2staff {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: var(--kc-muted);
  font-weight: 700;
}
.kc-l2staff select {
  max-width: 120px;
  padding: 6px;
  border-radius: 8px;
  border: 1px solid var(--kc-line);
  font: inherit;
  font-size: 12px;
  background: #fff;
}
.kc-stepchips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.kc-chip {
  border: 1px solid var(--kc-line);
  background: #f7f8fa;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.kc-chip.on { background: #1b2027; border-color: #1b2027; color: #fff; }




.kc-l3sticky {
  position: sticky;
  top: 0;
  z-index: var(--z-sticky, 100);
  background: var(--kc-bg, #f4f6f9);
  padding: 8px 0 10px;
  border-bottom: 1px solid var(--kc-line);
  margin-bottom: 10px;
}
.kc-partchips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0;
}
.kc-l3cost {
  font-size: 14px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.kc-l3tools {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.kc-l3tools .kc-btn { padding: 10px; font-size: 12px; font-weight: 700; }
.kc-l3mount {
  margin-top: 8px;
}
.kc-l3mount #karte-block-process {
  margin: 0 0 12px !important;
  display: block !important;
}
.kc-l3mount #karte-block-chemicals {
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.kc-l3copy {
  border: 1px dashed var(--kc-line);
  border-radius: 12px;
  padding: 10px;
  margin-bottom: 10px;
  background: #fafbfd;
}
.kc-l3copy-h {
  font-size: 12px;
  font-weight: 800;
  color: var(--kc-muted);
  margin-bottom: 8px;
}
.kc-l3copy-card {
  border: 1px solid var(--kc-line);
  border-radius: 10px;
  padding: 8px;
  margin-bottom: 8px;
  background: #fff;
}
.kc-l3copy-meta {
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 6px;
  color: var(--kc-ink);
}
.kc-l3copy-preview {
  font-size: 12px;
  line-height: 1.45;
  color: var(--kc-muted);
  background: #f4f6f9;
  border: 1px solid var(--kc-line);
  border-radius: 8px;
  padding: 8px 10px;
  margin: 0 0 8px;
  word-break: break-word;
}
.kc-l3copy-card .kc-btn {
  display: inline-block;
  width: auto;
  padding: 7px 10px;
  font-size: 11px;
  font-weight: 700;
  margin: 0 4px 4px 0;
}
.kc-copypart { background: #fff8eb !important; border-color: #e2b676 !important; color: #7a5a2a !important; }

/* ========== Dark mode — full controller contrast pass ==========
   Principle: low-chroma dark surfaces + bright borders + bright text (≥4.5:1).
   Keep meaning colors: START=blue / rest=amber / over=red / wait=teal.
*/
[data-theme="dark"] #karte-controller-shell {
  --kc-bg: #0f1217;
  --kc-card: #1a1f27;
  --kc-line: #5a6578;
  --kc-ink: #f1f4f8;
  --kc-muted: #c2cad6;
  --kc-blue: #5b9aff;
  --kc-amber: #f0b429;
  --kc-amber-ink: #1a1204;
  --kc-red: #ff8a8a;
  --kc-teal: #3ee0c8;
  --kc-red-bg: #3a181c;
  --kc-amber-bg: #3a2a10;
  --kc-teal-bg: #0f2e2c;
  --kc-shadow: none;
  background: var(--kc-bg);
  color: var(--kc-ink);
}

/* Surfaces / panes */
[data-theme="dark"] #karte-controller-shell .kc-pane,
[data-theme="dark"] #karte-controller-shell .kc-prow,
[data-theme="dark"] #karte-controller-shell .kc-mrow,
[data-theme="dark"] #karte-controller-shell .kc-panel,
[data-theme="dark"] #karte-controller-shell .kc-arrived,
[data-theme="dark"] #karte-controller-shell .kc-l2row,
[data-theme="dark"] #karte-controller-shell .kc-l3copy-card {
  background: #232a34;
  color: var(--kc-ink);
  border-color: var(--kc-line);
}
[data-theme="dark"] #karte-controller-shell .kc-pane h2 {
  color: var(--kc-muted);
  border-bottom-color: var(--kc-line);
}
[data-theme="dark"] #karte-controller-shell .kc-pane h2 .kc-cnt {
  background: #2f3846;
  color: var(--kc-ink);
}
[data-theme="dark"] #karte-controller-shell .kc-cust {
  border-bottom-color: var(--kc-line);
}
[data-theme="dark"] #karte-controller-shell .kc-cust .kc-nm { color: var(--kc-ink); }
[data-theme="dark"] #karte-controller-shell .kc-cust .kc-mt,
[data-theme="dark"] #karte-controller-shell .kc-empty,
[data-theme="dark"] #karte-controller-shell .kc-note,
[data-theme="dark"] #karte-controller-shell .kc-linkish,
[data-theme="dark"] #karte-controller-shell .kc-arrived .kc-lab,
[data-theme="dark"] #karte-controller-shell .kc-arrived .kc-el,
[data-theme="dark"] #karte-controller-shell .kc-arrived-hint,
[data-theme="dark"] #karte-controller-shell .kc-csum,
[data-theme="dark"] #karte-controller-shell .kc-prow .kc-t .kc-lbl,
[data-theme="dark"] #karte-controller-shell .kc-mstat small,
[data-theme="dark"] #karte-controller-shell .kc-divider {
  color: var(--kc-muted);
}
[data-theme="dark"] #karte-controller-shell .kc-note b { color: #e8eef6; }
[data-theme="dark"] #karte-controller-shell .kc-divider:before,
[data-theme="dark"] #karte-controller-shell .kc-divider:after {
  background: var(--kc-line);
}

/* Neutral buttons */
[data-theme="dark"] #karte-controller-shell .kc-btn {
  background: #2f3846;
  color: var(--kc-ink);
  border-color: #7a8699;
}
[data-theme="dark"] #karte-controller-shell .kc-btn.pri,
[data-theme="dark"] #karte-controller-shell .kc-btn.start,
[data-theme="dark"] #karte-controller-shell .kc-tools .kc-btn.on {
  background: #3b7dee !important;
  border-color: #7eb0ff !important;
  color: #ffffff !important;
}
[data-theme="dark"] #karte-controller-shell .kc-hist-pick .kc-hist-open,
[data-theme="dark"] #karte-controller-shell .kc-hist-pick .kc-btn.pri.kc-hist-open {
  background: #145c45 !important;
  border: 2px solid #3dd68c !important;
  color: #ffffff !important;
}
[data-theme="dark"] #karte-controller-shell .kc-hist-pick .kc-hist-lead {
  color: #f2f4f7;
}
[data-theme="dark"] #karte-controller-shell .kc-hist-pick .kc-hist-secondary-btn {
  background: transparent !important;
  border-color: #7a8699 !important;
  color: #c5ced9 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-prow.is-current {
  border-color: #3dd68c;
  background: #14352c;
  box-shadow: inset 0 0 0 1px rgba(61, 214, 140, 0.35);
}
[data-theme="dark"] #karte-controller-shell .kc-prow .kc-tag.now {
  background: #145c45;
  color: #fff;
  border-color: #3dd68c;
}
[data-theme="dark"] #karte-controller-shell .kc-btn.start.is-running {
  background: #2a5fbe !important;
  border-color: #8ec0ff !important;
  color: #ffffff !important;
}
[data-theme="dark"] #karte-controller-shell .kc-btn.rest {
  background: #3a2a10 !important;
  border-color: #f0b429 !important;
  color: #ffe08a !important;
}
[data-theme="dark"] #karte-controller-shell .kc-btn.rest.on {
  background: #f0b429 !important;
  border-color: #ffd56a !important;
  color: #1a1204 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-btn.danger {
  background: #c62828 !important;
  border-color: #ff8a8a !important;
  color: #ffffff !important;
}
[data-theme="dark"] #karte-controller-shell .kc-tools .kc-btn {
  color: var(--kc-ink);
}
[data-theme="dark"] #karte-controller-shell .kc-mic.rec {
  background: #c62828 !important;
  border-color: #ff8a8a !important;
  color: #fff !important;
}

/* Top progress rows — keep meaning colors */
[data-theme="dark"] #karte-controller-shell .kc-prow:active { background: #2c3440; }
[data-theme="dark"] #karte-controller-shell .kc-prow .kc-who { color: inherit; }
[data-theme="dark"] #karte-controller-shell .kc-prow.hands .kc-t .kc-big { color: #8ec0ff !important; }
[data-theme="dark"] #karte-controller-shell .kc-prow.over,
[data-theme="dark"] #karte-controller-shell .kc-prow.waitover {
  background: var(--kc-red-bg) !important;
  border-color: #c45a5a !important;
  color: #ffb4b4 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-prow.over .kc-t .kc-big,
[data-theme="dark"] #karte-controller-shell .kc-prow.waitover .kc-t .kc-big {
  color: #ffb4b4 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-prow.soon {
  background: var(--kc-amber-bg) !important;
  border-color: #c9942e !important;
  color: #ffe08a !important;
}
[data-theme="dark"] #karte-controller-shell .kc-prow.soon .kc-t .kc-big {
  color: #ffe08a !important;
}
[data-theme="dark"] #karte-controller-shell .kc-prow.wait {
  background: var(--kc-teal-bg) !important;
  border-color: #2a9a8e !important;
  color: #7aead8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-prow.wait .kc-t .kc-big {
  color: #7aead8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-tag {
  background: #2f3846;
  color: #d7dee8;
}
[data-theme="dark"] #karte-controller-shell .kc-tag.asst {
  background: #1e3a66;
  color: #b3d0ff;
}
[data-theme="dark"] #karte-controller-shell .kc-tag.wt {
  background: #0f3a36;
  color: #7aead8;
}

/* Today's reservations / accounting wait */
[data-theme="dark"] #karte-controller-shell .kc-resbox,
[data-theme="dark"] #karte-controller-shell .kc-acctbox {
  background: #151a21;
  border-color: var(--kc-line);
}
[data-theme="dark"] #karte-controller-shell .kc-reslab.over { color: #ffb4b4; }
[data-theme="dark"] #karte-controller-shell .kc-reslab.soon { color: #ffe08a; }
[data-theme="dark"] #karte-controller-shell .kc-arow,
[data-theme="dark"] #karte-controller-shell .kc-arow.kc-resrow .kc-res-go,
[data-theme="dark"] #karte-controller-shell .kc-arow.kc-acct .kc-acct-go,
[data-theme="dark"] #karte-controller-shell .kc-arow.kc-done .kc-done-go {
  background: #232a34 !important;
  border-color: var(--kc-line) !important;
  color: var(--kc-ink) !important;
}
[data-theme="dark"] #karte-controller-shell .kc-arow .kc-hhmm,
[data-theme="dark"] #karte-controller-shell .kc-arow .kc-nm,
[data-theme="dark"] #karte-controller-shell .kc-arow .kc-menu {
  color: var(--kc-ink) !important;
}
[data-theme="dark"] #karte-controller-shell .kc-arow.is-over,
[data-theme="dark"] #karte-controller-shell .kc-arow.is-over .kc-res-go,
[data-theme="dark"] #karte-controller-shell .kc-arow.kc-acct.is-over .kc-acct-go {
  background: var(--kc-red-bg) !important;
  border-color: #c45a5a !important;
  color: #ffb4b4 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-arow.is-over .kc-hhmm,
[data-theme="dark"] #karte-controller-shell .kc-arow.is-over .kc-nm,
[data-theme="dark"] #karte-controller-shell .kc-arow.is-over .kc-menu {
  color: #ffb4b4 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-arow.is-soon,
[data-theme="dark"] #karte-controller-shell .kc-arow.is-soon .kc-res-go {
  background: var(--kc-amber-bg) !important;
  border-color: #c9942e !important;
  color: #ffe08a !important;
}
[data-theme="dark"] #karte-controller-shell .kc-arow.is-soon .kc-hhmm,
[data-theme="dark"] #karte-controller-shell .kc-arow.is-soon .kc-nm,
[data-theme="dark"] #karte-controller-shell .kc-arow.is-soon .kc-menu {
  color: #ffe08a !important;
}
[data-theme="dark"] #karte-controller-shell .kc-arow .kc-overtag {
  background: #6a2424;
  color: #ffd0d0;
}
[data-theme="dark"] #karte-controller-shell .kc-arow .kc-go,
[data-theme="dark"] #karte-controller-shell .kc-arow.kc-resrow .kc-go.kc-arrive-btn {
  background: #2e7d32 !important;
  color: #ffffff !important;
  border: none !important;
}
[data-theme="dark"] #karte-controller-shell .kc-arow.kc-acct .kc-go.kc-reg {
  background: #3b7dee !important;
  color: #ffffff !important;
}
[data-theme="dark"] #karte-controller-shell .kc-resmore {
  color: var(--kc-muted);
  border-color: var(--kc-line);
  background: #1a1f27;
}

/* Layer 1: arrived / menus / recipe / timer */
[data-theme="dark"] #karte-controller-shell .kc-arrived.is-editable:hover {
  border-color: #7eb0ff;
}
[data-theme="dark"] #karte-controller-shell .kc-arrived .kc-val,
[data-theme="dark"] #karte-controller-shell .kc-arrived .kc-txsum {
  color: var(--kc-ink) !important;
}
[data-theme="dark"] #karte-controller-shell .kc-lastv {
  color: var(--kc-muted);
  border-color: var(--kc-line);
  background: #1a1f27;
}
[data-theme="dark"] #karte-controller-shell .kc-lastv .kc-dd { color: #9ec1ff; }
[data-theme="dark"] #karte-controller-shell .kc-draft {
  background: #3a2a10;
  color: #ffe08a;
  border-color: #c9942e;
}
[data-theme="dark"] #karte-controller-shell .kc-unassigned { color: #ffe08a !important; }
[data-theme="dark"] #karte-controller-shell .kc-mrow.running {
  background: #1a2740 !important;
  border-color: #5b9aff !important;
  box-shadow: 0 0 0 2px rgba(91, 154, 255, .25);
}
[data-theme="dark"] #karte-controller-shell .kc-mrow.resting {
  background: var(--kc-amber-bg) !important;
  border-color: #f0b429 !important;
  box-shadow: 0 0 0 2px rgba(240, 180, 41, .22);
}
[data-theme="dark"] #karte-controller-shell .kc-mname { color: var(--kc-ink); }
[data-theme="dark"] #karte-controller-shell .kc-mname .kc-chev { color: var(--kc-muted); }
[data-theme="dark"] #karte-controller-shell .kc-genre {
  background: #2f3846;
  color: var(--kc-muted);
}
[data-theme="dark"] #karte-controller-shell .kc-mstat.over { color: #ffb4b4 !important; }
[data-theme="dark"] #karte-controller-shell .kc-mstat.rest { color: #ffe08a !important; }
[data-theme="dark"] #karte-controller-shell .kc-mstat.hands { color: #8ec0ff !important; }
[data-theme="dark"] #karte-controller-shell .kc-mstat.done { color: var(--kc-ink) !important; }
[data-theme="dark"] #karte-controller-shell .kc-mstat .kc-mprev,
[data-theme="dark"] #karte-controller-shell .kc-mstat .kc-mcount {
  color: var(--kc-muted);
}
[data-theme="dark"] #karte-controller-shell .kc-panel textarea,
[data-theme="dark"] #karte-controller-shell .kc-tset input,
[data-theme="dark"] #karte-controller-shell .kc-l2staff select,
[data-theme="dark"] #karte-controller-shell .kc-arrived-time {
  background: #12161d !important;
  color: var(--kc-ink) !important;
  border-color: var(--kc-line) !important;
}
[data-theme="dark"] #karte-controller-shell .kc-tset input {
  border-color: #f0b429 !important;
  color: #ffe08a !important;
}
[data-theme="dark"] #karte-controller-shell .kc-tset .kc-head span { color: var(--kc-muted); }
[data-theme="dark"] #karte-controller-shell .kc-tset .kc-g .kc-btn {
  background: #3a2a10 !important;
  border-color: #f0b429 !important;
  color: #ffe08a !important;
}
[data-theme="dark"] #karte-controller-shell .kc-tset .kc-g .kc-btn.clr {
  background: #2f3846 !important;
  border-color: #7a8699 !important;
  color: var(--kc-muted) !important;
}
[data-theme="dark"] #karte-controller-shell .kc-tset-plan {
  color: #f1f4f8;
}
[data-theme="dark"] #karte-controller-shell .kc-limitalert {
  background: #2f3846 !important;
  border-color: #7a8699 !important;
  color: #f1f4f8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-limitalert.on {
  background: #16352f !important;
  border-color: #2a9a8e !important;
  color: #7aead8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-limitwarn {
  background: #3a2a10 !important;
  border-color: #f0b429 !important;
  color: #ffe08a !important;
}
[data-theme="dark"] #karte-controller-shell .kc-rec .kc-rh .kc-ttl {
  color: #e8eef6 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-cost {
  background: var(--kc-teal-bg) !important;
  border-color: #2a9a8e !important;
  color: #7aead8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-cost-tog,
[data-theme="dark"] #karte-controller-shell .kc-l3cost .kc-cost-tog {
  background: #2f3846 !important;
  border-color: #7a8699 !important;
  color: #f1f4f8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l3cost .kc-num {
  color: #7aead8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-rline .kc-pr {
  background: #1e3a66 !important;
  color: #b3d0ff !important;
}
[data-theme="dark"] #karte-controller-shell .kc-rline .kc-it {
  color: #f1f4f8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-rline .kc-amt {
  color: #7aead8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-rline .kc-cs {
  color: #c2cad6 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-rec .kc-none { color: var(--kc-muted); }

/* Layer 2 */
[data-theme="dark"] #karte-controller-shell .kc-l2sticky,
[data-theme="dark"] #karte-controller-shell .kc-l3sticky {
  background: #0f1217;
  border-bottom-color: var(--kc-line);
}
[data-theme="dark"] #karte-controller-shell .kc-l2title,
[data-theme="dark"] #karte-controller-shell .kc-l2live,
[data-theme="dark"] #karte-controller-shell .kc-l2range,
[data-theme="dark"] #karte-controller-shell .kc-l2dur {
  color: var(--kc-ink);
}
[data-theme="dark"] #karte-controller-shell .kc-l2row.live {
  background: #1a2740 !important;
  border-color: #5b9aff !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l2plan { color: #ffe08a; }
[data-theme="dark"] #karte-controller-shell .kc-l2del {
  color: #ffb4b4;
}
[data-theme="dark"] #karte-controller-shell .kc-chip {
  background: #2f3846 !important;
  border-color: #7a8699 !important;
  color: var(--kc-ink) !important;
}
[data-theme="dark"] #karte-controller-shell .kc-chip.on {
  background: #3b7dee !important;
  border-color: #7eb0ff !important;
  color: #ffffff !important;
}
[data-theme="dark"] #karte-controller-shell .kc-stepbtn.warn {
  background: #3a2a10 !important;
  border-color: #f0b429 !important;
  color: #ffe08a !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l2staff { color: var(--kc-muted); }

/* Layer 3 — past recipe cards (critical) */
[data-theme="dark"] #karte-controller-shell .kc-l3copy {
  background: #151a21 !important;
  border-color: var(--kc-line) !important;
  border-style: solid;
}
[data-theme="dark"] #karte-controller-shell .kc-l3copy-h {
  color: #e8eef6 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l3copy-card {
  background: #232a34 !important;
  border-color: #7a8699 !important;
  color: #f1f4f8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l3copy-meta {
  color: #f1f4f8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l3copy-preview {
  color: #c2cad6 !important;
  border-color: #5a6578;
  background: #12161d;
}
[data-theme="dark"] #karte-controller-shell .kc-l3copy-card .kc-btn {
  background: #2f3846 !important;
  border-color: #7a8699 !important;
  color: #f1f4f8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l3copy-card .kc-btn.kc-copypart {
  background: #3a2a10 !important;
  border-color: #f0b429 !important;
  color: #ffe08a !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l3cost {
  color: var(--kc-ink);
}
[data-theme="dark"] #karte-controller-shell .kc-l3cost .kc-num {
  color: #7aead8;
}

/* Chem / process blocks mounted into layer 3 */
[data-theme="dark"] #karte-controller-shell .kc-l3mount #karte-block-process,
[data-theme="dark"] #karte-controller-shell .kc-l3mount #karte-block-process.card,
[data-theme="dark"] #karte-controller-shell .kc-l3mount #karte-block-chemicals,
[data-theme="dark"] #karte-controller-shell .kc-l3mount #karte-block-chemicals.card,
[data-theme="dark"] #karte-controller-shell .kc-l3mount .card {
  background: #232a34 !important;
  color: var(--kc-ink) !important;
  border-color: var(--kc-line) !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l3mount #btn-open-process,
[data-theme="dark"] #karte-controller-shell .kc-l3mount .btn-meta-chip {
  background: #2f3846 !important;
  color: #f1f4f8 !important;
  border-color: #7a8699 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l3mount #process-summary,
[data-theme="dark"] #karte-controller-shell .kc-l3mount .btn-meta-value {
  color: #f1f4f8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l3mount input,
[data-theme="dark"] #karte-controller-shell .kc-l3mount select,
[data-theme="dark"] #karte-controller-shell .kc-l3mount textarea,
[data-theme="dark"] #karte-controller-shell .kc-l3mount button {
  background: #2f3846 !important;
  color: var(--kc-ink) !important;
  border-color: #7a8699 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-l3mount label,
[data-theme="dark"] #karte-controller-shell .kc-l3mount span,
[data-theme="dark"] #karte-controller-shell .kc-l3mount div,
[data-theme="dark"] #karte-controller-shell .kc-l3mount p,
[data-theme="dark"] #karte-controller-shell .kc-l3mount li {
  color: inherit;
}

/* Arrived edit modal (may append under shell) */
[data-theme="dark"] #karte-controller-shell .kc-arrived-edit,
[data-theme="dark"] .kc-arrived-edit {
  background: rgba(0, 0, 0, 0.55);
}
[data-theme="dark"] #karte-controller-shell .kc-arrived-edit-card,
[data-theme="dark"] .kc-arrived-edit-card {
  background: #1e2430 !important;
  color: #f1f4f8 !important;
  border: 1px solid #7a8699;
}
[data-theme="dark"] #karte-controller-shell .kc-arrived-edit-title,
[data-theme="dark"] .kc-arrived-edit-title {
  color: #f1f4f8 !important;
}
[data-theme="dark"] #karte-controller-shell .kc-arrived-warn,
[data-theme="dark"] .kc-arrived-warn {
  color: #ffb4b4 !important;
}

/* Ended banner */
[data-theme="dark"] #karte-controller-shell .kc-ended-banner {
  color: var(--kc-ink);
}
[data-theme="dark"] #karte-controller-shell .kc-night-note {
  background: rgba(76, 163, 255, 0.12);
  border-color: rgba(76, 163, 255, 0.28);
  color: #cfe8ff;
}
[data-theme="dark"] #karte-controller-shell .kc-donebox {
  /* inherits */
}