/* theme.css — GENERADO desde design-lab/temas/kanso/ — NO EDITAR A MANO */
/* Kanso · tokens
   Washi, sumi, beni y aizome. La impresión conserva la receta de 08-print.css. */

@media screen {
  :root[data-ui-theme="kanso"] {
      color-scheme: light;

      /* Tinta y marca */
      --ink: #171916;
      --ink-2: #33372f;
      --brand: #30372f;
      --accent: #982f2b;
      --cyan: #2f6264;
      --magenta: #7e3b51;
      --dot: #b33a32;

      /* Texto secundario opaco: legible también sobre la banda más oscura. */
      --muted: #484b44;
      --muted-2: #50534b;

      /* Papel */
      --bg: #f3efe5;
      --surface: #fdfaf2;
      --surface-2: #e9e3d6;
      --surface-3: #ded8cc;

      /* Filetes de tinta. --line-2 también cumple contraste no textual. */
      --line-soft: #d8d1c4;
      --line: #b9b1a3;
      --line-2: #696a61;
      --line-strong: #4e514a;

      /* Variaciones oscuras del riel; todas admiten la tinta clara local. */
      --tono-marino: #202321;
      --tono-marino-2: #3a403a;
      --tono-grafito: #1e201f;
      --tono-grafito-2: #41423f;
      --tono-petroleo: #1b2d2c;
      --tono-petroleo-2: #37524f;
      --tono-bosque: #202d24;
      --tono-bosque-2: #3d5142;
      --tono-vino: #342123;
      --tono-vino-2: #59383a;
      --tono-cafe: #30251f;
      --tono-cafe-2: #564337;

      /* Semánticos medidos contra bg y las tres superficies. */
      --green: #315f43;
      --green-soft: color-mix(in srgb, #315f43 10%, var(--surface));
      --green-vivo: #346b48;
      --blue: #315b78;
      --blue-soft: color-mix(in srgb, #315b78 10%, var(--surface));
      --amber: #70510d;
      --amber-soft: color-mix(in srgb, #70510d 10%, var(--surface));
      --amber-bright: #c08a24;
      --amber-cta-ink: #1b1305;
      --red: #8d302c;
      --red-soft: color-mix(in srgb, #8d302c 10%, var(--surface));
      --red-deep: #74251f;
      --teal: #2b5d62;
      --teal-soft: color-mix(in srgb, #2b5d62 10%, var(--surface));
      --violet: #604a74;
      --violet-soft: color-mix(in srgb, #604a74 10%, var(--surface));
      --rose: #803c55;
      --rose-soft: color-mix(in srgb, #803c55 10%, var(--surface));

      /* Mincho para voz editorial; Gothic para operación densa. */
      --serif: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho",
               "Noto Serif JP", Georgia, serif;
      --sans: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Yu Gothic",
              "Noto Sans JP", Inter, ui-sans-serif, system-ui, sans-serif;
      --font-display: var(--serif);
      --font-numeric: "Zen Kaku Gothic New", "Inter Tight", Inter,
                      ui-sans-serif, system-ui, sans-serif;

      /* Forma baja y austera. */
      --r-xs: 1px;
      --r-sm: 2px;
      --r: 3px;
      --r-lg: 4px;

      /* Sin elevación ambiental; el foco sigue siendo un indicador nítido. */
      --shadow-xs: none;
      --shadow-sm: none;
      --shadow-md: none;
      --shadow-lg: none;
      --focus: 0 0 0 3px rgba(152, 47, 43, .3);

      /* Gráficos: ejes visibles y doce tintas sin duplicados, medidas sobre papel. */
      --chart-grid: #c8c1b4;
      --chart-axis: #686960;
      --chart-tooltip-bg: #20231f;
      --chart-tooltip-ink: #fdfaf2;
      --chart-label-bg: rgba(253, 250, 242, .96);
      --chart-accent-shadow: rgba(152, 47, 43, .2);
      --chart-accent-area: rgba(152, 47, 43, .08);
      --chart-red-shadow: rgba(141, 48, 44, .22);
      --chart-series-1: #28586f;
      --chart-series-2: #a64235;
      --chart-series-3: #4e704e;
      --chart-series-4: #8b6422;
      --chart-series-5: #62547a;
      --chart-series-6: #387672;
      --chart-series-7: #8d4660;
      --chart-series-8: #1a1d1b;
      --chart-series-9: #70513c;
      --chart-series-10: #59652d;
      --chart-series-11: #364f78;
      --chart-series-12: #3c665f;
      --chart-flat: 1;
      --mente-flat: 1;
      --mente-canvas-top: #f7f3ea;
      --mente-canvas-end: #e4ded1;

      /* Navegación y superficies fijas. */
      --theme-rail-ink: #fdfaf2;
      --theme-rail-soft: #ebe4d8;
      --theme-rail-muted: #d4cdc0;
      --theme-rail-green: #a9c5a7;
      --theme-rail-cyan: #a7c5c5;
      --theme-rail-blue: #abc1d5;
      --theme-rail-red: #e7aaa2;
      --theme-rail-amber: #e1c38c;
      --theme-rail-veil: rgba(253, 250, 242, .04);
      --theme-rail-veil-2: rgba(253, 250, 242, .08);
      --theme-rail-veil-3: rgba(253, 250, 242, .14);
      --theme-rail-line: rgba(253, 250, 242, .16);
      --theme-rail-line-2: rgba(253, 250, 242, .32);
      --theme-backdrop: rgba(23, 25, 22, .72);
      --theme-veil: rgba(23, 25, 22, .28);
      --theme-fixed-dark: #272a26;
      --theme-fixed-dark-ink: #fdfaf2;
      --theme-washi-mark: rgba(48, 55, 47, .035);

      /* Alias que consume la aplicación POS independiente. */
      --paper: var(--bg);
      --green-dark: #272a26;
      --mint: var(--green-soft);
      --scroll-track: #ddd6c9;
      --scroll-thumb: #696a61;
      --shadow: none;

      font-family: var(--sans);
  }
}
/* Kanso · acabado visual
   Sólo piel: tinta, papel, bordes, estados y tipografía. */

@media screen {
  @layer base {
    :root[data-ui-theme="kanso"] body {
      background-color: var(--bg);
      background-image: none;
      color: var(--ink);
      font-family: var(--sans);
    }

    :root[data-ui-theme="kanso"] :is(h1, h2, .ph-title, .modal-panel h2, .section-head h2) {
      color: var(--ink);
      font-family: var(--font-display);
      font-weight: 550;
      letter-spacing: .015em;
    }

    :root[data-ui-theme="kanso"] :is(h3, h4, button, input, select, textarea) {
      font-family: var(--sans);
    }

    :root[data-ui-theme="kanso"] :is(input, select, textarea) {
      background-color: var(--surface);
      border-color: var(--line-2);
      border-radius: var(--r-sm);
      box-shadow: none;
      caret-color: var(--accent);
    }

    :root[data-ui-theme="kanso"] :is(
      input:not([type="checkbox"]):not([type="radio"]),
      select,
      textarea
    ):not(:disabled):not(:focus) {
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(input, select, textarea):focus {
      background-color: var(--surface);
      border-color: var(--accent);
      box-shadow: var(--focus);
    }

    :root[data-ui-theme="kanso"] :is(input, select, textarea):disabled,
    :root[data-ui-theme="kanso"] input[readonly] {
      background-color: var(--surface-2);
      color: var(--muted);
    }

    :root[data-ui-theme="kanso"] select {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='%2350534b' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
      background-position: right 10px center;
      background-repeat: no-repeat;
      background-size: 13px 13px;
    }

    :root[data-ui-theme="kanso"] th {
      background: var(--surface-2);
      background-image: none;
      border-bottom-color: var(--line-2);
      color: var(--muted);
      font-family: var(--sans);
      letter-spacing: .09em;
    }

    :root[data-ui-theme="kanso"] tbody tr:hover td {
      background: color-mix(in srgb, var(--accent) 4%, var(--surface));
    }

    :root[data-ui-theme="kanso"] ::selection {
      background: var(--accent);
      color: var(--surface);
    }
  }

  @layer layout {
    :root[data-ui-theme="kanso"] :is(.sidebar, .topbar, .tb-panel) {
      --rail-ink: var(--theme-rail-ink);
      --rail-soft: var(--theme-rail-soft);
      --rail-muted: var(--theme-rail-muted);
      --rail-veil: var(--theme-rail-veil);
      --rail-veil-2: var(--theme-rail-veil-2);
      --rail-veil-3: var(--theme-rail-veil-3);
      --rail-line: var(--theme-rail-line);
      --rail-line-2: var(--theme-rail-line-2);
    }

    :root[data-ui-theme="kanso"] .sidebar {
      background: var(--nav);
      background-image: none;
      border-right-color: var(--rail-line-2);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(.brand-mark, .brand-mark img) {
      filter: none;
    }

    :root[data-ui-theme="kanso"] :is(.nav-group-toggle, .nav-item, .nav-search input) {
      border-radius: var(--r-sm);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .nav-group-toggle:hover,
    :root[data-ui-theme="kanso"] .nav-item:hover {
      background: var(--rail-veil-2);
      border-color: var(--rail-line-2);
      color: var(--rail-ink);
    }

    :root[data-ui-theme="kanso"] .nav-item.active {
      background: var(--surface);
      border-color: var(--accent);
      color: var(--ink);
      box-shadow: inset 3px 0 0 var(--accent);
    }

    :root[data-ui-theme="kanso"] :is(.sidebar, .topbar, .tb-panel)
      :is(button, a[href], [role="button"]):focus-visible {
      outline: 2px solid var(--theme-rail-ink);
      outline-offset: 2px;
    }

    :root[data-ui-theme="kanso"] :is(.sidebar, .topbar) .nav-search input:focus-visible {
      background: var(--rail-veil-3);
      border-color: var(--theme-rail-ink);
      box-shadow: inset 0 0 0 1px var(--theme-rail-ink);
    }

    :root[data-ui-theme="kanso"] .sidebar-foot {
      background: var(--rail-veil);
      background-image: none;
      border-color: var(--rail-line-2);
      border-radius: var(--r-sm);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(.connection-progress, .tb-progreso) {
      background: var(--rail-veil-3);
      border-radius: 0;
    }

    :root[data-ui-theme="kanso"] .connection-progress span,
    :root[data-ui-theme="kanso"] .topbar .tb-progreso > i {
      background: var(--theme-rail-green);
      background-image: none;
      border-radius: 0;
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .status-dot {
      background: var(--theme-rail-amber);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .status-dot.ok {
      background: var(--theme-rail-green);
      box-shadow: 0 0 0 2px var(--nav);
    }

    :root[data-ui-theme="kanso"] .status-dot.bad {
      background: var(--theme-rail-red);
    }

    :root[data-ui-theme="kanso"] .connection-task-pulse {
      background: var(--theme-rail-cyan);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .connection-task--done .connection-task-pulse {
      background: var(--theme-rail-green);
      animation: none;
    }

    :root[data-ui-theme="kanso"] .sidebar .connection-task time {
      background: var(--rail-veil-3);
      border-color: var(--rail-line-2);
      border-radius: var(--r-xs);
      color: var(--rail-ink);
    }

    :root[data-ui-theme="kanso"] .topbar .connection-task-panel .connection-task time {
      background: var(--red-soft);
      border-color: var(--accent);
      color: var(--accent);
    }

    :root[data-ui-theme="kanso"] :is(.user-identity, .sidebar-settings-button, .sidebar-foot-actions .table-action) {
      border-radius: var(--r-sm);
      box-shadow: none;
    }
  }

  @layer componentes {
    :root[data-ui-theme="kanso"] :is(.topbar, .tb-panel) {
      background: var(--nav);
      background-image: none;
      border-color: var(--rail-line-2);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .tb-progreso > i {
      background: var(--theme-rail-green);
      background-image: none;
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(.check-line--switch, .ui-switch, .permission-check) input,
    :root[data-ui-theme="kanso"] .daily-chat-dock-toggle small i {
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(.topbar > .nav-search input, .topbar .connection-state, .topbar .user-identity) {
      border-radius: var(--r-sm);
    }

    :root[data-ui-theme="kanso"] .tb-panel {
      animation: none;
      border-radius: 0 0 var(--r-lg) var(--r-lg);
    }

    :root[data-ui-theme="kanso"] .ph-toolbox,
    :root[data-ui-theme="kanso"][data-fuego="1"] .ph-toolbox {
      background: var(--surface);
      background-image: none;
      border-color: var(--line-2);
      border-radius: var(--r);
      box-shadow: none;
      -webkit-backdrop-filter: none;
      backdrop-filter: none;
    }

    :root[data-ui-theme="kanso"] .ph-toolbox > * + * {
      border-left-color: var(--line);
    }

    :root[data-ui-theme="kanso"] .ph-toolbox > .filtros-btn {
      background: transparent;
      border-radius: 0 var(--r) var(--r) 0;
    }

    :root[data-ui-theme="kanso"] .ph-toolbox > .filtros-btn:hover:not(:disabled),
    :root[data-ui-theme="kanso"] .ph-toolbox :is(.icon-button, .date-range-trigger):hover {
      background: var(--surface-2);
    }

    :root[data-ui-theme="kanso"] .ph-title {
      color: var(--ink);
      font-family: var(--font-display);
      font-weight: 550;
    }

    :root[data-ui-theme="kanso"] :is(.fuego-lienzo, .fuego-chispas) {
      filter: none;
      opacity: 0;
    }

    :root[data-ui-theme="kanso"][data-fuego="1"] .topbar
      :is(.tb-cat, .brandmark, .user-identity, .marca b) {
      text-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(
      .table-section,
      .overview-panel,
      .overview-command-bar,
      .report-panel,
      .finance-overview-panel,
      .tool-panel,
      .accounting-panel,
      .report-board-head,
      .financial-entry-card,
      .chart-account-group,
      .flow-spotlight,
      .view-launch-tile,
      .daily-chat-dock
    ) {
      background: var(--surface);
      background-image: none;
      border-color: var(--line);
      border-radius: var(--r);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(.section-head, .report-board-head, .overview-command-bar) {
      border-color: var(--line);
    }

    :root[data-ui-theme="kanso"] :is(
      .primary-action,
      .secondary-action,
      .icon-button,
      .table-action,
      .mini-action,
      .dashboard-inline-plus,
      .date-range-trigger,
      .filtros-btn
    ) {
      background-image: none;
      border-radius: var(--r-sm);
      box-shadow: none;
      transform: none;
    }

    :root[data-ui-theme="kanso"] :is(
      .primary-action,
      .secondary-action,
      .icon-button,
      .table-action,
      .mini-action
    ):hover:not(:disabled),
    :root[data-ui-theme="kanso"] :is(
      .primary-action,
      .secondary-action,
      .icon-button,
      .table-action,
      .mini-action
    ):active:not(:disabled) {
      box-shadow: none;
      transform: none;
    }

    :root[data-ui-theme="kanso"] .primary-action:not(.danger):not(.primary-action--cta):not(.success) {
      background: var(--brand);
      border-color: var(--brand);
      color: var(--surface);
    }

    :root[data-ui-theme="kanso"] .primary-action:not(.danger):not(.primary-action--cta):not(.success):hover:not(:disabled) {
      background: var(--accent);
      border-color: var(--accent);
      color: var(--surface);
    }

    :root[data-ui-theme="kanso"] :is(.secondary-action, .icon-button, .table-action, .mini-action) {
      background: var(--surface);
      border-color: var(--line-2);
      color: var(--ink);
    }

    :root[data-ui-theme="kanso"] :is(.secondary-action, .icon-button, .table-action, .mini-action):hover:not(:disabled) {
      background: var(--surface-2);
      border-color: var(--ink);
      color: var(--ink);
    }

    :root[data-ui-theme="kanso"] .widget-pin {
      border-radius: var(--r-sm);
      box-shadow: none;
      transform: none;
    }

    :root[data-ui-theme="kanso"] .widget-pin:hover,
    :root[data-ui-theme="kanso"] .widget-pin:focus-visible {
      box-shadow: none;
      transform: none;
    }

    :root[data-ui-theme="kanso"] :is(.primary-action.danger, .btn-danger) {
      background: var(--red-deep);
      border-color: var(--red-deep);
      color: var(--surface);
    }

    :root[data-ui-theme="kanso"] :is(.primary-action.success, .orders-whatsapp-action) {
      background: var(--green);
      border-color: var(--green);
      color: var(--surface);
    }

    :root[data-ui-theme="kanso"] :is(
      .segmented-control,
      .hr-tabs,
      .report-chart-tabs,
      .coffee-event-product-modes,
      .coffee-quote-add-modes,
      .owner-account-filters
    ) {
      background: var(--surface-2);
      background-image: none;
      border-color: var(--line);
      border-radius: var(--r-sm);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(
      .segmented-control,
      .hr-tabs,
      .report-chart-tabs,
      .coffee-event-product-modes,
      .coffee-quote-add-modes
    ) button {
      border-radius: var(--r-xs);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(
      .segmented-control,
      .hr-tabs,
      .report-chart-tabs,
      .coffee-event-product-modes,
      .coffee-quote-add-modes
    ) button.active {
      background: var(--ink);
      color: var(--surface);
      animation: none;
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .owner-account-filters button {
      border-radius: var(--r-xs);
    }

    :root[data-ui-theme="kanso"] .owner-account-filters button.active {
      background: var(--ink);
      border-color: var(--ink);
      color: var(--surface);
    }

    :root[data-ui-theme="kanso"] :is(.modal-backdrop, .app-dialog-backdrop) {
      background: var(--theme-backdrop);
      -webkit-backdrop-filter: none;
      backdrop-filter: none;
    }

    :root[data-ui-theme="kanso"] :is(.modal-backdrop, .app-dialog-backdrop):not([hidden]),
    :root[data-ui-theme="kanso"] :is(.modal-backdrop, .app-dialog-backdrop):not([hidden]) .modal-panel {
      animation: none;
    }

    :root[data-ui-theme="kanso"] :is(
      .modal-panel,
      .popover-panel,
      .notif-panel,
      .filtros-drawer,
      .daily-chat-reference-picker,
      .daily-chat-attach-menu
    ) {
      background: var(--surface);
      background-image: none;
      border-color: var(--line-2);
      border-radius: var(--r-lg);
      box-shadow: none;
      -webkit-backdrop-filter: none;
      backdrop-filter: none;
    }

    :root[data-ui-theme="kanso"] :is(.filtros-velo, .tb-velo) {
      background: var(--theme-veil);
    }

    :root[data-ui-theme="kanso"] .filtros-nube {
      opacity: 1;
      transform: none;
    }

    :root[data-ui-theme="kanso"] :is(.toast, .debug-box) {
      background: var(--theme-fixed-dark);
      border-color: var(--line-2);
      border-radius: var(--r-sm);
      box-shadow: none;
      color: var(--theme-fixed-dark-ink);
    }

    :root[data-ui-theme="kanso"] .toast.error {
      background: var(--red-deep);
    }

    :root[data-ui-theme="kanso"] :is(.notif-item:hover, .notif-item.is-unread) {
      background: var(--surface-2);
    }

    :root[data-ui-theme="kanso"] :is(
      .overview-kpi,
      .book-summary > article,
      .sales-summary > article,
      .report-kpi-strip > article,
      .hr-kpis > article,
      .hr-pending-kpis > article,
      .hr-third-party-kpis > article,
      .hr-vacation-kpis > article
    ) {
      background: var(--surface);
      background-image: none;
      border-color: var(--line);
      border-radius: var(--r);
      box-shadow: none;
      transform: none;
    }

    :root[data-ui-theme="kanso"] :is(
      .overview-kpi,
      .book-summary > article,
      .sales-summary > article,
      .report-kpi-strip > article,
      .hr-kpis > article,
      .hr-pending-kpis > article,
      .hr-third-party-kpis > article,
      .hr-vacation-kpis > article
    ):hover {
      border-color: var(--line-2);
      box-shadow: none;
      transform: none;
    }

    :root[data-ui-theme="kanso"] :is(
      .overview-kpi,
      .book-summary > article,
      .sales-summary > article,
      .report-kpi-strip > article
    )::after {
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .daily-chat-dock-toggle {
      background: var(--theme-fixed-dark);
      background-image: none;
      color: var(--theme-fixed-dark-ink);
    }

    :root[data-ui-theme="kanso"] .daily-chat-dock-toggle small {
      color: var(--theme-rail-soft);
    }

    :root[data-ui-theme="kanso"] .daily-chat-dock.has-unread .daily-chat-dock-toggle {
      background: var(--red-deep);
      border-left: 4px solid var(--theme-rail-red);
    }

    :root[data-ui-theme="kanso"] .daily-chat-dock.has-new-message .daily-chat-dock-toggle {
      animation: none;
      box-shadow: inset 4px 0 0 var(--theme-rail-red);
    }

    :root[data-ui-theme="kanso"] .daily-chat-dock.is-drop-ready .daily-chat-dock-toggle {
      box-shadow: inset 0 0 0 2px var(--theme-rail-green);
    }

    :root[data-ui-theme="kanso"] .daily-chat-dock.is-drop-target .daily-chat-dock-toggle {
      background: var(--green);
      box-shadow: inset 0 0 0 3px var(--surface);
    }

    :root[data-ui-theme="kanso"] :is(.daily-chat-message, .daily-chat-message-attachment, .daily-chat-composer-actions) {
      border-radius: var(--r-sm);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .daily-chat-message.is-own {
      background: var(--red-soft);
      border-right: 3px solid var(--accent);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .daily-chat-file-preview iframe {
      background: var(--surface);
    }

    :root[data-ui-theme="kanso"] .app-loader {
      --loader-ink: var(--theme-rail-ink);
      --loader-ink-muted: var(--theme-rail-muted);
      --loader-track: var(--theme-rail-veil-3);
    }

    :root[data-ui-theme="kanso"] .app-loader.loading .loader-progress span::after {
      background: transparent;
      animation: none;
    }

  }

  @layer vistas {
    :root[data-ui-theme="kanso"] :is(.ios-list, .settings-subfamily-check) {
      background: var(--surface);
      background-image: none;
      border-color: var(--line);
      border-radius: var(--r);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .ios-row + .ios-row {
      border-color: var(--line);
    }

    :root[data-ui-theme="kanso"] .ios-row--nav:hover {
      background: var(--surface-2);
    }

    :root[data-ui-theme="kanso"] .tono-muestra {
      background-image: none;
      border-radius: var(--r-xs);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .tono-muestra[data-tono="marino"] { background: var(--tono-marino); }
    :root[data-ui-theme="kanso"] .tono-muestra[data-tono="grafito"] { background: var(--tono-grafito); }
    :root[data-ui-theme="kanso"] .tono-muestra[data-tono="petroleo"] { background: var(--tono-petroleo); }
    :root[data-ui-theme="kanso"] .tono-muestra[data-tono="bosque"] { background: var(--tono-bosque); }
    :root[data-ui-theme="kanso"] .tono-muestra[data-tono="vino"] { background: var(--tono-vino); }
    :root[data-ui-theme="kanso"] .tono-muestra[data-tono="cafe"] { background: var(--tono-cafe); }

    :root[data-ui-theme="kanso"] .tono-muestra[aria-checked="true"] {
      box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--accent);
    }

    :root[data-ui-theme="kanso"] :is(
      .view-launch-tile.is-primary,
      .view-launch-tile.is-alert,
      .event-launch-card--primary,
      .inventory-launch-card--primary,
      .financial-close-status-card,
      .accounting-export-card,
      .daily-pulse-panel,
      .coffee-company-card--ok,
      .coffee-company-card--watch,
      .coffee-company-card--stale,
      .hr-period-status.is-warning,
      .hr-period-status.is-ready,
      .hr-source-workflow.is-caja,
      .hr-certificate-preview,
      .hr-sim-highlight,
      .hr-sim-bar i,
      .hr-sim-bar i.is-negative
    ) {
      background-image: none;
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(.view-launch-tile, .event-launch-card, .inventory-launch-card):hover {
      box-shadow: none;
      transform: none;
    }

    :root[data-ui-theme="kanso"] .view-launch-tile.is-primary,
    :root[data-ui-theme="kanso"] .inventory-launch-card--primary {
      background: var(--green-soft);
      border-color: var(--green);
    }

    :root[data-ui-theme="kanso"] .view-launch-tile.is-alert,
    :root[data-ui-theme="kanso"] .event-launch-card--primary {
      background: var(--amber-soft);
      border-color: var(--amber);
    }

    :root[data-ui-theme="kanso"] .coffee-company-card--ok {
      background: var(--green-soft);
      border-color: var(--green);
    }

    :root[data-ui-theme="kanso"] .coffee-company-card--watch {
      background: var(--amber-soft);
      border-color: var(--amber);
    }

    :root[data-ui-theme="kanso"] .coffee-company-card--stale {
      background: var(--red-soft);
      border-color: var(--red);
    }

    :root[data-ui-theme="kanso"] .daily-progress-ring {
      background: var(--surface);
      background-image: none;
      border: 3px solid var(--green);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .hr-sim-bar i {
      background: var(--accent);
    }

    :root[data-ui-theme="kanso"] .hr-sim-bar i.is-negative {
      background: var(--red);
    }

    :root[data-ui-theme="kanso"] :is(
      .hr-hero,
      .hr-period-card,
      .hr-delivery-section,
      .hr-source-workflow,
      .hr-third-party-ledger,
      .hr-settings-card,
      .hr-legal-card,
      .hr-sim-form-panel,
      .hr-sim-result,
      .hr-sim-compare-card
    ) {
      background-color: var(--surface);
      background-image: none;
      border-color: var(--line);
      border-radius: var(--r);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(
      .import-step,
      .import-dropzone,
      .bank-summary-card,
      .bank-source-card,
      .bank-movement-card,
      .users-card,
      .promo-map,
      .promo-map-stage,
      .promo-map-card,
      .promo-rec-card,
      .promotion-results,
      .catalog-group,
      .coffee-dashboard-section,
      .recipe-workspace,
      .recipe-summary-card
    ) {
      background-image: none;
      border-radius: var(--r);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] :is(.users-card, .promo-rec-card):hover {
      box-shadow: none;
      transform: none;
    }

    :root[data-ui-theme="kanso"] :is(.promo-map-lenses, .promo-map-flag, .mente-tag) {
      border-radius: var(--r-xs);
    }

    :root[data-ui-theme="kanso"] :is(.mente-stage, .mente-card, .mente-drawer, .mente-sec, .mente-hooppanel) {
      background-color: var(--surface);
      background-image: none;
      border-color: var(--line-2);
      border-radius: var(--r);
      box-shadow: none;
      -webkit-backdrop-filter: none;
      backdrop-filter: none;
    }

    :root[data-ui-theme="kanso"] .mente-stage {
      background: var(--mente-canvas-top);
    }

    :root[data-ui-theme="kanso"] :is(.mente-btn, .mente-stepwrap, .mente-drop, .mente-addrow button) {
      border-radius: var(--r-sm);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .mente-ctrl input[type="date"] {
      color-scheme: light;
    }

    :root[data-ui-theme="kanso"] .mente-av {
      color: var(--theme-fixed-dark-ink);
    }

    :root[data-ui-theme="kanso"] #view-catalog :is(
      .catalog-rail,
      .catalog-board,
      .catalog-publish-card,
      .catalog-fudo-hover-card,
      .catalog-help-card
    ) {
      background-image: none;
      border-color: var(--line);
      border-radius: var(--r);
      box-shadow: none;
      -webkit-backdrop-filter: none;
      backdrop-filter: none;
    }

    :root[data-ui-theme="kanso"] #view-catalog :is(
      .catalog-rail-item[aria-pressed="true"],
      .catalog-board-tools [aria-pressed="true"],
      .catalog-board-bar,
      .catalog-publish-card
    ) {
      background: var(--theme-fixed-dark);
      background-image: none;
      border-color: var(--theme-fixed-dark);
      color: var(--theme-fixed-dark-ink);
    }

    :root[data-ui-theme="kanso"] #view-catalog .catalog-publish-card small {
      color: var(--theme-rail-soft);
    }
  }

  @layer utilidades {
    :root[data-ui-theme="kanso"] .tb-panel .nav-item {
      border-radius: var(--r-xs);
    }

    :root[data-ui-theme="kanso"] .tb-panel .nav-item.active {
      background: var(--surface);
      border-color: var(--accent);
      color: var(--ink);
      box-shadow: inset 3px 0 0 var(--accent);
    }

    :root[data-ui-theme="kanso"] .filtros-cuerpo :is(select, input, .date-range-trigger) {
      background: var(--surface);
      border-color: var(--line-2);
      border-radius: var(--r-sm);
      box-shadow: none;
    }

    :root[data-ui-theme="kanso"] .filtros-cuerpo :is(select, input):focus {
      background: var(--surface);
      border-color: var(--accent);
      box-shadow: var(--focus);
    }

    :root[data-ui-theme="kanso"] .filtros-cuerpo .segmented-control,
    :root[data-ui-theme="kanso"] .filtros-cuerpo .segmented-control button,
    :root[data-ui-theme="kanso"] .filtros-cuerpo > details > summary {
      border-radius: var(--r-xs);
      box-shadow: none;
    }
  }

  /* POS: se deja fuera de las capas porque tables.css es una hoja sin capa. */
  :root[data-ui-theme="kanso"] body {
    background: var(--paper);
    background-image: none;
    color: var(--ink);
    font-family: var(--sans);
  }

  :root[data-ui-theme="kanso"] :is(.pos-gate, .room-stage-wrap, .analytics-workspace, .fiscal-workspace) {
    background-color: var(--paper);
    background-image: none;
  }

  :root[data-ui-theme="kanso"] .pos-topbar {
    background: var(--green-dark);
    background-image: none;
    border-bottom: 1px solid var(--theme-rail-line-2);
    box-shadow: none;
    color: var(--theme-rail-ink);
  }

  :root[data-ui-theme="kanso"] .pos-brand img {
    filter: none;
    opacity: 1;
  }

  :root[data-ui-theme="kanso"] .pos-brand span {
    color: var(--theme-rail-muted);
    font-family: var(--sans);
    letter-spacing: .14em;
  }

  :root[data-ui-theme="kanso"] .pos-brand strong,
  :root[data-ui-theme="kanso"] :is(.analytics-head, .fiscal-head, .dialog-head, .open-panel-head) h1,
  :root[data-ui-theme="kanso"] :is(.analytics-head, .fiscal-head, .dialog-head, .open-panel-head) h2 {
    font-family: var(--font-display);
    font-weight: 550;
    letter-spacing: .02em;
  }

  :root[data-ui-theme="kanso"] :is(.module-tabs, .module-tab, .room-tab, .queue-pill, .icon-action, .exit-action) {
    border-color: var(--theme-rail-line-2);
    border-radius: var(--r-sm);
    box-shadow: none;
  }

  :root[data-ui-theme="kanso"] :is(.module-tab, .room-tab, .queue-pill, .icon-action, .exit-action) {
    background: var(--theme-rail-veil-2);
    color: var(--theme-rail-soft);
  }

  :root[data-ui-theme="kanso"] :is(.module-tab, .room-tab).is-active {
    background: var(--surface);
    border-color: var(--surface);
    color: var(--green-dark);
    box-shadow: inset 0 -3px 0 var(--accent);
  }

  :root[data-ui-theme="kanso"] :is(.module-tab, .room-tab, .icon-action, .exit-action):focus-visible {
    outline: 2px solid var(--theme-rail-ink);
    outline-offset: 2px;
  }

  :root[data-ui-theme="kanso"] .queue-pill.has-queue {
    background: var(--theme-rail-amber);
    color: var(--green-dark);
  }

  :root[data-ui-theme="kanso"] .room-stage {
    background: var(--surface-2);
    background-image: none;
    border-color: var(--line);
    border-radius: var(--r);
    box-shadow: none;
  }

  :root[data-ui-theme="kanso"] .table-card {
    background: var(--surface);
    background-image: none;
    border-color: var(--line-2);
    border-radius: var(--r);
    box-shadow: none;
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] .table-card:hover,
  :root[data-ui-theme="kanso"] .table-card:focus-visible {
    border-color: var(--accent);
    box-shadow: inset 3px 0 0 var(--accent);
    outline: 2px solid var(--accent);
    outline-offset: 1px;
    transform: none;
  }

  :root[data-ui-theme="kanso"] .layout-mode .table-card {
    background: var(--surface);
    border-color: var(--line-2);
    box-shadow: none;
  }

  :root[data-ui-theme="kanso"] .table-card.is-selected {
    border-color: var(--ink);
    box-shadow: none;
    outline: 4px solid var(--accent);
    outline-offset: 2px;
  }

  :root[data-ui-theme="kanso"] .table-card.is-occupied {
    background: var(--red-deep);
    border-color: var(--red-deep);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] .table-card.is-prebill {
    background: var(--blue);
    border-color: var(--blue);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] .table-card.is-partial {
    background: var(--rose);
    border-color: var(--rose);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] .layout-mode .table-card:is(.is-occupied, .is-prebill, .is-partial) {
    background: var(--red-soft);
    border-color: var(--red);
    color: var(--red-deep);
  }

  :root[data-ui-theme="kanso"] .table-card.shape-round {
    border-radius: 50%;
  }

  :root[data-ui-theme="kanso"] .table-card.shape-bar {
    border-radius: var(--r-sm);
  }

  :root[data-ui-theme="kanso"] :is(.table-status, .analytics-status, .analytics-origin, .meeting-room-badge) {
    border-radius: var(--r-xs);
  }

  :root[data-ui-theme="kanso"] .table-status {
    background: var(--green-soft);
    color: var(--green);
  }

  :root[data-ui-theme="kanso"] .is-occupied .table-status {
    background: var(--surface);
    color: var(--red-deep);
  }

  :root[data-ui-theme="kanso"] .is-prebill .table-status {
    background: var(--surface);
    color: var(--blue);
  }

  :root[data-ui-theme="kanso"] .is-partial .table-status {
    background: var(--surface);
    color: var(--rose);
  }

  :root[data-ui-theme="kanso"] :is(
    .sale-panel,
    .layout-editor-panel,
    .layout-toolbar,
    .sale-opening,
    .open-panel-head,
    .open-panel-actions,
    .sale-work-head,
    .catalog-section,
    .product-dropdown,
    .sale-footer,
    .analytics-filters,
    .analytics-kpi,
    .analytics-table-panel,
    .fiscal-row
  ) {
    background-color: var(--surface);
    background-image: none;
    border-color: var(--line);
    box-shadow: none;
  }

  :root[data-ui-theme="kanso"] :is(.sale-panel, .layout-editor-panel) {
    border-left-color: var(--line-2);
  }

  :root[data-ui-theme="kanso"] :is(
    .layout-toolbar-actions button,
    .layout-presets button,
    .layout-align-grid button,
    .open-panel-head > button,
    .sale-overview-row > .icon-action,
    .sale-manage-trigger,
    .check-tab,
    .category-strip button,
    .product-card,
    .sale-secondary-actions button,
    .fiscal-actions button
  ) {
    background: var(--surface);
    border-color: var(--line-2);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] :is(
    .layout-toolbar-actions button,
    .layout-presets button,
    .layout-align-grid button,
    .sale-overview-row > .icon-action,
    .sale-manage-trigger,
    .check-tab,
    .category-strip button,
    .product-card,
    .sale-secondary-actions button,
    .fiscal-actions button
  ):hover {
    background: var(--surface-2);
    border-color: var(--accent);
  }

  :root[data-ui-theme="kanso"] :is(.check-tab, .category-strip button).is-active {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] .check-tabs {
    background: var(--surface-2);
    border-color: var(--line);
  }

  :root[data-ui-theme="kanso"] .sale-manage-trigger.has-pending,
  :root[data-ui-theme="kanso"] .sale-item.is-pending {
    background: var(--amber-soft);
    border-color: var(--amber);
  }

  :root[data-ui-theme="kanso"] .sale-item.is-room-charge {
    background: var(--blue-soft);
    border-color: var(--blue);
  }

  :root[data-ui-theme="kanso"] :is(.sale-item, .item-stepper, .item-note-trigger, .room-payment-choices button) {
    background: var(--surface);
    border-color: var(--line);
    border-radius: var(--r-sm);
    box-shadow: none;
  }

  :root[data-ui-theme="kanso"] .item-stepper button {
    background: var(--surface-2);
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] .item-stepper button:hover,
  :root[data-ui-theme="kanso"] .item-stepper button:focus-visible {
    background: var(--ink);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] .sale-quick-action {
    background-image: none;
    border: 1px solid transparent;
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] .sale-quick-action.is-command { background: var(--amber); }
  :root[data-ui-theme="kanso"] .sale-quick-action.is-payment { background: var(--green); }
  :root[data-ui-theme="kanso"] .sale-quick-action.is-prebill { background: var(--blue); }
  :root[data-ui-theme="kanso"] .sale-quick-action:is(.is-close, .is-reversing) { background: var(--red-deep); }

  :root[data-ui-theme="kanso"] .sale-quick-action:hover,
  :root[data-ui-theme="kanso"] .sale-quick-action:focus-visible {
    filter: none;
    outline: 3px solid var(--ink);
    outline-offset: -3px;
  }

  :root[data-ui-theme="kanso"] :is(.btn, .btn-primary, .btn-ghost, .management-close-action) {
    background-image: none;
    border-radius: var(--r-sm);
    box-shadow: none;
  }

  :root[data-ui-theme="kanso"] :is(.btn-primary, .btn-open) {
    background: var(--brand);
    border-color: var(--brand);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] :is(.btn-primary, .btn-open):hover {
    background: var(--accent);
    border-color: var(--accent);
  }

  :root[data-ui-theme="kanso"] :is(.btn-close, .management-close-action, .btn-primary.is-danger) {
    background: var(--red-deep);
    border-color: var(--red-deep);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] .btn-ghost {
    background: var(--surface);
    border-color: var(--line-2);
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] :is(.analytics-filters, .pos-dialog) :is(input, select, textarea),
  :root[data-ui-theme="kanso"] :is(.open-panel-form, .layout-inspector-form) :is(input, select, textarea) {
    background: var(--surface);
    border-color: var(--line-2);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] :is(.analytics-filters, .pos-dialog, .open-panel-form, .layout-inspector-form)
    :is(input, select, textarea):focus {
    border-color: var(--accent);
    box-shadow: var(--focus);
    outline: none;
  }

  :root[data-ui-theme="kanso"] .analytics-kpi.is-accent { border-top-color: var(--green); }
  :root[data-ui-theme="kanso"] .analytics-kpi.is-paying { border-top-color: var(--blue); }
  :root[data-ui-theme="kanso"] .analytics-kpi.is-tip { border-top-color: var(--amber); }

  :root[data-ui-theme="kanso"] .analytics-table th {
    background: var(--surface-2);
    border-color: var(--line-2);
    color: var(--muted);
  }

  :root[data-ui-theme="kanso"] .analytics-table td {
    border-color: var(--line-soft);
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] .analytics-table tbody tr:hover td {
    background: var(--red-soft);
  }

  :root[data-ui-theme="kanso"] .analytics-status {
    background: var(--green-soft);
    border-color: var(--green);
    color: var(--green);
  }

  :root[data-ui-theme="kanso"] .analytics-status.is-paying {
    background: var(--blue);
    border-color: var(--blue);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] .analytics-status.is-open {
    background: var(--red-deep);
    border-color: var(--red-deep);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] .fiscal-contract {
    background: var(--green-soft);
    border-color: var(--green);
    color: var(--green);
  }

  :root[data-ui-theme="kanso"] .pos-dialog {
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-radius: var(--r-lg);
    box-shadow: none;
  }

  :root[data-ui-theme="kanso"] .pos-dialog::backdrop {
    background: var(--theme-backdrop);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  :root[data-ui-theme="kanso"] :is(
    .table-management-head,
    .dialog-head > button,
    .dialog-note,
    .meeting-room-open,
    .room-card-field,
    .history-row,
    .config-card,
    .modifier-option
  ) {
    background-color: var(--surface);
    background-image: none;
    border-color: var(--line);
    border-radius: var(--r-sm);
    box-shadow: none;
  }

  :root[data-ui-theme="kanso"] :is(.wallet-payment-note, .room-card-field.has-card, .modifier-option:has(input:checked)) {
    background: var(--green-soft);
    border-color: var(--green);
    color: var(--green);
    box-shadow: inset 3px 0 0 var(--green);
  }

  :root[data-ui-theme="kanso"] :is(.wallet-payment-note.is-insufficient, .modifier-error, .modifier-group-empty) {
    background: var(--red-soft);
    border-color: var(--red);
    color: var(--red-deep);
  }

  :root[data-ui-theme="kanso"] :is(.modifier-option, .modifier-option input, .split-check) {
    accent-color: var(--accent);
  }

  :root[data-ui-theme="kanso"] .toast {
    background: var(--green-dark);
    border: 1px solid var(--theme-rail-line-2);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--theme-rail-ink);
  }

  :root[data-ui-theme="kanso"] .toast.error {
    background: var(--red-deep);
  }

  /* El ensō de tinta conserva su silueta sobre rieles y cabeceras sumi. */
  :root[data-ui-theme="kanso"] .brand-mark,
  :root[data-ui-theme="kanso"] .pos-brand img {
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-radius: var(--r-sm);
  }

  /* Kitchen: hoja independiente y sin capas, por eso esta piel también queda
     fuera de @layer. La clase del body evita contaminar vistas homónimas. */
  :root[data-ui-theme="kanso"] body.kitchen-portal {
    background: var(--bg);
    background-image: none;
    color: var(--ink);
    font-family: var(--sans);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal ::selection {
    background: var(--accent);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(button, input, select, textarea) {
    font-family: var(--sans);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(button, input, select, textarea):focus-visible {
    border-color: var(--accent);
    box-shadow: none;
    outline: 3px solid var(--accent);
    outline-offset: 2px;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(button, input, select, textarea):disabled {
    opacity: .56;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .app-header {
    background: var(--green-dark);
    background-image: none;
    border-bottom-color: var(--theme-rail-line-2);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow: none;
    color: var(--theme-rail-ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .brand-mark {
    filter: none;
    opacity: 1;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .brand-block p {
    color: var(--theme-rail-red);
    font-family: var(--sans);
    font-weight: 700;
    letter-spacing: .16em;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(
    .brand-block h1,
    .hero h2,
    .dialog-head h2,
    .history-detail h3
  ) {
    font-family: var(--font-display);
    font-weight: 650;
    letter-spacing: .015em;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .brand-block h1 {
    color: var(--theme-rail-ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .header-actions .soft-button {
    background: var(--theme-rail-veil-2);
    border-color: var(--theme-rail-line-2);
    color: var(--theme-rail-ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .header-actions .soft-button:hover {
    background: var(--theme-rail-veil-3);
    border-color: var(--theme-rail-ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .header-actions .soft-button span {
    color: var(--theme-rail-ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(
    .soft-button,
    .cart-button,
    .back-button,
    .primary-button,
    .danger-button,
    .close-button
  ) {
    background-image: none;
    border-radius: var(--r-sm);
    box-shadow: none;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(.soft-button, .back-button, .close-button) {
    background: var(--surface);
    border-color: var(--line-2);
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(.soft-button, .back-button, .close-button):hover {
    background: var(--surface-2);
    border-color: var(--accent);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(.cart-button, .primary-button) {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(.cart-button, .primary-button):hover {
    background: var(--red-deep);
    border-color: var(--red-deep);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .cart-button strong {
    background: var(--surface);
    border: 1px solid var(--surface);
    border-radius: var(--r-sm);
    color: var(--accent);
    font-family: var(--font-numeric);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .danger-button {
    background: var(--red-soft);
    border-color: var(--red);
    color: var(--red-deep);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .danger-button:hover {
    background: var(--red-deep);
    border-color: var(--red-deep);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .eyebrow {
    color: var(--accent);
    font-family: var(--sans);
    font-weight: 700;
    letter-spacing: .17em;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(.hero p:last-child, .result-meta) {
    color: var(--muted);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .search-panel {
    background: var(--surface);
    background-image: none;
    border-color: var(--line-2);
    border-radius: var(--r-lg);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow: none;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .search-box > span {
    color: var(--accent);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .search-box input {
    background: transparent;
    color: var(--ink);
    caret-color: var(--accent);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .search-box input::placeholder {
    color: var(--muted-2);
    opacity: 1;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .search-box button {
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .search-box button:hover {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .alphabet button {
    background: var(--surface);
    border-color: var(--line-2);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .alphabet button:hover {
    background: var(--surface-2);
    border-color: var(--accent);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .alphabet button.active {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .category-card {
    background: var(--surface);
    background-image: none;
    border-color: var(--line-2);
    border-left-color: var(--green);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--ink);
    transform: none;
    transition: background-color .12s ease, border-color .12s ease;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .category-card:nth-child(3n+2) {
    border-left-color: var(--amber);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .category-card:nth-child(3n+3) {
    border-left-color: var(--blue);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .category-card:hover {
    background: var(--surface-2);
    border-color: var(--accent);
    transform: none;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .category-card :is(strong, span) {
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .category-card span {
    color: var(--muted);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .product-card {
    background: var(--surface);
    background-image: none;
    border-color: var(--line);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .product-card.selected {
    background: var(--surface);
    border-color: var(--accent);
    box-shadow: none;
    outline: 2px solid var(--accent);
    outline-offset: -2px;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .unit-chip {
    background: var(--green-soft);
    border: 1px solid var(--green);
    border-radius: var(--r-sm);
    color: var(--green);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(.presentation-field, .presentation-count-label) {
    color: var(--muted);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .presentation-field select,
  :root[data-ui-theme="kanso"] body.kitchen-portal .request-meta :is(select, textarea) {
    background: var(--surface);
    border-color: var(--line-2);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .presentation-meta {
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .presentation-meta strong {
    color: var(--green);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .presentation-meta :is(span, small) {
    color: var(--muted);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .stepper button,
  :root[data-ui-theme="kanso"] body.kitchen-portal .stepper input {
    background: var(--surface);
    border-color: var(--line-2);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--ink);
    font-family: var(--font-numeric);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .stepper button:hover {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .stepper button:first-child {
    color: var(--red-deep);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .stepper button:first-child:hover {
    background: var(--red-deep);
    border-color: var(--red-deep);
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(.loading-state, .empty-state) {
    color: var(--muted);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .error-state {
    background: var(--red-soft);
    border: 1px solid var(--red);
    border-radius: var(--r-sm);
    color: var(--red-deep);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .mobile-cart {
    background: var(--accent);
    background-image: none;
    border: 1px solid var(--accent);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--surface);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .mobile-cart:hover {
    background: var(--red-deep);
    border-color: var(--red-deep);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .app-dialog {
    background: var(--surface);
    background-image: none;
    border-color: var(--line-2);
    border-radius: var(--r-lg);
    box-shadow: none;
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .app-dialog::backdrop {
    background: var(--theme-backdrop);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(.dialog-head, .dialog-foot, .summary-row, .history-line) {
    border-color: var(--line);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .request-meta label {
    color: var(--muted);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .summary-group h3 {
    color: var(--accent);
    font-family: var(--sans);
    letter-spacing: .14em;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .summary-row small {
    color: var(--muted);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .history-list {
    background: var(--surface-2);
    background-image: none;
    border-color: var(--line);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .history-card {
    background: var(--surface);
    border-color: var(--line);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .history-card:hover {
    background: var(--surface-2);
    border-color: var(--accent);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .history-card.active {
    background: var(--surface);
    border-color: var(--accent);
    box-shadow: none;
    outline: 2px solid var(--accent);
    outline-offset: -2px;
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .history-card small,
  :root[data-ui-theme="kanso"] body.kitchen-portal .history-detail-meta,
  :root[data-ui-theme="kanso"] body.kitchen-portal .history-line small {
    color: var(--muted);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal :is(.status-chip, .email-status.is-sent) {
    background: var(--green-soft);
    border: 1px solid var(--green);
    border-radius: var(--r-sm);
    color: var(--green);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .email-status.is-pending {
    background: var(--red-soft);
    border: 1px solid var(--red);
    border-radius: var(--r-sm);
    color: var(--red-deep);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .history-line strong {
    color: var(--green);
    font-family: var(--font-numeric);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .toast {
    background: var(--green-dark);
    background-image: none;
    border: 1px solid var(--theme-rail-line-2);
    border-radius: var(--r-sm);
    box-shadow: none;
    color: var(--theme-rail-ink);
  }

  :root[data-ui-theme="kanso"] body.kitchen-portal .toast.error {
    background: var(--red-deep);
    border-color: var(--red-deep);
    color: var(--surface);
  }
}