/* SMDL components 1.3.0 — the approved workspace and record language.
   CORE owns this source. Consumers ship a digest-verified local snapshot.
   Product colors and domain layouts remain product-owned. */
:root {
  --smdl-text-body: .875rem;
  --smdl-text-control: .875rem;
  --smdl-text-meta: .75rem;
  --smdl-text-section: 1rem;
  --smdl-text-mode: .8125rem;
  --smdl-text-heading: 1.375rem;
  --smdl-text-metric: 1.75rem;
  --smdl-text-display: 2.25rem;
  --smdl-leading-body: 1.5;
  --smdl-leading-heading: 1.3;
  --smdl-weight-regular: 400;
  --smdl-weight-medium: 500;
  --smdl-weight-semibold: 600;
  --smdl-control-height: 36px;
  --smdl-control-small: 30px;
  --smdl-control-pad: 6px;
  --smdl-control-radius: 8px;
  --smdl-row-padding: 12px;
  --smdl-control-line: var(--line);
  --smdl-control-line-hover: var(--line-strong, var(--ink-3));
  --smdl-space-1: 4px;
  --smdl-space-2: 8px;
  --smdl-space-3: 12px;
  --smdl-space-4: 16px;
  --smdl-space-6: 24px;
  --smdl-space-8: 32px;
  --smdl-sheet-inset: 28px;
  --smdl-sheet-setup: 640px;
  --smdl-sheet-record: 680px;
  --smdl-sheet-review: 760px;
  --smdl-drop-surface: color-mix(in srgb, #6798ed 14%, var(--surface));
  --w-fly-s: var(--smdl-sheet-setup);
  --w-fly-m: var(--smdl-sheet-record);
  --w-fly-l: var(--smdl-sheet-review);
}
/* Compact also works before JavaScript and when browser storage is blocked.
   An explicitly saved Comfortable preference always wins. */
:root[data-smdl-ui-size="comfortable"] {
  --smdl-text-body: 1rem;
  --smdl-text-control: 1rem;
  --smdl-text-meta: .875rem;
  --smdl-text-section: 1.125rem;
  --smdl-text-mode: .875rem;
  --smdl-text-heading: 1.5rem;
  --smdl-text-metric: 2rem;
  --smdl-text-display: 2.5rem;
  --smdl-control-height: 44px;
  --smdl-control-small: 36px;
  --smdl-control-pad: 10px;
  --smdl-row-padding: 18px;
}
.smdl {
  --smdl-side: 16rem;
  --smdl-rail-width: var(--smdl-side);
  --smdl-search-width: clamp(320px, 36vw, 520px);
  --ctl: var(--smdl-control-height);
  --ctl-h: var(--smdl-control-height);
  --ctl-h-sm: var(--smdl-control-small);
  --ctl-fs: var(--smdl-text-control);
  --ctl-radius: var(--smdl-control-radius);
  --text-body: var(--smdl-text-body);
  --text-caption: var(--smdl-text-meta);
  --text-h1: var(--smdl-text-heading);
  --text-h2: var(--smdl-text-section);
  font-size: var(--smdl-text-body); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-regular);
}
.smdl .smdl-heading h1 {
  font-size: var(--smdl-text-heading); line-height: var(--smdl-leading-heading);
  font-weight: var(--smdl-weight-semibold); text-transform: none; letter-spacing: normal;
}
.smdl :is(b,strong):not(:where(.rich-editor *, .doc-content *, .wm-site-preview *)) { font-weight: var(--smdl-weight-semibold); }
.smdl .smdl-switch-btn > .ic.chev { display: none; }
.smdl.is-slim { --smdl-rail-width: var(--smdl-side-slim); }
.smdl .smdl-top { background: var(--canvas); border-bottom: 0; }
.smdl .smdl-side-foot { border-top: 0; }
.smdl .smdl-org .who { flex: 1; min-width: 0; }
.smdl .smdl-side-scroll > :is(a,.smdl-soon,.smdl-side-soon) { min-height: var(--smdl-control-height); height: auto; flex-shrink: 0; }
.smdl .smdl-side a.is-active {
  background: var(--surface-2); color: var(--ink); font-weight: 600;
  box-shadow: inset 0 0 0 1px var(--line);
}
.smdl .smdl-side a.is-active > .ic { color: var(--accent-deep, var(--accent-ink)); }
/* Bind the actual shell markup, including non-link destinations and the
   mobile navigation host. One role includes size, leading, weight and case. */
:is(.smdl,.smdl-mobile-navigation) :is(.smdl-side a,.smdl-side-soon,.smdl-side-scroll > .smdl-soon),
.smdl :is(.smdl-new-item,.smdl-app-item,.smdl-appname,[data-smdl-side-toggle]) {
  font-size: var(--smdl-text-control); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal; text-transform: none;
}
.smdl .smdl-appname { font-weight: var(--smdl-weight-semibold); }
/* A user's larger text must wrap inside the expanded rail, not disappear
   behind a fixed-width label. Keep the icon-only rail's accessible hiding. */
@media (min-width: 901px) {
  .smdl:not(.is-slim) .smdl-side-scroll > :is(a,.smdl-soon,.smdl-side-soon) { padding-block: 8px; white-space: normal; }
  .smdl:not(.is-slim) .smdl-side-scroll > :is(a,.smdl-soon,.smdl-side-soon) .lbl {
    min-width: 0; white-space: normal; overflow-wrap: anywhere; overflow: visible; text-overflow: clip;
  }
  .smdl:not(.is-slim) :is(.smdl-cap,.smdl-org .who b,.smdl-org .who .org) { white-space: normal; overflow-wrap: anywhere; }
}
.smdl-mobile-navigation a.is-active { font-weight: var(--smdl-weight-semibold); }
:is(.smdl,.smdl-mobile-navigation) :is(.smdl-cap,.nav-group),
.smdl :is(.smdl-switch-sec,.smdl-new-sec,.smdl-search-group,.smdl-search-heading) {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal; text-transform: none;
}
.smdl :is(.smdl-app-item small,.smdl-new-item small,.smdl-switch-org,
  .smdl-search-heading small,.smdl-search-item small,.smdl-search-page-miss small,
  .smdl-search-empty small,.smdl-search-note,.smdl-search-error,.smdl-search-shortcut),
:is(.smdl,.smdl-mobile-navigation) :is(.smdl-org .who .org,.smdl-badge,.smdl-railcount,
  .smdl-side-soon .smdl-soon,.smdl-side-scroll > .smdl-soon .soon) {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-regular); letter-spacing: normal; text-transform: none;
}
.smdl :is(.smdl-brandrow,.smdl-search-item b,.smdl-search-page-miss strong,.smdl-search-empty strong),
:is(.smdl,.smdl-mobile-navigation) .smdl-org .who b {
  font-size: var(--smdl-text-body); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal; text-transform: none;
}
.smdl :is(.smdl-search-item,.smdl-search-page-miss,.smdl-search-note) { overflow-wrap: anywhere; }
.smdl .smdl-search-heading { flex-wrap: wrap; }
.smdl-tip {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body); font-weight: var(--smdl-weight-medium);
  max-width: min(36ch,calc(100vw - 24px)); white-space: normal; overflow-wrap: anywhere;
}
.smdl .smdl-search { height: auto; min-height: var(--smdl-control-height); border-radius: var(--smdl-control-radius); }
.smdl .smdl-search input { font-size: var(--smdl-text-control); }
.smdl :is(.smdl-new-main,.smdl-new-caret,.smdl-iconbtn,.account-v3-create-main,.account-v3-create-caret) {
  min-height: var(--smdl-control-height); height: auto;
}
.smdl :is(.smdl-new-btn,.smdl-new-main,.account-v3-create-main) { font-size: var(--smdl-text-control); font-weight: var(--smdl-weight-medium); }
.smdl :is(.smdl-new-caret,.smdl-iconbtn,.account-v3-create-caret) { min-width: var(--smdl-control-height); }
/* Saved-status segments own their child styles; inheriting a new size on the
   anchor alone leaves the legacy 12.5px label behind. */
.smdl .smdl-count { height: auto; min-height: var(--smdl-control-small); padding-block: 6px; }
.smdl .smdl-count .k {
  font-size: var(--smdl-text-control); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal; text-transform: none;
}
.smdl .smdl-count.is-on .k { font-weight: var(--smdl-weight-medium); }
.smdl .smdl-count :is(b,.d) {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal;
}

/* The family keeps a viewport-centred search while the title and tools fit.
   Search yields width before a narrow header needs its own second row. */
@media (min-width: 761px) {
  .smdl > .smdl-side { grid-column: 1; grid-row: 1 / -1; padding-top: calc(var(--smdl-top) + 12px); }
  .smdl > .smdl-corner { height: var(--smdl-top); align-self: start; background: var(--smdl-rail); border-bottom: 0; border-right: 1px solid var(--rail-hair); }
  .smdl .smdl-top, .smdl .smdl-top:has(.smdl-live-actions) {
    --smdl-search-width: clamp(240px,calc(100vw - 960px),520px);
    container: smdl-header / inline-size;
    grid-template-columns: minmax(0,calc((100vw - var(--smdl-search-width)) / 2 - var(--smdl-rail-width) - 24px)) var(--smdl-search-width) minmax(0,1fr);
    grid-template-rows: auto; column-gap: 0; row-gap: 8px; padding: 10px 24px;
  }
  .smdl .smdl-top :is(.smdl-heading,.smdl-pagetitle) {
    grid-column: 1; grid-row: 1; min-width: min(9rem,100%); max-width: 100%; padding-right: 16px;
  }
  .smdl .smdl-top :is(.smdl-heading h1,.smdl-pagetitle) {
    white-space: normal; overflow-wrap: anywhere; text-overflow: clip;
  }
  .smdl .smdl-top > .smdl-search, .smdl .smdl-top > .smdl-search-gap,
  .smdl .smdl-top:has(.smdl-live-actions) > .smdl-search {
    grid-column: 2; grid-row: 1; width: 100%; min-width: 0; justify-self: stretch;
  }
  .smdl .smdl-top .smdl-tools {
    grid-column: 3; grid-row: 1; padding-left: 16px; min-width: 0; flex-wrap: wrap; align-self: center;
  }
}
/* Use the space inside the header, including the current rail width, rather
   than making every desktop below a wide viewport use two rows. */
@container smdl-header (max-width: 760px) {
  .smdl .smdl-top :is(.smdl-heading,.smdl-pagetitle) { grid-column: 1 / 3; grid-row: 1; min-width: 0; }
  .smdl .smdl-top > .smdl-search, .smdl .smdl-top > .smdl-search-gap,
  .smdl .smdl-top:has(.smdl-live-actions) > .smdl-search {
    grid-column: 1 / -1; grid-row: 2; width: min(420px,100%); justify-self: center;
  }
}
@media (min-width: 761px) and (max-width: 900px) {
  .smdl { --smdl-rail-width: var(--smdl-side-slim); }
}

/* Selects retain native form state; their floating list is always neutral.
   A selected item has text plus a check. Color is never the only state cue. */
.smdl-select-trigger {
  box-sizing: border-box; width: 100%; height: auto; min-height: var(--smdl-control-height);
  padding: var(--smdl-control-pad) 12px; gap: 14px; border: 1px solid var(--smdl-control-line);
  border-radius: var(--smdl-control-radius); background: var(--surface); color: var(--ink);
  font: inherit; font-size: var(--smdl-text-control); font-weight: 400; line-height: 1.4;
  text-align: left; box-shadow: none;
}
.smdl-select-trigger:hover { border-color: var(--smdl-control-line-hover); }
.smdl-select-trigger:focus-visible { outline: 2px solid var(--ink-2); outline-offset: 2px; box-shadow: none; }
.smdl-select.is-open .smdl-select-trigger { border-color: var(--ink-2); box-shadow: none; }
.smdl-select-arrow { flex: none; align-self: center; margin: -3px 3px 0 auto; width: 6px; height: 6px; }
.smdl-select-menu {
  padding: 5px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--surface); color: var(--ink); box-shadow: 0 8px 24px rgb(0 0 0 / 10%);
}
.smdl-select-option {
  display: flex; align-items: center; min-height: var(--smdl-control-height); padding: var(--smdl-control-pad) 34px var(--smdl-control-pad) 11px;
  border-radius: 6px; background: transparent; color: var(--ink-2);
  font-size: var(--smdl-text-control); line-height: 1.4; font-weight: 400;
}
.smdl-select-option:is(.is-selected,.is-active,:hover) { background: var(--surface-2); color: var(--ink); }
.smdl-select-option.is-selected { font-weight: 500; }
.smdl-select-option.is-active { outline: 1px solid var(--smdl-control-line-hover); outline-offset: -1px; }
.smdl-select-option.is-selected::after { border-color: var(--accent-ink, var(--ink)); }
.smdl-select.is-disabled .smdl-select-trigger { color: var(--ink-3); background: var(--surface-2); cursor: not-allowed; }
.smdl-select-group, .smdl-select-option small, .smdl-mobile-navigation-label {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal; text-transform: none;
}
.smdl-select-option small { font-weight: var(--smdl-weight-regular); }
/* The select behavior uses a native dialog on phones. Its geometry belongs
   with the shared capability, including CORE/Account which have no product shell. */
.smdl-select-sheet {
  inset: auto 0 0; margin: 0 auto; width: min(100%,560px); max-width: 100%;
  max-height: calc(100dvh - 16px); padding: 0; border: 1px solid var(--line);
  border-radius: 16px 16px 0 0; background: var(--surface); color: var(--ink); overflow: hidden;
  box-shadow: 0 8px 24px rgb(0 0 0 / 10%);
}
.smdl-select-sheet[open] { display: flex; flex-direction: column; }
.smdl-select-sheet::backdrop { background: var(--scrim, rgb(0 0 0 / 25%)); }
.smdl-select-sheet > header {
  display: flex; align-items: center; justify-content: space-between; flex: none;
  padding: 8px 12px 8px 20px; border-bottom: 1px solid var(--line); gap: 12px;
}
.smdl-select-sheet > header button { min-width: 44px; min-height: 44px; }
.smdl-select-sheet > header strong {
  font-size: var(--smdl-text-body); line-height: var(--smdl-leading-body); font-weight: var(--smdl-weight-semibold);
}
.smdl-select-sheet .smdl-select-menu {
  position: relative; inset: auto; min-width: 0; min-height: 0;
  max-height: calc(100dvh - 86px); width: 100%; border: 0; border-radius: 0;
  box-shadow: none; overflow-y: auto; padding: 8px 8px max(16px,env(safe-area-inset-bottom)); outline: none;
}

/* Existing product primitives, shared by the independent application shells.
   CORE/Account adapt their separately named content components locally. */
.smdl .smdl-canvas { font-size: var(--smdl-text-body); line-height: 1.5; }
.smdl :is(.card h2,.empty h2,.formpage h2) {
  font-size: var(--smdl-text-section); line-height: var(--smdl-leading-heading);
  font-weight: var(--smdl-weight-semibold); letter-spacing: normal; text-transform: none;
}
.smdl :is(table.list,.reader,.kv,.card-sub,.pagehead .lede,.checkline,.note) {
  font-size: var(--smdl-text-body); line-height: 1.5;
}
.smdl :is(.pagehead .eyebrow,.field .label,.field .help,.help,.hint,.row-sub,.rowsub,.pill,
  table.list .ref,table.list th,.listcap,.pager-count,.chip) { font-size: var(--smdl-text-meta); line-height: 1.5; }
.smdl table.list th { text-transform: none; letter-spacing: normal; font-weight: var(--smdl-weight-medium); }
.smdl :is(.pagehead .eyebrow,.field .label,.listcap) {
  font-weight: var(--smdl-weight-medium); text-transform: none; letter-spacing: normal;
}
.smdl table.list td { padding-block: var(--smdl-row-padding); }
.smdl :is(.field .label,.pagehead .eyebrow) { margin-bottom: 8px; }
:is(.smdl,.workspace-record,.ticket-create,.approval-review,.core-context-flyout,.account-v3-drawer,.smdl-fly) :is(.field > input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file]),
  .field > textarea,.field > select:not(.smdl-select-native)) {
  box-sizing: border-box; min-height: var(--smdl-control-height); height: auto;
  width: 100%; max-width: 100%; border: 1px solid var(--line, var(--hair));
  background: var(--field, var(--surface)); color: var(--ink); font-family: inherit;
  padding: var(--smdl-control-pad) 12px; border-radius: var(--smdl-control-radius);
  font-size: var(--smdl-text-control); line-height: 1.4;
}
:is(.smdl .smdl-canvas,.workspace-record,.ticket-create,.approval-review,.core-context-flyout,.account-v3-drawer,.smdl-fly) .btn {
  min-height: var(--smdl-control-height); height: auto; padding: var(--smdl-control-pad) 14px;
  font-size: var(--smdl-text-control); line-height: 1.35; border-radius: var(--smdl-control-radius);
  font-weight: var(--smdl-weight-medium); text-transform: none; letter-spacing: normal;
}
:is(.smdl .smdl-canvas,.workspace-record,.ticket-create,.approval-review,.core-context-flyout,.account-v3-drawer,.smdl-fly) .btn-sm { min-height: var(--smdl-control-small); padding: 7px 12px; }
.smdl .smdl-canvas .form-grid { gap: 20px; }
.smdl .card-sub, .smdl .pagehead .lede { max-width: 76ch; }
.smdl .smdl-canvas .form-actions { justify-content: flex-end; }
/* A card header has two slots: readable copy and trailing actions. Direct
   links and the explicit action group obey the same contract. */
.smdl .smdl-canvas :is(.cardhead,.card-head,.panel-head) {
  display: flex; align-items: center; flex-wrap: wrap; gap: 12px 16px;
}
.smdl .smdl-canvas :is(.cardhead,.card-head,.panel-head) > :first-child:not(:is(.btn,button,.actions,.btnrow)) {
  flex: 1 1 16rem; min-width: 0; overflow-wrap: anywhere;
}
.smdl .smdl-canvas :is(.cardhead,.card-head,.panel-head) > :is(.actions,.btnrow) {
  display: flex; flex: 0 1 auto; flex-wrap: wrap; align-items: center;
  justify-content: flex-end; gap: 8px; margin-inline-start: auto; max-width: 100%;
}
.smdl .smdl-canvas :is(.cardhead,.card-head,.panel-head) > :is(.btn,button):last-child {
  flex: 0 0 auto; margin-inline-start: auto; max-width: 100%;
}
.smdl .smdl-canvas :is(.cardhead,.card-head,.panel-head) :is(.btn,button) {
  white-space: normal; overflow-wrap: anywhere;
}
/* Intrinsic grid floors must never be wider than a phone content column. */
.smdl .smdl-canvas .grid.two { grid-template-columns: repeat(auto-fit,minmax(min(100%,320px),1fr)); }
.smdl .smdl-canvas .grid.three { grid-template-columns: repeat(auto-fit,minmax(min(100%,240px),1fr)); }
.smdl .smdl-canvas .grid.kpis { grid-template-columns: repeat(auto-fit,minmax(min(100%,150px),1fr)); }
.smdl .smdl-canvas .form-grid { grid-template-columns: repeat(auto-fit,minmax(min(100%,240px),1fr)); }
.smdl .smdl-canvas :where(.card,.panel,.grid,.form-grid,.field,.tablewrap,.actions,.btnrow) {
  min-width: 0; max-width: 100%; box-sizing: border-box;
}
.smdl .smdl-canvas :where(.tablewrap) { overflow: auto; overscroll-behavior-x: contain; overscroll-behavior-y: auto; }
.smdl .smdl-canvas :where(.form-actions,.btnrow) { flex-wrap: wrap; gap: 8px; }
.smdl .smdl-canvas :where(.form-actions,.btnrow) > :is(.btn,button) { max-width: 100%; white-space: normal; }
.smdl .smdl-canvas :where(.inlineform) { flex-wrap: wrap; }
.smdl .smdl-canvas :where(.inlineform) :is(input,select,.smdl-select) { min-width: min(180px,100%); max-width: 100%; }

.smdl .smdl-canvas :is(.cardhead,.card-head) > :is(h2,h3) { margin: 0; }
.smdl table.list .subject { font-weight: var(--smdl-weight-medium); }

/* Modes and subsets share an inset control. Navigation between record
   sections keeps the separate underline pattern below. */
.smdl :is(.smdl-counts,.sm-segmented,.work-view-tabs),.smdl-segmented {
  display: inline-flex; align-items: stretch; flex-wrap: nowrap; gap: 2px;
  width: max-content; max-width: 100%; padding: 2px; box-sizing: border-box;
  background: color-mix(in srgb,var(--ink) 7%,var(--surface));
  border: 0; border-radius: 7px; overflow-x: auto;
  box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--line) 55%,transparent);
}
.smdl :is(.smdl-counts,.sm-segmented,.work-view-tabs) > :is(a,button),.smdl-segmented > :is(a,button) {
  display: inline-flex; align-items: center; justify-content: center; flex: 1 0 auto;
  gap: 8px; min-height: var(--smdl-control-small); height: auto; padding: 4px 12px;
  border: 0; border-radius: 5px; background: transparent; box-shadow: none;
  color: var(--ink-2); font: inherit; font-size: var(--smdl-text-mode);
  font-weight: var(--smdl-weight-regular); line-height: 1.4; white-space: nowrap;
  text-decoration: none; cursor: pointer;
}
.smdl :is(.smdl-counts,.sm-segmented,.work-view-tabs) > :is(.is-on,.is-active,[aria-selected="true"],[aria-pressed="true"]),
.smdl-segmented > :is(.is-on,.is-active,[aria-selected="true"],[aria-pressed="true"]) {
  background: var(--surface); color: var(--ink); font-weight: var(--smdl-weight-medium);
  box-shadow: 0 1px 2px rgb(16 24 40 / 4%);
}
.smdl .smdl-count .k { font-size: var(--smdl-text-mode); font-weight: inherit; }
.smdl .smdl-count :is(b,.d) { background: transparent; padding: 0; color: var(--ink-2); font-weight: 400; }
.smdl :is(.smdl-counts,.sm-segmented,.work-view-tabs) > :focus-visible,.smdl-segmented > :focus-visible {
  outline: 2px solid var(--ink-2); outline-offset: -2px;
}

/* Records can be portalled to body. Their typography and controls must not
   depend on inheriting from the product's .smdl element. */
:is(.workspace-record,.ticket-create,.approval-review,.core-context-flyout,.account-v3-drawer,.smdl-fly) {
  font-family: var(--sans,system-ui,sans-serif); font-size: var(--smdl-text-body);
  line-height: var(--smdl-leading-body); font-weight: var(--smdl-weight-regular);
}
:is(.workspace-record,.ticket-create,.approval-review,.core-context-flyout,.account-v3-drawer,.smdl-fly) :is(button,input,select,textarea) { font-family: inherit; }
:is(.workspace-record,.ticket-create,.approval-review,.core-context-flyout,.account-v3-drawer,.smdl-fly) :is(.field .label,.field > label,.rowsub,.help,.card-sub,dt) {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body);
}
:is(.workspace-record,.ticket-create,.approval-review,.core-context-flyout,.account-v3-drawer,.smdl-fly) :is(.card h2,.card h3,.cardhead h2,.cardhead h3,.rec-panel h3) {
  font-size: var(--smdl-text-section); line-height: var(--smdl-leading-heading); font-weight: var(--smdl-weight-semibold);
}
:is(.workspace-record,.ticket-create,.approval-review,.core-context-flyout,.account-v3-drawer) {
  --smdl-sheet-width: var(--smdl-sheet-record);
  width: min(var(--smdl-sheet-width),100vw); max-width: 100vw;
  padding: 0; border-radius: 0; overflow: hidden;
}
:is(.workspace-record.connection-dialog,.workspace-record.smdl-setup-sheet,.ticket-create,.core-context-flyout) { --smdl-sheet-width: var(--smdl-sheet-setup); }
.workspace-record:is(.source-review-panel,.pipeline-panel,.sm-review-sheet) { --smdl-sheet-width: var(--smdl-sheet-review); }
.workspace-record[open] { display: flex; flex-direction: column; }
:is(.workspace-record-head,.ticket-create-head,.approval-review-head) {
  flex: none; display: flex; align-items: flex-start; gap: 16px;
  padding: 24px var(--smdl-sheet-inset) 16px; border: 0;
}
:is(.workspace-record-head,.ticket-create-head,.approval-review-head) > div { flex: 1; min-width: 0; }
:is(.workspace-record-head,.ticket-create-head,.approval-review-head) :is(h2,h3) {
  margin: 0; font-size: var(--smdl-text-heading); line-height: var(--smdl-leading-heading);
  font-weight: var(--smdl-weight-semibold); letter-spacing: normal; overflow-wrap: anywhere;
}
:is(.workspace-record-head,.ticket-create-head,.approval-review-head) :is(small,.preview-task-context) {
  display: block; margin-block: 8px 0; color: var(--ink-2); font-size: var(--smdl-text-meta);
}
:is(.workspace-record-head,.ticket-create-head,.approval-review-head) :is(.smdl-iconbtn,[data-panel-close],[data-dialog-close]) {
  display: inline-grid; place-items: center; flex: none; width: 36px; height: 36px;
  min-width: 36px; min-height: 36px; padding: 0; border: 1px solid var(--line);
  border-radius: 50%; color: var(--ink-2); background: var(--surface);
}
:is(.workspace-record-body,.ticket-create-body,.approval-review-body) {
  flex: 1; min-height: 0; min-width: 0; overflow: auto; overscroll-behavior: contain;
  padding: 8px var(--smdl-sheet-inset) 32px; font-size: var(--smdl-text-body);
}
.workspace-record-body > .page { padding: 0; margin: 0; max-width: none; }
.workspace-record-body .card {
  padding: 0; margin: 0 0 24px; background: transparent; border: 0; border-radius: 0; box-shadow: none;
}
.workspace-record-body .card:last-child { margin-bottom: 0; }
.workspace-record-body :is(.cardhead,.card-head) { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.workspace-record-body :is(.cardhead,.card-head) :is(h2,h3) { margin: 0; }
:is(.workspace-record-footer,.ticket-create-footer,.approval-review-footer) {
  display: flex; flex: none; align-items: center; justify-content: flex-end; flex-wrap: wrap;
  gap: 8px; padding: 16px var(--smdl-sheet-inset); padding-bottom: max(16px,env(safe-area-inset-bottom));
  border-top: 1px solid var(--line); background: var(--surface);
}
.workspace-record-footer :is(.form-actions,.btnrow) { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin: 0; }
.workspace-record-footer :is([data-panel-full],.record-open-full) { margin-right: auto; }
.workspace-record-footer:empty { display: none; }

/* Section tabs always use natural-width labels and a quiet shared boundary.
   Existing button and addressable-link adapters share this geometry. */
:is(.workspace-record,.desk-record) :is(.record-tabs,.sm-tabbar,.rw-tabs,.sm-sheet-views),.smdl-record-tabs {
  display: flex; align-items: stretch; flex-wrap: nowrap; gap: 24px; width: 100%; max-width: 100%;
  padding: 0; margin: 0 0 24px; border: 0; border-bottom: 1px solid var(--line);
  border-radius: 0; background: transparent; box-shadow: none; overflow-x: auto;
}
:is(.workspace-record,.desk-record) :is(.record-tabs,.sm-tabbar,.rw-tabs,.sm-sheet-views) > :is(button,a),.smdl-record-tabs > :is(button,a) {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; gap: 8px;
  min-height: 36px; height: auto; padding: 6px 0; margin: 0 0 -1px;
  border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent;
  box-shadow: none; color: var(--ink-2); font: inherit; font-size: var(--smdl-text-mode);
  line-height: 1.4; font-weight: var(--smdl-weight-regular); text-decoration: none; white-space: nowrap;
}
:is(.workspace-record,.desk-record) :is(.record-tabs,.sm-tabbar,.rw-tabs,.sm-sheet-views) > :is([aria-selected="true"],.is-active,.is-on),
.smdl-record-tabs > :is([aria-selected="true"],.is-active,.is-on) {
  color: var(--ink); border-bottom-color: var(--accent); font-weight: var(--smdl-weight-medium);
  background: transparent; box-shadow: none;
}
:is(.workspace-record,.desk-record) :is(.record-tabs,.sm-tabbar,.rw-tabs,.sm-sheet-views) > :focus-visible,.smdl-record-tabs > :focus-visible {
  outline: 2px solid var(--ink-2); outline-offset: -2px;
}
/* A dragged card and its insertion surface share a soft blue fill. A lane
   retains its ordinary background; state is also conveyed by drag position. */
.smdl-drop-card { min-height: var(--smdl-drop-height,96px); border: 0; border-radius: 8px; background: var(--smdl-drop-surface); }
.smdl-drag-card { box-shadow: 0 6px 20px rgb(16 24 40 / 12%); }

/* Attention belongs inside a readable button, including the unread count. */
.smdl .platform-notif-bell,.smdl .notif-bell,.account-v3-notifications {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  width: auto; min-width: var(--smdl-control-height); padding: 6px 10px;
  border: 1px solid var(--line); border-radius: var(--smdl-control-radius);
  background: var(--surface); color: var(--ink-2);
}
:is(.platform-notif-bell,.notif-bell,.account-v3-notifications) > .ic { width: 20px; height: 20px; font-size: 20px; }
:is(.platform-notif-bell,.notif-bell,.account-v3-notifications) :is(.platform-notif-badge,.notif-badge,[data-account-notification-count]) {
  position: static; inset: auto; min-width: 18px; min-height: 18px; padding: 1px 5px;
  border: 0; border-radius: 6px; background: var(--surface-2); color: var(--ink-2);
  font-size: var(--smdl-text-meta); font-weight: var(--smdl-weight-medium); line-height: 1.4;
}
@media (max-width: 600px) {
  :root { --smdl-sheet-inset: 20px; }
  :is(.workspace-record,.desk-record) :is(.record-tabs,.sm-tabbar,.rw-tabs,.sm-sheet-views),.smdl-record-tabs { gap: 16px; }
  :is(.workspace-record,.desk-record) :is(.record-tabs,.sm-tabbar,.rw-tabs,.sm-sheet-views) > :is(button,a),.smdl-record-tabs > :is(button,a) { min-height: 40px; }
  .workspace-record-footer > :is([data-panel-full],.record-open-full) { flex-basis: 100%; margin: 0; justify-content: flex-start; }
}
@media (pointer: coarse) {
  .smdl :is(.smdl-counts,.sm-segmented,.work-view-tabs) > :is(a,button),.smdl-segmented > :is(a,button),
  :is(.workspace-record,.desk-record) :is(.record-tabs,.sm-tabbar,.rw-tabs,.sm-sheet-views) > :is(button,a),.smdl-record-tabs > :is(button,a) { min-height: 44px; }
}

/* The same profile surface, whether its host is CORE, Account or a product. */
.smdl .user-pop {
  width: 320px; min-width: 0; max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px);
  overflow-y: auto; padding: 8px; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 12px 36px rgb(0 0 0 / 13%);
}
.smdl .user-pop-id { padding: 16px 12px 20px; gap: 12px; border-bottom: 1px solid var(--line); margin-bottom: 8px; }
.smdl .user-pop-id :is(.user-dot,.avatar) { width: 36px; height: 36px; font-size: 14px; flex: none; }
.smdl .user-pop-who { gap: 4px; line-height: 1.35; min-width: 0; }
.smdl .user-pop-who b { font-size: var(--smdl-text-body); font-weight: 500; }
.smdl .user-pop-who small { font-size: var(--smdl-text-meta); color: var(--ink-3); overflow-wrap: anywhere; }
.smdl .smdl-side .user-pop .user-pop-item {
  min-height: var(--smdl-control-height); padding: var(--smdl-control-pad) 12px; border-radius: 8px;
  font-size: var(--smdl-text-control); font-weight: 400; gap: 12px;
}
.smdl.is-slim .user-pop [data-smdl-side-toggle] { justify-content: flex-start; gap: 12px; }
.smdl.is-slim .user-pop [data-smdl-side-toggle] .lbl { display: inline; }
.smdl .user-pop-appearance { padding: 16px 16px 4px; }
.smdl .user-pop-label { color: var(--ink-2); font-size: var(--smdl-text-meta); font-weight: 500; margin: 0 0 10px; }
.smdl .theme-seg { padding: 3px; gap: 2px; border: 1px solid var(--line); border-radius: 9px; box-shadow: none; }
.smdl .theme-seg button {
  min-height: 36px; height: auto; padding: 6px 8px; border: 1px solid transparent;
  border-radius: 6px; font-size: var(--smdl-text-meta); font-weight: 400; line-height: 1.4;
}
.smdl .theme-seg button[aria-pressed="true"] { background: var(--surface); border-color: var(--line); box-shadow: none; font-weight: 500; }
.smdl .user-pop > form { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); }
.smdl-size-preference { margin: 0; padding: 16px; border: 0; min-width: 0; }
.smdl-size-preference legend { float: left; width: 100%; margin: 0 0 10px; padding: 0; font-size: var(--smdl-text-meta); font-weight: 500; color: var(--ink-2); }
.smdl-size-options { clear: both; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); }
.smdl-size-options label { position: relative; display: flex; align-items: center; justify-content: center; min-height: 36px; padding: 6px 8px; margin: 0; border: 1px solid transparent; border-radius: 6px; color: var(--ink-2); cursor: pointer; font-size: var(--smdl-text-meta); line-height: 1.4; }
.smdl-size-options label:has(input:checked) { background: var(--surface); border-color: var(--line); color: var(--ink); font-weight: 500; }
.smdl-size-options label:has(input:focus-visible) { outline: 2px solid var(--ink-2); outline-offset: 2px; }
.smdl-size-options input[type=radio] { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; margin: 0; opacity: 0; }
.smdl-size-preference p { margin: 10px 0 0; font-size: var(--smdl-text-meta); line-height: 1.5; color: var(--ink-3); }
.smdl-size-preference [role=status]:empty { display: none; }
@media (max-width: 760px) {
  :is(.smdl,.workspace-record,.ticket-create,.approval-review,.core-context-flyout,.account-v3-drawer,.smdl-fly) :is(.field > input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file]),.field > textarea,.field > select:not(.smdl-select-native)) { min-height: 44px; font-size: 16px; }
  :is(.smdl .smdl-canvas,.workspace-record,.ticket-create,.approval-review,.core-context-flyout,.account-v3-drawer,.smdl-fly) .btn { min-height: 44px; }
  .smdl-select-trigger, .smdl-select-option { min-height: 44px; font-size: 16px; }
  .smdl-select-sheet .smdl-select-option { min-height: 56px; }
  .smdl :is(.smdl-search,.smdl-new-main,.smdl-new-caret,.smdl-iconbtn) { min-height: 44px; }
}

/* Unavailable actions stay visibly quiet in the shell and portalled sheets. */
.btn:disabled, button.btn:disabled, .btn[aria-disabled="true"] {
  color: var(--ink-3); background: var(--surface-2); border-color: var(--line);
  box-shadow: none; cursor: not-allowed; opacity: .65;
}
.btn:disabled:hover, .btn[aria-disabled="true"]:hover {
  color: var(--ink-3); background: var(--surface-2); border-color: var(--line);
}

/* Give the phone title an explicit track. The title must remain inside
   the header when a desktop layout is resized to a phone.
   Both the shell and its header reserve all three bands, and may grow when
   a contextual action or translated title wraps. */
@media (max-width: 760px) {
  .smdl, .smdl.is-slim { grid-template-rows: minmax(148px, auto) auto minmax(0, 1fr); }
  .smdl.has-mobile-navigation { grid-template-rows: minmax(148px, auto) minmax(0, 1fr); }
  .smdl .smdl-top, .smdl .smdl-top:has(.smdl-live-actions) {
    min-height: 148px; grid-template-rows: minmax(44px, auto) 44px minmax(24px, auto);
    row-gap: 8px; padding-block: 8px 12px;
  }
}
