/* Page shell for dash.itinmotion.com: the theme tokens the dashboard expects, the sign-in screen, and page chrome. */
:root { color-scheme: light dark;
  --color-fg: #1d1d1f; --color-fg-muted: #6e6e73; --color-muted: #6e6e73; --color-bg: #fff; --color-panel: #fff; --color-border: #e5e5ea; --color-border-line: #e5e5ea;
  --color-ok: #248a3d; --color-warn: #b25000; --color-bad: #d70015; --cds-surface-popover: #fff; --cds-text-secondary: #6e6e73;
  --cds-chart-grid: #ececf0; --cds-chart-axis: #c7c7cc; --cds-chart-reference: #8e8e93; --cds-chart-muted: #c7c7cc; --cds-chart-status-critical: #ff3b30;
  --page: #f5f5f7;
  --cds-gap-xs: 4px; --cds-gap-sm: 8px; --cds-gap-md: 12px; --cds-gap-lg: 16px; --cds-gap-xl: 28px; --cds-pad-xs: 4px; --cds-pad-sm: 8px; --cds-pad-lg: 20px;
  --cds-radius: 8px; --cds-font-size-caption: 12px; --cds-font-size-body: 14px; --cds-font-size-heading: 16px; --cds-font-size-title: 24px; --cds-font-weight-medium: 500;
  --cds-dur-slow: 300ms; --cds-ease-out: cubic-bezier(.2, .8, .2, 1); --font-anthropic-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif; }
@media (prefers-color-scheme: dark) { :root {
  --color-fg: #f5f5f7; --color-fg-muted: #98989d; --color-muted: #98989d; --color-bg: #000; --color-panel: #1c1c1e; --color-border: #38383a; --color-border-line: #38383a;
  --color-ok: #30d158; --color-warn: #ff9f0a; --color-bad: #ff453a; --cds-surface-popover: #2c2c2e; --cds-text-secondary: #98989d;
  --cds-chart-grid: #2c2c2e; --cds-chart-axis: #48484a; --cds-chart-reference: #8e8e93; --cds-chart-muted: #48484a; --cds-chart-status-critical: #ff453a; --page: #000; } }
html, body { margin: 0; min-height: 100%; }
body { background: var(--page); color: var(--color-fg); font-family: var(--font-anthropic-sans); -webkit-font-smoothing: antialiased; }
body:has(#dash-root[data-itim-theme="light"]) { background: #f5f5f7; color-scheme: light; }
body:has(#dash-root[data-itim-theme="dark"]) { background: #000; color-scheme: dark; }
#dash-root { box-sizing: border-box; max-width: 1680px; margin: 0 auto; padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 40px max(16px, env(safe-area-inset-left)); min-height: 100vh; }
@media (min-width: 900px) { #dash-root { padding-inline: 28px; } }
#dash-root[data-itim-theme] { border-radius: 0; padding-block: max(16px, env(safe-area-inset-top)) 40px; }
[hidden] { display: none !important; }
.dash-skeleton { background: color-mix(in srgb, var(--color-fg) 6%, transparent); border-radius: 8px; min-height: 1em; animation: itim-pulse 1.4s ease-in-out infinite; }
@keyframes itim-pulse { 50% { opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .dash-skeleton { animation: none; } }

.login { min-height: 100vh; display: grid; place-items: center; padding: 24px; box-sizing: border-box; }
.login-card { width: min(380px, 100%); background: var(--color-panel); border-radius: 22px; padding: 36px 28px 24px; text-align: center; box-shadow: 0 1px 2px rgb(0 0 0 / .06), 0 12px 40px rgb(0 0 0 / .08); }
.login-card h1 { font-size: 1.5rem; letter-spacing: -0.02em; margin: 14px 0 2px; }
.login-sub { margin: 0 0 24px; color: var(--color-fg-muted); }
.login-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%; font: inherit; font-weight: 600; font-size: 0.9375rem; padding: 12px 16px; border-radius: 12px; border: 0; cursor: pointer; background: var(--color-fg); color: var(--color-panel); }
.login-btn:hover { opacity: .88; }
.login-btn:focus-visible, .login-link:focus-visible { outline: 3px solid #0a84ff; outline-offset: 2px; }
.login-msg { color: var(--color-fg-muted); font-size: 0.875rem; margin: 14px 0 0; min-height: 1.2em; }
.login-msg:empty { display: none; }
.login-link { margin-top: 14px; background: none; border: 0; color: #0a84ff; font: inherit; font-size: 0.875rem; cursor: pointer; }
.login-foot { margin: 22px 0 0; font-size: 0.75rem; color: var(--color-fg-muted); }

.itim-alert { position: fixed; z-index: 1000; left: 50%; bottom: 24px; transform: translateX(-50%); max-width: min(560px, calc(100% - 32px)); background: #1d1d1f; color: #fff; padding: 12px 16px; border-radius: 12px; font-size: 0.875rem; box-shadow: 0 8px 30px rgb(0 0 0 / .25); }
.itim-account { display: inline-flex; align-items: center; gap: 8px; font-size: 0.75rem; color: var(--color-fg-muted); align-self: flex-end; }
.itim-account button { font: inherit; font-size: 0.75rem; font-weight: 600; border: 0; border-radius: 999px; padding: 4px 11px; cursor: pointer; color: var(--color-fg); background: color-mix(in srgb, var(--color-fg) 8%, transparent); }
.itim-stamp { font-size: 0.75rem; color: var(--color-fg-muted); }
.itim-access { width: 100%; border-collapse: collapse; font-size: 0.8125rem; margin-top: 6px; }
.itim-access th { text-align: left; font-size: 0.6875rem; font-weight: 600; color: var(--color-fg-muted); padding: 6px 8px 6px 0; }
.itim-access td { padding: 8px 8px 8px 0; border-top: 0.5px solid var(--color-border-line); vertical-align: middle; }
.itim-access select, .itim-access input, .itim-access-add select, .itim-access-add input { font: inherit; font-size: 0.8125rem; padding: 5px 8px; border-radius: 8px; border: 0.5px solid var(--color-border-line); background: var(--color-panel); color: var(--color-fg); max-width: 100%; box-sizing: border-box; }
.itim-access-add { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.itim-access-add input { flex: 1 1 12rem; }
.itim-access-wrap { overflow-x: auto; }


  /* Apple-style look: system fonts, segmented tabs, soft grouped cards, tinted pills, hairline separators.
     Text colors stay on the theme tokens (readable in light and dark); fills use the system palette set in 03_core. */
  .itim {
    --itim-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable Text", "Segoe UI", "Helvetica Neue", var(--font-anthropic-sans), sans-serif;
    --itim-font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI Variable Display", "Segoe UI", "Helvetica Neue", var(--font-anthropic-sans), sans-serif;
    --itim-font-num: ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, "Segoe UI Variable Display", "Segoe UI", var(--font-anthropic-sans), sans-serif;
    --itim-accent: #007aff;
    --itim-r-lg: 18px; --itim-r-md: 12px; --itim-r-sm: 8px;
    --itim-hair: color-mix(in srgb, var(--color-fg) 9%, transparent);
    --itim-fill: color-mix(in srgb, var(--color-fg) 6%, transparent);
    --itim-fill-2: color-mix(in srgb, var(--color-fg) 4%, transparent);
    --itim-shadow: 0 0 0 0.5px color-mix(in srgb, var(--color-fg) 7%, transparent), 0 1px 2px color-mix(in srgb, #000 5%, transparent), 0 6px 20px color-mix(in srgb, #000 5%, transparent);
    --itim-shadow-hover: 0 0 0 0.5px color-mix(in srgb, var(--color-fg) 10%, transparent), 0 2px 6px color-mix(in srgb, #000 7%, transparent), 0 12px 32px color-mix(in srgb, #000 8%, transparent);
    font-family: var(--itim-font); color: var(--color-fg); max-width: 1440px; margin-inline: auto;
    -webkit-font-smoothing: antialiased; letter-spacing: -0.006em; font-size: 0.9375rem;
  }
  .itim :focus-visible { outline: 3px solid color-mix(in srgb, var(--itim-accent) 45%, transparent); outline-offset: 2px; border-radius: var(--itim-r-sm); }

  /* Header: large title */
  .itim-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--cds-gap-md); margin: var(--cds-gap-sm) 0 var(--cds-gap-lg); }
  .itim-title { font-family: var(--itim-font-display); font-weight: 700; font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.25rem); letter-spacing: -0.025em; line-height: 1.1; margin: 0 0 var(--cds-gap-sm); }
  .itim-takeaway { font-size: 1.0625rem; line-height: 1.45; margin: 0 0 var(--cds-gap-xs); max-width: 72ch; color: var(--color-fg-muted); }
  .itim .itim-takeaway b { font-weight: 600; color: var(--color-fg); }
  .itim-meta { font-size: 0.75rem; color: var(--color-fg-muted); margin: 0; }
  .itim-good { color: var(--color-ok); }
  .itim-bad { color: var(--color-bad); }
  .itim-warn { color: var(--color-warn); }
  .itim-muted { color: var(--color-fg-muted); }

  /* Tabs: segmented control, sticky with a frosted backdrop */
  .itim-tabs { position: sticky; top: 0; z-index: 10; display: flex; gap: 2px; width: fit-content; max-width: 100%; padding: 3px; margin: 0 0 var(--cds-gap-lg);
    background: color-mix(in srgb, var(--color-panel) 78%, transparent); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
    border-radius: 11px; box-shadow: inset 0 0 0 0.5px var(--itim-hair), 0 4px 18px color-mix(in srgb, #000 6%, transparent); overflow-x: auto; scrollbar-width: none; }
  .itim-tabs::-webkit-scrollbar { display: none; }
  .itim-tabs button { all: unset; cursor: pointer; white-space: nowrap; font-size: 0.8125rem; font-weight: 500; padding: 6px 14px; border-radius: 8px; color: var(--color-fg-muted); transition: background-color .2s, color .2s, box-shadow .2s; }
  .itim-tabs button:hover { color: var(--color-fg); }
  .itim-tabs button[aria-selected="true"] { color: var(--color-fg); font-weight: 600; background: var(--color-bg); box-shadow: 0 0 0 0.5px var(--itim-hair), 0 2px 6px color-mix(in srgb, #000 10%, transparent); }
  .itim-tabs .itim-badge:not(:empty) { margin-left: 6px; font-size: 0.6875rem; font-weight: 600; color: #fff; background: var(--ap-red, #ff3b30); border-radius: 999px; padding: 1px 6px; font-variant-numeric: tabular-nums; }

  /* Layout and cards */
  .itim-section { margin-bottom: var(--cds-gap-xl); }
  .itim-section-title { font-family: var(--itim-font-display); font-size: 1.375rem; font-weight: 700; letter-spacing: -0.02em; margin: 0 0 var(--cds-gap-md); }
  .itim-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 26rem), 1fr)); gap: var(--cds-gap-lg); }
  .itim-grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: var(--cds-gap-lg); }
  .itim-card, .itim-tile { background: var(--color-panel); border: 0; border-radius: var(--itim-r-lg); box-shadow: var(--itim-shadow); padding: 22px; min-width: 0; position: relative; container-type: inline-size; }
  .itim-card-wide { grid-column: 1 / -1; }
  .itim-card-title { font-family: var(--itim-font-display); font-size: 1.125rem; font-weight: 600; letter-spacing: -0.015em; margin: 0 0 4px; }
  .itim-card-note { font-size: 0.8125rem; line-height: 1.45; color: var(--color-fg-muted); margin: 0 0 var(--cds-gap-md); max-width: 90ch; }
  .itim-note { font-size: 0.8125rem; color: var(--color-fg-muted); margin: var(--cds-gap-sm) 0 0; max-width: 90ch; }

  /* Scorecard tiles */
  .itim-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: var(--cds-gap-lg); margin-bottom: var(--cds-gap-xl); }
  .itim-tile { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px; }
  .itim-tile-label { font-size: 0.8125rem; font-weight: 600; color: var(--color-fg-muted); margin: 0; }
  .itim-tile-value { font-family: var(--itim-font-num); font-weight: 600; font-size: clamp(1.625rem, 1.3rem + 0.8vw, 2rem); letter-spacing: -0.02em; line-height: 1.1; margin: 2px 0 0; font-variant-numeric: tabular-nums; min-height: 1.1em; }
  .itim-tile-sub { font-size: 0.8125rem; color: var(--color-fg-muted); margin: 0; font-variant-numeric: tabular-nums; }
  .itim-tile-target { font-size: 0.75rem; margin: auto 0 0; padding-top: 6px; display: flex; align-items: center; gap: 6px; color: var(--color-fg-muted); }
  .itim-dot { width: 0.5rem; height: 0.5rem; border-radius: 50%; display: inline-block; flex: none; background: var(--cds-chart-muted); }
  .itim-dot.ok { background: var(--ap-green, var(--color-ok)); }
  .itim-dot.bad { background: var(--ap-red, var(--color-bad)); }
  .itim-dot.warn { background: var(--ap-orange, var(--color-warn)); }
  .itim-spark { height: 34px; width: 100%; margin-top: 4px; }
  .itim-spark svg { display: block; }

  /* Charts */
  .itim-chart { min-height: 240px; width: 100%; }
  .itim-chart-sm { min-height: 170px; }
  .itim-chart svg { display: block; font-family: var(--itim-font); }
  .itim-legend { display: flex; flex-wrap: wrap; gap: var(--cds-gap-md); font-size: 0.75rem; color: var(--color-fg-muted); margin: 0 0 var(--cds-gap-sm); }
  .itim-legend span { display: inline-flex; align-items: center; gap: 6px; }
  .itim-swatch { width: 9px; height: 9px; border-radius: 50%; display: inline-block; flex: none; }
  .itim-tip { position: absolute; pointer-events: none; background: color-mix(in srgb, var(--cds-surface-popover) 88%, transparent); -webkit-backdrop-filter: blur(16px) saturate(180%); backdrop-filter: blur(16px) saturate(180%);
    border: 0; border-radius: var(--itim-r-md); box-shadow: var(--itim-shadow-hover); padding: 8px 12px; font-size: 0.75rem; line-height: 1.5; font-variant-numeric: tabular-nums; z-index: 30; white-space: nowrap; }
  .itim-tip-head { color: var(--cds-text-secondary); font-weight: 600; margin-bottom: 2px; }
  .itim-tip-row { display: flex; align-items: center; gap: 6px; }
  .itim-fail { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: inherit; font-size: 0.8125rem; color: var(--color-fg-muted); }
  .itim-fail::before { content: ""; width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--color-bad); }

  /* Controls: filled fields, Apple-style select chevron */
  .itim-tools { display: flex; flex-wrap: wrap; gap: var(--cds-gap-sm); align-items: center; margin-bottom: var(--cds-gap-md); }
  .itim-search, .itim-select, .itim-input, .itim-field input { font: inherit; font-size: 0.875rem; padding: 7px 12px; border: 0; border-radius: 10px; background-color: var(--itim-fill); color: var(--color-fg); min-width: 0; transition: box-shadow .15s, background-color .15s; }
  .itim-search:focus, .itim-select:focus, .itim-input:focus, .itim-field input:focus { outline: none; background-color: var(--color-bg); box-shadow: 0 0 0 3px color-mix(in srgb, var(--itim-accent) 40%, transparent); }
  .itim-search { flex: 1; max-width: 20rem; padding-left: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238e8e93' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m20 20-4.5-4.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: 11px center; }
  .itim-select { -webkit-appearance: none; appearance: none; padding-right: 30px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%238e8e93' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9 5-5 5 5M7 15l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 11px center; }
  .itim-act { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; min-width: 15rem; }
  .itim-act select, .itim-act input { font: inherit; font-size: 0.75rem; padding: 3px 8px; border-radius: 8px; border: 1px solid var(--color-border, rgba(127,127,127,.3)); background: var(--color-bg, transparent); color: var(--color-fg); }
  .itim-act select { padding-right: 8px; cursor: pointer; }
  .itim-act input { width: 9rem; flex: 1; min-width: 6rem; }
  .itim-act a { font-size: 0.75rem; font-weight: 500; color: var(--itim-accent); text-decoration: none; white-space: nowrap; }
  .itim-act a:hover { text-decoration: underline; }
  .itim-act-meta { font-size: 0.6875rem; color: var(--color-muted, #8e8e93); width: 100%; }
  .itim-explain { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: 10px 18px; margin: 4px 0 12px; font-size: 0.8125rem; }
  .itim-explain b { display: block; font-weight: 600; margin-bottom: 2px; }
  .itim-chips { display: inline-flex; flex-wrap: wrap; gap: 6px; }
  .itim-chips button { all: unset; cursor: pointer; font-size: 0.8125rem; font-weight: 500; padding: 5px 13px; border-radius: 999px; background: var(--itim-fill); color: var(--color-fg); transition: background-color .15s, color .15s; }
  .itim-chips button:hover { background: color-mix(in srgb, var(--color-fg) 10%, transparent); }
  .itim-chips button[aria-pressed="true"] { background: var(--itim-accent); color: #fff; }
  .itim-count { font-size: 0.8125rem; color: var(--color-fg-muted); font-variant-numeric: tabular-nums; }
  .itim-field { display: inline-flex; align-items: center; gap: var(--cds-gap-sm); font-size: 0.8125rem; color: var(--color-fg-muted); }
  .itim-field input { width: 7rem; font-variant-numeric: tabular-nums; }

  /* Tables: inset list style, hairline separators */
  .itim-tablebox { max-height: 36rem; overflow: auto; margin: 0 -8px; padding: 0 8px; }
  .itim-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 0.875rem; font-variant-numeric: tabular-nums; }
  .itim-table th { position: sticky; top: 0; background: color-mix(in srgb, var(--color-panel) 90%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    text-align: right; font-weight: 600; font-size: 0.75rem; color: var(--color-fg-muted); padding: 8px 10px; border-bottom: 0.5px solid var(--itim-hair); white-space: nowrap; z-index: 1; }
  .itim-table th.l, .itim-table td.l, .itim-table th:first-child, .itim-table td:first-child { text-align: left; }
  .itim-table td { text-align: right; padding: 11px 10px; border-bottom: 0.5px solid var(--itim-hair); white-space: nowrap; }
  .itim-table tbody tr:last-child td { border-bottom: 0; }
  .itim-table td:first-child { white-space: normal; min-width: 9rem; font-weight: 500; }
  .itim-table tr.itim-click { cursor: pointer; }
  .itim-table tr.itim-click td { transition: background-color .12s; }
  .itim-table tr.itim-click:hover td { background: var(--itim-fill-2); }
  .itim-table tr.itim-click:hover td:first-child { border-radius: var(--itim-r-sm) 0 0 var(--itim-r-sm); }
  .itim-table tr.itim-click:hover td:last-child { border-radius: 0 var(--itim-r-sm) var(--itim-r-sm) 0; }
  .itim-table tr.itim-sel td { background: color-mix(in srgb, var(--itim-accent) 10%, transparent); }
  .itim-table th button { all: unset; cursor: pointer; }
  .itim-table th button:hover { color: var(--color-fg); }
  .itim-sort-ind { display: inline-block; width: 0.8em; color: var(--itim-accent); }
  .itim-wrap { white-space: normal !important; min-width: 12rem; line-height: 1.4; }
  @container (max-width: 680px) { .itim-opt { display: none; } }
  @container (max-width: 480px) { .itim-opt2 { display: none; } }

  /* Pills and badges: tinted capsules */
  .itim-pill { display: inline-block; font-size: 0.75rem; font-weight: 600; padding: 2px 9px; border-radius: 999px; border: 0; background: var(--itim-fill); color: var(--color-fg-muted); white-space: nowrap; }
  .itim-pill-bad { color: var(--color-bad); background: color-mix(in srgb, var(--ap-red, var(--color-bad)) 14%, transparent); }
  .itim-pill-warn { color: var(--color-warn); background: color-mix(in srgb, var(--ap-orange, var(--color-warn)) 16%, transparent); }
  .itim-pill-ok { color: var(--color-ok); background: color-mix(in srgb, var(--ap-green, var(--color-ok)) 16%, transparent); }
  .itim-grade { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; font-family: var(--itim-font-num); font-weight: 700; font-size: 0.8125rem; border: 0; background: color-mix(in srgb, currentColor 14%, transparent); }
  .itim-grade-A, .itim-grade-B { color: var(--color-ok); }
  .itim-grade-C { color: var(--color-warn); }
  .itim-grade-D, .itim-grade-F { color: var(--color-bad); }
  .itim-bartrack { width: 64px; display: inline-flex; flex: none; vertical-align: middle; margin-left: var(--cds-gap-sm); background: var(--itim-fill); border-radius: 4px; overflow: hidden; }
  .itim-bar { height: 6px; border-radius: 3px; }

  /* Lists */
  .itim-list { list-style: none; margin: 0; padding: 0; }
  .itim-list li { display: flex; gap: var(--cds-gap-sm); align-items: baseline; padding: 10px 0; border-bottom: 0.5px solid var(--itim-hair); font-size: 0.875rem; line-height: 1.4; }
  .itim-list li:last-child { border-bottom: 0; }
  .itim-list .grow { flex: 1; min-width: 0; }
  .itim-list .num { font-variant-numeric: tabular-nums; white-space: nowrap; font-weight: 600; }
  .itim-list button.itim-link, .itim-num-link { all: unset; cursor: pointer; color: var(--itim-accent); font-variant-numeric: tabular-nums; }
  .itim-list button.itim-link:hover, .itim-num-link:hover { text-decoration: underline; text-underline-offset: 3px; }
  .itim-small { font-size: 0.8125rem; color: var(--color-fg-muted); }

  /* Client profile */
  .itim-profile { margin-bottom: var(--cds-gap-lg); }
  .itim-profile-head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-gap-sm) var(--cds-gap-md); margin-bottom: var(--cds-gap-lg); }
  .itim-profile-head h3 { font-family: var(--itim-font-display); font-weight: 700; font-size: 1.625rem; letter-spacing: -0.02em; margin: 0; }
  .itim-profile-close { all: unset; cursor: pointer; margin-left: auto; font-size: 0.8125rem; font-weight: 500; padding: 5px 12px; border-radius: 999px; background: var(--itim-fill); color: var(--color-fg); }
  .itim-profile-close:hover { background: color-mix(in srgb, var(--color-fg) 10%, transparent); }
  .itim-mini { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); gap: 10px; margin-bottom: var(--cds-gap-lg); }
  .itim-mini div { background: var(--itim-fill-2); border: 0; border-radius: var(--itim-r-md); padding: 12px 14px; }
  .itim-mini span { display: block; font-size: 0.75rem; font-weight: 600; color: var(--color-fg-muted); margin-bottom: 2px; }
  .itim .itim-mini b { display: block; font-family: var(--itim-font-num); font-weight: 600; font-size: 1.1875rem; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }

  /* Coverage matrix */
  .itim-matrix th.svc { height: 8.5rem; min-width: 2.2rem; vertical-align: bottom; padding: 0; overflow: visible; white-space: nowrap; }
  .itim-matrix th.svc > span { position: absolute; left: calc(50% - 4px); bottom: 10px; transform-origin: 0 100%; transform: rotate(-45deg); max-width: 11rem; overflow: hidden; text-overflow: ellipsis; font-size: 0.75rem; line-height: 1.2; }
  .itim-matrix thead tr:first-child th:last-child { padding-left: 4.5rem; }
  .itim-matrix td.cell { text-align: center; padding: 4px 2px; min-width: 2.2rem; }
  .itim-cov { display: inline-flex; align-items: center; justify-content: center; width: 1.7rem; height: 1.4rem; border-radius: 7px; font-size: 0.75rem; font-weight: 600; }
  .itim-cov-yes { background: color-mix(in srgb, var(--ap-green, var(--color-ok)) 20%, transparent); color: var(--color-ok); }
  .itim-cov-part { background: color-mix(in srgb, var(--ap-orange, var(--color-warn)) 20%, transparent); color: var(--color-warn); }
  .itim-cov-no { background: var(--itim-fill-2); box-shadow: inset 0 0 0 1px var(--itim-hair); color: var(--color-fg-muted); }
  .itim-cov-na { color: var(--itim-hair); }

  /* Action tracker */
  .itim-actions { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--cds-gap-md); }
  .itim-action { display: grid; grid-template-columns: auto 1fr auto; gap: var(--cds-gap-md); align-items: start; background: var(--color-panel); border: 0; border-radius: var(--itim-r-lg); box-shadow: var(--itim-shadow); padding: 20px 22px; transition: opacity .2s; }
  .itim-action.is-done { opacity: 0.55; }
  .itim-action-rank { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--itim-fill); font-family: var(--itim-font-num); font-size: 0.9375rem; font-weight: 700; color: var(--color-fg-muted); }
  .itim-action-title { font-family: var(--itim-font-display); font-size: 1.0625rem; font-weight: 600; letter-spacing: -0.012em; margin: 4px 0 4px; }
  .itim-action-why { font-size: 0.875rem; line-height: 1.45; color: var(--color-fg-muted); margin: 0; }
  .itim-action-impact { text-align: right; min-width: 7rem; }
  .itim .itim-action-impact b { display: block; font-family: var(--itim-font-num); font-weight: 600; font-size: 1.5rem; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
  .itim-action-impact span { font-size: 0.75rem; color: var(--color-fg-muted); }
  .itim-track { display: flex; flex-wrap: wrap; gap: var(--cds-gap-sm); align-items: center; margin-top: var(--cds-gap-md); }
  .itim-track .itim-input { width: 9rem; }
  .itim-track .itim-input.note { flex: 1; min-width: 10rem; width: auto; }
  .itim-actions-wrap { container-type: inline-size; }
  @container (max-width: 560px) { .itim-action { grid-template-columns: auto 1fr; } .itim-action-impact { grid-column: 2; text-align: left; } }

  /* Drill-downs: tiles lift on hover */
  .itim-tile-link { cursor: pointer; transition: box-shadow .25s ease, transform .25s ease; }
  .itim-tile-link:hover { box-shadow: var(--itim-shadow-hover); transform: translateY(-2px); }
  .itim-tile-link:active { transform: translateY(0) scale(.99); }
  .itim-tile-link .itim-tile-label::after { content: " ›"; color: var(--itim-accent); font-weight: 600; }
  .itim-drill-head { display: flex; align-items: center; gap: var(--cds-gap-md); }
  .itim-drill-head .itim-profile-close { margin-left: auto; }
  .itim-drill { box-shadow: 0 0 0 2px color-mix(in srgb, var(--itim-accent) 45%, transparent), var(--itim-shadow-hover); }

  /* Service status */
  .itim-cov { cursor: pointer; border: 0; font: inherit; font-size: 0.75rem; font-weight: 600; }
  .itim-st-offered, .itim-st-interested { background: color-mix(in srgb, var(--ap-orange, var(--color-warn)) 18%, transparent); color: var(--color-warn); }
  .itim-st-sold { background: color-mix(in srgb, var(--ap-green, var(--color-ok)) 30%, transparent); color: var(--color-ok); }
  .itim-st-declined, .itim-st-notfit { background: color-mix(in srgb, var(--ap-red, var(--color-bad)) 13%, transparent); color: var(--color-bad); }
  .itim-st-elsewhere, .itim-st-notusing { background: var(--itim-fill); color: var(--color-fg-muted); }
  .itim-st-revisit { background: color-mix(in srgb, var(--itim-accent) 14%, transparent); color: var(--itim-accent); }
  .itim-pop { position: absolute; z-index: 20; width: min(22rem, 92%); background: color-mix(in srgb, var(--cds-surface-popover) 92%, transparent); -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%);
    border: 0; border-radius: 14px; box-shadow: var(--itim-shadow-hover); padding: 16px; display: grid; gap: 10px; }
  .itim-pop h4 { margin: 0; font-size: 0.9375rem; font-weight: 600; }
  .itim-pop label { display: grid; gap: 4px; font-size: 0.75rem; font-weight: 500; color: var(--color-fg-muted); }
  .itim-pop .row { display: flex; gap: var(--cds-gap-sm); justify-content: flex-end; }
  .itim-btn { font: inherit; font-size: 0.8125rem; font-weight: 500; padding: 6px 14px; border-radius: 999px; border: 0; background: var(--itim-fill); color: var(--color-fg); cursor: pointer; transition: filter .15s, background-color .15s; }
  .itim-btn:hover { background: color-mix(in srgb, var(--color-fg) 10%, transparent); }
  .itim-btn-primary, .itim-btn-primary:hover { background: var(--itim-accent); color: #fff; font-weight: 600; }
  .itim-btn-primary:hover { filter: brightness(1.08); }

  .itim-field input:disabled { opacity: 1; color: var(--color-fg); -webkit-text-fill-color: var(--color-fg); cursor: default; }

  .itim-profile-head .itim-btn-primary { margin-left: auto; }
  .itim-profile-head .itim-btn-primary + .itim-profile-close { margin-left: 0; }
  /* QBR pack */
  .qbr-page { padding: 32px; }
  .qbr-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 12px; border-bottom: 0.5px solid var(--itim-hair); padding-bottom: 16px; margin-bottom: 20px; }
  .qbr-kicker { font-size: 0.75rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--itim-accent); margin: 0 0 4px; }
  .qbr-title { font-family: var(--itim-font-display); font-size: 1.75rem; font-weight: 700; letter-spacing: -0.02em; margin: 0; }
  .qbr-sub { font-size: 0.8125rem; color: var(--color-fg-muted); margin: 4px 0 0; }
  .qbr-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.5rem), 1fr)); gap: 10px; margin-bottom: 24px; }
  .qbr-tile { background: var(--itim-fill-2); border-radius: var(--itim-r-md); padding: 12px 14px; }
  .qbr-tile span { display: block; font-size: 0.75rem; font-weight: 600; color: var(--color-fg-muted); }
  .itim .qbr-tile b { display: block; font-family: var(--itim-font-num); font-size: 1.375rem; font-weight: 600; margin-top: 2px; font-variant-numeric: tabular-nums; }
  .qbr-tile small { display: block; font-size: 0.75rem; color: var(--color-fg-muted); margin-top: 2px; }
  .qbr-sec { margin-bottom: 24px; }
  .qbr-sec h4 { font-family: var(--itim-font-display); font-size: 1.0625rem; font-weight: 600; margin: 0 0 4px; }
  .qbr-sec p { font-size: 0.875rem; line-height: 1.5; margin: 0 0 10px; color: var(--color-fg-muted); max-width: 80ch; }
  .qbr-two { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); gap: 20px; }
  .qbr-table { width: 100%; border-collapse: collapse; font-size: 0.8125rem; font-variant-numeric: tabular-nums; }
  .qbr-table th { text-align: left; font-weight: 600; font-size: 0.75rem; color: var(--color-fg-muted); padding: 6px 8px; border-bottom: 0.5px solid var(--itim-hair); }
  .qbr-table td { padding: 7px 8px; border-bottom: 0.5px solid var(--itim-hair); }
  .qbr-table .n { text-align: right; }
  .qbr-chips { display: flex; flex-wrap: wrap; gap: 6px; }
  .qbr-chip { font-size: 0.75rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; background: var(--itim-fill); }
  .qbr-chip.ok { color: var(--color-ok); background: color-mix(in srgb, var(--ap-green, var(--color-ok)) 16%, transparent); }
  .qbr-chip.rec { color: var(--itim-accent); background: color-mix(in srgb, var(--itim-accent) 12%, transparent); }
  .qbr-steps { margin: 0; padding-left: 20px; font-size: 0.875rem; line-height: 1.6; }
  .qbr-chart svg { display: block; color: var(--color-fg-muted); }
  [data-dash-source-state=empty] { color: transparent; }
  [data-dash-source-state=refreshing] { opacity: .5; transition: opacity var(--cds-dur-slow); }

  @media (prefers-reduced-motion: no-preference) {
    @keyframes itim-rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
    .itim-tab:not([hidden]) > * { animation: itim-rise var(--cds-dur-slow) var(--cds-ease-out) both; }
    .itim-tab:not([hidden]) > *:nth-child(2) { animation-delay: 40ms; }
    .itim-tab:not([hidden]) > *:nth-child(3) { animation-delay: 80ms; }
    .itim-tab:not([hidden]) > *:nth-child(n+4) { animation-delay: 120ms; }
  }

  /* Data freshness banner */
  .itim-health { margin: 0 0 14px; padding: 10px 14px; border-radius: 12px; font-size: 14px; line-height: 1.45;
    color: var(--color-bad); background: color-mix(in srgb, var(--ap-red, var(--color-bad)) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--ap-red, var(--color-bad)) 35%, transparent); }
  .itim-health[hidden] { display: none; }
  .itim-health b { margin-right: 6px; }

  /* Segmented control inside a tab (same look as the tabs) */
  .itim-seg { display: flex; gap: 2px; width: fit-content; max-width: 100%; padding: 3px; border-radius: 11px; overflow-x: auto; scrollbar-width: none;
    background: color-mix(in srgb, var(--color-fg) 6%, transparent); box-shadow: inset 0 0 0 0.5px var(--itim-hair); }
  .itim-seg button { all: unset; cursor: pointer; white-space: nowrap; font-size: 0.8125rem; font-weight: 500; padding: 6px 14px; border-radius: 8px; color: var(--color-fg-muted); }
  .itim-seg button:hover { color: var(--color-fg); }
  .itim-seg button:focus-visible { outline: 2px solid var(--ap-blue, #007aff); outline-offset: 1px; }
  .itim-seg button[aria-checked="true"] { color: var(--color-fg); font-weight: 600; background: var(--color-panel); box-shadow: 0 0 0 0.5px var(--itim-hair), 0 2px 6px color-mix(in srgb, #000 10%, transparent); }
  .itim-table tr.itim-total td { font-weight: 600; }

  /* Tasks & reminders */
  .itim-tabs .itim-badge-due:not(:empty) { background: var(--ap-orange, #ff9500); }
  .itim-task-form { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end; padding: 14px; margin: 0 0 var(--cds-gap-md); border-radius: 12px; background: color-mix(in srgb, var(--color-fg) 4%, transparent); }
  .itim-task-form[hidden] { display: none; }
  .itim-task-form .itim-field { display: flex; flex-direction: column; gap: 4px; font-size: 0.75rem; color: var(--color-fg-muted); min-width: 8rem; }
  .itim-task-form .itim-field.grow { flex: 1 1 16rem; }
  .itim-check { display: flex; align-items: center; gap: 6px; font-size: 0.8125rem; }
  .itim-task-form-actions { display: flex; gap: 8px; flex-wrap: wrap; }
  #tasks-table tr.is-done td { color: var(--color-fg-muted); text-decoration: line-through; }
  #tasks-table tr.is-due td:first-child { font-weight: 600; }
  #tasks-table .itim-input { min-width: 0; width: 8.5rem; }
  .itim-modal-back { position: fixed; inset: 0; z-index: 50; display: flex; align-items: center; justify-content: center; padding: 16px;
    background: color-mix(in srgb, #000 35%, transparent); }
  .itim-modal-back[hidden] { display: none; }
  .itim-modal { background: var(--color-panel); color: var(--color-fg); border-radius: var(--itim-r-lg, 16px); box-shadow: 0 20px 60px color-mix(in srgb, #000 30%, transparent);
    padding: 22px; width: min(34rem, 100%); max-height: 80vh; overflow: auto; }
  .itim-modal .itim-list { margin: 10px 0 16px; }

' + PRINT_CSS + '
/* IT In Motion dashboard, v6 layer: Apple-style shell (sidebar on wide screens, segmented tabs on narrow),
   Today inbox, client panel and quick search. Builds on the tokens set in the page's own style block. */
.itim { container: itim / inline-size; }
.itim kbd { font: inherit; font-size: 0.6875rem; font-weight: 600; line-height: 1.5; padding: 0 6px; border-radius: 5px; color: var(--color-fg-muted);
  background: var(--color-panel); box-shadow: 0 0 0 0.5px var(--itim-hair), 0 1px 0 var(--itim-hair); }

/* Header */
.itim-head { align-items: flex-start; }
.itim-head-text { min-width: 0; flex: 1 1 28rem; }
.itim-eyebrow { font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.02em; text-transform: uppercase; color: var(--color-fg-muted); margin: 0 0 2px; }
.itim-cmdk-wrap { position: relative; flex: 0 1 19rem; margin-top: 4px; }
.itim-cmdk-btn { all: unset; box-sizing: border-box; width: 100%; display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 8px 10px 8px 12px; border-radius: 10px;
  background: var(--itim-fill); color: var(--color-fg-muted); font-size: 0.875rem; transition: background-color .15s; }
.itim-cmdk-btn:hover { background: color-mix(in srgb, var(--color-fg) 9%, transparent); }
.itim-cmdk-btn kbd { margin-left: auto; }
.itim-cmdk-glass { width: 14px; height: 14px; flex: none; background: no-repeat center / 14px 14px
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238e8e93' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m20 20-4.5-4.5'/%3E%3C/svg%3E"); }
.itim-cmdk { position: absolute; right: 0; top: calc(100% + 8px); z-index: 40; width: min(34rem, calc(100cqw - 2px)); box-sizing: border-box; padding: 6px;
  background: color-mix(in srgb, var(--cds-surface-popover) 94%, transparent); -webkit-backdrop-filter: blur(24px) saturate(180%); backdrop-filter: blur(24px) saturate(180%);
  border-radius: 14px; box-shadow: 0 0 0 0.5px var(--itim-hair), 0 18px 50px color-mix(in srgb, #000 22%, transparent); }
.itim-cmdk[hidden] { display: none; }
.itim-cmdk-input { width: 100%; box-sizing: border-box; font: inherit; font-size: 1.0625rem; padding: 10px 12px; border: 0; border-bottom: 0.5px solid var(--itim-hair);
  border-radius: 0; background: transparent; color: var(--color-fg); outline: none; -webkit-appearance: none; appearance: none; }
.itim-cmdk-list { list-style: none; margin: 6px 0 0; padding: 0; max-height: min(24rem, 60vh); overflow: auto; }
.itim-cmdk-list li[role="option"] { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 8px; cursor: pointer; font-size: 0.875rem; }
.itim-cmdk-list li[aria-selected="true"] { background: var(--itim-accent); color: #fff; }
.itim-cmdk-list li[aria-selected="true"] .itim-cmdk-sub, .itim-cmdk-list li[aria-selected="true"] .itim-cmdk-kind { color: color-mix(in srgb, #fff 82%, transparent); }
.itim-cmdk-list li[aria-selected="true"] .itim-grade { color: #fff; background: color-mix(in srgb, #fff 22%, transparent); }
.itim-cmdk-list .grow { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.itim-cmdk-sub { font-size: 0.75rem; color: var(--color-fg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.itim-cmdk-kind { font-size: 0.6875rem; color: var(--color-fg-muted); }
.itim-cmdk-ico { width: 28px; height: 28px; flex: none; display: grid; place-items: center; border-radius: 7px; background: var(--itim-fill); }
.itim-cmdk-ico .itim-grade { width: 28px; height: 28px; border-radius: 7px; }
.itim-cmdk-group { font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-fg-muted); padding: 10px 10px 4px; }
.itim-cmdk-empty { padding: 14px 10px; font-size: 0.875rem; color: var(--color-fg-muted); }
.itim-cmdk-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 6px 4px 2px; padding-top: 6px; border-top: 0.5px solid var(--itim-hair); font-size: 0.6875rem; color: var(--color-fg-muted); }
@container itim (max-width: 640px) {
  .itim-cmdk-wrap { flex: 1 1 100%; }
  .itim-cmdk { left: 0; right: 0; width: auto; }
}

/* Shell: tabs on top when narrow; a sidebar when wide; the client panel beside the page */
.itim-shell { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "nav" "sheet" "main"; column-gap: 24px; align-items: start; }
.itim-shell > .itim-tabs { grid-area: nav; }
.itim-main { grid-area: main; min-width: 0; container: main / inline-size; }
.itim-sheet { grid-area: sheet; min-width: 0; margin: 0 0 var(--cds-gap-lg); }
.itim-sheet[hidden] { display: none; }
.itim-tabs .ico { display: none; width: 18px; height: 18px; flex: none; }
.itim-tabs button { display: inline-flex; align-items: center; gap: 8px; }
@container itim (min-width: 980px) {
  .itim-shell.has-sheet { grid-template-columns: minmax(0, 1fr) minmax(340px, 380px); grid-template-areas: "nav nav" "main sheet"; }
  .itim-sheet { position: sticky; top: 60px; max-height: calc(100vh - 76px); overflow: auto; margin: 0; overscroll-behavior: contain; }
}
@container itim (min-width: 1180px) {
  .itim-shell { grid-template-columns: 200px minmax(0, 1fr); grid-template-areas: "nav main"; }
  .itim-shell.has-sheet { grid-template-columns: 200px minmax(0, 1fr) minmax(360px, 400px); grid-template-areas: "nav main sheet"; }
  .itim-shell > .itim-tabs { flex-direction: column; width: auto; position: sticky; top: 12px; padding: 6px; gap: 1px; margin: 0;
    background: color-mix(in srgb, var(--color-fg) 3.5%, transparent); -webkit-backdrop-filter: none; backdrop-filter: none; border-radius: 14px; box-shadow: none; overflow: visible; }
  .itim-tabs button { display: flex; padding: 8px 10px; font-size: 0.875rem; font-weight: 500; border-radius: 9px; color: var(--color-fg); }
  .itim-tabs button:hover { background: var(--itim-fill); }
  .itim-tabs button[aria-selected="true"] { background: color-mix(in srgb, var(--itim-accent) 14%, transparent); color: var(--itim-accent); box-shadow: none; font-weight: 600; }
  .itim-tabs .ico { display: block; color: var(--itim-accent); }
  .itim-tabs .itim-badge:not(:empty) { margin-left: auto; }
  .itim-tabs .itim-badge + .itim-badge:not(:empty) { margin-left: 4px; }
  .itim-sheet { top: 12px; max-height: calc(100vh - 24px); }
}

/* Small segmented control and card header row */
.itim-card-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin-bottom: 4px; }
.itim-card-head .itim-card-title { margin: 0; }
.itim-seg-sm { padding: 2px; border-radius: 9px; }
.itim-seg-sm button { padding: 4px 10px; font-size: 0.75rem; border-radius: 7px; }
.itim-legend-btn { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px 2px 6px; border-radius: 999px; transition: opacity .15s, background-color .15s; }
.itim-legend-btn:hover { background: var(--itim-fill); }
.itim-legend-btn[aria-pressed="false"] { opacity: 0.45; }
.itim-legend-btn[aria-pressed="false"] span { text-decoration: line-through; }

/* Today */
.itim-today { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cds-gap-lg); align-items: start; }
@container main (min-width: 760px) { .itim-today { grid-template-columns: minmax(0, 1fr) minmax(200px, 260px); } }
.itim-glance { display: grid; gap: var(--cds-gap-md); grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); }
@container main (min-width: 760px) { .itim-glance { grid-template-columns: 1fr; position: sticky; top: 12px; } }
.itim-glance .itim-tile { padding: 16px 18px; gap: 4px; }
.itim-glance .itim-tile-value { font-size: 1.625rem; }
.itim-inbox { padding: 20px 20px 12px; }
.itim-inbox-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px 16px; }
.itim-inbox-head .itim-card-note { margin-bottom: 0; }
.itim-inbox-list, .itim-inbox-items { list-style: none; margin: 0; padding: 0; }
.itim-inbox-list.dash-skeleton { min-height: 12rem; }
.itim-inbox-sec > h4 { font-size: 0.75rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-fg-muted); margin: 20px 8px 4px; }
.itim-inbox-item { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; padding: 10px 8px; border-radius: 12px; position: relative; }
.itim-inbox-item + .itim-inbox-item::before { content: ""; position: absolute; top: 0; left: 50px; right: 8px; border-top: 0.5px solid var(--itim-hair); }
.itim-inbox-item.is-click { cursor: pointer; transition: background-color .12s; }
.itim-inbox-item.is-click:hover { background: var(--itim-fill-2); }
.itim-inbox-item.is-click:hover::before, .itim-inbox-item.is-click:hover + .itim-inbox-item::before { opacity: 0; }
.itim-ico { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; color: #fff; grid-row: span 2; align-self: start; margin-top: 1px; }
.itim-ico .ico-sm { width: 17px; height: 17px; }
.itim-ico b { font-family: var(--itim-font-num); font-size: 0.875rem; font-weight: 700; }
.itim-inbox-mid { min-width: 0; }
.itim-inbox-title { font-size: 0.9375rem; font-weight: 600; line-height: 1.3; letter-spacing: -0.01em; }
.itim-inbox-sub { font-size: 0.8125rem; line-height: 1.4; color: var(--color-fg-muted); margin-top: 1px; }
.itim-inbox-amt { text-align: right; font-family: var(--itim-font-num); font-weight: 600; font-size: 0.9375rem; font-variant-numeric: tabular-nums; white-space: nowrap; align-self: start; }
.itim-inbox-amt small { display: block; font-family: var(--itim-font); font-size: 0.6875rem; font-weight: 500; color: var(--color-fg-muted); }
.itim-inbox-acts { grid-column: 2 / -1; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.itim-tbtn { all: unset; box-sizing: border-box; cursor: pointer; display: inline-flex; align-items: center; font-size: 0.75rem; font-weight: 600; line-height: 1.4; padding: 4px 11px; border-radius: 999px;
  background: color-mix(in srgb, var(--itim-accent) 13%, transparent); color: var(--itim-accent); text-decoration: none; white-space: nowrap; transition: background-color .15s; }
.itim-tbtn:hover { background: color-mix(in srgb, var(--itim-accent) 20%, transparent); }
.itim-tbtn.gray { background: var(--itim-fill); color: var(--color-fg); }
.itim-tbtn.gray:hover { background: color-mix(in srgb, var(--color-fg) 10%, transparent); }
.itim-more { all: unset; cursor: pointer; display: block; margin: 2px 0 4px 50px; padding: 6px 0; font-size: 0.8125rem; font-weight: 500; color: var(--itim-accent); }
.itim-more:hover { text-decoration: underline; text-underline-offset: 3px; }
@container main (max-width: 520px) {
  .itim-inbox-item { grid-template-columns: 30px minmax(0, 1fr); }
  .itim-inbox-amt { grid-column: 2; text-align: left; display: flex; gap: 6px; align-items: baseline; }
}

/* Client panel */
.itim-sheet { background: var(--color-panel); border-radius: var(--itim-r-lg); box-shadow: var(--itim-shadow-hover); padding: 20px; box-sizing: border-box; scrollbar-width: thin; }
@media (prefers-reduced-motion: no-preference) {
  @keyframes itim-sheet-in { from { opacity: 0; transform: translateX(14px); } to { opacity: 1; transform: none; } }
  .itim-sheet:not([hidden]) { animation: itim-sheet-in var(--cds-dur-slow) var(--cds-ease-out) both; }
}
.itim-sheet .itim-profile { margin: 0; }
.itim-sheet .itim-profile-head { display: grid; gap: 10px; margin-bottom: 16px; }
.itim-profile-top { display: flex; align-items: center; gap: 10px; }
.itim-profile-top h3 { flex: 1; min-width: 0; font-family: var(--itim-font-display); font-weight: 700; font-size: 1.375rem; line-height: 1.2; letter-spacing: -0.02em; margin: 0; outline: none; }
.itim-profile-pills { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.itim-profile-btns { display: flex; flex-wrap: wrap; gap: 6px; }
.itim-sheet-close { all: unset; cursor: pointer; flex: none; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; font-size: 1.125rem; line-height: 1;
  background: var(--itim-fill); color: var(--color-fg-muted); }
.itim-sheet-close:hover { background: color-mix(in srgb, var(--color-fg) 10%, transparent); color: var(--color-fg); }
.itim-sheet .itim-mini { grid-template-columns: repeat(auto-fit, minmax(min(100%, 7.5rem), 1fr)); gap: 8px; margin-bottom: 4px; }
.itim-sheet .itim-mini div { padding: 10px 12px; }
.itim .itim-sheet .itim-mini b { font-size: 1.0625rem; }
.itim-sec { font-size: 0.75rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-fg-muted); margin: 20px 0 6px; }
.itim-sheet .itim-list li { align-items: center; }
.itim-sheet .itim-list .itim-tbtn { margin-left: 4px; }
.itim-kv { list-style: none; margin: 0; padding: 0 12px; border-radius: var(--itim-r-md); background: var(--itim-fill-2); }
.itim-kv li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 9px 0; border-bottom: 0.5px solid var(--itim-hair); font-size: 0.8125rem; }
.itim-kv li:last-child { border-bottom: 0; }
.itim-kv li span { color: var(--color-fg-muted); flex: none; }
.itim .itim-kv li b { font-weight: 600; text-align: right; min-width: 0; overflow-wrap: anywhere; }
.itim-quicktask { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 10px; margin: 0 0 12px; border-radius: var(--itim-r-md); background: var(--itim-fill-2); }
.itim-quicktask[hidden] { display: none; }
.itim-quicktask .itim-input { flex: 1 1 10rem; min-width: 0; }
.itim-quicktask .itim-input[type="date"] { flex: 0 1 9.5rem; }
.itim-sheet #profile-chart { min-height: 180px; }
.itim .itim-profile-top h3:focus-visible, .itim .itim-cmdk-input:focus-visible { outline: none; }
.itim-cmdk-input::-webkit-search-cancel-button { display: none; }
.itim-sheet { scroll-margin-top: 56px; }
.itim-today { margin-bottom: var(--cds-gap-xl); }
#today > .itim-tiles { margin-bottom: var(--cds-gap-lg); }
/* What changed */
.itim-changes { padding: 18px; }
.itim-changes .itim-card-note { margin-bottom: 6px; }
.itim-changes-list, .itim-changes-list ul { list-style: none; margin: 0; padding: 0; }
.itim-changes-list.dash-skeleton { min-height: 6rem; }
.itim-changes-day > h4 { font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-fg-muted); margin: 12px 0 2px; }
.itim-change { padding: 8px 8px; margin: 0 -8px; border-radius: 10px; cursor: pointer; transition: background-color .12s; }
.itim-change:hover { background: var(--itim-fill-2); }
.itim-change + .itim-change { border-top: 0.5px solid var(--itim-hair); }
.itim-change-top { display: flex; align-items: center; gap: 6px; }
.itim-change-name { font-weight: 600; font-size: 0.875rem; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.itim .itim-change-amt { font-family: var(--itim-font-num); font-weight: 600; font-size: 0.875rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.itim-change .itim-pill { font-size: 0.6875rem; padding: 1px 7px; }
.itim-change-detail { margin-top: 2px; line-height: 1.35; }
/* Forecast tiles */
#forecast-tiles small { display: block; margin-top: 2px; font-size: 0.6875rem; }
#scorecard { grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.5rem), 1fr)); gap: var(--cds-gap-md); }
#scorecard .itim-tile { padding: 16px 16px; }
#scorecard .itim-tile-value { font-size: clamp(1.5rem, 1.2rem + 0.6vw, 1.875rem); }
.itim-lifted { font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
.itim-lifted .itim-list { list-style: none; padding: 0; }
.itim-lifted .itim-list li { display: flex; gap: 8px; align-items: baseline; padding: 10px 0; border-bottom: 0.5px solid color-mix(in srgb, var(--color-fg) 9%, transparent); font-size: 0.875rem; }
.itim-lifted .itim-list .grow { flex: 1; }
.itim-lifted { --itim-fill: color-mix(in srgb, var(--color-fg) 6%, transparent); --itim-hair: color-mix(in srgb, var(--color-fg) 9%, transparent); --itim-accent: #007aff; --itim-r-lg: 18px; color: var(--color-fg); }
/* Wide tables: wrap text, keep numbers on one line, pin the first column, always-visible thin scrollbars, and an edge shadow while more columns are hidden */
.itim .itim-table td { padding: 9px 9px; }
.itim .itim-table th { white-space: normal; vertical-align: bottom; line-height: 1.25; min-width: 3.5rem; }
.itim .itim-table td.l, .itim .itim-table td.itim-wrap { white-space: normal; min-width: 7rem; max-width: 22rem; line-height: 1.35; }
.itim .itim-table th:first-child, .itim .itim-table td:first-child { position: sticky; left: 0; background: var(--color-panel); }
.itim .itim-table td:first-child { z-index: 1; }
.itim .itim-table th:first-child { z-index: 3; }
.itim .itim-table tr.itim-click:hover td:first-child { background: color-mix(in srgb, var(--color-fg) 4%, var(--color-panel)); }
.itim .itim-table tr.itim-sel td:first-child { background: color-mix(in srgb, var(--itim-accent) 10%, var(--color-panel)); }
.itim .itim-tablebox.sc-l td:first-child, .itim .itim-tablebox.sc-l th:first-child { box-shadow: 8px 0 10px -8px color-mix(in srgb, #000 35%, transparent); clip-path: inset(0 -16px 0 0); }
.itim .itim-tablebox { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--color-fg) 28%, transparent) transparent; overscroll-behavior-x: contain;
  background: radial-gradient(farthest-side at 100% 50%, color-mix(in srgb, #000 16%, transparent), transparent) right center / 12px 100% no-repeat scroll; background-color: transparent; }
.itim .itim-tablebox:not(.sc-r) { background: none; }
.itim .itim-tablebox::-webkit-scrollbar { width: 10px; height: 10px; }
.itim .itim-tablebox::-webkit-scrollbar-track { background: transparent; }
.itim .itim-tablebox::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--color-fg) 24%, transparent); border-radius: 10px; border: 2px solid transparent; background-clip: padding-box; }
.itim .itim-tablebox::-webkit-scrollbar-thumb:hover { background-color: color-mix(in srgb, var(--color-fg) 40%, transparent); }
.itim .itim-tablebox::-webkit-scrollbar-corner { background: transparent; }
.itim-scrollhint { display: none; font-size: 0.75rem; color: var(--color-fg-muted); margin: 6px 0 0; }
.itim-scrollhint.on { display: block; }
.itim-grid:has(.itim-tablebox) { grid-template-columns: repeat(auto-fit, minmax(min(100%, 40rem), 1fr)); }
.itim .itim-act { min-width: 12.5rem; }
.itim .itim-table th:first-child, .itim .itim-table td:first-child { box-shadow: -10px 0 0 var(--color-panel); clip-path: inset(0 0 0 -10px); }
.itim .itim-table tr.itim-click:hover td:first-child { box-shadow: -10px 0 0 color-mix(in srgb, var(--color-fg) 4%, var(--color-panel)); }
.itim .itim-tablebox.sc-l td:first-child, .itim .itim-tablebox.sc-l th:first-child { box-shadow: -10px 0 0 var(--color-panel), 8px 0 10px -8px color-mix(in srgb, #000 35%, transparent); clip-path: inset(0 -16px 0 -10px); }
.itim .itim-tablebox.sc-l tr.itim-click:hover td:first-child { box-shadow: -10px 0 0 color-mix(in srgb, var(--color-fg) 4%, var(--color-panel)), 8px 0 10px -8px color-mix(in srgb, #000 35%, transparent); }
.itim .itim-table td.itim-wrap { min-width: 10rem; }
/* Appearance switch */
.itim-cmdk-wrap { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.itim-theme { align-self: flex-end; }
@container itim (max-width: 640px) { .itim-theme { align-self: flex-start; } }
[data-itim-theme] { background: var(--itim-page); border-radius: 18px; color: var(--color-fg); padding-block: 4px; }
[data-itim-theme="light"] { color-scheme: light; --itim-page: #f5f5f7;
  --color-fg: #1d1d1f; --color-fg-muted: #6e6e73; --color-bg: #ffffff; --color-panel: #ffffff; --color-border-line: #e5e5ea;
  --color-ok: #248a3d; --color-warn: #b25000; --color-bad: #d70015; --cds-surface-popover: #ffffff; --cds-text-secondary: #6e6e73;
  --cds-chart-grid: #ececf0; --cds-chart-axis: #c7c7cc; --cds-chart-reference: #8e8e93; --cds-chart-muted: #c7c7cc; --cds-chart-status-critical: #ff3b30; }
[data-itim-theme="dark"] { color-scheme: dark; --itim-page: #000000;
  --color-fg: #f5f5f7; --color-fg-muted: #98989d; --color-bg: #000000; --color-panel: #1c1c1e; --color-border-line: #38383a;
  --color-ok: #30d158; --color-warn: #ff9f0a; --color-bad: #ff453a; --cds-surface-popover: #2c2c2e; --cds-text-secondary: #98989d;
  --cds-chart-grid: #2c2c2e; --cds-chart-axis: #48484a; --cds-chart-reference: #8e8e93; --cds-chart-muted: #48484a; --cds-chart-status-critical: #ff453a; }
/* License cost vs billed */
.itim-lic { border-radius: var(--itim-r-md); background: var(--itim-fill-2); padding: 2px 12px; font-size: 0.8125rem; font-variant-numeric: tabular-nums; }
.itim-lic-row { display: grid; grid-template-columns: minmax(0, 1fr) 4.6rem 4.6rem 3.2rem; gap: 8px; align-items: baseline; padding: 8px 0; border-bottom: 0.5px solid var(--itim-hair); }
.itim-lic-row > span:not(.itim-lic-name) { text-align: right; white-space: nowrap; }
.itim-lic-row:last-child { border-bottom: 0; }
.itim-lic-head { font-size: 0.6875rem; font-weight: 600; color: var(--color-fg-muted); padding-top: 10px; }
.itim-lic-name { min-width: 0; }
.itim .itim-lic-name b { font-weight: 600; display: block; overflow-wrap: anywhere; }
.itim-lic-name small { display: block; margin-top: 1px; font-size: 0.75rem; }
.itim-lic-total { font-weight: 600; }
.itim-cmdk { top: 46px; }
.itim-lic-row > span:first-child { text-align: left; }
/* People, assignments, activity */
.itim-cmdk-wrap { flex-direction: column; }
.itim-me { display: inline-flex; align-items: center; gap: 6px; font-size: 0.75rem; color: var(--color-fg-muted); align-self: flex-end; }
@container itim (max-width: 640px) { .itim-me { align-self: flex-start; } }
.itim-me-sel, .itim-assign { font: inherit; font-size: 0.75rem; font-weight: 600; border: 0; border-radius: 999px; padding: 4px 26px 4px 11px; cursor: pointer; color: var(--color-fg);
  background: var(--itim-fill) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%238e8e93' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9 5-5 5 5M7 15l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 9px center;
  -webkit-appearance: none; appearance: none; }
.itim-assign { background-color: transparent; box-shadow: inset 0 0 0 1px var(--itim-hair); color: var(--color-fg-muted); font-weight: 500; }
.itim-assign:hover { color: var(--color-fg); }
.itim-pill-who { background: color-mix(in srgb, var(--ap-indigo, #5856d6) 14%, transparent); color: var(--ap-indigo, #5856d6); }
.itim-pill-who.is-me { background: color-mix(in srgb, var(--itim-accent) 14%, transparent); color: var(--itim-accent); }
.itim-people { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 4px; }
.itim-people .itim-input { width: 13rem; }
.itim-person { display: inline-flex; align-items: center; gap: 6px; padding: 3px 6px 3px 3px; border-radius: 999px; background: var(--itim-fill); font-size: 0.8125rem; font-weight: 500; }
.itim-person-x { all: unset; cursor: pointer; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; color: var(--color-fg-muted); }
.itim-person-x:hover { background: color-mix(in srgb, var(--color-fg) 10%, transparent); color: var(--color-fg); }
.itim-avatar { width: 22px; height: 22px; flex: none; border-radius: 50%; display: inline-grid; place-items: center; font-size: 0.6875rem; font-weight: 700; color: #fff; background: var(--ap-indigo, #5856d6); }
.itim-activity { list-style: none; margin: 0; padding: 0; max-height: 26rem; overflow: auto; }
.itim-activity li { display: flex; gap: 10px; align-items: flex-start; padding: 9px 4px; border-bottom: 0.5px solid var(--itim-hair); font-size: 0.8125rem; line-height: 1.4; }
.itim-activity li:last-child { border-bottom: 0; }
.itim-activity li.is-click { cursor: pointer; border-radius: 8px; }
.itim-activity li.is-click:hover { background: var(--itim-fill-2); }
.itim-activity .grow { flex: 1; min-width: 0; }
.itim .itim-activity b { font-weight: 600; }
