/* Shared Studio geometry, recovered selectively on the current app baseline. */
/* Shared Studio control geometry from SwiftUI/Compose. Keep the web's
   keyboard, pointer and responsive layouts; the app surfaces share one skin. */
body.csc-intermittor-studio {
  --studio-surface-3: #e3d7ee;
  --studio-success: #247a55;
  --studio-warning: #b8500a;
  --studio-danger: #b33f50;
  --studio-on-primary: #fff;
  --studio-on-secondary: #fff;
  --studio-shadow: 0 2px 8px rgb(36 18 56 / 5%);
  --studio-field-radius: 14px;
  --studio-card-radius: 16px;
  --studio-hero-radius: 24px;
  color-scheme: light;
}
body.dark.csc-intermittor-studio {
  --studio-surface-3: #52486b;
  --studio-success: #6ed39a;
  --studio-warning: #ffae21;
  --studio-danger: #ef6f78;
  --studio-on-primary: #17151d;
  --studio-on-secondary: #17151d;
  --studio-shadow: 0 2px 10px rgb(0 0 0 / 16%);
  color-scheme: dark;
}
body.csc-intermittor-studio :is(button, input, select, textarea) { font-family: inherit; }
body.csc-intermittor-studio #content { line-height: 1.45; }
body.csc-intermittor-studio #content :is(h1,h2,h3,.csc-large-title) {
  font-family: ui-rounded, -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  text-wrap: pretty;
}
body.csc-intermittor-studio #content :is(input:not(:where([type=checkbox],[type=radio],[type=range],[type=hidden],[type=file])), select, textarea),
body.csc-intermittor-studio .document-reliability-dialog :is(input, select, textarea) {
  min-height: 44px;
  min-width: 0;
  max-width: 100%;
  border: 1px solid var(--studio-surface-3) !important;
  border-radius: var(--studio-field-radius);
  padding: 10px 12px;
  background: var(--studio-surface) !important;
  color: var(--studio-ink) !important;
  font-size: calc(16px * var(--csc-text-scale, 1));
  line-height: 1.35;
  box-shadow: none;
  transition: border-color 110ms ease-out, box-shadow 110ms ease-out;
}
body.csc-intermittor-studio #content input::placeholder,
body.csc-intermittor-studio #content textarea::placeholder { color: var(--studio-muted); opacity: 1; }
body.csc-intermittor-studio #content :is(input,textarea,select):focus,
body.csc-intermittor-studio .document-reliability-dialog :is(input,textarea,select):focus {
  border-color: var(--studio-primary) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--studio-primary) 14%, transparent);
}
/* A bare field (bg-transparent) sits inside a wrapper that already draws the
   frame, the padding and the focus ring: never draw a second one. */
body.csc-intermittor-studio #content :is(input,select,textarea).bg-transparent,
body.csc-intermittor-studio #content :is(input,select,textarea).bg-transparent:focus {
  min-height: 0;
  border: 0 !important;
  border-radius: 0;
  padding: 0;
  background: transparent !important;
  box-shadow: none;
}
body.csc-intermittor-studio input[type=number] { appearance: textfield; -moz-appearance: textfield; }
body.csc-intermittor-studio input[type=number]::-webkit-inner-spin-button,
body.csc-intermittor-studio input[type=number]::-webkit-outer-spin-button { appearance: none; -webkit-appearance: none; margin: 0; }
body.csc-intermittor-studio #content :is([data-action="csc-datepick-open"], [data-action="csc-timepick-open"]) {
  min-height: 44px;
  min-width: 44px;
  border-radius: var(--studio-field-radius);
  color: var(--studio-primary) !important;
  background: var(--studio-surface-2) !important;
}
body.csc-intermittor-studio :is(.studio-button-primary,.studio-button-secondary) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  border: 1px solid transparent;
  border-radius: var(--studio-field-radius);
  padding: 11px 18px;
  font-size: calc(15px * var(--csc-text-scale, 1));
  font-weight: 650;
  text-align: center;
  line-height: 1.35;
  transition: background-color 110ms ease-out, filter 110ms ease-out;
}
body.csc-intermittor-studio .studio-button-primary {
  background: var(--studio-secondary) !important;
  color: var(--studio-on-secondary) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 18%), 0 3px 0 color-mix(in srgb, var(--studio-secondary) 72%, #17151d);
}
body.csc-intermittor-studio .studio-button-secondary {
  border-color: var(--studio-surface-3);
  background: var(--studio-surface) !important;
  color: var(--studio-primary) !important;
}
body.csc-intermittor-studio :is(.studio-button-primary,.studio-button-secondary):disabled { opacity: .5; }
body.csc-intermittor-studio :is(.studio-button-primary,.studio-button-secondary):not(:disabled):active { filter: brightness(.92); }
body.csc-intermittor-studio .csc-tabbar-pill {
  min-height: 68px;
  border: 1px solid color-mix(in srgb, var(--studio-line) 50%, transparent);
  border-radius: 26px;
  padding: 5px 8px;
  box-shadow: 0 4px 18px rgb(23 21 29 / 10%);
}
body.csc-intermittor-studio .csc-tabbar [data-action="ts-nav"] { min-height: 54px; border-radius: 20px; }
/* Comme la barre native : l'onglet actif ne change que de teinte. */
body.csc-intermittor-studio .csc-tabbar [data-action="ts-nav"][aria-current="page"] { background: transparent; }
body.csc-intermittor-studio #csc-mobile-tabbar .csc-tabbar-create {
  background: var(--studio-primary) !important;
  color: var(--studio-on-primary) !important;
  border: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 22%), 0 3px 0 color-mix(in srgb, var(--studio-primary) 64%, #17151d), 0 5px 15px rgb(23 21 29 / 13%);
}
body.csc-intermittor-studio .csc-topnav-desktop {
  gap: 8px;
  padding-block: 12px;
  border-bottom-color: color-mix(in srgb, var(--studio-line) 50%, transparent) !important;
}
body.csc-intermittor-studio .csc-topnav-desktop [data-action="ts-nav"] { border-radius: 16px; padding-inline: 18px; }
body.csc-intermittor-studio #content .csc-back {
  min-height: 44px;
  background: var(--studio-surface);
  border-color: var(--studio-surface-3);
  color: var(--studio-ink);
}
body.csc-intermittor-studio #content .csc-back svg { color: var(--studio-primary); }
body.csc-intermittor-studio #content .studio-settings-row { min-height: 68px; border-color: color-mix(in srgb, var(--studio-line) 40%, transparent) !important; }
body.csc-intermittor-studio #content .studio-settings-row > span:first-child > span:first-child { font-size: calc(15px * var(--csc-text-scale, 1)); font-weight: 600; }
body.csc-intermittor-studio #content .studio-settings-row > span:first-child > span + span { font-size: calc(13px * var(--csc-text-scale, 1)); line-height: 1.4; }
body.csc-intermittor-studio #content .studio-settings-row[role=switch] > span[aria-hidden] { background: var(--studio-surface-3); }
body.csc-intermittor-studio #content .studio-settings-row[role=switch][aria-checked=true] > span[aria-hidden] { background: var(--studio-success); }
body.csc-intermittor-studio #content .studio-settings-row[role=switch] > span[aria-hidden] > span { background: #fff !important; }
body.csc-intermittor-studio #content [data-ts-plus-settings] section > h2 {
  font-size: calc(13px * var(--csc-text-scale, 1));
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
  padding-inline: 16px;
}
body.csc-intermittor-studio #content [data-action="a11y-text-size"] {
  background: var(--studio-surface-2) !important;
  color: var(--studio-muted) !important;
  border: 1px solid transparent;
  border-radius: 12px;
}
body.csc-intermittor-studio #content [data-action="a11y-text-size"][aria-pressed=true] {
  background: var(--studio-primary) !important;
  color: var(--studio-on-primary) !important;
}
body.csc-intermittor-studio .document-reliability-dialog {
  width: min(900px, calc(100vw - 32px));
  max-height: min(94dvh, 1000px);
  overflow: auto;
  overscroll-behavior: contain;
  margin: auto;
  border: 1px solid var(--studio-surface-3);
  border-radius: 24px;
  padding: 24px;
  background: var(--studio-canvas);
  color: var(--studio-ink);
  box-shadow: 0 24px 80px rgb(0 0 0 / 28%);
}
body.csc-intermittor-studio .document-reliability-dialog::backdrop { background: rgb(23 21 29 / 60%); }
body.csc-intermittor-studio .document-reliability-dialog h2 { margin: 0 0 16px; font-size: calc(23px * var(--csc-text-scale, 1)); line-height: 1.2; font-weight: 700; letter-spacing: -.02em; }
body.csc-intermittor-studio .document-review-body { display: grid; gap: 16px; }
body.csc-intermittor-studio .document-review-body > p { color: var(--studio-muted); font-size: calc(14px * var(--csc-text-scale, 1)); line-height: 1.5; }
body.csc-intermittor-studio .document-review-body label { display: grid; gap: 6px; font-size: calc(14px * var(--csc-text-scale, 1)); font-weight: 600; }
body.csc-intermittor-studio .document-review-body br { display: none; }
body.csc-intermittor-studio .document-review-body > div:has(> label) { display: grid; gap: 12px; }
body.csc-intermittor-studio .document-review-body input { width: 100%; }
body.csc-intermittor-studio .document-preview-tools { display: flex; flex-wrap: wrap; gap: 8px; }
body.csc-intermittor-studio .document-preview-frame {
  position: relative;
  min-width: 0;
  max-height: 52dvh;
  overflow: auto;
  border: 1px solid var(--studio-surface-3);
  border-radius: 14px;
  background: #fff;
}
body.csc-intermittor-studio .document-page-assignment { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 12px; margin-bottom: 8px; }
body.csc-intermittor-studio .document-page-assignment > button { min-height: 48px; text-align: left; padding: 10px 12px; border: 1px solid var(--studio-surface-3); border-radius: 14px; color: var(--studio-primary); background: var(--studio-surface); }
body.csc-intermittor-studio .document-reliability-dialog > [role=status]:not(:empty) { padding: 12px; margin-top: 16px; border-radius: 14px; background: var(--studio-surface-2); color: var(--studio-ink); font-size: calc(14px * var(--csc-text-scale, 1)); }
body.csc-intermittor-studio .document-review-actions { display: flex; gap: 12px; position: sticky; bottom: -24px; background: var(--studio-canvas); border-top: 1px solid var(--studio-surface-3); margin-top: 20px; padding: 16px 0 4px; }
body.csc-intermittor-studio .document-review-actions > button:last-child { flex: 1; }
body.csc-intermittor-studio .document-reliability-dialog :is(button,input,select):focus-visible { outline: 2px solid var(--studio-primary); outline-offset: 3px; }
@media (max-width: 639px) {
  body.csc-intermittor-studio .document-reliability-dialog { width: calc(100vw - 16px); max-height: 94dvh; padding: 18px 16px; border-radius: 24px; }
  body.csc-intermittor-studio .document-reliability-dialog h2 { font-size: calc(21px * var(--csc-text-scale, 1)); }
  body.csc-intermittor-studio .document-review-actions { bottom: -18px; gap: 8px; padding-bottom: 8px; }
  body.csc-intermittor-studio .document-review-actions > button { padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  body.csc-intermittor-studio :is(button,input,textarea,select) { transition: none !important; }
}

/* Disclosure and confirmation actions keep the same hierarchy in both themes. */
body.csc-intermittor-studio #content [data-action="ts-home-dashboard-customize"] {
  border: 1px solid var(--studio-surface-3);
  background: var(--studio-surface) !important;
  color: var(--studio-primary) !important;
  box-shadow: var(--studio-shadow);
}
body.csc-intermittor-studio #content .aem-review-editor { border-radius: 24px; border-color: var(--studio-surface-3) !important; background: var(--studio-canvas) !important; }
body.csc-intermittor-studio #content .aem-review-editor h3 { font-size: calc(20px * var(--csc-text-scale, 1)); letter-spacing: -.02em; }
body.csc-intermittor-studio #content .aem-review-editor [data-aem-confirm] {
  min-height: 48px;
  border-radius: 14px;
  background: var(--studio-secondary) !important;
  color: var(--studio-on-secondary) !important;
}
body.csc-intermittor-studio #content [data-action="ts-aem-review-evidence"] { min-height: 44px; border-radius: 14px; border-color: var(--studio-surface-3); color: var(--studio-primary); }
body.csc-intermittor-studio #csc-app-dialog [role="dialog"] {
  border-radius: 24px;
  border-color: var(--studio-surface-3);
  background: var(--studio-surface);
  color: var(--studio-ink);
}

body.csc-intermittor-studio .document-reliability-dialog [hidden] { display: none !important; }
body.csc-intermittor-studio #content :is([data-action="ts-feuille-save"], [data-action="ts-p-save"], [data-action="ts-feuille-edit-save"]) {
  min-height: 48px;
  border-radius: 14px;
  background: var(--studio-secondary) !important;
  color: var(--studio-on-secondary) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 18%), 0 3px 0 color-mix(in srgb, var(--studio-secondary) 72%, #17151d);
}
/* Intermittor Studio task surfaces. Source: current SwiftUI / Compose Studio.
   Insert after the shared Studio tokens and base controls in index.html.
   State colors (paid, late, draft, day kind) remain owned by their components. */
body.csc-intermittor-studio #content :is(
  .csc-studio-income-card, .csc-studio-chrono-card,
  .csc-studio-project-card, .csc-studio-project-row,
  .csc-studio-sheet-card, .csc-studio-project-filters,
  [data-testid="ts-dashboard-admin-actions"],
  [data-testid="ts-dashboard-reexamen-open"]:not(.csc-home-tile),
  [data-testid="ts-dashboard-recents"] > div:last-child,
  [data-testid="ts-dashboard-plateau-documents"] > div,
  [data-testid="ts-project-pdf-menu"], #ts-project-expenses-panel
) {
  border-radius: 16px;
  border-color: color-mix(in srgb, var(--studio-line) 68%, transparent) !important;
  background: var(--studio-surface) !important;
  color: var(--studio-ink) !important;
  box-shadow: 0 1px 2px rgb(23 21 29 / 5%);
}
body.dark.csc-intermittor-studio #content :is(
  .csc-studio-income-card, .csc-studio-chrono-card,
  .csc-studio-project-card, .csc-studio-project-row,
  .csc-studio-sheet-card, .csc-studio-project-filters,
  [data-testid="ts-dashboard-admin-actions"],
  [data-testid="ts-dashboard-reexamen-open"]:not(.csc-home-tile),
  [data-testid="ts-dashboard-recents"] > div:last-child,
  [data-testid="ts-dashboard-plateau-documents"] > div,
  [data-testid="ts-project-pdf-menu"], #ts-project-expenses-panel
) {
  border-color: rgb(255 255 255 / 9%) !important;
  box-shadow: 0 1px 2px rgb(0 0 0 / 16%);
}
body.csc-intermittor-studio #content .csc-studio-home-grid { gap: 16px; }
body.csc-intermittor-studio #content .csc-studio-month-selector {
  margin-bottom: 12px;
  gap: 12px;
}
body.csc-intermittor-studio #content .csc-studio-month-selector > div {
  color: var(--studio-ink) !important;
  font-size: calc(15px * var(--csc-text-scale, 1));
  font-weight: 600;
}
body.csc-intermittor-studio #content .csc-studio-month-selector > button {
  border: 1px solid color-mix(in srgb, var(--studio-line) 65%, transparent);
  border-radius: 14px;
  background: var(--studio-surface) !important;
  color: var(--studio-primary) !important;
}
body.csc-intermittor-studio #content .csc-studio-income-card { border-radius: 24px; }
body.csc-intermittor-studio #content .csc-studio-income-hero {
  padding: 20px;
  background: var(--studio-surface-2) !important;
  color: var(--studio-ink) !important;
}
body.csc-intermittor-studio #content .csc-studio-income-hero > div:first-child,
body.csc-intermittor-studio #content .csc-studio-income-hero > div > span:first-child {
  color: var(--studio-muted) !important;
}
body.csc-intermittor-studio #content .csc-studio-income-hero strong {
  color: var(--studio-ink) !important;
  font-size: clamp(28px, 7vw, 36px);
  font-weight: 650;
  line-height: 1.1;
  letter-spacing: -.035em;
}
body.csc-intermittor-studio #content .csc-studio-income-hero [data-action] {
  background: var(--studio-surface) !important;
  border-color: var(--studio-line) !important;
  color: var(--studio-primary) !important;
}
body.csc-intermittor-studio #content .csc-studio-income-card > .grid > div {
  padding: 16px;
  background: var(--studio-surface) !important;
  border-color: color-mix(in srgb, var(--studio-line) 50%, transparent) !important;
}
body.csc-intermittor-studio #content .csc-studio-income-card > .grid > div:last-child {
  background: color-mix(in srgb, var(--studio-surface-2) 35%, var(--studio-surface)) !important;
}
body.csc-intermittor-studio #content .csc-studio-income-card > .grid > div:last-child :is(strong, span, button) {
  color: var(--studio-primary) !important;
}
body.csc-intermittor-studio #content .csc-studio-income-card [data-action="ts-monthdetail-toggle"] {
  border-radius: 12px;
  padding-inline: 12px;
  font-size: calc(12px * var(--csc-text-scale, 1));
  font-weight: 500;
  color: var(--studio-primary) !important;
  border-color: color-mix(in srgb, var(--studio-line) 65%, transparent) !important;
  background: var(--studio-surface) !important;
}
body.csc-intermittor-studio #content .csc-studio-hours-card {
  border-radius: 24px;
  background: var(--studio-surface-2) !important;
  border-color: color-mix(in srgb, var(--studio-primary) 16%, transparent) !important;
  color: var(--studio-ink) !important;
  box-shadow: 0 1px 2px rgb(23 21 29 / 5%);
  padding-block: 18px;
}
body.csc-intermittor-studio #content .csc-studio-hours-card > span:first-child,
body.csc-intermittor-studio #content [data-testid="ts-dashboard-reexamen-open"]:not(.csc-home-tile) > span:first-child {
  background: var(--studio-surface-2) !important;
  color: var(--studio-primary) !important;
  border-radius: 14px;
}
body.csc-intermittor-studio #content .csc-studio-hours-value {
  font-size: calc(28px * var(--csc-text-scale, 1));
  line-height: 1.15;
  font-weight: 650;
  color: var(--studio-ink) !important;
}
body.csc-intermittor-studio #content .csc-studio-hours-remaining {
  max-width: 5.5rem;
  font-size: calc(12px * var(--csc-text-scale, 1));
  line-height: 1.5;
  font-weight: 500;
  color: var(--studio-muted) !important;
}
body.csc-intermittor-studio #content :is(.csc-studio-hours-card, [data-testid="ts-dashboard-reexamen-open"]:not(.csc-home-tile)) .h-1\.5 {
  background: color-mix(in srgb, var(--studio-primary) 14%, var(--studio-surface)) !important;
  height: 5px;
}
body.csc-intermittor-studio #content :is(.csc-studio-hours-card, [data-testid="ts-dashboard-reexamen-open"]:not(.csc-home-tile)) .h-1\.5 > span {
  background: var(--studio-primary) !important;
}
body.csc-intermittor-studio #content [data-testid="ts-dashboard-reexamen-open"]:not(.csc-home-tile) > .num > span:first-child {
  color: var(--studio-primary) !important;
  font-size: calc(17px * var(--csc-text-scale, 1));
  font-weight: 650;
}
body.csc-intermittor-studio #content [data-testid="ts-dashboard-recents"] [data-action="ts-nav-project"] {
  min-height: 66px;
  padding: 12px 16px;
  border-color: color-mix(in srgb, var(--studio-line) 40%, transparent) !important;
}
body.csc-intermittor-studio #content [data-testid="ts-dashboard-recents"] [data-action="ts-nav-project"] strong {
  font-size: calc(15px * var(--csc-text-scale, 1));
  font-weight: 600;
}
body.csc-intermittor-studio #content [data-testid="ts-dashboard-admin-actions"] [data-admin-task-row] {
  min-height: 54px;
  border-color: color-mix(in srgb, var(--studio-line) 40%, transparent) !important;
}
body.csc-intermittor-studio #content [data-testid="ts-dashboard-admin-actions"] [data-admin-task-row] > span:nth-child(2) {
  font-size: calc(13px * var(--csc-text-scale, 1));
  font-weight: 500;
}
body.csc-intermittor-studio #content [data-testid="ts-dashboard-primary-actions"] button {
  border-radius: 16px;
  min-height: 64px;
  font-weight: 600;
  box-shadow: none;
}
body.csc-intermittor-studio #content [data-testid="ts-dashboard-primary-actions"] [data-action="ts-nav-quick-entry"] {
  background: var(--studio-surface-2) !important;
  color: var(--studio-primary) !important;
  border: 1px solid color-mix(in srgb, var(--studio-primary) 16%, transparent);
}
body.csc-intermittor-studio #content [data-testid="ts-dashboard-primary-actions"] [data-action="ts-nav-quick-entry"] > span {
  color: var(--studio-muted) !important;
}
/* Project navigation and filters use the same contained selection as Studio. */
body.csc-intermittor-studio #content .csc-studio-project-views {
  width: 100%;
  padding: 4px;
  border-radius: 16px;
  border-color: transparent !important;
  background: var(--studio-surface-2) !important;
}
body.csc-intermittor-studio #content .csc-studio-project-views > button {
  flex: 1 1 0;
  min-height: 44px;
  border-radius: 12px;
  color: var(--studio-muted) !important;
}
body.csc-intermittor-studio #content .csc-studio-project-views > [aria-pressed="true"] {
  background: var(--studio-surface) !important;
  color: var(--studio-primary) !important;
  box-shadow: 0 1px 3px rgb(23 21 29 / 9%);
}
body.csc-intermittor-studio #content :is(.csc-studio-project-search input, .csc-studio-project-search > button) {
  min-height: 48px;
  border-radius: 14px;
  border-color: color-mix(in srgb, var(--studio-line) 75%, transparent) !important;
  background: var(--studio-surface) !important;
  color: var(--studio-ink) !important;
}
body.csc-intermittor-studio #content .csc-studio-project-search > button { color: var(--studio-primary) !important; }
body.csc-intermittor-studio #content .csc-studio-project-search input { padding-inline-start: 40px !important; }
body.csc-intermittor-studio #content [data-ts-projects-view="cards"] { gap: 12px; }
body.csc-intermittor-studio #content .csc-studio-project-card > button { padding: 16px; }
body.csc-intermittor-studio #content .csc-studio-project-name {
  font-size: calc(16px * var(--csc-text-scale, 1));
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: -.015em;
  text-transform: none;
  overflow-wrap: anywhere;
  color: var(--studio-ink) !important;
  padding-right: 0;
  margin-bottom: 4px;
}
body.csc-intermittor-studio #content .csc-studio-project-card > button > div:first-child {
  font-size: calc(11px * var(--csc-text-scale, 1));
  letter-spacing: .015em;
  text-transform: none;
  color: var(--studio-muted) !important;
  margin-bottom: 6px;
}
body.csc-intermittor-studio #content .csc-studio-project-footer {
  padding: 12px;
  border-color: color-mix(in srgb, var(--studio-line) 40%, transparent) !important;
  background: color-mix(in srgb, var(--studio-surface-2) 25%, var(--studio-surface));
  border-radius: 0 0 16px 16px;
}
body.csc-intermittor-studio #content .csc-studio-project-row > div { min-height: 76px; padding-block: 12px; }
body.csc-intermittor-studio #content .csc-studio-project-row [data-ts-project-metric] > span:first-child {
  font-size: calc(10px * var(--csc-text-scale, 1));
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
  color: var(--studio-muted) !important;
}
body.csc-intermittor-studio #content .csc-studio-project-row [data-ts-project-metric] > .num {
  font-size: calc(12px * var(--csc-text-scale, 1));
  line-height: 1.6;
}
body.csc-intermittor-studio #content [data-ts-project-status-pill] { min-height: 44px; }
/* The project rail is a secondary surface, while sheets and days are distinct. */
body.csc-intermittor-studio #content .csc-studio-project-summary {
  padding: 16px;
  gap: 12px;
  border: 1px solid color-mix(in srgb, var(--studio-line) 55%, transparent) !important;
  border-radius: 24px;
  background: var(--studio-surface-2) !important;
}
body.csc-intermittor-studio #content .csc-studio-project-summary header h2 { font-size: calc(24px * var(--csc-text-scale, 1)); line-height: 1.2; font-weight: 650; }
body.csc-intermittor-studio #content .csc-studio-project-total {
  background: var(--studio-surface) !important;
  border-color: transparent !important;
  border-radius: 16px;
  padding: 16px;
}
body.csc-intermittor-studio #content .csc-studio-project-total > .num {
  font-size: clamp(18px, 4.6vw, 24px);
  line-height: 1.3;
  font-weight: 650;
  white-space: normal;
  overflow-wrap: anywhere;
}
body.csc-intermittor-studio #content .csc-studio-sheet-card > [data-action="ts-nav-feuille"] { min-height: 80px; padding: 16px; }
body.csc-intermittor-studio #content .csc-studio-sheet-card [data-testid="ts-project-day-tiles"] { padding: 12px; gap: 8px; }
body.csc-intermittor-studio #content .csc-studio-day-tile { border-radius: 14px; min-height: 82px; padding: 12px; }
body.csc-intermittor-studio #content .csc-studio-day-tile > span:first-child > span:first-child { font-size: calc(14px * var(--csc-text-scale, 1)); }
body.csc-intermittor-studio #content .csc-studio-day-tile > span:not(:first-child) { font-size: calc(12px * var(--csc-text-scale, 1)); line-height: 1.5; }
body.csc-intermittor-studio #content .csc-studio-project-detail [data-testid="ts-project-secondary"] { gap: 16px; margin-top: 24px; }
/* Grouped native-style form sections; expanded/hidden behavior is untouched. */
body.csc-intermittor-studio #content .csc-studio-sheet-edit [data-feuille-section] {
  padding: 20px;
  margin-bottom: 16px;
  border: 1px solid color-mix(in srgb, var(--studio-line) 65%, transparent) !important;
  border-radius: 16px;
  background: var(--studio-surface) !important;
  box-shadow: 0 1px 2px rgb(23 21 29 / 5%);
}
body.dark.csc-intermittor-studio #content .csc-studio-sheet-edit [data-feuille-section] {
  border-color: rgb(255 255 255 / 9%) !important;
  box-shadow: 0 1px 2px rgb(0 0 0 / 16%);
}
body.csc-intermittor-studio #content .csc-studio-sheet-edit [data-feuille-section] h3 {
  font-size: calc(17px * var(--csc-text-scale, 1));
  line-height: 1.35;
  font-weight: 600;
  color: var(--studio-ink) !important;
}
body.csc-intermittor-studio #content .csc-studio-sheet-edit [data-feuille-section] :is(input, select, textarea) {
  border-radius: 14px;
  min-height: 48px;
  font-size: calc(16px * var(--csc-text-scale, 1));
  background: var(--studio-surface) !important;
  color: var(--studio-ink) !important;
  border-color: var(--studio-line) !important;
}
body.csc-intermittor-studio #content .csc-studio-sheet-edit [data-feuille-section] label > div:first-child {
  font-size: calc(13px * var(--csc-text-scale, 1));
  line-height: 1.4;
  margin-bottom: 6px;
  color: var(--studio-muted) !important;
}
body.csc-intermittor-studio #content .csc-studio-sheet-edit [data-activity-impact] {
  background: var(--studio-surface-2) !important;
  border-color: transparent !important;
  border-radius: 14px;
  font-weight: 400;
  font-size: calc(13px * var(--csc-text-scale, 1));
  line-height: 1.5;
}
body.csc-intermittor-studio #content .csc-studio-sheet-edit [role="switch"][data-action="ts-f-convopt"] {
  border: 1px solid transparent;
  border-radius: 14px;
  background: var(--studio-canvas) !important;
  color: var(--studio-ink) !important;
}
body.csc-intermittor-studio #content .csc-studio-sheet-edit [role="switch"][data-action="ts-f-convopt"][aria-checked="true"] {
  border-color: color-mix(in srgb, var(--studio-primary) 30%, transparent);
  background: var(--studio-surface-2) !important;
}
@media (min-width: 640px) {
  body.csc-intermittor-studio #content .csc-studio-project-views { width: auto; min-width: 400px; }
  body.csc-intermittor-studio #content [data-ts-projects-view="cards"] { gap: 16px; }
}
@media (max-width: 479px) {
  body.csc-intermittor-studio #content [data-ts-projects-view="cards"] { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 359px) {
  body.csc-intermittor-studio #content .csc-studio-sheet-edit [data-feuille-section] { padding: 16px; }
  body.csc-intermittor-studio #content .csc-studio-project-card > button { padding: 12px; }
  body.csc-intermittor-studio #content .csc-studio-project-name { font-size: calc(15px * var(--csc-text-scale, 1)); }
  body.csc-intermittor-studio #content .csc-studio-hours-remaining { max-width: 4.5rem; font-size: calc(11px * var(--csc-text-scale, 1)); }
}
@media (hover: hover) {
  body.csc-intermittor-studio #content :is(.csc-studio-project-card, .csc-studio-project-row, .csc-studio-sheet-card):hover {
    border-color: color-mix(in srgb, var(--studio-primary) 45%, var(--studio-line)) !important;
    box-shadow: 0 2px 6px rgb(23 21 29 / 6%);
  }
}

body.csc-intermittor-studio #content input[data-input]:not([data-clearx="0"]):not([data-timefmt]):not([data-datefmt]) { padding-right: 44px; }
body.csc-intermittor-studio #content input.pr-11 { padding-right: 44px; }
body.csc-intermittor-studio #content :is(.csc-studio-project-edit-header,.csc-studio-project-edit-fields) { max-width: 768px; margin-inline: auto; }
body.csc-intermittor-studio #content .csc-studio-project-edit-fields {
  padding: 20px;
  border: 1px solid var(--studio-surface-3);
  border-radius: 24px;
  background: var(--studio-surface);
  box-shadow: var(--studio-shadow);
}
body.csc-intermittor-studio #content .csc-studio-project-edit-fields > label > div:first-child { font-size: calc(13px * var(--csc-text-scale, 1)); font-weight: 600; color: var(--studio-muted); margin-bottom: 6px; }
body.csc-intermittor-studio #content .csc-studio-project-edit-header .studio-button-primary { background: var(--studio-secondary) !important; color: var(--studio-on-secondary) !important; }
@media (max-width: 639px) {
  body.csc-intermittor-studio #content .csc-studio-project-edit-fields { padding: 16px; }
}
/* A document review is a task sheet: persistent title and decision, with
   scrollable evidence between them, matching the native review hierarchy. */
body.csc-intermittor-studio .document-reliability-dialog[open] {
  max-width: none;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}
body.csc-intermittor-studio .document-review-header {
  flex: 0 0 auto;
  padding: 22px 24px 16px;
  background: var(--studio-canvas);
}
body.csc-intermittor-studio .document-review-header h2 { margin: 0; }
body.csc-intermittor-studio .document-review-body {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 0 24px 20px;
  gap: 24px;
}
body.csc-intermittor-studio .document-review-actions {
  position: static;
  flex: 0 0 auto;
  padding: 16px 24px 20px;
  margin: 0;
  background: var(--studio-surface);
  border-top: 1px solid color-mix(in srgb, var(--studio-line) 50%, transparent);
}
body.csc-intermittor-studio .document-review-actions > button { min-height: 48px; }
body.csc-intermittor-studio .document-review-actions > button[hidden] { display: none !important; }
body.csc-intermittor-studio .document-field-review .document-review-header { display: grid; gap: 18px; padding-top: 18px; }
body.csc-intermittor-studio .document-field-review .document-review-header > button { justify-self: start; border-radius: 24px; min-height: 44px; padding: 8px 16px; }
body.csc-intermittor-studio .document-field-review .document-review-header h2 { font-size: calc(30px * var(--csc-text-scale, 1)); letter-spacing: -.025em; }
body.csc-intermittor-studio .document-field-summary,
body.csc-intermittor-studio .document-field-value {
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--studio-line) 38%, transparent);
  border-radius: 20px;
  background: var(--studio-surface);
  box-shadow: var(--studio-shadow);
}
body.csc-intermittor-studio .document-field-summary h3 { font-size: calc(17px * var(--csc-text-scale, 1)); font-weight: 650; margin: 0; }
body.csc-intermittor-studio .document-field-summary p { font-size: calc(14px * var(--csc-text-scale, 1)); line-height: 1.5; margin: 0; }
body.csc-intermittor-studio .document-field-summary .document-field-state { margin-block: 12px; padding-block: 12px; border-block: 1px solid color-mix(in srgb, var(--studio-line) 38%, transparent); color: var(--studio-muted); }
body.csc-intermittor-studio .document-field-source { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px; min-width: 0; }
body.csc-intermittor-studio .document-field-source > h3 { grid-column: 1/-1; font-size: calc(16px * var(--csc-text-scale, 1)); font-weight: 600; color: var(--studio-muted); padding-left: 4px; margin: 0 0 2px; }
body.csc-intermittor-studio .document-field-source > .document-preview-frame { grid-column: 1/-1; }
body.csc-intermittor-studio .document-field-source .document-preview-tools { gap: 6px; }
body.csc-intermittor-studio .document-field-source .document-preview-tools button { min-height: 44px; padding: 10px; font-size: calc(13px * var(--csc-text-scale, 1)); }
body.csc-intermittor-studio .document-field-value > label { font-size: calc(15px * var(--csc-text-scale, 1)); font-weight: 600; gap: 10px; }
body.csc-intermittor-studio .document-field-value p { margin: 10px 0 0; font-size: calc(13px * var(--csc-text-scale, 1)); color: var(--studio-muted); line-height: 1.4; }
body.csc-intermittor-studio .document-field-value [data-testid="document-review-candidate"] { padding: 10px 12px; margin-top: 12px; width: 100%; border-radius: 14px; background: var(--studio-surface-2) !important; color: var(--studio-primary) !important; }
body.csc-intermittor-studio .document-reliability-dialog > [role=status]:not(:empty) { flex: 0 0 auto; margin: 0 24px 12px; }
@media (max-width: 639px) {
  body.csc-intermittor-studio .document-field-review { width: 100vw; height: 96dvh; max-height: 96dvh; margin: auto 0 0; border-radius: 28px 28px 0 0; }
  body.csc-intermittor-studio .document-review-header { padding: 20px 18px 16px; }
  body.csc-intermittor-studio .document-review-body { padding: 0 18px 20px; }
  body.csc-intermittor-studio .document-review-actions { padding: 14px 18px max(18px,env(safe-area-inset-bottom)); }
  body.csc-intermittor-studio .document-field-review .document-review-header { gap: 16px; }
  body.csc-intermittor-studio .document-field-review .document-review-header h2 { font-size: calc(30px * var(--csc-text-scale, 1)); }
  body.csc-intermittor-studio .document-field-review .document-review-actions > button { min-height: 52px; font-size: calc(16px * var(--csc-text-scale, 1)); }
}

/* Invalid values stay distinct after the shared field skin is applied. */
body.csc-intermittor-studio #content :is(input,select,textarea)[aria-invalid="true"],
body.csc-intermittor-studio .document-reliability-dialog :is(input,select,textarea)[aria-invalid="true"] { border-color: var(--studio-danger) !important; }
body.csc-intermittor-studio #content :is(input,select,textarea):disabled { opacity: .55; }

/* Recovered main surface */
/* Full route coverage: document intake, readers, app dialogs, AI and shared sheets. */
body.csc-intermittor-studio :is(.csc-web-document-intake,.csc-web-pdf-viewer,#csc-app-dialog) :is(input,select,textarea) {
  min-height: 44px; max-width: 100%; border: 1px solid var(--studio-surface-3); border-radius: 14px; padding: 10px 12px;
  background: var(--studio-surface); color: var(--studio-ink); font-size: calc(16px * var(--csc-text-scale,1));
}
body.csc-intermittor-studio :is(.csc-web-document-intake,.csc-web-pdf-viewer,#csc-app-dialog) :is(input,select,textarea):focus { border-color: var(--studio-primary); outline: 2px solid var(--studio-primary); outline-offset: 2px; }
body.csc-intermittor-studio #csc-app-dialog [role=dialog] { border-radius: 24px; background: var(--studio-surface) !important; color: var(--studio-ink); border-color: var(--studio-line) !important; }
body.csc-intermittor-studio #csc-app-dialog-title { color: var(--studio-ink) !important; font-size: calc(22px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio #csc-app-dialog-message { color: var(--studio-muted) !important; font-size: calc(15px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio #csc-app-dialog [role=dialog] > div:last-child { border-color: var(--studio-line); background: var(--studio-surface-2); }
body.csc-intermittor-studio #csc-app-dialog :is([data-dialog-cancel],[data-dialog-confirm]) { min-height: 48px; font-size: calc(14px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio #csc-app-dialog [data-dialog-cancel] { background: var(--studio-surface) !important; border-color: var(--studio-line) !important; color: var(--studio-primary) !important; }
body.csc-intermittor-studio #csc-app-dialog [data-dialog-confirm]:not(.bg-red-600) { background: var(--studio-secondary) !important; color: var(--studio-on-secondary) !important; box-shadow: 0 3px 0 color-mix(in srgb,var(--studio-secondary) 80%,#17151d); }
body.csc-intermittor-studio #csc-app-dialog [data-dialog-confirm].bg-red-600 { background: var(--studio-danger) !important; color: white !important; }
body.csc-intermittor-studio #csc-app-dialog [data-dialog-icon].bg-sky-100 { background: var(--studio-surface-2); color: var(--studio-primary); }
body.csc-intermittor-studio .csc-web-document-intake { width: min(94vw,600px); max-height: 92dvh; border-radius: 24px; border-color: var(--studio-line); background: var(--studio-canvas); color: var(--studio-ink); }
body.csc-intermittor-studio .csc-web-intake-shell { display: flex; flex-direction: column; padding: 0; gap: 0; max-height: inherit; overflow: hidden; }
body.csc-intermittor-studio .csc-web-intake-shell > header { flex: 0 0 auto; padding: 22px 20px 16px; align-items: flex-start; }
body.csc-intermittor-studio .csc-web-intake-shell h2 { font-size: calc(26px * var(--csc-text-scale,1)); line-height: 1.15; letter-spacing: -.02em; }
body.csc-intermittor-studio .csc-web-intake-shell p { margin-top: 8px; font-size: calc(14px * var(--csc-text-scale,1)); color: var(--studio-muted); }
body.csc-intermittor-studio .csc-web-intake-shell > header button { flex: 0 0 44px; border-radius: 50%; padding: 0; background: var(--studio-surface-2); color: var(--studio-primary); font-size: 24px; }
body.csc-intermittor-studio .csc-web-intake-body { display: grid; gap: 16px; min-height: 0; overflow: auto; padding: 4px 20px 20px; }
body.csc-intermittor-studio .csc-web-intake-actions { display: grid; grid-template-columns: 1fr 1fr; }
body.csc-intermittor-studio .csc-web-intake-actions button { background: var(--studio-surface); color: var(--studio-primary); border: 1px solid var(--studio-line); border-radius: 16px; padding: 12px; font-size: calc(14px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio .csc-web-intake-drop { min-height: 150px; background: var(--studio-surface-2); color: var(--studio-ink); border-color: var(--studio-primary); border-radius: 20px; }
body.csc-intermittor-studio .csc-web-intake-drop strong { font-size: calc(16px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio .csc-web-intake-drop span { color: var(--studio-muted); font-size: calc(13px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio .csc-web-intake-message { color: var(--studio-warning); font-size: calc(14px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio .csc-web-intake-message:empty { display: none; }
body.csc-intermittor-studio .csc-web-intake-list { gap: 8px; }
body.csc-intermittor-studio .csc-web-intake-list li { display: grid; grid-template-columns: minmax(0,1fr) auto; padding: 10px; border-color: var(--studio-line); border-radius: 16px; background: var(--studio-surface); font-size: calc(14px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio .csc-web-intake-list li > span:first-child { white-space: normal; overflow-wrap: anywhere; }
body.csc-intermittor-studio .csc-web-intake-list button { min-width: 44px; min-height: 44px; background: var(--studio-surface-2); color: var(--studio-primary); }
body.csc-intermittor-studio .csc-web-intake-shell > footer { flex: 0 0 auto; padding: 16px 20px max(20px,env(safe-area-inset-bottom)); background: var(--studio-surface); border-top: 1px solid var(--studio-line); }
body.csc-intermittor-studio .csc-web-intake-shell > footer button { min-height: 48px; border-radius: 14px; font-size: calc(14px * var(--csc-text-scale,1)); background: var(--studio-surface-2); color: var(--studio-primary); }
body.csc-intermittor-studio .csc-web-intake-shell > footer [data-intake-submit] { background: var(--studio-secondary); color: var(--studio-on-secondary); box-shadow: 0 3px 0 color-mix(in srgb,var(--studio-secondary) 80%,#17151d); }
body.csc-intermittor-studio .csc-web-pdf-viewer { background: var(--studio-canvas); color: var(--studio-ink); }
body.csc-intermittor-studio :is(.csc-web-pdf-toolbar,.csc-web-pdf-footer) { background: var(--studio-surface); color: var(--studio-ink); border-color: var(--studio-line); }
body.csc-intermittor-studio .csc-web-pdf-progress { background: var(--studio-surface-2); color: var(--studio-muted); font-size: calc(13px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio .csc-web-pdf-title { font-size: calc(16px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio :is(.csc-web-pdf-actions,.csc-web-pdf-footer) button { background: var(--studio-surface-2); color: var(--studio-primary); font-size: calc(13px * var(--csc-text-scale,1)); border-radius: 14px; }
body.csc-intermittor-studio .csc-web-pdf-pages { background: var(--studio-canvas); }
body.csc-intermittor-studio .csc-web-pdf-following { background: var(--studio-secondary) !important; color: var(--studio-on-secondary) !important; }
body.csc-intermittor-studio #content .csc-studio-share-header > div:nth-child(2) { white-space: normal; line-height: 1.5; font-size: calc(12px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio #content .csc-studio-share-header .text-xl { white-space: normal; }
body.csc-intermittor-studio #content .csc-studio-share-total { background: var(--studio-surface-2) !important; color: var(--studio-ink) !important; border-radius: 24px; }
@media(max-width:639px) {
  body.csc-intermittor-studio .csc-web-document-intake { width: 100vw; height: 94dvh; max-height: 94dvh; margin: auto 0 0; border-radius: 28px 28px 0 0; }
  body.csc-intermittor-studio .csc-web-intake-shell { height: 100%; }
  body.csc-intermittor-studio .csc-web-intake-body { flex: 1; align-content: start; }
  body.csc-intermittor-studio .csc-web-intake-list li { grid-template-columns: minmax(0,1fr); }
  body.csc-intermittor-studio .csc-web-intake-list li > span:last-child { justify-self: end; }
  body.csc-intermittor-studio .csc-web-pdf-toolbar { display: grid; gap: 10px; padding-block: max(12px,env(safe-area-inset-top)) 12px; }
  body.csc-intermittor-studio .csc-web-pdf-title { width: 100%; }
  body.csc-intermittor-studio .csc-web-pdf-actions { max-width: 100%; width: 100%; justify-content: space-between; }
  body.csc-intermittor-studio .csc-web-pdf-actions button { flex-shrink: 0; padding-inline: 10px; }
}

/* Recovered projects surface */
/* Project, timesheet and business tools — current native Studio surfaces.
   Keep the printable PDF iframe isolated: only its surrounding controls change. */
body.csc-intermittor-studio #content .csc-studio-preview-tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}
body.csc-intermittor-studio #content .csc-studio-preview-content {
  grid-column: 1 / -1;
  width: 100%;
}
body.csc-intermittor-studio #content #ts-pdf-preview-pick,
body.csc-intermittor-studio #content #ts-pdf-preview-template {
  width: 100%;
  min-width: 0;
  min-height: 48px;
}
body.csc-intermittor-studio #content [data-testid="ts-preview-reimportable"] {
  min-width: 0;
  white-space: normal;
  line-height: 1.35;
  font-size: 12px;
  border-color: var(--studio-line) !important;
  color: var(--studio-muted) !important;
  background: var(--studio-surface-2) !important;
}
body.csc-intermittor-studio #content [data-action="ts-preview-zoom"] {
  min-height: 44px;
  min-width: 44px;
}
body.csc-intermittor-studio #content :is(
  [data-action="ts-stats-preset"],
  [data-action="ts-stats-conv"],
  [data-action="ts-stats-sort"],
  [data-action="ts-ex-hours"],
  [data-action="ts-ex-contract"],
  [data-action="ts-cal-mode"][aria-pressed]
) {
  min-height: 44px;
  font-size: 13px;
  border: 1px solid var(--studio-line);
  background: var(--studio-surface) !important;
  color: var(--studio-ink) !important;
}
body.csc-intermittor-studio #content :is(
  [data-action="ts-stats-preset"],
  [data-action="ts-stats-conv"],
  [data-action="ts-stats-sort"],
  [data-action="ts-ex-hours"],
  [data-action="ts-ex-contract"],
  [data-action="ts-cal-mode"][aria-pressed]
)[aria-pressed="true"] {
  background: var(--studio-surface-2) !important;
  color: var(--studio-primary) !important;
  border-color: var(--studio-primary) !important;
  font-weight: 650;
}
body.csc-intermittor-studio #content [data-action="cp-conv-set"] {
  min-height: 44px;
  font-size: 13px;
  line-height: 1.3;
}
body.csc-intermittor-studio #content [data-action="cp-conv-set"].bg-amber-600 {
  background: var(--studio-surface-2) !important;
  color: var(--studio-primary) !important;
  box-shadow: inset 0 0 0 1px var(--studio-primary);
}
body.csc-intermittor-studio #content:has(.csc-studio-quick-entry-header) :is(input, select) {
  background: var(--studio-surface) !important;
}
body.csc-intermittor-studio #content:has(.csc-studio-quick-entry-header) input::placeholder,
body.csc-intermittor-studio #content .csc-studio-sheet input::placeholder {
  color: var(--studio-muted);
  opacity: 1;
}
body.csc-intermittor-studio #content:has(.csc-studio-quick-entry-header) label > :is(div, span):first-child,
body.csc-intermittor-studio #content .csc-studio-sheet label > :is(div, span):first-child,
body.csc-intermittor-studio #content .csc-studio-project-filters label > div:first-child {
  font-size: 12px;
  line-height: 1.4;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 550;
  color: var(--studio-muted) !important;
  margin-bottom: 6px;
}
body.csc-intermittor-studio #content:has(.csc-studio-quick-entry-header) [data-activity-impact] {
  border: 1px solid var(--studio-line);
  border-radius: 14px;
  background: var(--studio-surface-2) !important;
  color: var(--studio-ink) !important;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.45;
}
body.csc-intermittor-studio #content .csc-studio-sheet > header > div :is(h2, p) {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}
body.csc-intermittor-studio #content :is(
  [data-action="ts-f-edit"],
  [data-action="ts-preview-download"],
  [data-action="ts-f-edit-done"]
) {
  min-height: 44px;
}
@media (min-width: 640px) {
  body.csc-intermittor-studio #content .csc-studio-preview-tools {
    grid-template-columns: minmax(260px, 1fr) minmax(150px, auto) auto auto;
  }
  body.csc-intermittor-studio #content .csc-studio-preview-content { grid-column: auto; }
}

/* Recovered account surface */
/* Account, directory and personal forms share the native Studio hierarchy. */
body.csc-intermittor-studio #content .csc-account-page {
  width: 100%; max-width: 860px; margin-inline: auto; padding-bottom: 24px;
}
body.csc-intermittor-studio #content .csc-owner-onboarding { max-width: 560px; }
body.csc-intermittor-studio #content .csc-account-header { margin-bottom: 24px; }
body.csc-intermittor-studio #content .csc-account-header :is(h1,h2) {
  font-size: calc(28px * var(--csc-text-scale,1)); font-weight: 700; line-height: 1.14; letter-spacing: -.65px;
}
body.csc-intermittor-studio #content .csc-account-header > p {
  font-size: calc(14px * var(--csc-text-scale,1)); line-height: 1.5; color: var(--studio-muted) !important; margin-top: 8px;
}
body.csc-intermittor-studio #content :is(.csc-account-card,.csc-account-group) {
  border: 1px solid color-mix(in srgb,var(--studio-line) 62%,transparent) !important;
  background: var(--studio-surface) !important; border-radius: 16px; overflow: hidden;
  box-shadow: 0 1px 2px rgb(23 21 29 / 4%); color: var(--studio-ink);
}
body.dark.csc-intermittor-studio #content :is(.csc-account-card,.csc-account-group) {
  border-color: rgb(255 255 255 / 10%) !important; box-shadow: none;
}
body.csc-intermittor-studio #content .csc-account-hero {
  background: var(--studio-surface-2) !important; background-image: none !important;
  padding: 20px; border-color: var(--studio-surface-3) !important;
}
body.csc-intermittor-studio #content .csc-account-hero :is(h1,h2) {
  font-weight: 650; font-size: calc(20px * var(--csc-text-scale,1)); line-height: 1.25; letter-spacing: -.3px;
}
body.csc-intermittor-studio #content .csc-account-page .font-black { font-weight: 650; }
body.csc-intermittor-studio #content .csc-account-page .csc-account-section-title {
  display: block; margin: 0 0 14px; color: var(--studio-ink) !important;
  text-transform: none; letter-spacing: -.15px; font-weight: 650; font-size: calc(16px * var(--csc-text-scale,1)); line-height: 1.3;
}
body.csc-intermittor-studio #content .csc-account-page > div > section > h2,
body.csc-intermittor-studio #content [data-ts-plus-help] > section > h2 {
  text-transform: none; letter-spacing: -.1px; color: var(--studio-muted) !important;
  font-size: calc(13px * var(--csc-text-scale,1)); font-weight: 600; margin-bottom: 8px; padding-left: 12px;
}
body.csc-intermittor-studio #content .csc-account-group > button {
  min-height: 64px; padding: 12px 16px; gap: 12px; border-color: var(--studio-surface-3) !important;
}
body.csc-intermittor-studio #content .csc-account-group > button:hover { background: var(--studio-surface-2) !important; }
body.csc-intermittor-studio #content .csc-account-group .csc-plus-icon { flex-shrink: 0; width: 36px; }
body.csc-intermittor-studio #content .csc-account-steps > li > span:first-child {
  background: var(--studio-surface-2) !important; color: var(--studio-primary) !important;
}
body.csc-intermittor-studio #content .csc-owner-card { padding: 20px !important; }
body.csc-intermittor-studio #content :is(.csc-owner-edit,.csc-infosheet-section,.csc-account-form-section) { padding: 20px; }
body.csc-intermittor-studio #content .csc-account-form-section > * + * { margin-top: 16px; }
body.csc-intermittor-studio #content .csc-owner-edit > div:first-child { gap: 12px; align-items: start; }
body.csc-intermittor-studio #content .csc-account-field { display: block; min-width: 0; }
body.csc-intermittor-studio #content .csc-account-field > span:first-child,
body.csc-intermittor-studio #content .csc-account-page label > div:first-child:not(:has(input)) {
  display: block; margin-bottom: 6px; font-size: calc(13px * var(--csc-text-scale,1)); font-weight: 500;
  color: var(--studio-muted) !important; text-transform: none; letter-spacing: 0; line-height: 1.35;
}
body.csc-intermittor-studio #content .csc-account-field > input { width: 100%; min-width: 0; }
body.csc-intermittor-studio #content .csc-account-field > span + input + span { font-size: calc(12px * var(--csc-text-scale,1)); line-height: 1.45; }
body.csc-intermittor-studio #content .csc-infosheet-sections { display: grid; gap: 16px; }
body.csc-intermittor-studio #content .csc-infosheet-sections > * { margin-top: 0; }
body.csc-intermittor-studio #content .csc-team-contact {
  min-height: 80px; padding: 16px; gap: 10px; border-radius: 16px;
  border-color: var(--studio-surface-3) !important; background: var(--studio-surface) !important;
}
body.csc-intermittor-studio #content .csc-team-contact[aria-pressed=true] { border-color: var(--studio-primary) !important; box-shadow: 0 0 0 1px var(--studio-primary); }
body.csc-intermittor-studio #content .csc-team-contact > button { min-width: 44px; min-height: 44px; }
body.csc-intermittor-studio #content .csc-team-empty { padding: 32px 20px !important; }
body.csc-intermittor-studio #content .csc-account-missing { padding: 24px; }
body.csc-intermittor-studio #content .csc-account-missing > button { display: block; margin-top: 12px; }
body.csc-intermittor-studio #content .csc-account-page :is(button,[role=button]) { min-height: 44px; }
body.csc-intermittor-studio #content .csc-account-page :is(button,[role=button]):focus-visible {
  outline: 3px solid var(--studio-primary); outline-offset: 3px;
}
body.csc-intermittor-studio #content .csc-account-page button:is(.bg-stone-900,.bg-stone-950,.bg-amber-600) {
  background: var(--studio-primary) !important; color: var(--studio-canvas) !important; border-radius: 14px; font-weight: 600;
}
body.csc-intermittor-studio #content .csc-owner-onboarding button[aria-disabled=true] { background: var(--studio-surface-3) !important; color: var(--studio-muted) !important; }
body.csc-intermittor-studio #content .csc-account-page :is([data-action="ts-infosheet-clear"],[data-action="ts-delete-team-member"]) { color: #c2314d !important; }
body.dark.csc-intermittor-studio #content .csc-account-page :is([data-action="ts-infosheet-clear"],[data-action="ts-delete-team-member"]) { color: #ff98ad !important; }
/* These app-level account views keep their existing state and action handlers. */
body.csc-intermittor-studio.csc-account-auth #content > div { max-width: 620px; }
body.csc-intermittor-studio.csc-account-auth #content :is(.rounded-2xl,.rounded-3xl) {
  border-radius: 20px; border-color: var(--studio-surface-3) !important;
}
body.csc-intermittor-studio.csc-account-auth #content :is(h1,h2) { font-size: calc(28px * var(--csc-text-scale,1)); font-weight: 700; letter-spacing: -.5px; }
body.csc-intermittor-studio.csc-account-auth #content button { min-height: 44px; }
body.csc-intermittor-studio.csc-account-auth #content button:is(.bg-stone-900,.bg-amber-600) {
  background: var(--studio-primary) !important; color: var(--studio-canvas) !important; border-radius: 14px;
}
body.csc-intermittor-studio .csc-profile-sheet--intermittor {
  background: var(--studio-canvas) !important; border: 1px solid var(--studio-surface-3); border-radius: 24px !important;
}
body.csc-intermittor-studio .csc-profile-sheet--intermittor .csc-profile-header { background: var(--studio-canvas) !important; }
body.csc-intermittor-studio .csc-profile-sheet--intermittor :is(.csc-profile-row,.csc-profile-group) {
  background: var(--studio-surface) !important; color: var(--studio-ink) !important; border-color: var(--studio-surface-3) !important;
}
body.csc-intermittor-studio .csc-profile-sheet--intermittor :is(button,a) { min-height: 44px; }
body.csc-intermittor-studio [data-action="csc-delete-account-backdrop"] > div { background: var(--studio-surface) !important; border-color: var(--studio-surface-3) !important; border-radius: 24px; }
body.csc-intermittor-studio [data-action="csc-delete-account-backdrop"] > div > .border-t { background: var(--studio-canvas) !important; border-color: var(--studio-surface-3) !important; flex-wrap: wrap; }
body.csc-intermittor-studio [data-action="csc-delete-account-backdrop"] button { min-height: 44px; border-radius: 14px; }
@media (max-width: 420px) {
  body.csc-intermittor-studio #content :is(.csc-owner-edit,.csc-owner-onboarding) .grid-cols-2 { grid-template-columns: 1fr; }
  body.csc-intermittor-studio #content .csc-team-contact { padding: 12px; gap: 8px; }
  body.csc-intermittor-studio #content .csc-team-contact > div:first-of-type { width: 36px; height: 36px; }
}
@media (min-width: 900px) {
  body.csc-intermittor-studio #content .csc-team-page { max-width: 960px; }
}

body.csc-intermittor-studio #content .csc-team-actions {
  display: flex; flex-direction: column; gap: 0; border: 1px solid var(--studio-surface-3);
  border-radius: 16px; overflow: hidden; background: var(--studio-surface);
}
body.csc-intermittor-studio #content .csc-team-actions > button {
  min-height: 64px; padding: 16px; justify-content: flex-start; gap: 14px; border: 0;
  border-radius: 0; background: var(--studio-surface) !important; color: var(--studio-primary) !important;
  font-size: calc(15px * var(--csc-text-scale,1)); font-weight: 500;
}
body.csc-intermittor-studio #content .csc-team-actions > button + button { border-top: 1px solid var(--studio-surface-3); }
body.csc-intermittor-studio #content .csc-team-actions > button > svg { width: 24px; height: 24px; }
body.csc-intermittor-studio #content .csc-member-heading { display: flex; align-items: center; gap: 12px; margin-top: 20px; }
body.csc-intermittor-studio #content .csc-member-avatar {
  width: 48px; height: 48px; flex: 0 0 48px; display: grid; place-items: center; border-radius: 50%;
  background: var(--studio-primary); color: var(--studio-canvas); font-size: calc(20px * var(--csc-text-scale,1)); font-weight: 600;
}
body.csc-intermittor-studio #content .csc-member-heading h2 { font-size: calc(22px * var(--csc-text-scale,1)); }
body.csc-intermittor-studio #content .csc-member-heading p { margin-top: 3px; font-size: calc(15px * var(--csc-text-scale,1)); color: var(--studio-muted); }
body.csc-intermittor-studio #content .csc-owner-onboarding .csc-large-title { font-size: calc(28px * var(--csc-text-scale,1)); }

/* Account forms and account dialogs use the same readable controls as the directory. */
body.csc-intermittor-studio.csc-account-auth #content > :is(header,form,.max-w-md) { width: 100%; max-width: 620px; margin-inline: auto; }
body.csc-intermittor-studio.csc-account-auth #content label { display: block; min-width: 0; }
body.csc-intermittor-studio.csc-account-auth #content label > div:first-child:not(.relative) {
  color: var(--studio-muted) !important; font-size: calc(13px * var(--csc-text-scale,1)); line-height: 1.4;
}
body.csc-intermittor-studio.csc-account-auth #content :is(input:not([type=checkbox]),select) { min-height: 44px; min-width: 0; }
body.csc-intermittor-studio.csc-account-auth #content :is(button,input,select):focus-visible,
body.csc-intermittor-studio :is([data-api-panel],.csc-profile-sheet--intermittor,[data-action="csc-delete-account-backdrop"],[data-action="csc-login-signout-backdrop"]) :is(button,input,a):focus-visible {
  outline: 3px solid var(--studio-primary); outline-offset: 3px;
}
body.csc-intermittor-studio.csc-account-auth #content dl > div { flex-wrap: wrap; row-gap: 4px; }
body.csc-intermittor-studio.csc-account-auth #content dl :is(dd,dt) { overflow-wrap: anywhere; }
body.csc-intermittor-studio [data-api-panel] {
  background: var(--studio-canvas) !important; color: var(--studio-ink); border: 1px solid var(--studio-surface-3); border-radius: 24px;
}
body.csc-intermittor-studio [data-api-panel] > div:first-child { padding: 20px; background: var(--studio-surface); border-color: var(--studio-surface-3) !important; }
body.csc-intermittor-studio [data-api-panel] h2 { font-size: calc(20px * var(--csc-text-scale,1)); font-weight: 650; letter-spacing: -.3px; }
body.csc-intermittor-studio [data-api-panel] h3 { font-size: calc(15px * var(--csc-text-scale,1)); font-weight: 600; letter-spacing: 0; text-transform: none; }
body.csc-intermittor-studio [data-api-panel] :is(button,input) { min-height: 44px; }
body.csc-intermittor-studio [data-api-panel] [data-action="csc-api-panel-close"] { min-width: 44px; }
body.csc-intermittor-studio [data-api-panel] :is([data-api-access],[data-api-create-form],[data-api-create-limit],[data-api-reveal]) {
  padding: 18px; border-radius: 16px; background: var(--studio-surface) !important; border-color: var(--studio-surface-3) !important;
}
body.csc-intermittor-studio [data-api-panel] [data-api-code] { font-size: calc(12px * var(--csc-text-scale,1)); line-height: 1.6; }
body.csc-intermittor-studio [data-api-panel] [data-action="csc-api-guide-tab"][aria-selected=true] { color: var(--studio-primary) !important; background: var(--studio-surface) !important; }
body.csc-intermittor-studio [data-api-panel] [data-action="csc-api-scope"][aria-checked=true] { border-color: var(--studio-primary) !important; background: var(--studio-surface-2) !important; }
body.csc-intermittor-studio [data-api-panel] button:is(.bg-amber-600,.bg-stone-900) { background: var(--studio-primary) !important; color: var(--studio-on-primary) !important; border-radius: 14px; }
body.csc-intermittor-studio [data-action="csc-login-signout-backdrop"] > div { background: var(--studio-surface) !important; border: 1px solid var(--studio-surface-3); border-radius: 24px; }
body.csc-intermittor-studio [data-action="csc-login-signout-backdrop"] button { min-height: 48px; }
@media (max-width: 420px) {
  body.csc-intermittor-studio.csc-account-auth[data-csc-text-size=xlarge] #content .grid-cols-2,
  body.csc-intermittor-studio[data-csc-text-size=xlarge] #content .csc-team-edit .grid-cols-2 { grid-template-columns: 1fr; }
  body.csc-intermittor-studio [data-api-panel] > .p-5 { padding: 16px; }
}

/* Modal account flows cover and disable the persistent navigation and support launcher. */
body.csc-intermittor-studio:has(:is([data-api-panel],.csc-profile-sheet--intermittor,[data-action="csc-delete-account-backdrop"],[data-action="csc-login-signout-backdrop"])) :is(#csc-mobile-tabbar,#csc-support-launcher) { visibility: hidden; pointer-events: none; }

/* Recovered rights-admin surface */
/* Rights and administrative routes: current SwiftUI/Compose Studio surfaces.
   Render-only hooks; legal values, calculation models and actions are unchanged. */
body.csc-intermittor-studio #content .csc-studio-rights { min-width: 0; color: var(--studio-ink); }
body.csc-intermittor-studio #content :is(.csc-studio-admin,.csc-studio-are-onboarding,.csc-studio-records) { max-width: 880px; margin-inline: auto; }
body.csc-intermittor-studio #content .csc-studio-rights :is(h1,.csc-large-title) { font-size: calc(30px * var(--csc-text-scale,1)); line-height: 1.15; letter-spacing: -.025em; font-weight: 750; }
body.csc-intermittor-studio #content .csc-studio-rights header > p { font-size: calc(15px * var(--csc-text-scale,1)); line-height: 1.45; max-width: 65ch; }
body.csc-intermittor-studio #content .csc-studio-rights :is(.bg-white.border,[data-admin-vault-entry]):not(:where(input,select,textarea)) {
  background: var(--studio-surface) !important; border-color: var(--studio-surface-3) !important;
  border-radius: var(--studio-card-radius); box-shadow: var(--studio-shadow);
}
body.csc-intermittor-studio #content .csc-studio-rights :is(.bg-stone-50,.bg-stone-100) { background: var(--studio-surface-2) !important; }
body.csc-intermittor-studio #content .csc-studio-rights :is(.text-stone-400,.text-stone-500,.text-stone-600) { color: var(--studio-muted) !important; }
body.csc-intermittor-studio #content .csc-studio-rights :is(.text-stone-700,.text-stone-800,.text-stone-900,.text-stone-950) { color: var(--studio-ink) !important; }
body.csc-intermittor-studio #content .csc-studio-rights :is(.border-stone-100,.border-stone-200,.border-stone-300):not(:where(input,select,textarea)) { border-color: var(--studio-surface-3) !important; }
body.csc-intermittor-studio #content .csc-studio-rights :is([class~="text-[9px]"],[class~="text-[10px]"],[class~="text-[11px]"],[class~="text-[11.5px]"],.text-xs,[class~="text-[12px]"],[class~="text-[12.5px]"]) { font-size: calc(13px * var(--csc-text-scale,1)); line-height: 1.4; }
body.csc-intermittor-studio #content .csc-studio-rights :is([class~="text-[13px]"],.text-sm,[class~="text-[14px]"]) { font-size: calc(14px * var(--csc-text-scale,1)); line-height: 1.4; }
body.csc-intermittor-studio #content .csc-studio-rights :is([class~="text-[15px]"],[class~="text-[16px]"],.text-base) { font-size: calc(16px * var(--csc-text-scale,1)); line-height: 1.35; }
body.csc-intermittor-studio #content .csc-studio-rights :is(h3,h4) { font-size: calc(18px * var(--csc-text-scale,1)); line-height: 1.25; letter-spacing: -.015em; }
body.csc-intermittor-studio #content .csc-studio-rights label :is(.uppercase,.tracking-widest) { text-transform: none; letter-spacing: 0; font-weight: 600; }
body.csc-intermittor-studio #content .csc-studio-rights :is(button,summary,label:has(input[type=file])) { min-height: 44px; }
body.csc-intermittor-studio #content .csc-studio-rights button { white-space: normal; overflow-wrap: anywhere; }
body.csc-intermittor-studio #content .csc-studio-rights label:has(input[type=file]):focus-within { outline: 3px solid var(--studio-primary); outline-offset: 3px; }
body.csc-intermittor-studio #content .csc-studio-rights :is(.bg-violet-600,.bg-violet-700,.bg-sky-700) { background: var(--studio-primary) !important; color: var(--studio-on-primary) !important; }
body.csc-intermittor-studio #content .csc-studio-rights :is(.bg-violet-50,.bg-violet-100,.bg-sky-50) { background: var(--studio-surface-2) !important; border-color: var(--studio-line) !important; }
body.csc-intermittor-studio #content .csc-studio-rights :is(.text-violet-700,.text-violet-800,.text-violet-900,.text-violet-950,.text-sky-800,.text-sky-900,.text-sky-950) { color: var(--studio-primary) !important; }
body.csc-intermittor-studio #content .csc-studio-rights .bg-amber-50 { background: color-mix(in srgb,var(--studio-secondary) 10%,var(--studio-surface)) !important; }
body.csc-intermittor-studio #content .csc-studio-rights :is(.text-amber-700,.text-amber-800,.text-amber-900) { color: var(--studio-warning) !important; }
body.csc-intermittor-studio #content .csc-studio-rights :is(.text-rose-600,.text-rose-700,.text-red-600) { color: var(--studio-danger) !important; }
body.csc-intermittor-studio #content .csc-studio-rights :is([data-action="ts-are-save"],[data-action="ts-admin-export-pack"],[data-action="ts-admin-export-zip"]) {
  min-height: 48px; border-radius: 14px; background: var(--studio-secondary) !important; color: var(--studio-on-secondary) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 18%),0 3px 0 color-mix(in srgb,var(--studio-secondary) 72%,#17151d);
}
body.csc-intermittor-studio #content .csc-studio-rights :is([data-action="ts-ft-annexe"],[data-action="ts-are-annexe"],[data-action^="ts-sim-mode-"],[data-action="ts-cs-profession"],[data-action="ts-cs-abbattement"],[data-action="ts-sim-csg"])[aria-pressed="true"] {
  background: var(--studio-primary) !important; color: var(--studio-on-primary) !important; border-color: transparent !important;
}
body.csc-intermittor-studio #content .csc-studio-rights :is([data-action="ts-ft-annexe"],[data-action="ts-are-annexe"],[data-action^="ts-sim-mode-"],[data-action="ts-cs-profession"],[data-action="ts-cs-abbattement"],[data-action="ts-sim-csg"])[aria-pressed="false"] {
  background: var(--studio-surface-2) !important; color: var(--studio-muted) !important; border-color: transparent !important;
}
body.csc-intermittor-studio #content .csc-studio-are-onboarding > .bg-white { padding: 20px; border-radius: 20px; }
body.csc-intermittor-studio #content .csc-studio-are-onboarding > details { padding: 0; }
body.csc-intermittor-studio #content .csc-studio-are-onboarding > details > summary { gap: 12px; }
body.csc-intermittor-studio #content .csc-studio-are-onboarding [data-action="ts-are-onb-toggle-refus"] { min-width: 44px; height: 44px; padding-block: 10px; background-clip: content-box; }
body.csc-intermittor-studio #content .csc-studio-are-situation { background: var(--studio-surface) !important; border-color: var(--studio-surface-3) !important; border-radius: 20px; }
body.csc-intermittor-studio #content .csc-studio-are-situation [data-action="ts-situation-toggle"] { align-items: flex-start; flex-wrap: wrap; }
body.csc-intermittor-studio #content .csc-studio-are-situation [data-action="ts-situation-toggle"] .truncate { white-space: normal; overflow: visible; }
body.csc-intermittor-studio #content .csc-studio-history-actions { grid-template-columns: repeat(auto-fit,minmax(105px,1fr)); gap: 8px; }
body.csc-intermittor-studio #content .csc-studio-are-history > div:first-child { flex-wrap: wrap; }
body.csc-intermittor-studio #content .csc-studio-are-history > div:first-child > button:first-child { flex-basis: 220px; }
body.csc-intermittor-studio #content .csc-studio-simulator > div:has(> [data-action^="ts-sim-mode-"]) { flex-wrap: wrap; }
body.csc-intermittor-studio #content .csc-studio-simulator :is(.csc-sim-hours-input,.csc-sim-rate-input) { width: 100px; padding-right: 12px !important; }
body.csc-intermittor-studio #content .csc-studio-simulator input[type=range] { accent-color: var(--studio-primary); }
body.csc-intermittor-studio #content .csc-studio-conges .csc-cs-summary { white-space: normal; overflow: visible; }
body.csc-intermittor-studio #content .csc-studio-admin section > div:first-child:has(h3) { flex-wrap: wrap; }
body.csc-intermittor-studio #content .csc-studio-admin [data-action="ts-admin-vault-open"] { padding: 18px; border-radius: 20px; }
body.csc-intermittor-studio #content .csc-studio-admin [data-action="ts-admin-vault-open"] > span:first-child { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--studio-surface-2); color: var(--studio-primary) !important; }
body.csc-intermittor-studio #content .csc-studio-admin [aria-labelledby="ts-admin-medical-title"] > div:first-child > div { flex-wrap: wrap; }
body.csc-intermittor-studio #content .csc-studio-vault-actions { grid-template-columns: repeat(auto-fit,minmax(125px,1fr)); }
body.csc-intermittor-studio #content .csc-studio-admin [data-admin-vault-entry] h3 { overflow-wrap: anywhere; }
body.csc-intermittor-studio #content .csc-studio-admin [data-transfer-status="failed"] { border-color: var(--studio-warning) !important; }
body.csc-intermittor-studio #content .csc-studio-records .csc-studio-document-row { padding: 18px 16px; }
body.csc-intermittor-studio #content .csc-studio-records .csc-studio-document-row > div:first-child { flex-wrap: wrap; }
body.csc-intermittor-studio #content .csc-studio-records .csc-studio-document-row > div:first-child > span:first-child { flex: 1 1 240px; }
body.csc-intermittor-studio #content .csc-studio-document-fields { display: grid; grid-template-columns: repeat(auto-fit,minmax(135px,1fr)); align-items: end; }
body.csc-intermittor-studio #content .csc-studio-document-fields input { width: 100%; min-width: 0; }
@media (max-width: 639px) {
  body.csc-intermittor-studio #content .csc-studio-rights :is(h1,.csc-large-title) { font-size: calc(28px * var(--csc-text-scale,1)); }
  body.csc-intermittor-studio #content .csc-studio-are-onboarding > .bg-white { padding: 16px; }
  body.csc-intermittor-studio #content .csc-studio-rights [data-testid="ts-507-actualisation"] { overflow-wrap: anywhere; }
  body.csc-intermittor-studio:is([data-csc-text-size="large"],[data-csc-text-size="xlarge"]) #content .csc-studio-admin .grid-cols-2,
  body.csc-intermittor-studio:is([data-csc-text-size="large"],[data-csc-text-size="xlarge"]) #content .csc-studio-records .grid-cols-2 { grid-template-columns: 1fr; }
}

/* Keep badges intact and inherited text legible on the lavender dark CTA. */
body.csc-intermittor-studio #content .csc-studio-admin [data-action="ts-admin-export-medical"] > span:last-child { flex-shrink: 0; white-space: nowrap; }
body.csc-intermittor-studio #content .csc-studio-are-onboarding > button .text-violet-200 { color: inherit !important; opacity: .85; }
/* The source badge wraps below the renewal title at phone widths. */
body.csc-intermittor-studio #content .csc-studio-rights [data-testid="ts-reexamen-header"] { flex-wrap: wrap; background: var(--studio-surface-2) !important; color: var(--studio-ink) !important; }
body.csc-intermittor-studio #content .csc-studio-rights [data-testid="ts-reexamen-header"] > div:first-child { flex: 1 1 240px; }
body.csc-intermittor-studio #content .csc-studio-rights [data-testid="ts-reexamen-source"] { max-width: 100%; white-space: normal; background: var(--studio-surface) !important; color: var(--studio-primary) !important; border-color: var(--studio-line) !important; }
body.csc-intermittor-studio #content .csc-studio-rights [data-testid="ts-reexamen-header"] .text-violet-200 { color: var(--studio-primary) !important; }
/* Pastille d'icône : le blanc translucide d'origine disparaissait sur la
   surface claire du Studio ; même pastille que les tuiles de l'app. */
body.csc-intermittor-studio #content .csc-studio-rights [data-testid="ts-reexamen-header"] span[aria-hidden="true"].rounded-xl { background: color-mix(in srgb, var(--studio-primary) 14%, transparent) !important; color: var(--studio-primary) !important; }
/* The legacy monetary panels keep their fixed dark background in both themes. */
body.csc-intermittor-studio #content .csc-studio-simulator .csc-sim-output > div[style*="background:#1c1917"] .text-stone-500 { color: #c9c5ce !important; }
body.csc-intermittor-studio #content .csc-studio-admin :is(.bg-emerald-100,.bg-emerald-50) { background: color-mix(in srgb,var(--studio-success) 14%,var(--studio-surface)) !important; }
body.csc-intermittor-studio #content .csc-studio-admin :is(.text-emerald-700,.text-emerald-800,.text-emerald-900) { color: var(--studio-success) !important; }

/* Keep the active field visible after section border theming. */
body.csc-intermittor-studio #content .csc-studio-rights :is(input,select,textarea):focus {
  border-color: var(--studio-primary) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb,var(--studio-primary) 18%,transparent);
}

/* Intermittor desktop workspace. Existing Studio tokens and native assets are
   shared; the workspace is enabled only by the web renderer. */
body.web-studio-workspace { --web-rail-width: 232px; --web-header-height: 52px; --studio-border: var(--studio-line); --studio-text: var(--studio-ink); }
body.web-studio-workspace #content { max-width: none !important; padding: 0 28px 28px !important; margin-left: var(--web-rail-width); }
body.web-studio-workspace > .sticky.top-0 { z-index: 35; }
body.web-studio-workspace > .sticky.top-0 > div { max-width: none; }
.web-desktop-sidebar { position: fixed; top: var(--web-header-height); left: 0; bottom: 0; width: var(--web-rail-width); display: flex; flex-direction: column; gap: 8px; padding: 20px 14px 14px; background: var(--studio-surface, #fff); border-right: 1px solid var(--studio-border, #e7e2ef); overflow-y: auto; z-index: 30; }
.web-desktop-brand { display: flex; align-items: center; gap: 10px; padding: 2px 10px 16px; font-size: 17px; font-weight: 750; letter-spacing: -.4px; }
.web-desktop-brand img { border-radius: 9px; object-fit: contain; }
.web-desktop-brand small { display: block; font-size: 11px; font-weight: 500; color: var(--studio-muted, #797381); letter-spacing: 0; margin-top: 2px; }
.web-desktop-sidebar nav { display: grid; gap: 3px; }
body.web-studio-workspace #content .web-desktop-nav-item { display: flex; align-items: center; gap: 11px; width: 100%; min-height: 43px; padding: 9px 12px; text-align: left; border-radius: 10px; font-size: 13px; font-weight: 550; color: var(--studio-muted, #716a7d); border: 1px solid transparent; }
.web-desktop-nav-item svg { flex-shrink: 0; }
body.web-studio-workspace #content .web-desktop-nav-item[aria-current="page"] { background: #eee6ff !important; color: #6331cf !important; font-weight: 700; }
body.dark.web-studio-workspace #content .web-desktop-nav-item[aria-current="page"] { background: #38274d !important; color: #dec8ff !important; }
.web-desktop-sidebar-label { padding: 16px 12px 4px; font-size: 10px; letter-spacing: .08em; font-weight: 750; text-transform: uppercase; color: var(--studio-muted, #847d8c); }
.web-desktop-sidebar-footer { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--studio-border, #e7e2ef); display: grid; gap: 3px; }
body.web-studio-workspace #content .web-desktop-search-trigger { display: flex; align-items: center; gap: 9px; min-height: 40px; padding: 8px 11px; width: 100%; border: 1px solid var(--studio-border, #e7e2ef); border-radius: 10px; font-size: 12px; color: var(--studio-muted, #716a7d); background: var(--studio-surface-2, #f6f3fa) !important; }
.web-desktop-search-trigger kbd { margin-left: auto; }
body.web-studio-workspace #content .web-desktop-create { margin: 4px 0 12px; display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 43px; padding: 10px; border-radius: 11px; background: #713de0 !important; color: #fff !important; font-size: 13px; font-weight: 700; }
.web-desktop-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 70px; margin-bottom: 16px; border-bottom: 1px solid var(--studio-border, #e7e2ef); }
.web-desktop-breadcrumb { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 650; color: var(--studio-muted, #716a7d); }
.web-desktop-toolbar-actions { display: flex; gap: 8px; }
body.web-studio-workspace #content .web-desktop-toolbar-actions button { display: flex; align-items: center; gap: 7px; min-height: 38px; padding: 7px 12px; border-radius: 9px; font-size: 12px; border: 1px solid var(--studio-border, #e7e2ef); background: var(--studio-surface, #fff) !important; }
.web-desktop-toolbar kbd,.web-desktop-search-trigger kbd,.web-desktop-search-hint kbd { font: inherit; font-size: 10px; white-space: nowrap; padding: 1px 4px; color: var(--studio-muted, #716a7d); }
.web-desktop-main { max-width: 1440px; margin-inline: auto; min-width: 0; outline-offset: 4px; }
.web-studio-home-module { min-width: 0; overflow-wrap: anywhere; }
body.web-studio-workspace #content .web-desktop-create :is(span,svg) { color: inherit !important; }
body.web-studio-workspace:not(.dark) #content .web-project-calendar-day { color: #27202f !important; }
body.dark.web-studio-workspace #content .web-project-calendar-day { color: #fafaf9 !important; }
body.web-studio-workspace #content .web-project-calendar-day > div:first-of-type { font-size: 16px; }
body.web-studio-workspace #content .web-project-calendar-day > div:last-of-type:not(:first-of-type) { font-size: 12px; opacity: 1; }
@media (max-width: 767px) {
  body.web-studio-workspace #content .web-project-calendar-day > div:first-of-type { font-size: 13px; }
  body.web-studio-workspace #content .web-project-calendar-day > div:last-of-type:not(:first-of-type) { font-size: 10px; }
}
.web-desktop-main > .csc-topnav-desktop { display: none !important; }
.web-desktop-main > main { max-width: none; }
.web-desktop-skip { position: fixed; top: 60px; left: 245px; z-index: 200; padding: 10px 16px; background: #713de0; color: white; border-radius: 8px; transform: translateY(-160px); }
.web-desktop-skip:focus { transform: none; }
body.web-studio-workspace #content :is(.web-desktop-search-dialog) { border: 1px solid var(--studio-border, #e7e2ef); border-radius: 18px; padding: 0; width: min(640px, calc(100vw - 32px)); max-height: min(76dvh, 690px); color: var(--studio-text, #24202b); background: var(--studio-surface, white); margin: 12vh auto auto; box-shadow: 0 24px 100px #100c2040; }
.web-desktop-search-dialog::backdrop { background: #100c2066; backdrop-filter: blur(4px); }
.web-desktop-search-heading { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px 0; }
.web-desktop-search-heading h2 { font-size: 14px; font-weight: 700; }
.web-desktop-search-heading button { min-width: 40px; min-height: 40px; font-size: 24px; color: var(--studio-muted, #716a7d); }
.web-desktop-search-field { display: flex; align-items: center; gap: 12px; margin: 8px 18px 16px; }
body.web-studio-workspace #content #web-desktop-query { flex: 1; min-width: 0; background: transparent !important; border: 0 !important; padding: 8px 0; font-size: 18px; box-shadow: none; }
.web-desktop-search-results { max-height: 48dvh; overflow-y: auto; padding: 6px 8px; border-block: 1px solid var(--studio-border, #e7e2ef); }
body.web-studio-workspace #content .web-desktop-search-result { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 61px; text-align: left; padding: 9px 12px; border-radius: 10px; }
.web-desktop-search-result > span:first-of-type { flex: 1; min-width: 0; }
.web-desktop-search-result strong { display: block; font-size: 13px; font-weight: 650; overflow-wrap: anywhere; }
.web-desktop-search-result small { display: block; font-size: 11px; margin-top: 2px; color: var(--studio-muted, #716a7d); overflow-wrap: anywhere; }
.web-desktop-result-group { font-size: 10px; color: var(--studio-muted, #716a7d); }
.web-desktop-search-hint { display: flex; justify-content: space-between; padding: 12px 18px; font-size: 10px; color: var(--studio-muted, #716a7d); }
.web-desktop-search-empty { padding: 24px 12px; color: var(--studio-muted, #716a7d); font-size: 13px; }
body.web-studio-workspace #content :is(.web-desktop-nav-item,.web-desktop-toolbar-actions button,.web-desktop-search-result):focus-visible { outline: 2px solid #9b6aec !important; outline-offset: -2px; background: var(--studio-surface-2, #f6f3fa) !important; }

/* Shared primitives for the native tools adapted to the web. */
body.csc-intermittor-studio:not(.csc-native) #content .web-studio-card { background: var(--studio-surface, #fff); border: 1px solid var(--studio-border, #e7e2ef); border-radius: 18px; padding: 22px; box-shadow: 0 2px 6px #21172c03; }
.web-studio-card h2 { font-size: 17px; font-weight: 700; letter-spacing: -.3px; margin-bottom: 12px; }
.web-studio-card p { line-height: 1.55; }
.web-studio-toolbar { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.web-studio-toolbar h1 { font-size: clamp(25px, 2.8vw, 34px); line-height: 1.15; font-weight: 750; letter-spacing: -.8px; }
.web-studio-toolbar h2 { font-size: 25px; font-weight: 750; letter-spacing: -.7px; }
.web-studio-field { display: grid; gap: 6px; font-size: 13px; font-weight: 550; }
body.csc-intermittor-studio:not(.csc-native) #content .web-studio-field :is(input,textarea,select) { width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; font-size: 16px; border: 1px solid var(--studio-border, #e7e2ef); border-radius: 10px; background: var(--studio-surface-2, #f6f3fa); color: var(--studio-text, #24202b); }
.web-studio-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 12px; }
.web-studio-item { display: flex; align-items: center; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--studio-border, #e7e2ef); }
.web-studio-item:last-child { border-bottom: 0; }
body.web-studio-workspace #content :is([data-web-career-tool],[data-web-native-extra],[data-web-settings]) { width: 100%; max-width: 1180px; margin-inline: auto; }
body.web-studio-workspace #content button:focus-visible, body.web-studio-workspace #content a:focus-visible { outline: 2px solid #9b6aec; outline-offset: 3px; }
body.web-studio-workspace #content :is(input,textarea,select):focus-visible { outline: 2px solid #9b6aec !important; outline-offset: 2px; }
body.web-studio-workspace #content [hidden] { display: none !important; }

/* Existing business surfaces retain their actions and data model. */
body.web-studio-workspace #content :is([data-testid="ts-projects-header"],.csc-studio-projects-header) { margin-bottom: 22px; }
body.web-studio-workspace #content :is(.csc-studio-sheet-edit,.csc-studio-project-edit-fields,.csc-studio-quick-entry-header) { max-width: 1120px; margin-inline: auto; }
body.web-studio-workspace #content :is(.csc-studio-preview-tools,.csc-studio-project-views) { flex-wrap: wrap; gap: 8px; }
body.web-studio-workspace #content .csc-studio-sheet { max-width: 1180px; margin-inline: auto; }
body.web-studio-workspace #content .web-studio-home-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); align-items: start; gap: 16px; }
body.web-studio-workspace #content .web-studio-home-header { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 14px; margin-bottom: 24px; }
body.web-studio-workspace #content .web-studio-home-header h2 { font-size: 32px; font-weight: 750; letter-spacing: -.8px; }
body.web-studio-workspace #content .web-studio-home-metrics { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; margin-bottom: 20px; }

@media (hover: hover) and (pointer: fine) {
  body.web-studio-workspace #content :is(.web-desktop-nav-item,.web-desktop-search-result):hover { background: var(--studio-surface-2, #f6f3fa) !important; color: var(--studio-text, #24202b); }
  body.web-studio-workspace #content .web-desktop-create:hover { background: #6330cf !important; }
}
@media (min-width: 768px) and (max-width: 1100px) {
  body.web-studio-workspace { --web-rail-width: 74px; }
  .web-desktop-sidebar { padding-inline: 10px; }
  .web-desktop-brand { padding-inline: 8px; }
  .web-desktop-brand > span,.web-desktop-sidebar .web-desktop-nav-item > span,.web-desktop-sidebar .web-desktop-create > span,.web-desktop-sidebar .web-desktop-search-trigger > span,.web-desktop-sidebar kbd,.web-desktop-sidebar-label { display: none; }
  body.web-studio-workspace #content .web-desktop-sidebar :is(.web-desktop-nav-item,.web-desktop-create,.web-desktop-search-trigger) { justify-content: center; padding-inline: 9px; }
  body.web-studio-workspace #content .web-studio-home-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767px) {
  body.web-studio-workspace { --web-rail-width: 0px; }
  body.web-studio-workspace #content { margin-left: 0; padding: 0 16px 24px !important; }
  .web-desktop-sidebar { display: none; }
  .web-desktop-toolbar { min-height: 58px; margin-bottom: 18px; gap: 8px; }
  .web-desktop-toolbar kbd,.web-desktop-toolbar-actions button:first-child span,.web-desktop-breadcrumb svg { display: none; }
  body.web-studio-workspace #content .web-desktop-toolbar-actions button { min-height: 42px; padding: 8px; }
  .web-desktop-breadcrumb { font-size: 12px; }
  .web-desktop-main .csc-topnav-desktop { display: none !important; }
  body.web-studio-workspace #content :is(.web-studio-home-grid,.web-studio-home-metrics) { grid-template-columns: 1fr; }
  body.web-studio-workspace #content .web-studio-card { padding: 18px; border-radius: 16px; }
  .web-desktop-result-group { display: none; }
  .web-desktop-skip { left: 16px; }
}
@media (prefers-reduced-motion: reduce) { .web-desktop-workspace * { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }

/* Tools and the native settings directory, made comfortable on a computer. */
.web-toolbox-intro { margin-top: 10px; color: var(--studio-muted); font-size: 14px; }
body.web-studio-workspace #content .web-toolbox-command { display: flex; align-items: center; gap: 8px; border: 1px solid var(--studio-border); padding: 10px 13px; border-radius: 10px; min-height: 44px; font-size: 12px; }
.web-toolbox-command kbd { color: var(--studio-muted); font-size: 10px; }
.web-toolbox-search,.web-settings-search-control { display: flex; align-items: center; gap: 10px; background: var(--studio-surface); border: 1px solid var(--studio-border); border-radius: 12px; padding: 4px 12px; }
.web-toolbox-search { max-width: 540px; margin-bottom: 28px; }
body.web-studio-workspace #content .web-toolbox-search input,body.web-studio-workspace #content .web-settings-search-control input { flex: 1; width: 100%; min-width: 0; border: 0 !important; background: transparent !important; box-shadow: none; padding: 10px 0; font-size: 16px; }
.web-toolbox-groups { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 26px 20px; }
.web-toolbox-group h2 { font-size: 15px; font-weight: 700; margin: 0 3px 10px; }
.web-toolbox-items { border: 1px solid var(--studio-border); border-radius: 17px; overflow: hidden; background: var(--studio-surface); }
body.web-studio-workspace #content .web-toolbox-item { display: flex; gap: 13px; align-items: center; width: 100%; min-height: 79px; padding: 15px 16px; text-align: left; border-bottom: 1px solid var(--studio-border); }
.web-toolbox-item:last-child { border-bottom: 0 !important; }
.web-toolbox-item > span:nth-child(2) { flex: 1; min-width: 0; }
.web-toolbox-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--studio-surface-2); color: var(--studio-accent,#713de0); flex-shrink: 0; }
.web-toolbox-item strong { display: block; font-size: 14px; font-weight: 650; }
.web-toolbox-item small { display: block; font-size: 12px; line-height: 1.4; color: var(--studio-muted); margin-top: 3px; }
.web-toolbox-chevron { font-size: 24px; color: var(--studio-muted); }
.web-toolbox-account { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 26px; font-size: 12px; color: var(--studio-muted); }
.web-toolbox-empty { padding: 24px; text-align: center; color: var(--studio-muted); }
.web-settings-layout { display: grid; grid-template-columns: 310px minmax(0,1fr); gap: 24px; align-items: start; }
.web-settings-directory { position: sticky; top: 75px; }
.web-settings-search-control { margin-bottom: 12px; }
.web-settings-categories { display: flex; gap: 6px; flex-wrap: wrap; margin: 10px 0 18px; }
body.web-studio-workspace #content .web-settings-categories button { border: 1px solid var(--studio-border); border-radius: 8px; font-size: 11px; min-height: 34px; padding: 7px 9px; }
body.web-studio-workspace #content .web-settings-categories [aria-pressed="true"] { background: #eee6ff !important; color: #6331cf !important; }
body.dark.web-studio-workspace #content .web-settings-categories [aria-pressed="true"] { background: #38274d !important; color: #dec8ff !important; }
.web-settings-group { margin-bottom: 14px; }
.web-settings-group > h2 { font-size: 11px; font-weight: 700; color: var(--studio-muted); margin: 14px 6px 7px; }
body.web-studio-workspace #content .web-settings-group > button { display: flex; width: 100%; align-items: center; gap: 9px; border-radius: 9px; min-height: 44px; padding: 8px 10px; font-size: 13px; text-align: left; }
body.web-studio-workspace #content .web-settings-group > button[aria-current] { background: var(--studio-surface-2) !important; color: var(--studio-accent,#713de0); }
.web-settings-entry-icon { display: grid; place-items: center; width: 26px; flex-shrink: 0; }
.web-settings-entry-icon svg { width: 23px; height: 23px; }
.web-settings-result-count { font-size: 11px; color: var(--studio-muted); margin: 10px 4px; }
.web-settings-detail-heading { margin-bottom: 20px; }
.web-settings-detail-heading h2 { font-size: 24px; letter-spacing: -.6px; font-weight: 750; margin: 5px 0 8px; }
.web-settings-introduction,.web-settings-note { font-size: 13px; line-height: 1.55; color: var(--studio-muted); }
body.web-studio-workspace #content .web-settings-control { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: 100%; min-height: 70px; padding: 14px 0; border-bottom: 1px solid var(--studio-border); text-align: left; }
.web-settings-control:last-child { border-bottom: 0 !important; }
.web-settings-control-copy { display: block; flex: 1; min-width: 0; }
.web-settings-control-copy strong { display: block; font-size: 14px; font-weight: 650; }
.web-settings-control-copy span { display: block; font-size: 12px; color: var(--studio-muted); margin-top: 4px; line-height: 1.4; }
.web-settings-switch { width: 43px; height: 26px; border-radius: 20px; padding: 3px; background: #ccc5d5; flex-shrink: 0; }
.web-settings-switch > span { display: block; width: 20px; height: 20px; border-radius: 50%; background: white; box-shadow: 0 1px 3px #0002; }
.web-settings-switch.is-on { background: #713de0; }
.web-settings-switch.is-on > span { margin-left: 17px; }
.web-settings-choices { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
body.web-studio-workspace #content .web-settings-choices button { border: 1px solid var(--studio-border); border-radius: 10px; min-height: 44px; padding: 9px 15px; font-size: 13px; }
body.web-studio-workspace #content .web-settings-choices [aria-pressed="true"] { background: #713de0 !important; color: white !important; }
.web-settings-size-group { margin: 16px 0; }
.web-settings-back { min-height: 44px; font-size: 12px; font-weight: 650; color: var(--studio-accent,#713de0); margin-bottom: 10px; }
.web-settings-empty { padding: 20px 6px; font-size: 13px; color: var(--studio-muted); }
@media (hover: hover) and (pointer: fine) {
 body.web-studio-workspace #content :is(.web-toolbox-item,.web-settings-group > button):hover { background: var(--studio-surface-2) !important; }
}
@media (max-width: 1150px) { .web-settings-layout { grid-template-columns: 260px minmax(0,1fr); gap: 16px; } }
@media (max-width: 767px) {
 .web-toolbox-groups,.web-settings-layout { grid-template-columns: 1fr; }
 .web-settings-directory { position: static; }
 [data-web-settings-detail="true"] .web-settings-directory,[data-web-settings-detail="false"] .web-settings-detail { display: none; }
 .web-toolbox-account { gap: 16px; }
 .web-toolbox-command kbd { display: none; }
}

/* Personalized home: measured information, then the next useful action. */
.web-studio-home-module[data-web-home-span="full"] { grid-column: 1 / -1; }
.web-studio-home-toolbar { display: flex; gap: 8px; flex-wrap: wrap; }
body.web-studio-workspace #content .web-studio-home-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; padding: 10px 15px; border: 1px solid var(--studio-border); border-radius: 11px; font-size: 13px; font-weight: 650; background: var(--studio-surface) !important; }
body.web-studio-workspace #content .web-studio-home-button.is-primary { color: white !important; background: #713de0 !important; border-color: #713de0; }
.web-studio-home-income-grid { display: grid; grid-template-columns: minmax(0,1.8fr) minmax(0,1fr); gap: 16px; align-items: start; }
body.web-studio-workspace #content .web-studio-home-metric { display: flex; align-items: center; gap: 15px; text-align: left; padding: 18px 20px; }
.web-studio-home-metric .web-studio-home-clay { width: 56px; height: 56px; object-fit: contain; flex-shrink: 0; }
.web-studio-home-eyebrow { display: block; color: var(--studio-muted); font-size: 11px; font-weight: 600; margin-bottom: 4px; }
.web-studio-home-metric-value { display: block; font-size: clamp(22px,2.1vw,30px); font-weight: 750; letter-spacing: -.7px; margin-bottom: 2px; }
.web-studio-home-muted { color: var(--studio-muted); font-size: 12px; line-height: 1.5; }
.web-studio-home-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 10px; }
.web-studio-home-card-heading h2 { margin-bottom: 0; font-size: 17px; font-weight: 700; }
.web-studio-home-card-heading > strong { font-size: 24px; font-weight: 750; white-space: nowrap; }
.web-studio-home-week { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 8px; margin: 22px 0 14px; }
.web-studio-home-week li { display: flex; flex-direction: column; align-items: center; gap: 7px; font-size: 10px; color: var(--studio-muted); }
.web-studio-home-week-track { display: block; position: relative; width: 18px; height: 84px; background: var(--studio-surface-2); border-radius: 6px; overflow: hidden; }
.web-studio-home-week-bar { display: block; position: absolute; bottom: 0; width: 100%; height: var(--web-home-activity-level,0%); background: #b593ed; border-radius: 6px; }
.web-studio-home-week-bar.is-today { background: #713de0; }
.web-studio-home-progress { height: 5px; border-radius: 5px; background: var(--studio-surface-2); margin: 20px 0 15px; overflow: hidden; }
.web-studio-home-progress > span { display: block; height: 100%; background: #713de0; border-radius: inherit; }
body.web-studio-workspace #content .web-studio-home-text-action { display: inline-flex; align-items: center; gap: 4px; color: var(--studio-accent,#713de0) !important; font-weight: 650; font-size: 12px; min-height: 44px; }
body.web-studio-workspace #content .web-studio-home-agenda-row { width: 100%; text-align: left; padding: 13px 0; font-size: 13px; }
.web-studio-home-date { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 47px; height: 51px; border-radius: 11px; background: var(--studio-surface-2); flex-shrink: 0; }
.web-studio-home-date > span { font-size: 9px; color: var(--studio-muted); }
.web-studio-home-date strong { font-size: 20px; }
.web-studio-home-date.is-today { background: #eee6ff; color: #6331cf; }
body.dark .web-studio-home-date.is-today { background: #38274d; color: #dec8ff; }
.web-studio-home-day-status { font-size: 10px; color: var(--studio-muted); flex-shrink: 0; }
.web-studio-home-recent-list { margin-top: 16px; }
.web-studio-home-empty { text-align: center; padding: 20px 5px; color: var(--studio-muted); font-size: 13px; }
.web-studio-home-empty img { margin-inline: auto; margin-bottom: 8px; }
.web-studio-home-tool-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
body.web-studio-workspace #content .web-studio-home-tool { display: flex; align-items: center; gap: 10px; padding: 13px 12px; min-height: 83px; border: 1px solid var(--studio-border); border-radius: 13px; text-align: left; }
.web-studio-home-tool img { width: 48px; height: 48px; object-fit: contain; }
.web-studio-home-tool > span:nth-child(2) { min-width: 0; flex: 1; }
.web-studio-home-tool strong { display: block; font-size: 13px; font-weight: 650; }
.web-studio-home-tool .web-studio-home-muted { display: block; font-size: 11px; margin-top: 3px; }

/* Projects and planning remain a single workspace. */
.web-project-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.web-project-title { font-size: 32px; letter-spacing: -.8px; font-weight: 750; }
.web-project-subtitle { color: var(--studio-muted); font-size: 13px; margin-top: 6px; }
.web-project-view-switch { display: flex; gap: 6px; border: 1px solid var(--studio-border); padding: 4px; border-radius: 12px; background: var(--studio-surface); }
body.web-studio-workspace #content .web-project-view-switch button { min-height: 38px; padding: 8px 13px; border-radius: 8px; font-size: 12px; }
.web-project-toolbar,.web-project-searchbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 15px; }
.web-project-searchbar > label { flex: 1; min-width: min(240px,100%); }
.web-project-input { width: 100%; min-width: 0; min-height: 44px; border-radius: 11px; background: var(--studio-surface); border: 1px solid var(--studio-border); padding: 10px 13px; font-size: 14px; }
body.web-studio-workspace #content :is(.web-project-export,.web-project-filter-toggle) { min-height: 43px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid var(--studio-border); border-radius: 10px; padding: 9px 13px; font-size: 12px; background: var(--studio-surface) !important; }
.web-project-filters { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 10px; background: var(--studio-surface-2); border-radius: 13px; padding: 14px; margin-bottom: 18px; }
.web-project-filters label { flex: 1; min-width: 140px; }
.web-project-results { color: var(--studio-muted); font-size: 12px; margin: 13px 0; }
.web-project-row { min-height: 62px; border-bottom: 1px solid var(--studio-border); }
.web-project-row:last-child { border-bottom: 0; }
.web-project-row-open { min-height: 44px; }
.web-project-metric-label { color: var(--studio-muted); font-size: 10px; font-weight: 550; }
.web-project-metric-value { font-weight: 700; font-size: 16px; }
.web-project-detail .web-project-layout { display: grid; grid-template-columns: minmax(0,1fr) 290px; gap: 20px; align-items: start; }
.web-project-summary { border-radius: 18px; background: var(--studio-surface); border: 1px solid var(--studio-border); padding: 20px; }
.web-project-section-nav { display: flex; gap: 8px; flex-wrap: wrap; margin: 18px 0; }
.web-project-personal-hours,.web-project-team-total { color: var(--studio-muted); font-size: 12px; line-height: 1.6; }
.web-project-team-total { border-top: 1px solid var(--studio-border); padding-top: 10px; margin-top: 10px; }
.web-project-calendar { min-width: 0; }
.web-project-calendar-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 18px; }
.web-project-calendar-metrics { display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 16px; }
.web-project-calendar-month-grid { width: 100%; }
.web-project-calendar-year-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.web-project-calendar-year-month { border: 1px solid var(--studio-border); border-radius: 15px; padding: 14px; background: var(--studio-surface); min-width: 0; }

/* Career, housing, annual review and the professional journal. */
.web-studio-tool-header { margin: 0 0 26px; }
.web-studio-tool-header h1 { font-size: 32px; font-weight: 750; letter-spacing: -.8px; margin-top: 6px; }
.web-studio-eyebrow { font-size: 11px; font-weight: 650; color: var(--studio-muted); }
.web-studio-tool-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; align-items: start; }
.web-studio-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; margin: 16px 0; }
body.web-studio-workspace #content .web-studio-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; padding: 10px 15px; border: 1px solid var(--studio-border); border-radius: 10px; font-size: 13px; font-weight: 650; background: var(--studio-surface) !important; }
body.web-studio-workspace #content .web-studio-button--primary { background: #713de0 !important; color: #fff !important; border-color: #713de0; }
.web-studio-button:disabled { opacity: .45; cursor: wait; }
.web-studio-switch { display: flex; align-items: center; gap: 9px; margin: 12px 0; font-size: 13px; }
.web-studio-switch input { width: 19px; height: 19px; accent-color: #713de0; }
.web-studio-help { color: var(--studio-muted); font-size: 12px; line-height: 1.55; margin: 10px 0; }
.web-studio-error { color: #ad2840; background: #fff0f2; border: 1px solid #ecc4cb; padding: 12px 16px; border-radius: 11px; font-size: 13px; margin: 16px 0; }
body.dark .web-studio-error { color: #ffb2be; background: #391e27; border-color: #6a3846; }
.web-studio-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.web-studio-metric { display: block; font-size: 29px; font-weight: 750; letter-spacing: -.6px; margin: 12px 0 8px; }
.web-studio-icon-button { min-width: 42px; min-height: 42px; border: 1px solid var(--studio-border); border-radius: 10px; font-size: 18px; }
.web-studio-tool :is(ul,ol) { margin-block: 12px; }
@media (max-width: 1200px) {
 .web-project-calendar-year-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .web-studio-home-income-grid { grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); }
 .web-studio-home-tool-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .web-project-detail .web-project-layout { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
 .web-studio-tool-grid { grid-template-columns: 1fr; }
 .web-studio-home-income-grid { grid-template-columns: 1fr; }
 .web-project-calendar-year-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
 .web-project-title,.web-studio-tool-header h1 { font-size: 27px; }
 .web-studio-fields { grid-template-columns: 1fr; }
 .web-studio-home-tool-grid { grid-template-columns: 1fr; }
 body.web-studio-workspace #content .web-studio-home-metric { padding: 16px; }
 .web-studio-home-day-status { display: none; }
 .web-project-view-switch { width: 100%; }
 .web-project-view-switch button { flex: 1; }
}

/* Native companion tools and the reviewed ITSI import. */
.web-studio-section-heading { margin-bottom: 24px; }
body.csc-privacy input:is([data-web-career-field="pensionSalary"],[data-web-career-field="amount"],[data-input="web-extra-housing-income"],[data-input="web-extra-housing-rent"]) { filter: blur(6px); user-select: none; -webkit-user-select: none; }
.web-studio-section-heading h1 { font-size: clamp(27px,3vw,34px); font-weight: 750; letter-spacing: -.7px; margin: 6px 0 9px; }
.web-studio-section-heading p:not(.web-studio-eyebrow) { color: var(--studio-muted); font-size: 14px; line-height: 1.6; max-width: 760px; }
.web-studio-extras { display: grid; gap: 20px; min-width: 0; }
.web-studio-extra-grid,.web-studio-form-grid,.web-studio-review-grid,.web-studio-journal-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; align-items: start; }
.web-studio-form-grid { margin: 18px 0; }
.web-studio-review-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.web-studio-card-wide { grid-column: 1/-1; }
.web-studio-item-list { display: grid; gap: 4px; }
body.web-studio-workspace #content .web-studio-item { width: 100%; text-align: left; min-height: 48px; padding: 12px; border-radius: 10px; overflow-wrap: anywhere; }
body.web-studio-workspace #content .web-studio-item[aria-pressed=true] { background: var(--studio-surface-2) !important; color: var(--studio-primary); }
.web-studio-item strong,.web-studio-item small { display: block; }
.web-studio-item small { font-size: 12px; color: var(--studio-muted); margin-top: 4px; }
.web-studio-item-status { display: block; font-size: 12px; color: var(--studio-warning); margin-top: 4px; }
/* Le texte s’enroule, le bouton « Modifier » garde sa ligne. */
.web-studio-item > div { flex: 1 1 auto; min-width: 0; }
.web-studio-item > .web-studio-button { flex: none; }
.web-studio-metric-cap { font-size: 14px; font-weight: 600; letter-spacing: 0; color: var(--studio-muted); white-space: nowrap; }
.web-studio-link { color: var(--studio-primary); text-underline-offset: 3px; font-size: 13px; }
.web-studio-link:hover { text-decoration: underline; }
.web-studio-notice,.web-itsi-warning { padding: 14px 16px; border-radius: 12px; color: var(--studio-warning); background: color-mix(in srgb,var(--studio-warning) 9%,var(--studio-surface)); font-size: 13px; line-height: 1.55; margin: 14px 0; }
.web-studio-empty { padding-block: 28px; color: var(--studio-muted); }
.web-studio-review-card progress { display: block; width: 100%; accent-color: var(--studio-primary); height: 7px; margin-top: 18px; }
.web-studio-journal-grid h2 { line-height: 1.4; }
.web-studio-journal-grid p { color: var(--studio-muted); font-size: 14px; margin-block: 12px; }
.web-itsi-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.web-itsi-heading h3 { font-size: 22px; font-weight: 700; margin: 4px 0; }
.web-itsi-heading h4 { font-size: 16px; font-weight: 650; }
.web-itsi-heading > span { font-size: 12px; color: var(--studio-muted); }
.web-itsi-eyebrow { font-size: 11px; font-weight: 650; color: var(--studio-primary); }
.web-itsi-metrics { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,130px),1fr)); gap: 12px; margin: 18px 0; }
.web-itsi-metrics > div { padding: 14px; border-radius: 12px; background: var(--studio-surface-2); }
.web-itsi-metrics strong,.web-itsi-metrics span { display: block; }
.web-itsi-metrics strong { font-size: 24px; font-weight: 700; }
.web-itsi-metrics span { font-size: 11px; color: var(--studio-muted); margin-top: 6px; }
.web-itsi-file-list { display: grid; gap: 6px; margin-top: 18px; }
body.web-studio-workspace #content .web-itsi-file-item { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 60px; padding: 12px; border: 1px solid var(--studio-line); border-radius: 12px; width: 100%; text-align: left; font-size: 13px; }
body.web-studio-workspace #content .web-itsi-file-item[aria-current=true] { background: var(--studio-surface-2) !important; border-color: var(--studio-primary); }
.web-itsi-file-item span,.web-itsi-file-item strong,.web-itsi-file-item small { display: block; overflow-wrap: anywhere; }
.web-itsi-file-item small { font-size: 11px; color: var(--studio-muted); margin-top: 5px; }
.web-itsi-ownership { margin: 20px 0; padding: 18px; border: 1px solid var(--studio-line); border-radius: 14px; }
.web-itsi-ownership p { font-size: 13px; line-height: 1.5; }
.web-itsi-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
body.web-studio-workspace #content .web-itsi-choices button { min-height: 52px; padding: 12px; border: 1px solid var(--studio-line); border-radius: 12px; font-weight: 600; font-size: 13px; }
body.web-studio-workspace #content .web-itsi-choices button[aria-pressed=true] { background: var(--studio-primary) !important; color: var(--studio-on-primary) !important; border-color: var(--studio-primary); }
.web-itsi-choices button:disabled { opacity: .45; cursor: not-allowed; }
@media(max-width:1100px) { .web-studio-review-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:767px) { .web-studio-extra-grid,.web-studio-form-grid,.web-studio-review-grid,.web-studio-journal-grid,.web-itsi-choices { grid-template-columns: 1fr; } .web-itsi-heading,.web-itsi-file-item { flex-wrap: wrap; } }

/* The set timer was designed for a full-width home. In a narrow Studio card its
   viewport-based sm: columns squeezed the CTA and the live-gross fields: follow
   the card width instead (browsers without container queries keep sm:). */
body.web-studio-workspace #content .web-studio-home-module[data-home-dashboard-module="plateau-chrono"] { container: web-home-chrono / inline-size; }
@container web-home-chrono (max-width: 600px) {
  [data-testid="ts-dashboard-chrono"] .sm\:grid-cols-2 { grid-template-columns: minmax(0,1fr); }
  [data-testid="ts-dashboard-chrono"] .sm\:col-span-2 { grid-column: 1 / -1; }
}

/* Feuilles « Actions rapides » et « Quel suivi veux-tu créer ? » du bouton « + »
   (NativeQuickActionSheet / NativeProjectKindPicker) : feuille basse sur
   téléphone, fenêtre centrée sur grand écran. */
.web-quick-sheet-layer { position: fixed; inset: 0; z-index: 120; display: flex; align-items: flex-end; justify-content: center; }
.web-quick-sheet-backdrop { position: absolute; inset: 0; width: 100%; border: 0; background: rgb(23 21 29 / 42%); cursor: default; }
body.dark .web-quick-sheet-backdrop { background: rgb(0 0 0 / 58%); }
.web-quick-sheet { position: relative; z-index: 1; display: grid; gap: 12px; width: min(100%, 460px); max-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px)); overflow-y: auto; overscroll-behavior: contain; padding: 10px 18px calc(14px + env(safe-area-inset-bottom, 0px)); border-radius: 28px 28px 0 0; background: var(--studio-surface, #fff); color: var(--studio-ink, #17151d); box-shadow: 0 -10px 40px rgb(23 21 29 / 18%); }
.web-quick-sheet-grabber { justify-self: center; width: 42px; height: 5px; border-radius: 999px; background: color-mix(in srgb, var(--studio-ink, #17151d) 30%, transparent); }
.web-quick-primary-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
#content .web-quick-primary { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-width: 0; min-height: 56px; padding: 8px 6px; border: 0; border-radius: var(--studio-card-radius, 16px); font-size: clamp(13px, 3.5vw, 15px); font-weight: 650; line-height: 1.15; text-align: center; }
.web-quick-primary span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#content .web-quick-primary.is-primary { background: var(--studio-surface-2, #efe7ff) !important; color: var(--studio-primary, #6d3df2) !important; }
#content .web-quick-primary.is-secondary { background: var(--studio-secondary, #b85a1a) !important; color: var(--studio-on-secondary, #fff) !important; }
.web-quick-primary svg { flex: none; }
.web-quick-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 8px; row-gap: 12px; }
#content .web-quick-tile { --web-quick-tone: var(--studio-primary, #6d3df2); display: flex; flex-direction: column; align-items: center; gap: 7px; min-height: 96px; padding: 2px; border: 0; border-radius: 16px; background: transparent !important; color: var(--studio-ink, #17151d) !important; }
#content .web-quick-tile.is-secondary { --web-quick-tone: var(--studio-secondary, #b85a1a); }
.web-quick-tile-icon { display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 50%; color: var(--web-quick-tone); background: color-mix(in srgb, var(--web-quick-tone) 7.5%, transparent); box-shadow: inset 0 0 0 0.75px color-mix(in srgb, var(--web-quick-tone) 18%, transparent), 0 0 6px color-mix(in srgb, var(--web-quick-tone) 10%, transparent); }
.web-quick-tile-label { min-height: 32px; font-size: 12px; font-weight: 550; line-height: 1.3; text-align: center; overflow-wrap: anywhere; }
.web-quick-divider { width: 100%; height: 1px; margin: 0; border: 0; background: color-mix(in srgb, var(--studio-ink, #17151d) 8%, transparent); }
#content .web-quick-close { min-height: 48px; width: 100%; border: 0; border-radius: 14px; background: var(--studio-surface-2, #efe7ff) !important; color: var(--studio-ink, #17151d) !important; font-size: 16px; font-weight: 550; }
.web-project-kind-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
#content .web-project-kind-heading h2 { margin: 6px 0 0; font-size: 22px; font-weight: 750; line-height: 1.2; letter-spacing: -0.01em; }
#content .web-quick-round-close { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 42px; height: 42px; border: 0; border-radius: 50%; background: var(--studio-surface-2, #efe7ff) !important; color: var(--studio-ink, #17151d) !important; }
#content .web-project-kind-choice { --web-quick-tone: var(--studio-primary, #6d3df2); display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: start; gap: 13px; width: 100%; padding: 14px; border: 0.75px solid color-mix(in srgb, var(--studio-ink, #17151d) 8%, transparent); border-radius: 18px; background: var(--studio-surface, #fff) !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
#content .web-project-kind-choice.is-goal { --web-quick-tone: var(--studio-warning, #b8500a); }
.web-project-kind-icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; color: var(--web-quick-tone); background: color-mix(in srgb, var(--web-quick-tone) 12%, transparent); box-shadow: 0 0 10px color-mix(in srgb, var(--web-quick-tone) 18%, transparent); }
.web-project-kind-copy { display: grid; gap: 4px; min-width: 0; padding-top: 2px; }
.web-project-kind-copy strong { font-size: 20px; font-weight: 750; line-height: 1.2; }
.web-project-kind-copy span { font-size: 15px; color: var(--studio-muted, #5f5867); line-height: 1.35; }
.web-project-kind-arrow { color: var(--studio-muted, #5f5867); padding-top: 2px; }
@media (hover: hover) and (pointer: fine) {
  #content .web-quick-tile:hover .web-quick-tile-icon { background: color-mix(in srgb, var(--web-quick-tone) 14%, transparent); }
  #content .web-project-kind-choice:hover { border-color: color-mix(in srgb, var(--web-quick-tone) 40%, transparent); }
  #content .web-quick-close:hover, #content .web-quick-round-close:hover { filter: brightness(0.97); }
}
@media (min-width: 768px) {
  .web-quick-sheet-layer { align-items: center; padding: 24px; }
  .web-quick-sheet { border-radius: 28px; padding-bottom: 18px; box-shadow: 0 24px 64px rgb(23 21 29 / 24%); }
  .web-quick-sheet-grabber { display: none; }
}
@media (prefers-reduced-motion: no-preference) {
  .web-quick-sheet-layer.is-closing .web-quick-sheet-backdrop { animation: web-quick-backdrop-out 180ms ease-in both; }
  .web-quick-sheet-layer.is-closing .web-quick-sheet { animation: web-quick-sheet-down 200ms cubic-bezier(0.4, 0, 1, 1) both; }
  @media (min-width: 768px) {
    [data-web-quick-sheet][data-csc-sheet-motion="up"] .csc-sheet-panel { animation-name: web-quick-pop-in; }
    .web-quick-sheet-layer.is-closing .web-quick-sheet { animation-name: web-quick-pop-out; }
  }
}
@keyframes web-quick-backdrop-out { to { opacity: 0; } }
@keyframes web-quick-sheet-down { to { transform: translateY(100%); } }
@keyframes web-quick-pop-in { from { opacity: 0; transform: translateY(12px) scale(0.97); } }
@keyframes web-quick-pop-out { to { opacity: 0; transform: translateY(8px) scale(0.98); } }

/* « Nouveau projet » / « Nouvelle feuille » : feuille de création native
   (NativeProjectCreationFlow). Plein écran arrondi sur téléphone, fenêtre
   centrée sur grand écran ; contrôles système invisibles posés sur les rangées. */
.web-create-layer { position: fixed; inset: 0; z-index: 120; display: flex; align-items: flex-end; justify-content: center; }
.web-create-backdrop { position: absolute; inset: 0; width: 100%; border: 0; background: rgb(23 21 29 / 42%); cursor: default; }
body.dark .web-create-backdrop { background: rgb(0 0 0 / 58%); }
.web-create-sheet { position: relative; z-index: 1; display: flex; flex-direction: column; width: 100%; height: calc(100dvh - 10px - env(safe-area-inset-top, 0px)); border-radius: 28px 28px 0 0; overflow: hidden; background: var(--studio-canvas, #faf7ff); color: var(--studio-ink, #17151d); box-shadow: 0 -10px 40px rgb(23 21 29 / 18%); }
.web-create-bar { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; gap: 8px; padding: 12px 16px 10px; border-bottom: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 6%, transparent); background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 35%, var(--studio-canvas, #faf7ff)); }
#content .web-create-bar h2 { margin: 0; overflow: hidden; font-size: 17px; font-weight: 650; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
#content .web-create-close { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--studio-surface, #fff) !important; color: var(--studio-ink, #17151d) !important; box-shadow: 0 2px 10px rgb(23 21 29 / 10%); }
.web-create-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 18px 20px 28px; }
.web-create-hero { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 14px; align-items: start; margin-bottom: 8px; }
.web-create-hero-icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 13px; color: var(--studio-primary, #6d3df2); background: var(--studio-surface-2, #efe7ff); }
#content .web-create-hero h3 { margin: 0; font-size: 24px; font-weight: 750; line-height: 1.15; letter-spacing: -0.01em; }
.web-create-hero p { margin: 5px 0 0; font-size: 16px; line-height: 1.4; color: var(--studio-muted, #5f5867); }
.web-create-section { margin-top: 22px; }
#content .web-create-section h4 { margin: 0 0 9px 2px; font-size: 17px; font-weight: 650; }
.web-create-card { display: grid; gap: 10px; padding: 12px; border-radius: 20px; background: var(--studio-surface, #fff); }
.web-create-card.is-dates { gap: 12px; }
.web-create-field { display: grid; gap: 2px; padding: 9px 14px 10px; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 14px; background: var(--studio-surface, #fff); cursor: text; }
.web-create-field:focus-within { border-color: var(--studio-primary, #6d3df2); box-shadow: 0 0 0 2px color-mix(in srgb, var(--studio-primary, #6d3df2) 14%, transparent); }
.web-create-field > span { font-size: 13px; color: var(--studio-muted, #5f5867); }
body.csc-intermittor-studio #content .web-create-field input,
body.csc-intermittor-studio #content .web-create-card textarea { width: 100%; min-height: 0; padding: 0; border: 0 !important; border-radius: 0; background: transparent !important; box-shadow: none !important; font-size: 17px; color: var(--studio-ink, #17151d) !important; }
body.csc-intermittor-studio #content .web-create-card textarea { min-height: 88px; padding: 6px 4px; resize: vertical; line-height: 1.45; }
.web-create-footnote { margin: 8px 4px 0; font-size: 13px; line-height: 1.45; color: var(--studio-muted, #5f5867); }
.web-create-date, .web-create-menu-row { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 64px; padding: 10px 14px; border-radius: 14px; cursor: pointer; }
.web-create-date { background: var(--studio-surface-2, #efe7ff); }
.web-create-date-icon, .web-create-row-icon { color: var(--studio-primary, #6d3df2); display: flex; }
.web-create-date-copy, .web-create-menu-copy { display: grid; gap: 1px; min-width: 0; }
.web-create-date-copy > span, .web-create-menu-copy small { font-size: 13px; color: var(--studio-muted, #5f5867); }
.web-create-date-copy strong { font-size: 18px; font-weight: 500; }
.web-create-menu-copy strong { font-size: 17px; font-weight: 600; line-height: 1.25; }
.web-create-chevron { display: flex; color: var(--studio-muted, #5f5867); transition: transform 160ms ease-out; }
.web-create-chevron.is-open { transform: rotate(90deg); }
body.csc-intermittor-studio #content .web-create-date input,
body.csc-intermittor-studio #content .web-create-menu-row select { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; margin: 0; padding: 0; border: 0 !important; opacity: 0; cursor: pointer; appearance: none; -webkit-appearance: none; }
.web-create-date:focus-within, .web-create-menu-row:focus-within { box-shadow: 0 0 0 2px var(--studio-primary, #6d3df2); }
.web-create-menu-row.is-payment { grid-template-columns: minmax(0, 1fr) auto; min-height: 52px; border-top: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 7%, transparent); border-radius: 0; }
.web-create-menu-row.is-payment strong { font-weight: 450; }
.web-create-menu-value { display: inline-flex; align-items: center; gap: 4px; font-size: 17px; font-weight: 550; color: var(--studio-warning, #b8500a); }
.web-create-menu-row[data-payment-status="pending"] .web-create-menu-value { color: var(--studio-muted, #5f5867); }
.web-create-menu-row[data-payment-status="late"] .web-create-menu-value { color: var(--studio-danger, #b33f50); }
.web-create-menu-row[data-payment-status="paid"] .web-create-menu-value { color: var(--studio-success, #247a55); }
#content .web-create-disclosure { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 8px 14px; border: 0; border-top: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 7%, transparent); background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
.web-create-disclosure strong { display: block; font-size: 16px; font-weight: 600; color: var(--studio-primary, #6d3df2); }
.web-create-disclosure small { display: block; font-size: 12px; color: var(--studio-muted, #5f5867); }
.web-create-options { display: grid; padding: 0 6px; }
.web-create-options p { margin: 8px 0 4px; font-size: 12px; line-height: 1.45; color: var(--studio-muted, #5f5867); }
.web-create-option { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 6%, transparent); }
.web-create-option strong { display: block; font-size: 14px; font-weight: 550; line-height: 1.35; }
.web-create-option small { display: block; margin-top: 2px; font-size: 11px; color: var(--studio-muted, #5f5867); }
.web-create-chips { display: flex; gap: 6px; margin-top: 8px; }
#content .web-create-chips button { min-height: 34px; padding: 4px 12px; border: 0; border-radius: 999px; background: var(--studio-surface-2, #efe7ff) !important; color: var(--studio-ink, #17151d) !important; font-size: 12px; font-weight: 600; }
#content .web-create-chips button[aria-pressed="true"] { background: var(--studio-primary, #6d3df2) !important; color: var(--studio-on-primary, #fff) !important; }
.web-create-segmented { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; padding: 3px; border-radius: 12px; background: color-mix(in srgb, var(--studio-ink, #17151d) 6%, transparent); }
#content .web-create-segmented button { min-height: 36px; padding: 4px 6px; border: 0; border-radius: 9px; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 14px; font-weight: 500; transition: background-color 160ms ease-out, box-shadow 160ms ease-out; }
#content .web-create-segmented button[aria-checked="true"] { background: var(--studio-surface, #fff) !important; font-weight: 650; box-shadow: 0 1px 4px rgb(23 21 29 / 14%); }
body.dark #content .web-create-segmented button[aria-checked="true"] { background: var(--studio-surface-3, #52486b) !important; }
.web-create-toggle-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; min-height: 52px; padding: 4px 14px; font-size: 17px; border-top: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 7%, transparent); }
#content .web-create-switch { position: relative; flex: none; width: 51px; height: 31px; min-height: 31px; padding: 0; border: 0; border-radius: 999px; background: color-mix(in srgb, var(--studio-ink, #17151d) 16%, transparent) !important; transition: background-color 180ms ease-out; }
#content .web-create-switch > span { position: absolute; top: 2px; left: 2px; width: 27px; height: 27px; border-radius: 50%; background: #fff; box-shadow: 0 2px 5px rgb(0 0 0 / 22%); transition: transform 200ms cubic-bezier(0.22, 1, 0.36, 1); }
#content .web-create-switch[aria-checked="true"] { background: var(--studio-primary, #6d3df2) !important; }
#content .web-create-switch[aria-checked="true"] > span { transform: translateX(20px); }
.web-create-hint { margin: 14px 4px 0; font-size: 13px; color: var(--studio-danger, #b33f50); }
.web-create-footer { flex: none; padding: 12px 20px calc(12px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 6%, transparent); background: var(--studio-canvas, #faf7ff); }
#content .web-create-cta { position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 56px; padding: 8px 54px; border: 0; border-radius: 16px; background: var(--studio-secondary, #b85a1a) !important; color: var(--studio-on-secondary, #fff) !important; font-size: 17px; font-weight: 650; box-shadow: 0 6px 0 color-mix(in srgb, var(--studio-secondary, #b85a1a) 55%, #000), 0 8px 18px color-mix(in srgb, var(--studio-secondary, #b85a1a) 30%, transparent); transform: translateY(-3px); transition: transform 110ms ease-out, box-shadow 110ms ease-out, opacity 160ms ease-out; }
#content .web-create-cta img { position: absolute; left: 14px; top: 50%; width: 34px; height: 34px; transform: translateY(-50%); }
#content .web-create-cta:active:not(:disabled) { transform: translateY(0); box-shadow: 0 2px 0 color-mix(in srgb, var(--studio-secondary, #b85a1a) 55%, #000); }
#content .web-create-cta:disabled { opacity: .5; cursor: not-allowed; }
@media (min-width: 768px) {
  .web-create-layer { align-items: center; padding: 24px; }
  .web-create-sheet { width: min(640px, 100%); height: auto; max-height: min(860px, calc(100dvh - 48px)); border-radius: 28px; box-shadow: 0 24px 64px rgb(23 21 29 / 24%); }
  .web-create-scroll { padding: 22px 28px 28px; }
  .web-create-footer { padding: 14px 28px 18px; }
}
@media (prefers-reduced-motion: no-preference) and (min-width: 768px) {
  [data-web-create-sheet][data-csc-sheet-motion="up"] .csc-sheet-panel { animation-name: web-quick-pop-in; }
}
body.csc-intermittor-studio #content .web-create-field input:focus-visible,
body.csc-intermittor-studio #content .web-create-card textarea:focus-visible { outline: none !important; }
body.csc-intermittor-studio #content .web-create-date input:focus-visible,
body.csc-intermittor-studio #content .web-create-menu-row select:focus-visible { outline: none !important; }

/* Assistant « Nouvelle feuille » (StudioWorkflowRail, StudioTimesheetSummary). */
.web-sheet-rail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 22px 0 14px; padding: 0 0 14px; list-style: none; border-bottom: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 8%, transparent); }
.web-sheet-rail li { position: relative; display: flex; justify-content: center; }
.web-sheet-rail li + li::before { content: ''; position: absolute; top: 15px; right: calc(50% + 22px); left: calc(-50% + 22px); height: 2px; border-radius: 2px; background: color-mix(in srgb, var(--studio-ink, #17151d) 12%, transparent); }
.web-sheet-rail li[data-step-state="done"] + li::before, .web-sheet-rail li[data-step-state="current"]::before { background: color-mix(in srgb, var(--studio-primary, #6d3df2) 45%, transparent); }
.web-sheet-rail-item, #content .web-sheet-rail-item { display: grid; justify-items: center; gap: 6px; min-width: 0; max-width: 100%; padding: 0; border: 0; background: transparent !important; color: inherit !important; }
.web-sheet-rail-dot { display: flex; align-items: center; justify-content: center; width: 31px; height: 31px; border-radius: 50%; font-size: 14px; font-weight: 650; color: var(--studio-muted, #5f5867); background: color-mix(in srgb, var(--studio-ink, #17151d) 7%, transparent); transition: background-color 200ms ease-out, color 200ms ease-out, transform 200ms ease-out; }
.web-sheet-rail-label { max-width: 100%; overflow: hidden; font-size: 12px; color: var(--studio-muted, #5f5867); text-overflow: ellipsis; white-space: nowrap; }
.web-sheet-rail li[data-step-state="current"] .web-sheet-rail-dot { color: var(--studio-primary, #6d3df2); background: var(--studio-surface-2, #efe7ff); box-shadow: 0 0 0 2px color-mix(in srgb, var(--studio-primary, #6d3df2) 35%, transparent); transform: scale(1.06); }
.web-sheet-rail li[data-step-state="current"] .web-sheet-rail-label { color: var(--studio-ink, #17151d); font-weight: 650; }
.web-sheet-rail li[data-step-state="done"] .web-sheet-rail-dot { color: var(--studio-on-primary, #fff); background: var(--studio-primary, #6d3df2); }
.web-sheet-summary { display: grid; gap: 14px; padding: 16px; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 18px; background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 70%, var(--studio-surface, #fff)); box-shadow: 0 2px 10px rgb(36 18 56 / 6%); }
.web-sheet-summary-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.web-sheet-summary-head strong { display: block; font-size: 19px; font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
.web-sheet-summary-head span:not(.web-sheet-draft-pill) { display: block; margin-top: 3px; font-size: 14px; color: var(--studio-muted, #5f5867); }
.web-sheet-draft-pill { flex: none; padding: 4px 10px; border-radius: 999px; font-size: 13px; font-weight: 650; color: var(--studio-secondary, #b85a1a); background: color-mix(in srgb, var(--studio-secondary, #b85a1a) 14%, transparent); }
.web-sheet-summary-metrics { display: grid; grid-template-columns: 1fr 1fr; }
.web-sheet-summary-metrics > div { display: grid; gap: 3px; padding: 0 14px; }
.web-sheet-summary-metrics > div:first-child { padding-left: 0; border-right: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 10%, transparent); }
.web-sheet-summary-metrics b { font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; }
.web-sheet-summary-metrics b.is-hours { color: var(--studio-primary, #6d3df2); }
.web-sheet-summary-metrics b.is-gross { color: var(--studio-success, #247a55); }
.web-sheet-summary-metrics span { font-size: 13px; color: var(--studio-muted, #5f5867); }
#content .web-sheet-back { margin: 14px 0 -6px; padding: 6px 2px; min-height: 40px; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 600; }
.web-sheet-team-title { margin: 2px 4px 0; font-size: 14px; font-weight: 550; color: var(--studio-muted, #5f5867); }
#content .web-sheet-free, #content .web-sheet-person { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 8px 12px; border: 1px solid transparent; border-radius: 14px; background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; font-size: 16px; }
#content .web-sheet-free { grid-template-columns: auto minmax(0, 1fr); font-weight: 550; }
#content .web-sheet-person { background: var(--studio-surface-2, #efe7ff) !important; background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 55%, transparent) !important; }
#content .web-sheet-person[aria-pressed="true"] { border-color: var(--studio-primary, #6d3df2); background: var(--studio-surface-2, #efe7ff) !important; }
.web-sheet-people { display: grid; gap: 8px; max-height: 272px; overflow-y: auto; overscroll-behavior: contain; }
.web-sheet-avatar { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; font-size: 14px; font-weight: 700; color: var(--studio-primary, #6d3df2); background: var(--studio-surface, #fff); }
.web-sheet-person-copy { display: grid; gap: 2px; min-width: 0; }
.web-sheet-person-copy strong { overflow: hidden; font-size: 16px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.web-sheet-person-copy em { font-style: normal; font-weight: 500; color: var(--studio-muted, #5f5867); }
.web-sheet-person-copy small { overflow: hidden; font-size: 13px; color: var(--studio-muted, #5f5867); text-overflow: ellipsis; white-space: nowrap; }
.web-sheet-check { width: 22px; height: 22px; border: 2px solid color-mix(in srgb, var(--studio-ink, #17151d) 25%, transparent); border-radius: 50%; }
[aria-pressed="true"] > .web-sheet-check { border-color: var(--studio-primary, #6d3df2); background: var(--studio-primary, #6d3df2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 15px no-repeat; }
.web-create-segmented.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#content .web-sheet-text-action { display: inline-flex; align-items: center; gap: 10px; justify-self: start; min-height: 44px; padding: 4px 6px; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 600; }
.web-sheet-days-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 2px 9px; }
#content .web-sheet-days-title h4 { margin: 0; }
.web-sheet-count { min-width: 28px; padding: 3px 9px; border-radius: 999px; font-size: 13px; font-weight: 700; text-align: center; color: var(--studio-primary, #6d3df2); background: color-mix(in srgb, var(--studio-primary, #6d3df2) 11%, transparent); font-variant-numeric: tabular-nums; }
.web-sheet-template, .web-sheet-day-times { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 74px; gap: 8px; }
.web-sheet-template label, .web-sheet-day-times label { display: grid; gap: 4px; min-width: 0; }
.web-sheet-template label > span, .web-sheet-day-times label > span { font-size: 12px; color: var(--studio-muted, #5f5867); }
body.csc-intermittor-studio #content .web-sheet-template input, body.csc-intermittor-studio #content .web-sheet-day-times input { width: 100%; min-height: 42px; padding: 8px 4px; font-size: 15px; text-align: center; font-variant-numeric: tabular-nums; }
/* L'heure tient en entier : sans l'icône d'horloge, le champ affiche 08:00. */
.web-sheet-template input[type="time"]::-webkit-calendar-picker-indicator, .web-sheet-day-times input[type="time"]::-webkit-calendar-picker-indicator { display: none; }
.web-sheet-template input[type="time"]::-webkit-datetime-edit, .web-sheet-day-times input[type="time"]::-webkit-datetime-edit { padding: 0; }
.web-create-notice { margin: 12px 4px 0; padding: 12px 14px; border-radius: 14px; font-size: 14px; line-height: 1.45; color: var(--studio-warning, #b8500a); background: color-mix(in srgb, var(--studio-warning, #b8500a) 10%, var(--studio-surface, #fff)); }
#content .web-create-notice button { display: inline; padding: 0; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-weight: 650; text-decoration: underline; text-underline-offset: 3px; }
.web-sheet-calendar { display: grid; gap: 8px; padding: 10px; border-radius: 16px; background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 45%, transparent); }
.web-sheet-calendar-head { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; text-align: center; }
.web-sheet-calendar-head strong { font-size: 16px; font-weight: 650; text-transform: capitalize; }
#content .web-sheet-calendar-head button { width: 44px; height: 44px; border: 0; border-radius: 50%; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 24px; line-height: 1; }
#content .web-sheet-calendar-head button:disabled { opacity: .3; }
.web-sheet-calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.web-sheet-calendar-grid .is-weekday { padding: 2px 0; font-size: 12px; font-weight: 600; text-align: center; color: var(--studio-muted, #5f5867); }
#content .web-sheet-calendar-grid button { aspect-ratio: 1; width: 100%; max-width: 46px; min-height: 36px; justify-self: center; padding: 0; border: 0; border-radius: 50%; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 15px; font-variant-numeric: tabular-nums; transition: background-color 140ms ease-out, color 140ms ease-out, transform 140ms ease-out; }
#content .web-sheet-calendar-grid button[aria-pressed="true"] { background: var(--studio-primary, #6d3df2) !important; color: var(--studio-on-primary, #fff) !important; font-weight: 700; }
#content .web-sheet-calendar-grid button:disabled { opacity: .28; cursor: default; }
.web-sheet-day-actions { display: flex; flex-wrap: wrap; gap: 6px 14px; }
#content .web-sheet-day-actions button { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 4px 6px; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 600; }
#content .web-sheet-day-actions button.is-danger { color: var(--studio-danger, #b33f50) !important; }
.web-sheet-days { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.web-sheet-day { display: grid; gap: 10px; padding: 12px; border: 1px solid color-mix(in srgb, var(--studio-primary, #6d3df2) 18%, transparent); border-radius: 16px; background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 35%, var(--studio-surface, #fff)); }
.web-sheet-day-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto 36px; align-items: center; gap: 10px; }
.web-sheet-day-index { padding: 3px 8px; border-radius: 8px; font-size: 12px; font-weight: 700; color: var(--studio-primary, #6d3df2); background: var(--studio-surface-2, #efe7ff); }
.web-sheet-day-head strong { overflow: hidden; font-size: 15px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; text-transform: capitalize; }
.web-sheet-day-gross { font-size: 13px; color: var(--studio-muted, #5f5867); font-variant-numeric: tabular-nums; white-space: nowrap; }
#content .web-sheet-day-remove { width: 36px; height: 36px; min-height: 36px; padding: 0; border: 0; border-radius: 50%; background: transparent !important; color: var(--studio-muted, #5f5867) !important; font-size: 22px; line-height: 1; }
.web-sheet-empty { display: grid; justify-items: center; gap: 6px; padding: 18px 8px 10px; text-align: center; }
.web-sheet-empty strong { font-size: 15px; }
.web-sheet-empty span { max-width: 300px; font-size: 13px; color: var(--studio-muted, #5f5867); }
.web-sheet-recap { gap: 0; padding: 4px 16px; }
.web-sheet-recap > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; min-height: 50px; padding: 12px 0; border-bottom: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 7%, transparent); font-size: 16px; }
.web-sheet-recap > div:last-child { border-bottom: 0; }
.web-sheet-recap strong { font-weight: 650; font-variant-numeric: tabular-nums; }
#content .web-create-cta.is-plain { padding-inline: 16px; }
@media (max-width: 380px) {
  .web-sheet-day-head { grid-template-columns: auto minmax(0, 1fr) 36px; }
  .web-sheet-day-gross { grid-column: 2 / 3; grid-row: 2; }
}
.web-create-ready { display: grid; justify-items: center; gap: 6px; padding: 26px 8px 22px; text-align: center; }
.web-create-ready-icon { display: flex; align-items: center; justify-content: center; width: 76px; height: 76px; margin-bottom: 8px; border-radius: 22px; color: var(--studio-success, #247a55); background: color-mix(in srgb, var(--studio-success, #247a55) 13%, var(--studio-surface, #fff)); }
.web-create-ready-eyebrow { margin: 0; font-size: 12px; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; color: var(--studio-success, #247a55); }
#content .web-create-ready h3 { margin: 0; font-size: 28px; font-weight: 800; line-height: 1.15; overflow-wrap: anywhere; }
.web-create-ready p:not(.web-create-ready-eyebrow) { max-width: 360px; margin: 4px 0 0; font-size: 15px; line-height: 1.5; color: var(--studio-muted, #5f5867); }
.web-create-ready-actions { display: grid; gap: 10px; }
#content .web-create-row-button { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 8px 14px; border: 0; border-radius: 16px; background: var(--studio-surface, #fff) !important; color: var(--studio-ink, #17151d) !important; font-size: 16px; font-weight: 600; text-align: left; }
#content .web-create-row-button.is-quiet { grid-template-columns: minmax(0, 1fr); background: transparent !important; color: var(--studio-muted, #5f5867) !important; text-align: center; font-weight: 550; }
@media (prefers-reduced-motion: no-preference) {
  .web-create-ready-icon { animation: csc-milestone-in var(--csc-motion-slower, 600ms) var(--csc-motion-ease-out, ease-out) both; }
}

/* En-tête natif sur téléphone (web Intermittor) : une seule barre translucide,
   retour rond à gauche, titre centré, lune et avatar à droite. */
.csc-web-titlebar { display: none; }
@media (max-width: 767px) {
  body.csc-web-native-header > .sticky.top-0 { border-bottom: 0.5px solid color-mix(in srgb, var(--studio-ink, #17151d) 9%, transparent) !important; background: color-mix(in srgb, var(--studio-canvas, #faf7ff) 82%, transparent) !important; -webkit-backdrop-filter: saturate(1.6) blur(18px); backdrop-filter: saturate(1.6) blur(18px); }
  body.csc-web-native-header > .sticky.top-0 > div { position: relative; min-height: 44px !important; padding: 8px 14px !important; }
  body.csc-web-native-header .csc-web-titlebar { display: flex; flex: 1 1 auto; align-items: center; min-width: 0; min-height: 44px; }
  body.csc-web-native-header :is(#brand-home, #app-brand-banner, #csc-sync-badge, #privacy-btn),
  body.csc-web-native-header > .sticky.top-0 div:has(> #lang-fr) { display: none !important; }
  body.csc-web-native-header .csc-web-back { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--studio-surface, #fff); color: var(--studio-ink, #17151d); box-shadow: 0 2px 10px rgb(23 21 29 / 10%); }
  body.csc-web-native-header .csc-web-back[hidden] { display: none; }
  body.csc-web-native-header .csc-web-title { position: absolute; top: 50%; left: 50%; max-width: calc(100% - 228px); margin: 0; overflow: hidden; transform: translate(-50%, -50%); font-family: ui-rounded, -apple-system, BlinkMacSystemFont, system-ui, sans-serif; font-size: 17px; font-weight: 650; color: var(--studio-ink, #17151d); text-overflow: ellipsis; white-space: nowrap; pointer-events: none; }
  body.csc-web-native-header #theme-toggle { width: 44px; height: 44px; min-width: 44px; padding: 0; border-radius: 50% !important; background: var(--studio-surface, #fff) !important; color: var(--studio-ink, #17151d); box-shadow: 0 2px 10px rgb(23 21 29 / 10%); }
  body.csc-web-native-header #csc-account-btn { width: 44px; height: 44px; }
  body.csc-web-native-header > .sticky.top-0 > div > div:last-child { gap: 10px !important; }
  body.csc-web-native-header #content .web-desktop-toolbar { display: none; }
}

/* Accueil mobile natif (NativeQuantifiedHomeDashboard + NativeHomeModuleGrid). */
.web-native-home { display: grid; gap: 13px; padding-bottom: calc(var(--csc-tabbar-clearance, 96px) + 12px); color: var(--studio-ink, #17151d); }
.web-native-home-hero { display: grid; justify-items: center; gap: 2px; padding: 6px 0 2px; text-align: center; }
#content .web-native-home-hero h1 { margin: 0; font-size: 22px; font-weight: 750; letter-spacing: -0.01em; }
.web-native-home-hero p { margin: 0; font-size: 13px; color: var(--studio-muted, #5f5867); }
.web-home-month { overflow: hidden; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 16px; background: var(--studio-surface, #fff); }
#content .web-home-month-summary { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 10px 14px; border: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
.web-home-month-label { font-size: 15px; font-weight: 650; }
.web-home-month-figure { display: grid; min-width: 0; }
.web-home-month-figure small { font-size: 12px; color: var(--studio-muted, #5f5867); }
.web-home-month-figure b { overflow: hidden; font-size: 15px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.web-home-month-figure b.is-missing { font-size: 13px; font-weight: 600; }
.web-home-month-chevron { color: var(--studio-muted, #5f5867); transition: transform 200ms ease-out; }
.web-home-month.is-open .web-home-month-chevron { transform: rotate(180deg); }
.web-home-month-detail { padding: 4px 12px 12px; border-top: 1px solid var(--studio-surface-3, #e3d7ee); }
.web-home-toast { display: grid; grid-template-columns: 38px minmax(0, 1fr) 32px; align-items: start; gap: 12px; padding: 12px 12px 12px 16px; border-radius: 16px; background: var(--studio-surface-2, #efe7ff); }
.web-home-toast-icon { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; font-size: 17px; color: var(--studio-primary, #6d3df2); background: color-mix(in srgb, currentColor 16%, transparent); }
.web-home-toast-icon.is-success { color: var(--studio-success, #247a55); }
.web-home-toast-icon.is-goal { color: var(--studio-warning, #b8500a); }
.web-home-toast-icon.is-secondary { color: var(--studio-secondary, #b85a1a); }
.web-home-toast-copy { display: grid; gap: 3px; min-width: 0; }
.web-home-toast-copy strong { font-size: 15px; font-weight: 700; }
.web-home-toast-copy span { font-size: 13px; line-height: 1.4; color: var(--studio-muted, #5f5867); }
#content .web-home-toast-close { width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 20px; line-height: 1; }
#content .web-home-level { display: grid; gap: 8px; width: 100%; padding: 12px; border: 0; border-radius: 16px; background: var(--studio-surface, #fff) !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
.web-home-level-head { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.web-home-level-head strong { font-size: 15px; font-weight: 700; }
.web-home-level-xp { font-size: 12px; color: var(--studio-primary, #6d3df2); }
.web-home-level-art { display: block; object-fit: contain; }
.web-home-level-bars { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.web-home-level-bars span { height: 6px; border-radius: 999px; background: var(--studio-surface-3, #e3d7ee); }
.web-home-level-bars span.is-on { background: var(--studio-primary, #6d3df2); }
.web-home-level-next { overflow: hidden; font-size: 12px; color: var(--studio-muted, #5f5867); text-overflow: ellipsis; white-space: nowrap; }
.web-home-achievements { display: grid; gap: 10px; padding: 12px; border-radius: 16px; background: var(--studio-surface, #fff); }
.web-home-ladder { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; margin: 0; padding: 0 0 10px; list-style: none; border-bottom: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 8%, transparent); }
.web-home-ladder li { display: grid; justify-items: center; gap: 2px; font-size: 11px; font-weight: 700; color: var(--studio-muted, #5f5867); opacity: .45; }
.web-home-ladder li.is-reached { opacity: 1; }
.web-home-ladder li.is-current span { color: var(--studio-primary, #6d3df2); }
.web-home-achievements-head { display: flex; justify-content: space-between; font-size: 14px; }
.web-home-achievements-head span { font-size: 12px; font-weight: 700; color: var(--studio-muted, #5f5867); }
.web-home-achievements ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.web-home-achievements li { --web-ach: var(--studio-primary, #6d3df2); display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 10px; opacity: .58; }
.web-home-achievements li.is-unlocked { opacity: 1; }
.web-home-achievements li.is-success { --web-ach: var(--studio-success, #247a55); }
.web-home-achievements li.is-goal { --web-ach: var(--studio-warning, #b8500a); }
.web-home-achievements li.is-secondary { --web-ach: var(--studio-secondary, #b85a1a); }
.web-home-achievement-dot { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; font-size: 14px; font-weight: 800; color: var(--web-ach); background: color-mix(in srgb, var(--web-ach) 10%, transparent); }
.web-home-achievement-copy { display: grid; gap: 4px; min-width: 0; }
.web-home-achievement-copy > span:first-child { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; }
.web-home-achievement-copy b { color: var(--web-ach); font-size: 11px; white-space: nowrap; }
.web-home-achievement-bar { display: block; height: 4px; overflow: hidden; border-radius: 999px; background: color-mix(in srgb, var(--studio-ink, #17151d) 9%, transparent); }
.web-home-achievement-bar span { display: block; height: 100%; border-radius: inherit; background: var(--web-ach); }
#content .web-home-advice { display: grid; grid-template-columns: minmax(0, 1fr) 124px; gap: 8px; width: 100%; padding: 0; border: 0; background: transparent !important; text-align: left; }
.web-home-advice-text { display: flex; align-items: center; min-height: 48px; padding: 10px 16px; border-radius: 16px; font-size: 12px; font-weight: 700; line-height: 1.3; color: #fff; background: var(--studio-success, #247a55); }
.web-home-advice-cta { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px; border-radius: 16px; font-size: 11px; font-weight: 600; color: #fff; background: var(--studio-warning, #b8500a); }
body.dark .web-home-advice-text, body.dark .web-home-advice-cta { color: var(--studio-canvas, #17151d); }
.web-home-tools { display: grid; gap: 10px; margin-top: 6px; }
.web-home-tools-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#content .web-home-tools-head h2 { margin: 0; font-size: 22px; font-weight: 750; letter-spacing: -0.01em; }
body.csc-intermittor-studio #content .web-home-tools-edit[data-action] { display: inline-flex; align-items: center; justify-content: center; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; border: 0 !important; border-radius: 50%; background: transparent !important; box-shadow: none !important; color: var(--studio-ink, #17151d) !important; }
.web-home-tools-edit svg { box-sizing: content-box; padding: 10px; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 50%; background: var(--studio-surface-2, #efe7ff); }
.web-home-tile-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 299px) { .web-home-tile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
#content .web-home-tile { --web-tile-bg: #faf7ff; position: relative; display: block; aspect-ratio: 1; width: 100%; overflow: hidden; padding: 0; border: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 65%, transparent); border-radius: 18px; background: var(--web-tile-bg) !important; color: #241c4a !important; text-align: left; }
#content .web-home-tile.is-lavande { --web-tile-bg: #efe7ff; }
#content .web-home-tile.is-peche { --web-tile-bg: #ffeadb; }
body.dark #content .web-home-tile { --web-tile-bg: #211f25; color: #fbfaff !important; }
body.dark #content .web-home-tile.is-lavande { --web-tile-bg: #2f2940; }
body.dark #content .web-home-tile.is-peche { --web-tile-bg: #3b2a25; }
.web-home-tile-title { position: absolute; top: 10px; left: 10px; right: 10px; display: -webkit-box; overflow: hidden; font-size: 14px; font-weight: 700; line-height: 1.2; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow-wrap: anywhere; }
.web-home-tile-art { position: absolute; right: 8%; bottom: 8%; width: 58%; height: 58%; object-fit: contain; transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1); }
.web-home-tile-value { position: absolute; left: 8px; bottom: 8px; max-width: calc(100% - 16px); overflow: hidden; padding: 3px 6px; border-radius: 999px; font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; background: rgb(255 255 255 / 92%); }
body.dark .web-home-tile-value { background: rgb(255 255 255 / 14%); }
#content .web-home-tools-empty { min-height: 96px; border: 1.5px dashed var(--studio-surface-3, #e3d7ee); border-radius: 18px; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-weight: 650; }
@media (hover: hover) and (pointer: fine) { #content .web-home-tile:hover .web-home-tile-art { transform: translateY(-3px) scale(1.04); } }
@media (prefers-reduced-motion: no-preference) {
  .web-native-home > * { animation: web-home-rise 340ms cubic-bezier(0.22, 1, 0.36, 1) both; }
  .web-native-home > :nth-child(2) { animation-delay: 30ms; }
  .web-native-home > :nth-child(3) { animation-delay: 60ms; }
  .web-native-home > :nth-child(4) { animation-delay: 90ms; }
  .web-native-home > :nth-child(5) { animation-delay: 120ms; }
  .web-native-home > :nth-child(n+6) { animation-delay: 150ms; }
  .web-home-toast { animation: web-home-drop 360ms cubic-bezier(0.22, 1, 0.36, 1) both; }
}
@keyframes web-home-rise { from { opacity: 0; transform: translateY(8px); } }
@keyframes web-home-drop { from { opacity: 0; transform: translateY(-10px) scale(0.98); } }

/* Barre d'onglets repliée (sous-pages, défilement) : bouton « Accueil » rond. */
body.csc-intermittor-studio .csc-tabbar-home { display: none; }
body.csc-intermittor-studio .csc-tabbar [data-action="ts-nav"] span { font-size: 11px; }
@media (max-width: 767px) {
  body.csc-intermittor-studio #csc-mobile-tabbar.is-collapsed { justify-content: space-between; }
  body.csc-intermittor-studio #csc-mobile-tabbar.is-collapsed .csc-tabbar-pill { display: none; }
  body.csc-intermittor-studio #csc-mobile-tabbar.is-collapsed .csc-tabbar-home { display: flex; flex: 0 0 52px; align-items: center; justify-content: center; width: 52px; height: 52px; border: 0; border-radius: 50%; color: var(--studio-primary, #6d3df2); background: var(--studio-surface, #fff); box-shadow: 0 3px 14px rgb(23 21 29 / 12%); }
}
@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
  body.csc-intermittor-studio #csc-mobile-tabbar.is-collapsed .csc-tabbar-home { animation: web-tab-pop 240ms cubic-bezier(0.22, 1, 0.36, 1) both; }
  body.csc-intermittor-studio #csc-mobile-tabbar:not(.is-collapsed) .csc-tabbar-pill { transform-origin: left center; animation: web-tab-expand 260ms cubic-bezier(0.22, 1, 0.36, 1) both; }
}
@keyframes web-tab-pop { from { opacity: 0; transform: scale(0.6); } }
@keyframes web-tab-expand { from { opacity: 0; transform: scaleX(0.35); } }

/* Page Projets sur téléphone (NativeProjectsCardsAligned) : sélecteur à
   libellés, carte de recherche, cartes « Tes projets ». */
.web-native-segmented { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; margin-bottom: 14px; padding: 4px; border-radius: 18px; background: var(--studio-surface-2, #efe7ff); }
#content .web-native-segmented button { display: grid; justify-items: center; gap: 3px; min-height: 58px; padding: 8px 4px 6px; border: 0; border-radius: 14px; background: transparent !important; color: var(--studio-muted, #5f5867) !important; font-size: 12px; font-weight: 600; transition: background-color 180ms ease-out, color 180ms ease-out; }
#content .web-native-segmented button[aria-pressed="true"] { background: var(--studio-ink, #17151d) !important; color: var(--studio-canvas, #faf7ff) !important; box-shadow: 0 3px 10px rgb(23 21 29 / 18%); }
.web-native-search { display: grid; grid-template-columns: 20px minmax(0, 1fr) 44px 44px; align-items: center; gap: 8px; margin-bottom: 14px; padding: 6px 6px 6px 16px; border-radius: 20px; background: var(--studio-surface, #fff); box-shadow: 0 2px 10px rgb(36 18 56 / 5%); color: var(--studio-muted, #5f5867); }
body.csc-intermittor-studio #content .web-native-search input { min-height: 44px; padding: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; font-size: 17px; }
body.csc-intermittor-studio #content .web-native-search input:focus-visible { outline: none !important; }
#content .web-native-search-tool { position: relative; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 12px; background: transparent !important; }
#content .web-native-search-tool[aria-pressed="true"], #content .web-native-search-tool[aria-expanded="true"] { background: var(--studio-surface-2, #efe7ff) !important; }
.web-native-search-badge { position: absolute; top: 4px; right: 4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; font-size: 10px; font-weight: 700; line-height: 16px; color: #fff; background: var(--studio-secondary, #b85a1a); }
#content .web-native-filter-switch { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 48px; padding: 0; border: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 15px; font-weight: 550; text-align: left; }
#content .web-native-filter-switch[aria-checked="true"] .web-create-switch { background: var(--studio-primary, #6d3df2) !important; }
#content .web-native-filter-switch[aria-checked="true"] .web-create-switch > span { transform: translateX(20px); }
#content .web-native-section-title { margin: 6px 2px 10px; font-size: 19px; font-weight: 700; color: var(--studio-ink, #17151d); }
.web-native-project-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
/* Une colonne jusqu'à 390 px, deux au-delà (NativeAdaptiveLayout.projectColumnCount). */
body.csc-intermittor-studio #content .web-native-project-grid[data-ts-projects-view="cards"] { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 391px) { body.csc-intermittor-studio #content .web-native-project-grid[data-ts-projects-view="cards"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

body.csc-intermittor-studio #content [data-ts-project-menu-surface] [role="menuitem"][data-action] { background: transparent !important; color: var(--studio-ink, #17151d) !important; filter: none; }
body.csc-intermittor-studio #content [data-ts-project-menu-surface] [role="menuitem"][data-action="ts-delete-project"] { color: var(--studio-danger, #b33f50) !important; }
.web-native-project-card { position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 18px; background: var(--studio-surface, #fff); box-shadow: 0 2px 10px rgb(36 18 56 / 5%); }
.web-native-project-card.is-excluded { border-style: dashed; opacity: .72; }
.web-native-project-card.is-selected { border-color: var(--studio-primary, #6d3df2); box-shadow: 0 0 0 2px var(--studio-primary, #6d3df2); }
#content .web-native-project-open { position: relative; display: flex; flex: 1; flex-direction: column; align-items: stretch; gap: 3px; width: 100%; padding: 14px 16px 12px; border: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
.web-native-project-check { position: absolute; top: 12px; right: 12px; width: 22px; height: 22px; border: 2px solid var(--studio-surface-3, #e3d7ee); border-radius: 50%; }
[aria-pressed="true"] > .web-native-project-check { border-color: var(--studio-primary, #6d3df2); background: var(--studio-primary, #6d3df2); }
.web-native-project-name { font-size: 19px; font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
.web-native-project-production { font-size: 13px; color: var(--studio-muted, #5f5867); }
.web-native-project-period { font-size: 13px; letter-spacing: .01em; color: var(--studio-muted, #5f5867); }
.web-native-project-metrics { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; margin-top: 8px; padding-top: 10px; border-top: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 8%, transparent); }
.web-native-project-metrics > span { display: grid; gap: 2px; min-width: 0; }
.web-native-project-metrics > span:last-child { text-align: right; }
.web-native-project-metrics small { font-size: 12px; color: var(--studio-muted, #5f5867); }
.web-native-project-metrics b { overflow: hidden; font-size: 17px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.web-native-project-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px 12px 16px; border-top: 1px solid color-mix(in srgb, var(--studio-ink, #17151d) 7%, transparent); }
#content .web-native-status { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 6px 14px; border: 0; border-radius: 999px; font-size: 14px; font-weight: 650; white-space: nowrap; }
.web-native-status > span { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
#content .web-native-status.is-in-progress { color: #fff !important; background: #0284c7 !important; }
#content .web-native-status.is-pending { color: #9a4a10 !important; background: #fde9d8 !important; }
#content .web-native-status.is-late { color: #b02a3c !important; background: #fde2e6 !important; }
#content .web-native-status.is-paid { color: #1d6b49 !important; background: #dcf3e7 !important; }
body.dark #content .web-native-status.is-pending { color: #ffd2a8 !important; background: #4a3020 !important; }
body.dark #content .web-native-status.is-late { color: #ffc2cb !important; background: #4b2128 !important; }
body.dark #content .web-native-status.is-paid { color: #b8f0d2 !important; background: #1f3f31 !important; }
#content .web-native-project-gear { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; }

/* #content porte un nom de transition de vue, donc son propre contexte
   d'empilement : une fenêtre modale qu'il contient (création, feuilles « + »,
   menu du compte…) passait sous l'en-tête collant et sous la bulle d'aide,
   bouton Annuler compris. Pendant qu'elle est ouverte, #content passe devant. */
body.csc-intermittor-studio.csc-create-flow-active #content,
body.csc-intermittor-studio:has(#content [aria-modal="true"]) #content { position: relative; z-index: 130; }

/* Deux colonnes sur téléphone large : la carte native resserre ses textes. */
@media (min-width: 391px) and (max-width: 440px) {
  .web-native-project-name { font-size: 17px; }
  .web-native-project-metrics b { font-size: 15px; }
  #content .web-native-project-open { padding: 12px 12px 10px; }
  .web-native-project-footer { padding: 8px 8px 10px 12px; }
  #content .web-native-status { gap: 6px; min-height: 32px; padding: 5px 11px; font-size: 13px; }
}

/* Détail d'un projet sur téléphone (en-tête natif). */
.web-native-project-head { display: grid; gap: 12px; margin-bottom: 18px; }
.web-native-project-hero { display: grid; gap: 4px; padding: 16px 16px 14px; border-radius: 22px; background: var(--studio-surface, #fff); box-shadow: 0 2px 10px rgb(36 18 56 / 5%); }
.web-native-project-hero-top { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: start; gap: 4px; }
#content .web-native-project-hero h2 { margin: 2px 0 0; font-size: 24px; font-weight: 750; line-height: 1.2; letter-spacing: -0.01em; overflow-wrap: anywhere; }
#content .web-native-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent !important; color: var(--studio-muted, #5f5867) !important; }
.web-native-menu-anchor { position: relative; }
.web-native-menu { position: absolute; top: 46px; right: 0; z-index: 40; display: grid; min-width: 220px; padding: 6px; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 16px; background: var(--studio-surface, #fff); box-shadow: 0 16px 40px rgb(23 21 29 / 18%); }
#content .web-native-menu-item { min-height: 46px; padding: 10px 12px; border: 0; border-radius: 10px; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 15px; font-weight: 550; text-align: left; }
#content .web-native-menu-item.is-danger { color: var(--studio-danger, #b33f50) !important; }
.web-native-project-sub { margin: 0; font-size: 16px; color: var(--studio-muted, #5f5867); }
#content .web-native-info-row { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 52px; margin: 8px 0 6px; padding: 6px 0; border: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 16px; font-weight: 550; text-align: left; }
.web-native-project-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.web-native-project-tiles > div { display: grid; gap: 2px; padding: 10px 12px; border-radius: 14px; background: var(--studio-surface-2, #efe7ff); }
.web-native-project-tiles small { font-size: 13px; color: var(--studio-muted, #5f5867); }
.web-native-project-tiles b { font-size: 20px; font-weight: 700; }
.web-native-project-note { margin: 6px 2px 0; font-size: 13px; color: var(--studio-muted, #5f5867); }
#content .web-native-row-button { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 10px 16px; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 16px; background: var(--studio-surface, #fff) !important; color: var(--studio-ink, #17151d) !important; font-size: 15px; font-weight: 600; text-decoration: none; }
.web-native-project-head [data-testid="ts-project-status-menu"], .web-native-project-head [data-testid="ts-project-status-readonly"], .web-native-project-head section[aria-label] { border-radius: 16px; }
body.csc-intermittor-studio #content .web-native-new-sheet[data-action] { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 60px; margin: 2px 0 6px; padding: 10px 16px; border: 0; border-radius: 18px; background: var(--studio-surface-2, #efe7ff) !important; color: var(--studio-primary, #6d3df2) !important; font-size: 18px; font-weight: 650; filter: none; }
.is-native-phone [data-testid="ts-project-sticky-new-sheet"] { display: none !important; }
.is-native-phone #ts-project-sheets-panel > div:first-child { display: grid; gap: 8px; }
body.csc-intermittor-studio #content .is-native-phone [data-testid="ts-project-inline-new-sheet"] { display: none !important; }

/* Outils : icônes 3D natives (sans pastille de fond, comme la page Plus native). */
body.web-studio-workspace #content .web-toolbox-icon.is-clay { background: transparent !important; box-shadow: none !important; }
.web-toolbox-icon.is-clay img { display: block; width: 40px; height: 40px; object-fit: contain; }
.web-toolbox-account button img { display: inline-block; margin-right: 6px; vertical-align: middle; }
@media (max-width: 767px) {
  /* L'en-tête natif affiche déjà « Plus » : pas de grand titre ni de ⌘K. */
  body.csc-web-native-header #content .web-toolbox > .web-studio-toolbar { display: none; }
}

/* Navigation sur téléphone : poussée et retour plein écran comme iOS (la page
   suivante glisse depuis la droite, la précédente recule et s'assombrit). */
@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
  html:not(:has(> body.csc-native))[data-csc-route-motion="forward"]::view-transition-group(csc-intermittor-content),
  html:not(:has(> body.csc-native))[data-csc-route-motion="back"]::view-transition-group(csc-intermittor-content) { animation-duration: 320ms; }
  html:not(:has(> body.csc-native))[data-csc-route-motion="forward"]::view-transition-old(csc-intermittor-content) { mix-blend-mode: normal; animation: web-push-old 320ms cubic-bezier(0.22, 1, 0.36, 1) both; }
  html:not(:has(> body.csc-native))[data-csc-route-motion="forward"]::view-transition-new(csc-intermittor-content) { mix-blend-mode: normal; animation: web-push-new 320ms cubic-bezier(0.22, 1, 0.36, 1) both; box-shadow: -14px 0 32px rgb(23 21 29 / 14%); }
  html:not(:has(> body.csc-native))[data-csc-route-motion="back"]::view-transition-old(csc-intermittor-content) { z-index: 2; mix-blend-mode: normal; animation: web-pop-old 300ms cubic-bezier(0.22, 1, 0.36, 1) both; box-shadow: -14px 0 32px rgb(23 21 29 / 14%); }
  html:not(:has(> body.csc-native))[data-csc-route-motion="back"]::view-transition-new(csc-intermittor-content) { mix-blend-mode: normal; animation: web-pop-new 300ms cubic-bezier(0.22, 1, 0.36, 1) both; }
}
@keyframes web-push-old { to { transform: translateX(-28%); filter: brightness(0.94); } }
@keyframes web-push-new { from { transform: translateX(100%); } }
@keyframes web-pop-old { to { transform: translateX(100%); } }
@keyframes web-pop-new { from { transform: translateX(-28%); filter: brightness(0.94); } }

/* Sur téléphone, l'en-tête natif porte déjà le retour vers Plus : pas de
   second bouton « ‹ Plus » dans la page. La bulle d'aide reste repliée dans
   tout l'onglet (« Demander conseil » est dans le bouton « + »). */
@media (max-width: 767px) {
  body.csc-web-native-header #content [data-action="ts-plus-back"]:not([role="menuitem"]) { display: none !important; }
  body.csc-web-native-header #csc-support-launcher { display: none !important; }
}
@media (max-width: 767px) {
  body.csc-web-native-header #content [data-web-page-title] { display: none !important; }
}

/* Feuille sur téléphone : l'ordre de la feuille native (résumé, journées,
   PDF, puis « Options de la feuille »), « Enregistrer » collé en bas. */
.csc-studio-sheet.is-native-phone { display: flex; flex-direction: column; }
.csc-studio-sheet.is-native-phone > * { order: 6; }
.csc-studio-sheet.is-native-phone > header { display: none; }
.csc-studio-sheet.is-native-phone > [data-web-sheet-order="summary"] { order: 0; }
.csc-studio-sheet.is-native-phone > [data-activity-section="days"] { order: 1; }
.csc-studio-sheet.is-native-phone > [data-testid="ts-boundary-day-shortcuts"] { order: 2; }
.csc-studio-sheet.is-native-phone > [data-testid="ts-feuille-pdf-actions"] { order: 3; }
.csc-studio-sheet.is-native-phone > [data-web-sheet-order="options"] { order: 5; }
.csc-studio-sheet.is-native-phone > [data-web-sheet-cta="top"] { display: none; }
.csc-studio-sheet.is-native-phone > [data-web-sheet-cta="bottom"] { order: 9; position: sticky; bottom: calc(var(--csc-tabbar-clearance, 88px) + 8px); z-index: 6; box-shadow: 0 10px 24px rgb(184 90 26 / 28%); }
.csc-studio-sheet.is-native-phone > button[data-action="ts-nav-project"] { order: 10; }
.web-native-sheet-summary { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 8px; margin-bottom: 18px; padding: 14px 14px 14px 16px; border-radius: 20px; background: var(--studio-surface, #fff); box-shadow: 0 2px 10px rgb(36 18 56 / 5%); }
.web-native-sheet-summary strong { display: block; overflow: hidden; font-size: 18px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.web-native-sheet-summary span { display: block; margin-top: 2px; font-size: 13px; color: var(--studio-muted, #5f5867); font-variant-numeric: tabular-nums; }
.web-native-sheet-summary small { display: block; margin-top: 1px; font-size: 12px; color: var(--studio-muted, #5f5867); }
#content .web-native-pill { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 8px 14px; border: 0; border-radius: 999px; background: var(--studio-surface-2, #efe7ff) !important; color: var(--studio-primary, #6d3df2) !important; font-size: 14px; font-weight: 650; }
#content .web-native-sheet-options-title { margin: 22px 2px 10px; font-size: 19px; font-weight: 700; color: var(--studio-ink, #17151d); }

/* Résumé de l'année (NativeYearReviewExperience) : carte héro sombre du
   lanceur, lecture plein écran en stories et feuille « Exporter en stories ».
   L'expérience reste sombre en mode jour, texte toujours blanc. */
.web-review-hero { position: relative; isolation: isolate; overflow: hidden; display: grid; gap: 16px; margin: 0 0 18px; padding: 20px; border: 1px solid rgb(255 255 255 / 10%); border-radius: 22px; color: #fff; background: linear-gradient(#131729, #090a13); }
.web-review-hero::before { content: ""; position: absolute; z-index: -1; left: calc(50% + 15px); top: calc(50% - 225px); width: 230px; height: 230px; border-radius: 50%; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 35%, transparent); filter: blur(60px); }
.web-review-eyebrow { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--studio-primary, #6d3df2); font-size: 12px; font-weight: 800; letter-spacing: 2px; }
.web-review-heading { display: grid; gap: 4px; }
#content .web-review-heading h2 { margin: 0; color: #fff; font-family: ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; font-size: 24px; font-weight: 700; line-height: 1.2; }
.web-review-heading p { margin: 0; color: rgb(255 255 255 / 65%); font-size: 13px; font-weight: 500; }
.web-review-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.web-review-chips span { display: grid; justify-items: center; gap: 1px; padding: 7px 12px; border-radius: 999px; background: rgb(255 255 255 / 9%); }
.web-review-chips b { color: #fff; font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.web-review-chips small { color: rgb(255 255 255 / 55%); font-size: 11px; }
#content .web-review-play { min-height: 48px; border: 0; border-radius: 16px; background: var(--studio-secondary, #b85a1a) !important; color: var(--studio-canvas, #faf7ff) !important; font-size: 16px; font-weight: 600; transition: transform 120ms ease; }
#content .web-review-play:active, #content .web-review-share:active { transform: scale(0.97); }
#content .web-review-share { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; border: 0; background: transparent !important; color: #fff !important; font-size: 17px; font-weight: 600; }
.web-review-caption { margin: 0; color: rgb(255 255 255 / 60%); font-size: 12px; line-height: 1.4; }
#content .web-review-year { display: grid; gap: 8px; padding: 6px 16px; }
.web-review-year-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; font-size: 16px; font-weight: 600; color: var(--studio-ink, #17151d); }
#content .web-review-year-row select { width: auto; min-width: 96px; min-height: 36px; padding: 4px 30px 4px 12px; border-radius: 10px; font-size: 16px; font-weight: 600; }
.web-review-year > p { margin: 0 0 8px; }
@media (max-width: 767px) {
  /* Téléphone : la page est la carte héro, comme l'écran natif ; la grille et
     les exports de bureau passent par la feuille « Exporter en stories ». */
  [data-web-native-extra="year-review"] > .web-studio-section-heading,
  [data-web-native-extra="year-review"] > .web-studio-review-grid,
  [data-web-native-extra="year-review"] > .web-studio-card:last-child { display: none; }
}

/* La page ne défile pas sous les stories ni sous leur feuille. */
body:has(#content .web-story-layer), body:has(#content .web-story-export-layer) { overflow: hidden; }
.web-story-layer { --story-accent: #bca5ff; position: fixed; inset: 0; z-index: 140; display: flex; flex-direction: column; overflow: hidden; color: #fff; background: #090a13; outline: none; touch-action: none; overscroll-behavior: contain; -webkit-user-select: none; user-select: none; }
.web-story-backdrop { position: absolute; inset: 0; overflow: hidden; background: linear-gradient(#131729, #090a13); pointer-events: none; }
.web-story-backdrop i { position: absolute; left: 50%; top: 50%; border-radius: 50%; background: var(--story-accent); }
.web-story-backdrop .is-a { width: 360px; height: 360px; margin: -180px 0 0 -180px; opacity: .4; filter: blur(75px); transform: translate(-115px, -195px); }
.web-story-backdrop .is-b { width: 320px; height: 320px; margin: -160px 0 0 -160px; opacity: .18; filter: blur(85px); transform: translate(135px, 250px); }
.web-story-layer[data-seed="odd"] .web-story-backdrop .is-a { transform: translate(125px, -195px); }
.web-story-layer[data-seed="odd"] .web-story-backdrop .is-b { transform: translate(-125px, 250px); }
.web-story-backdrop::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 50% 50%, transparent 210px, rgb(0 0 0 / 35%) 520px); }
.web-story-progress { position: relative; z-index: 1; display: flex; align-items: center; gap: 5px; padding: calc(14px + env(safe-area-inset-top, 0px)) 18px 0; }
.web-story-progress span { flex: 1; height: 4px; border-radius: 999px; background: rgb(255 255 255 / 24%); transition: background-color 250ms ease-out, height 250ms ease-out; }
.web-story-progress .is-filled { background: #fff; }
.web-story-progress .is-current { height: 5px; }
.web-story-card { position: relative; z-index: 1; flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 520px; margin: 0 auto; padding: 0 30px 8px; text-align: center; pointer-events: none; }
.web-story-copy { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; width: 100%; }
.web-story-kicker { margin: 0; color: var(--story-accent); font-size: 12px; font-weight: 800; letter-spacing: 2.2px; text-transform: uppercase; }
#content .web-story-title { margin: 0; color: #fff; font-family: ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; font-size: 28px; font-weight: 700; line-height: 1.18; }
.web-story-value-block { display: grid; justify-items: center; gap: 12px; width: 100%; }
.web-story-value { display: block; max-width: 100%; overflow-wrap: anywhere; font-family: ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; font-size: 64px; font-weight: 800; line-height: 1.05; font-variant-numeric: tabular-nums; color: #fff; background: linear-gradient(#fff, #fff 50%, color-mix(in srgb, var(--story-accent) 75%, transparent)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.web-story-value.is-compact { font-size: 54px; }
.web-story-value.is-long { font-size: 30px; }
.web-story-ring { position: relative; display: grid; place-items: center; width: 218px; height: 218px; }
.web-story-ring svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.web-story-ring circle { fill: none; stroke-width: 11; stroke-linecap: round; }
.web-story-ring-track { stroke: rgb(255 255 255 / 12%); }
.web-story-ring-fill { stroke-dasharray: 1; stroke-dashoffset: var(--ring); }
.web-story-ring .web-story-value { width: 168px; }
.web-story-bars { display: flex; align-items: flex-end; justify-content: center; gap: 5px; width: 100%; height: 46px; padding: 0 26px; }
.web-story-bars i { flex: 1; max-width: 26px; height: var(--bar); border-radius: 999px; background: rgb(255 255 255 / 26%); }
.web-story-bars i.is-peak { background: var(--story-accent); }
.web-story-split { display: grid; gap: 6px; width: 100%; padding: 0 34px; }
.web-story-split span { position: relative; height: 12px; overflow: hidden; border-radius: 999px; background: rgb(255 255 255 / 16%); }
.web-story-split i { position: absolute; inset: 0 auto 0 0; width: max(12px, var(--split)); border-radius: 999px; background: linear-gradient(90deg, var(--story-accent), color-mix(in srgb, var(--story-accent) 70%, transparent)); }
.web-story-split p { display: flex; justify-content: space-between; margin: 0; color: rgb(255 255 255 / 60%); font-size: 11px; font-weight: 600; }
.web-story-unit { margin: 0; color: rgb(255 255 255 / 85%); font-size: 17px; font-weight: 600; }
.web-story-detail { margin: 4px 0 0; color: rgb(255 255 255 / 86%); font-size: 15px; font-weight: 500; line-height: 1.4; }
.web-story-footnote { margin: 0; color: rgb(255 255 255 / 55%); font-size: 12px; line-height: 1.35; }
#content .web-story-zone { position: absolute; z-index: 2; top: calc(80px + env(safe-area-inset-top, 0px)); bottom: calc(110px + env(safe-area-inset-bottom, 0px)); width: 50%; border: 0; border-radius: 0; background: transparent !important; cursor: pointer; -webkit-tap-highlight-color: transparent; }
#content .web-story-zone.is-prev { left: 0; cursor: w-resize; }
#content .web-story-zone.is-next { right: 0; cursor: e-resize; }
#content .web-story-zone:focus-visible { outline: 2px solid rgb(255 255 255 / 55%); outline-offset: -6px; }
.web-story-bar { position: relative; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; max-width: 560px; margin: 0 auto; padding: 0 22px calc(18px + env(safe-area-inset-bottom, 0px)); }
#content .web-story-export-pill { display: inline-flex; flex-direction: row; align-items: center; gap: 7px; white-space: nowrap; padding: 10px 16px; border: 0; border-radius: 999px; background: rgb(255 255 255 / 14%) !important; color: #fff !important; font-size: 15px; font-weight: 600; }
.web-story-count { padding: 6px 12px; border-radius: 999px; background: rgb(255 255 255 / 10%); color: rgb(255 255 255 / 75%); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
#content .web-story-close { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: rgb(255 255 255 / 14%) !important; color: #fff !important; }
@media (prefers-reduced-motion: no-preference) {
  .web-story-backdrop i { animation: web-story-glow 500ms ease-in-out both; }
  .web-story-copy { animation: web-story-in 450ms cubic-bezier(0.34, 1.3, 0.64, 1) both; }
  .web-story-ring-fill { animation: web-story-ring 1.1s cubic-bezier(0.22, 1, 0.36, 1) both; }
  .web-story-bars i { animation: web-story-bar 520ms cubic-bezier(0.34, 1.4, 0.64, 1) var(--delay) both; }
  .web-story-split i { animation: web-story-split 900ms cubic-bezier(0.22, 1, 0.36, 1) both; }
}
@keyframes web-story-glow { from { opacity: 0; } }
@keyframes web-story-in { from { opacity: 0; transform: translateY(14px); } }
@keyframes web-story-ring { from { stroke-dashoffset: 1; } }
@keyframes web-story-bar { from { height: 6px; } }
@keyframes web-story-split { from { width: 12px; } }

/* Feuille « Exporter en stories » : au-dessus des stories quand elle s'ouvre
   depuis leur barre du bas ; formulaire groupé comme un Form iOS. */
.web-story-export-layer { z-index: 150; }
#content .web-story-export { display: flex; flex-direction: column; gap: 8px; background: var(--studio-canvas, #faf7ff); padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)); }
/* Une rangée de la feuille ne rétrécit jamais sous la hauteur maximale :
   c'est la feuille qui défile. */
.web-story-export > * { flex-shrink: 0; }
.web-story-export > .web-quick-sheet-grabber { align-self: center; }
.web-story-export-head { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 44px; }
#content .web-story-export-head h2 { margin: 0; font-size: 17px; font-weight: 650; color: var(--studio-ink, #17151d); }
#content .web-story-export-done { justify-self: start; min-height: 44px; padding: 0 4px; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 17px; }
.web-story-export-group { display: grid; gap: 0; overflow: hidden; border-radius: 14px; background: var(--studio-surface, #fff); }
.web-story-export-intro { gap: 6px; padding: 14px 16px; }
#content .web-story-export-intro h3 { margin: 0; font-size: 20px; font-weight: 700; color: var(--studio-ink, #17151d); }
.web-story-export-intro p { margin: 0; color: var(--studio-ink, #17151d); font-size: 15px; line-height: 1.4; }
.web-story-export-intro small, .web-story-export-note { color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-story-export-caption { margin: 10px 16px 0; color: var(--studio-muted, #5f5867); font-size: 13px; text-transform: uppercase; letter-spacing: .02em; }
.web-story-export-note { margin: 0 16px 6px; line-height: 1.4; }
.web-story-export-preview { display: flex; gap: 12px; overflow-x: auto; padding: 14px; scroll-snap-type: x mandatory; scrollbar-width: none; }
.web-story-export-preview::-webkit-scrollbar { display: none; }
.web-story-export-preview img { flex: 0 0 auto; width: auto; height: 350px; aspect-ratio: 9 / 16; border-radius: 12px; scroll-snap-align: center; box-shadow: 0 8px 22px rgb(23 21 29 / 18%); }
.web-story-export-index { margin: 0 0 12px; text-align: center; color: var(--studio-muted, #5f5867); font-size: 12px; font-variant-numeric: tabular-nums; }
.web-story-export-status { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; margin: 0; padding: 10px 16px; color: var(--studio-muted, #5f5867); font-size: 15px; }
.web-story-export-status.is-error { color: var(--studio-danger, #b42318); }
#content .web-story-export-retry { min-height: 44px; border: 0; border-top: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 16px; }
#content .web-story-export-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 56px; padding: 8px 16px; border: 0; border-bottom: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
#content .web-story-export-row:last-child { border-bottom: 0; }
.web-story-export-row-copy { display: grid; gap: 2px; min-width: 0; }
.web-story-export-row-copy b { font-size: 16px; font-weight: 650; }
.web-story-export-row-copy small { overflow: hidden; color: var(--studio-muted, #5f5867); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.web-story-switch { position: relative; flex: 0 0 auto; width: 51px; height: 31px; border-radius: 999px; background: var(--studio-surface-3, #e3d7ee); transition: background-color 200ms ease; }
.web-story-switch i { position: absolute; top: 2px; left: 2px; width: 27px; height: 27px; border-radius: 50%; background: #fff; box-shadow: 0 3px 8px rgb(0 0 0 / 15%); transition: transform 200ms cubic-bezier(0.34, 1.3, 0.64, 1); }
[aria-checked="true"] > .web-story-switch { background: var(--studio-success, #2f9e5b); }
[aria-checked="true"] > .web-story-switch i { transform: translateX(20px); }
#content .web-story-export-share, #content .web-story-export-text { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 50px; padding: 0 16px; border: 0; border-bottom: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 16px; text-align: left; }
#content .web-story-export-share { font-size: 17px; font-weight: 650; }
.web-story-export-actions > :last-child { border-bottom: 0 !important; }
body.dark #content .web-story-export { background: var(--studio-canvas, #17151d); }
body.dark .web-story-export-preview img { box-shadow: 0 8px 22px rgb(0 0 0 / 45%); }

/* En-tête « saisie » (Ajout rapide au compteur) : titre et ✕ à droite, sans
   retour, lune ni avatar ; la barre d'onglets n'y garde que l'accueil. */
@media (max-width: 767px) {
  body.csc-web-native-header .csc-web-close { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin-left: auto; padding: 0; border: 0; border-radius: 50%; background: color-mix(in srgb, var(--studio-ink, #17151d) 7%, transparent); color: var(--studio-ink, #17151d); }
  body.csc-web-native-header .csc-web-close[hidden] { display: none; }
  body.csc-web-modal-route :is(#theme-toggle, #csc-account-btn) { display: none !important; }
  /* La zone de marque (vide sur téléphone) cède sa place : le ✕ va à droite. */
  body.csc-web-modal-route > .sticky.top-0 > div > div.flex-1:not(#csc-web-titlebar) { display: none !important; }
  body.csc-web-modal-route .csc-web-title { max-width: calc(100% - 112px); }
  body.csc-web-modal-route #csc-mobile-tabbar .csc-tabbar-create { display: none !important; }
}

/* Ajout rapide au compteur, téléphone (écran natif). */
.web-qe { --qe-info: #0284c7; display: grid; gap: 12px; padding-bottom: 12px; }
.web-qe-hint { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: 16px; background: color-mix(in srgb, var(--studio-warning, #b8500a) 10%, var(--studio-surface, #fff)); color: var(--studio-ink, #17151d); font-size: 13px; line-height: 1.4; }
.web-qe-hint p { margin: 0; }
#content .web-qe-hint button { flex: none; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent !important; color: var(--studio-muted, #5f5867) !important; font-size: 22px; line-height: 1; }
#content .web-qe-profile-link { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 0 4px; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 14px; font-weight: 650; }
.web-qe-profile-link svg { color: var(--studio-muted, #5f5867); }
.web-qe-summary { display: grid; gap: 12px; padding: 14px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 18px; background: var(--studio-surface, #fff); }
.web-qe-summary-head { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: start; gap: 11px; }
.web-qe-summary-icon { display: grid; place-items: center; width: 38px; height: 38px; }
.web-qe-kicker { margin: 0 0 2px; color: var(--qe-info); font-size: 11px; font-weight: 700; letter-spacing: .7px; }
#content .web-qe-summary h2 { margin: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; color: var(--studio-ink, #17151d); font-size: 17px; font-weight: 650; line-height: 1.25; }
.web-qe-summary-date { color: var(--studio-muted, #5f5867); font-size: 12px; font-weight: 600; white-space: nowrap; }
.web-qe-owner { display: flex; align-items: center; gap: 8px; margin: 0; padding-bottom: 12px; border-bottom: 1px solid var(--studio-surface-3, #e3d7ee); color: var(--studio-muted, #5f5867); font-size: 13px; }
.web-qe-owner.is-missing { color: var(--studio-warning, #b8500a); }
.web-qe-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.web-qe-metric { display: grid; gap: 3px; min-width: 0; }
.web-qe-metric span { display: flex; align-items: center; gap: 4px; color: var(--studio-muted, #5f5867); font-size: 9px; font-weight: 650; letter-spacing: .5px; text-transform: uppercase; }
.web-qe-metric i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.web-qe-metric.is-info i { color: var(--qe-info); }
.web-qe-metric.is-success i { color: var(--studio-success, #247a55); }
.web-qe-metric.is-secondary i { color: var(--studio-secondary, #b85a1a); }
.web-qe-metric b { overflow: hidden; color: var(--studio-ink, #17151d); font-family: ui-rounded, -apple-system, BlinkMacSystemFont, system-ui, sans-serif; font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }
.web-qe-warning { display: grid; gap: 8px; padding: 12px 14px; border-radius: 16px; background: color-mix(in srgb, var(--studio-warning, #b8500a) 10%, var(--studio-surface, #fff)); }
.web-qe-warning p { margin: 0; color: var(--studio-ink, #17151d); font-size: 14px; }
#content .web-qe-warning button { justify-self: start; min-height: 44px; padding: 0; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 650; }
#content .web-qe-section-title { margin: 10px 2px -2px; color: var(--studio-ink, #17151d); font-size: 20px; font-weight: 700; }
.web-qe-card { gap: 12px; padding: 14px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); }
.web-qe .web-qe-field { padding: 4px 2px 6px; border: 0; border-radius: 0; background: transparent; }
.web-qe .web-qe-field:focus-within { box-shadow: none; }
.web-qe .web-qe-field + .web-qe-field { padding-top: 10px; border-top: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 80%, transparent); }
.web-qe-label { margin: 6px 2px -4px; color: var(--studio-ink, #17151d); font-size: 15px; }
.web-qe-caption { margin: 0; color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-qe-regimes { display: grid; gap: 8px; }
#content .web-qe-regime { --tone: var(--studio-success, #247a55); display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; min-height: 48px; padding: 8px 10px; border: 0; border-radius: 12px; background: color-mix(in srgb, var(--tone) 4.5%, transparent) !important; color: var(--studio-ink, #17151d) !important; text-align: left; font-size: 15px; font-weight: 650; line-height: 1.3; transition: background-color 160ms ease-out, transform 120ms ease; }
#content .web-qe-regime:active { transform: scale(0.98); }
#content .web-qe-regime[aria-checked="true"] { background: color-mix(in srgb, var(--tone) 12%, transparent) !important; }
#content .web-qe-regime.is-info { --tone: var(--qe-info); }
#content .web-qe-regime.is-secondary { --tone: var(--studio-secondary, #b85a1a); }
#content .web-qe-regime.is-warning { --tone: var(--studio-warning, #b8500a); }
.web-qe-regime > i { width: 10px; height: 10px; border-radius: 50%; background: var(--tone); }
.web-qe-regime-mark { display: flex; color: var(--studio-muted, #5f5867); }
.web-qe-regime[aria-checked="true"] .web-qe-regime-mark { color: var(--tone); }
.web-qe-impact { margin: 0; color: var(--studio-muted, #5f5867); font-size: 13px; line-height: 1.4; }
.web-qe-hours { display: grid; gap: 10px; }
.web-qe-amounts { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
.web-qe-amount { display: grid; gap: 8px; padding: 12px 14px; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 16px; background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 55%, var(--studio-surface, #fff)); cursor: text; }
.web-qe-amount:focus-within { border-color: var(--studio-primary, #6d3df2); }
.web-qe-amount > span:first-child { color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 650; }
.web-qe-amount-input { display: flex; align-items: center; gap: 6px; }
body.csc-intermittor-studio #content .web-qe-amount input { flex: 1; width: 100%; min-width: 0; min-height: 0; padding: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--studio-ink, #17151d) !important; font-size: 20px; font-weight: 650; font-variant-numeric: tabular-nums; }
body.csc-intermittor-studio #content .web-qe-amount input:focus-visible { outline: none !important; }
.web-qe-amount-input small { color: var(--studio-muted, #5f5867); font-size: 16px; font-weight: 600; }
.web-qe-more { padding: 0 14px; }
.web-qe-more summary { display: flex; align-items: center; justify-content: space-between; min-height: 54px; color: var(--studio-ink, #17151d); font-size: 16px; cursor: pointer; list-style: none; }
.web-qe-more summary::-webkit-details-marker { display: none; }
.web-qe-more summary svg { color: var(--studio-primary, #6d3df2); transition: transform 200ms ease; }
.web-qe-more[open] summary svg { transform: rotate(90deg); }
.web-qe-more-body { display: grid; gap: 12px; padding: 2px 0 14px; }
#content .web-qe-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 44px; padding: 0; border: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 16px; text-align: left; }
.web-qe-toggle-label { display: flex; align-items: center; gap: 8px; }
.web-qe-toggle .web-create-switch[aria-checked="true"] { background: var(--studio-primary, #6d3df2) !important; }
.web-qe-primary { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--studio-muted, #5f5867); font-size: 15px; }
.web-qe-primary svg { color: var(--studio-success, #247a55); }
.web-qe-result { gap: 10px; }
.web-qe-result-title { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 650; }
.web-qe-cta { padding: 4px 0 0; }
#content .web-qe-create { width: 100%; min-height: 54px; border: 0; border-radius: 16px; background: var(--studio-secondary, #b85a1a) !important; color: var(--studio-on-secondary, #fff) !important; font-size: 17px; font-weight: 650; box-shadow: 0 4px 0 color-mix(in srgb, var(--studio-secondary, #b85a1a) 62%, #17151d); transition: transform 120ms ease; }
#content .web-qe-create:active { transform: translateY(2px); box-shadow: 0 2px 0 color-mix(in srgb, var(--studio-secondary, #b85a1a) 62%, #17151d); }

/* En-tête de page outil (NativeFeaturePageHeader compact) et page Documents
   sur téléphone : carte recherche + import, liste des pièces, valeurs lues. */
.web-feature-header { display: flex; align-items: flex-start; gap: 16px; padding: 8px 2px 4px; }
.web-feature-header > div { flex: 1; min-width: 0; display: grid; gap: 6px; }
#content .web-feature-header h2 { margin: 0; color: var(--studio-ink, #17151d); font-size: 22px; font-weight: 700; line-height: 1.2; }
.web-feature-header p { margin: 0; color: var(--studio-muted, #5f5867); font-size: 15px; line-height: 1.35; }
.web-feature-header img { flex: none; width: 32px; height: 32px; }
.web-docs { display: grid; gap: 12px; }
.web-docs-actions { overflow: hidden; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 20px; background: var(--studio-surface, #fff); }
.web-docs-search { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 0 16px; border-bottom: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 80%, transparent); color: var(--studio-muted, #5f5867); cursor: text; }
body.csc-intermittor-studio #content .web-docs-search input { flex: 1; min-width: 0; min-height: 0; padding: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--studio-ink, #17151d) !important; font-size: 17px; }
body.csc-intermittor-studio #content .web-docs-search input:focus-visible { outline: none !important; }
#content .web-docs-import { display: flex; align-items: center; justify-content: center; gap: 10px; width: calc(100% - 24px); min-height: 48px; margin: 12px; border: 0; border-radius: 16px; background: var(--studio-secondary, #b85a1a) !important; color: var(--studio-on-secondary, #fff) !important; font-size: 16px; font-weight: 650; box-shadow: inset 0 1px 0 rgb(255 255 255 / 22%), 0 4px 0 color-mix(in srgb, var(--studio-secondary, #b85a1a) 62%, #17151d); transition: transform 120ms ease; }
#content .web-docs-import:active { transform: translateY(2px); box-shadow: 0 2px 0 color-mix(in srgb, var(--studio-secondary, #b85a1a) 62%, #17151d); }
#content .web-docs-section { margin: 8px 4px -2px; color: var(--studio-ink, #17151d); font-size: 17px; font-weight: 650; }
.web-docs-list { overflow: hidden; border-radius: 20px; background: var(--studio-surface, #fff); }
#content .web-docs-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 14px; width: 100%; min-height: 64px; padding: 10px 16px; border: 0; border-bottom: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 80%, transparent); border-radius: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
#content .web-docs-row:last-child { border-bottom: 0; }
#content div.web-docs-row { grid-template-columns: 44px minmax(0, 1fr); }
#content .web-docs-row[hidden] { display: none; }
.web-docs-file { display: grid; place-items: center; width: 44px; height: 50px; border-radius: 12px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 10%, transparent); color: var(--studio-primary, #6d3df2); }
.web-docs-copy { display: grid; gap: 3px; min-width: 0; }
.web-docs-copy small:first-child { color: var(--studio-primary, #6d3df2); font-size: 12px; font-weight: 650; }
.web-docs-copy b { overflow: hidden; color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.web-docs-copy small:last-child { overflow: hidden; color: var(--studio-muted, #5f5867); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.web-docs-chevron { color: var(--studio-muted, #5f5867); }
.web-docs-empty, .web-docs-empty-card p { margin: 0; padding: 14px 16px; text-align: center; color: var(--studio-muted, #5f5867); font-size: 16px; }
.web-docs-empty-card { border-radius: 20px; background: var(--studio-surface, #fff); }
.web-docs-cards { display: grid; gap: 12px; }
.web-docs-card { display: grid; gap: 6px; padding: 14px 16px; border-radius: 20px; background: var(--studio-surface, #fff); }
.web-docs-card[hidden] { display: none; }
.web-docs-card-kind { margin: 0; color: var(--studio-primary, #6d3df2); font-size: 12px; font-weight: 650; }
#content .web-docs-card h4 { margin: 0; overflow: hidden; color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.web-docs-card-detail { margin: 0 0 4px; color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-docs-declared-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; }
.web-docs-declared { display: grid; gap: 4px; padding: 8px 10px; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 12px; background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 45%, var(--studio-surface, #fff)); }
.web-docs-declared.is-edited { border-color: var(--studio-warning, #b8500a); }
.web-docs-declared > span:first-child { color: var(--studio-muted, #5f5867); font-size: 11px; font-weight: 600; }
.web-docs-declared.is-edited > span:first-child { color: var(--studio-warning, #b8500a); }
.web-docs-declared-input { display: flex; align-items: center; gap: 4px; }
body.csc-intermittor-studio #content .web-docs-declared input { flex: 1; width: 100%; min-width: 0; min-height: 0; padding: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--studio-ink, #17151d) !important; font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }
.web-docs-declared-input small { color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-docs-extracted { margin: 4px 0 0; color: var(--studio-muted, #5f5867); font-size: 12px; line-height: 1.5; }
.web-docs-extracted strong { color: var(--studio-ink, #17151d); font-variant-numeric: tabular-nums; }
#content .web-docs-reset { justify-self: start; min-height: 40px; padding: 0; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 14px; font-weight: 650; }
/* De nuit, le bouton Accueil replié se détache des cartes sombres. */
@media (max-width: 767px) {
  body.dark.csc-intermittor-studio #csc-mobile-tabbar.is-collapsed .csc-tabbar-home { background: var(--studio-surface-2, #2f2940); box-shadow: 0 3px 14px rgb(0 0 0 / 45%), inset 0 0 0 1px rgb(255 255 255 / 9%); }
}

/* Chrono plateau, téléphone (NativeChronoView) : carte instrument, « Ma
   journée », réglages repliés. L'en-tête de page laisse la place à la carte. */
@media (max-width: 767px) {
  body.csc-web-native-header #content [data-ts-plus-tool="chrono"] > header { display: none; }
}
.web-chrono { display: grid; gap: 12px; }
.web-chrono-card { display: grid; justify-items: center; gap: 12px; padding: 16px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 20px; background: var(--studio-surface, #fff); }
.web-chrono-icon { display: grid; place-items: center; width: 64px; height: 64px; }
.web-chrono-time { margin: 12px 0 0; color: var(--studio-ink, #17151d); font-family: ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; font-size: 40px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: .01em; }
.web-chrono-status { margin: 0; color: var(--studio-muted, #5f5867); font-size: 15px; text-align: center; }
#content .web-chrono-primary { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 50px; padding: 0 16px; border: 0; border-radius: 16px; background: var(--studio-secondary, #b85a1a) !important; color: var(--studio-on-secondary, #fff) !important; font-size: 17px; font-weight: 650; list-style: none; cursor: pointer; box-shadow: inset 0 1px 0 rgb(255 255 255 / 22%), 0 4px 0 color-mix(in srgb, var(--studio-secondary, #b85a1a) 62%, #17151d); transition: transform 120ms ease; }
#content .web-chrono-primary:active { transform: translateY(2px); box-shadow: 0 2px 0 color-mix(in srgb, var(--studio-secondary, #b85a1a) 62%, #17151d); }
.web-chrono-primary::-webkit-details-marker { display: none; }
.web-chrono-export { width: 100%; }
.web-chrono-export-list { display: grid; margin-top: 10px; overflow: hidden; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 14px; }
#content .web-chrono-export-list button { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 52px; padding: 8px 14px; border: 0; border-bottom: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 80%, transparent); border-radius: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
#content .web-chrono-export-list button:last-child { border-bottom: 0; }
.web-chrono-export-list span { display: grid; gap: 2px; min-width: 0; }
.web-chrono-export-list b { overflow: hidden; font-size: 15px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.web-chrono-export-list small { color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-chrono-export-list svg { flex: none; color: var(--studio-muted, #5f5867); }
.web-chrono-footnote { justify-self: stretch; margin: 0; color: var(--studio-muted, #5f5867); font-size: 13px; line-height: 1.4; }
.web-chrono-message { justify-self: stretch; margin: 0; padding: 10px 12px; border-radius: 12px; background: color-mix(in srgb, #0284c7 10%, var(--studio-surface, #fff)); color: var(--studio-ink, #17151d); font-size: 14px; line-height: 1.4; }
.web-chrono-controls { display: flex; flex-wrap: wrap; gap: 10px; width: 100%; }
#content .web-chrono-controls button { flex: 1 1 auto; white-space: nowrap; }
/* « Nouveau projet » reste une rangée de liste, pas le bouton orange global. */
body.csc-intermittor-studio #content .web-chrono-export-list button[data-action="ts-create-project"] { background: transparent !important; color: var(--studio-ink, #17151d) !important; filter: none; }
#content .web-chrono-controls button, #content .web-chrono-lunch button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 12px; border: 0; border-radius: 12px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 12%, transparent) !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 600; }
#content .web-chrono-controls button[aria-pressed="true"] { background: var(--studio-primary, #6d3df2) !important; color: var(--studio-on-primary, #fff) !important; }
.web-chrono-lunch { display: grid; gap: 6px; justify-self: stretch; }
.web-chrono-lunch span { color: var(--studio-muted, #5f5867); font-size: 13px; }
#content .web-chrono-lunch button { justify-self: start; min-width: 88px; font-variant-numeric: tabular-nums; }
.web-chrono-day { display: grid; gap: 12px; padding: 14px; border-radius: 20px; background: var(--studio-surface, #fff); }
.web-chrono-day-head { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.web-chrono-day-index { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 12%, transparent); color: var(--studio-primary, #6d3df2); font-size: 15px; font-weight: 700; }
.web-chrono-day-head div { display: grid; gap: 2px; min-width: 0; }
.web-chrono-day-head b { color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 650; }
.web-chrono-day-head small { color: var(--studio-muted, #5f5867); font-size: 13px; }
.web-chrono-day-total { color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 650; font-variant-numeric: tabular-nums; }
.web-chrono-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.web-chrono-steps label { display: grid; gap: 4px; padding: 8px 10px; border-radius: 12px; background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 55%, var(--studio-surface, #fff)); }
.web-chrono-steps label.is-set { background: var(--studio-surface-2, #efe7ff); }
.web-chrono-steps span { color: var(--studio-muted, #5f5867); font-size: 11px; font-weight: 600; }
.web-chrono-steps b { color: var(--studio-muted, #5f5867); font-size: 16px; }
body.csc-intermittor-studio #content .web-chrono-steps input { width: 100%; min-width: 0; min-height: 0; padding: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--studio-ink, #17151d) !important; font-size: 16px; font-weight: 650; font-variant-numeric: tabular-nums; }
.web-chrono-settings { display: grid; gap: 12px; padding: 4px 16px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 20px; background: var(--studio-surface, #fff); }
.web-chrono-disclosure summary, #content .web-chrono-live-toggle { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 52px; color: var(--studio-ink, #17151d); cursor: pointer; list-style: none; }
.web-chrono-disclosure summary::-webkit-details-marker, .web-chrono-reset summary::-webkit-details-marker { display: none; }
.web-chrono-disclosure summary > span, .web-chrono-live-toggle > span { display: flex; align-items: center; gap: 10px; }
.web-chrono-disclosure summary b, .web-chrono-live-toggle b { color: var(--studio-primary, #6d3df2); font-size: 16px; font-weight: 600; }
.web-chrono-disclosure summary > svg { color: var(--studio-muted, #5f5867); transition: transform 200ms ease; }
.web-chrono-disclosure[open] summary > svg { transform: rotate(90deg); }
.web-chrono-disclosure-body { display: grid; gap: 12px; padding: 4px 0 14px; border-top: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 80%, transparent); }
#content .web-chrono-live-toggle { padding: 0; border: 0; background: transparent !important; text-align: left; }
.web-chrono-live-toggle > svg { color: var(--studio-muted, #5f5867); }
.web-chrono-targets { display: flex; flex-wrap: wrap; gap: 8px; }
#content .web-chrono-targets button { min-height: 36px; padding: 0 12px; border: 0; border-radius: 10px; background: color-mix(in srgb, var(--studio-ink, #17151d) 6%, transparent) !important; color: var(--studio-muted, #5f5867) !important; font-size: 14px; font-weight: 600; }
#content .web-chrono-targets button[aria-pressed="true"] { background: color-mix(in srgb, var(--studio-primary, #6d3df2) 14%, transparent) !important; color: var(--studio-primary, #6d3df2) !important; }
.web-chrono-gross { display: flex; align-items: center; justify-content: space-between; margin: 0; color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 600; }
.web-chrono-gross b { font-variant-numeric: tabular-nums; }
.web-chrono-settings .web-qe-field { padding: 4px 2px 6px; border: 0; background: transparent; }
body.csc-intermittor-studio #content .web-chrono-settings .web-qe-field select { width: 100%; min-height: 0; padding: 2px 0; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--studio-ink, #17151d) !important; font-size: 17px; }
.web-chrono-reset { border-top: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 80%, transparent); }
.web-chrono-reset summary { display: flex; align-items: center; min-height: 50px; color: var(--studio-danger, #b33f50); font-size: 16px; cursor: pointer; list-style: none; }
.web-chrono-reset > div { display: grid; gap: 8px; padding: 0 0 14px; }
.web-chrono-reset p { margin: 0; color: var(--studio-ink, #17151d); font-size: 14px; }
#content .web-chrono-reset button { justify-self: start; min-height: 40px; padding: 0 16px; border: 0; border-radius: 12px; background: var(--studio-danger, #b33f50) !important; color: #fff !important; font-size: 15px; font-weight: 650; }

/* Onglet « Plus », téléphone (NativePlusHubView) : raccourcis en cartes, puis
   cinq groupes à tuile colorée ; la recherche affiche la liste complète. */
.web-toolbox.is-native-hub { display: grid; gap: 20px; }
.web-toolbox.is-native-hub:not([data-searching="1"]) > :is(.web-toolbox-groups, .web-toolbox-empty) { display: none; }
.web-toolbox.is-native-hub[data-searching="1"] > :is(.web-plus-hub, .web-plus-group) { display: none; }
.web-toolbox.is-native-hub > .web-toolbox-account { display: none; }
.web-toolbox.is-native-hub > .web-toolbox-search { order: -1; margin: 0; }
.web-plus-hub { display: grid; gap: 20px; }
.web-plus-card { overflow: hidden; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 18px; background: var(--studio-surface, #fff); }
#content .web-plus-row { position: relative; display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 10px 16px; border: 0; border-radius: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; transition: background-color 120ms ease; }
#content .web-plus-row:active { background: color-mix(in srgb, var(--studio-ink, #17151d) 5%, transparent) !important; }
#content .web-plus-row + .web-plus-row::before { content: ""; position: absolute; top: 0; left: 56px; right: 0; height: 1px; background: color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 85%, transparent); }
.web-plus-row img { width: 28px; height: 28px; }
.web-plus-copy { display: grid; gap: 2px; min-width: 0; }
.web-plus-copy strong { overflow: hidden; color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.web-plus-copy small { color: var(--studio-muted, #5f5867); font-size: 12px; line-height: 1.35; }
.web-plus-chevron { color: var(--studio-muted, #5f5867); }
.web-plus-badge { display: grid; place-items: center; border-radius: 7px; background: linear-gradient(color-mix(in srgb, var(--tint) 98%, transparent), color-mix(in srgb, var(--tint) 78%, transparent)); box-shadow: inset 0 0 0 0.5px rgb(255 255 255 / 18%); }
.web-plus-group { display: grid; gap: 20px; }
.web-plus-hero { display: flex; align-items: center; gap: 12px; padding-top: 4px; }
.web-plus-hero > div { display: grid; gap: 4px; min-width: 0; }
#content .web-plus-hero h2 { margin: 0; color: var(--studio-ink, #17151d); font-size: 28px; font-weight: 700; line-height: 1.15; }
.web-plus-hero p { margin: 0; color: var(--studio-muted, #5f5867); font-size: 16px; line-height: 1.35; }

/* Feuille d'heures, téléphone (écran natif) : « Journées détaillées » en
   cartes, carte PDF, et le reste replié sous « Options de la feuille ». */
.csc-studio-sheet.is-native-phone > [data-web-sheet-option] { order: 6; }
.csc-studio-sheet.is-native-phone:not(.is-options-open) > :not([data-web-sheet-order], [data-activity-section="days"], [data-testid="ts-feuille-pdf-actions"], [data-web-sheet-cta], [data-web-sheet-keep], button[data-action="ts-nav-project"], header) { display: none !important; }
#content .web-native-sheet-options-toggle { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 56px; margin: 4px 0 8px; padding: 0 16px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 18px; background: var(--studio-surface, #fff) !important; color: var(--studio-primary, #6d3df2) !important; }
.web-native-sheet-options-toggle > span { display: flex; align-items: center; gap: 10px; }
.web-native-sheet-options-toggle b { font-size: 16px; font-weight: 650; }
.web-native-sheet-options-toggle > svg { color: var(--studio-muted, #5f5867); transition: transform 200ms ease; }
.web-native-sheet-options-toggle[aria-expanded="true"] > svg { transform: rotate(90deg); }
.is-native-phone [data-testid="ts-day-focus-nav"] { display: none !important; }
body.csc-intermittor-studio #content .csc-studio-sheet.is-native-phone > [data-activity-section="days"] { padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.web-days-head { display: grid; gap: 8px; margin-bottom: 10px; }
#content .web-days-head h3 { margin: 4px 2px 0; color: var(--studio-ink, #17151d); font-size: 17px; font-weight: 650; }
.web-days-add { display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 0 12px 0 16px; border-radius: 16px; background: var(--studio-surface, #fff); }
#content .web-days-add > button:first-child { display: inline-flex; flex: 1; align-items: center; gap: 8px; min-height: 44px; padding: 0; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 650; text-align: left; }
/* Plus fort que la règle globale (orange, encre sombre de nuit) des boutons
   de création : ici c'est une rangée de liste. */
body.csc-intermittor-studio #content .web-days-add > button[data-action="ts-add-day"] { background: transparent !important; color: var(--studio-primary, #6d3df2) !important; filter: none; }
#content .web-days-add .web-days-add-many { min-height: 32px; padding: 0 10px; border: 0; border-radius: 999px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 10%, transparent) !important; color: var(--studio-primary, #6d3df2) !important; font-size: 13px; font-weight: 700; }
.web-days-count { padding: 5px 9px; border-radius: 999px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 11%, transparent); color: var(--studio-primary, #6d3df2); font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
.web-days-list { display: grid; gap: 10px; padding: 12px; border-radius: 18px; background: var(--studio-surface, #fff); }
#content .web-day-card { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 72px; padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--studio-primary, #6d3df2) 14%, transparent); border-radius: 16px; background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 60%, var(--studio-surface, #fff)) !important; color: var(--studio-ink, #17151d) !important; text-align: left; transition: transform 120ms ease; }
#content .web-day-card:active { transform: scale(0.98); }
#content .web-day-card.is-empty { border-style: dashed; }
.web-day-card-icon { display: grid; justify-items: center; gap: 2px; }
.web-day-card-icon b { padding: 1px 6px; border-radius: 6px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 14%, transparent); color: var(--studio-primary, #6d3df2); font-size: 10px; font-weight: 800; }
.web-day-card-copy { display: grid; gap: 3px; min-width: 0; }
.web-day-card-copy strong { color: var(--studio-ink, #17151d); font-size: 16px; font-weight: 650; }
.web-day-card-copy small { color: var(--studio-muted, #5f5867); font-size: 13px; font-variant-numeric: tabular-nums; }
.web-day-card.is-empty .web-day-card-copy small { color: var(--studio-warning, #b8500a); }
.web-day-card-figures { display: grid; justify-items: end; gap: 2px; font-variant-numeric: tabular-nums; }
.web-day-card-figures b { color: var(--studio-ink, #17151d); font-size: 16px; font-weight: 700; }
.web-day-card-figures > span { color: var(--studio-ink, #17151d); font-size: 13px; font-weight: 600; }
.web-day-card-figures small { display: inline-flex; align-items: center; gap: 4px; color: var(--studio-muted, #5f5867); font-size: 11px; }
.web-day-card-figures i { width: 6px; height: 6px; border-radius: 50%; background: #0284c7; }
.web-day-card[data-day-kind="essais"] .web-day-card-figures i { background: #6366f1; }
.web-day-card[data-day-kind="chargement"] .web-day-card-figures i { background: #0ea5e9; }
.web-day-card[data-day-kind="rendu"] .web-day-card-figures i { background: #10b981; }
#content .web-days-clear { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 4px; border: 0; background: transparent !important; color: var(--studio-danger, #b33f50) !important; font-size: 16px; font-weight: 500; text-align: left; }
#content .web-days-back { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin-bottom: 8px; padding: 0 14px 0 10px; border: 0; border-radius: 999px; background: var(--studio-surface, #fff) !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 650; box-shadow: 0 2px 8px rgb(23 21 29 / 8%); }
.web-sheet-pdf-card { display: grid; margin: 12px 0; overflow: hidden; border-radius: 18px; background: var(--studio-surface, #fff); }
#content .web-sheet-pdf-card button { display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 0 16px; border: 0; border-bottom: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 80%, transparent); border-radius: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 16px; text-align: left; }
#content .web-sheet-pdf-card button:last-child { border-bottom: 0; }

/* Formulaires « Modifier le projet / la feuille » sur téléphone : le retour
   vit dans l'en-tête ; « Valider » reste, orange comme les actions clés. */
body.csc-web-native-header #content :is(.csc-studio-project-edit-header, .csc-studio-sheet-edit-header) .csc-back { display: none !important; }
body.csc-intermittor-studio #content .csc-studio-sheet-edit-header .studio-button-primary { background: var(--studio-secondary) !important; color: var(--studio-on-secondary) !important; }
body.csc-web-native-header #content :is(.csc-studio-project-edit-header, .csc-studio-sheet-edit-header) .studio-button-primary { margin-left: auto; }
/* « Mon profil » ouvert depuis Plus : le retour de l'en-tête suffit. */
body.csc-web-native-header #content header > button.csc-back[data-action="ts-nav"][data-val="france-travail"] { display: none !important; }

/* Équipe, téléphone : « Ajouter un membre » et « Importer un contact .vcf »
   en une carte de deux rangées (StudioActionRow natif, icône violette). */
@media (max-width: 767px) {
  body.csc-intermittor-studio #content .web-team-actions { gap: 0 !important; overflow: hidden; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 18px; background: var(--studio-surface, #fff); }
  body.csc-intermittor-studio #content .web-team-actions > button { justify-content: flex-start !important; gap: 14px !important; min-height: 72px; padding: 0 16px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 16px !important; font-weight: 500 !important; }
  body.csc-intermittor-studio #content .web-team-actions > button + button { border-top: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 85%, transparent) !important; }
  body.csc-intermittor-studio #content .web-team-actions > button svg { width: 28px; height: 28px; color: var(--studio-primary, #6d3df2); }
}

/* Pression comme StudioPressButtonStyle (0,985 et 86 % d'opacité). Dans une
   couche : toute règle existante (transition, transform, :active propre à un
   composant) garde la priorité. */
@layer web-press {
  body.csc-intermittor-studio :is(#content, #csc-mobile-tabbar, #csc-web-titlebar) :is(button, summary, [role="button"]):not(:disabled) { transition: transform 140ms cubic-bezier(0.2, 0.8, 0.2, 1), opacity 140ms ease; }
  body.csc-intermittor-studio :is(#content, #csc-mobile-tabbar, #csc-web-titlebar) :is(button, summary, [role="button"]):not(:disabled):active { transform: scale(0.985); opacity: 0.86; }
  @media (prefers-reduced-motion: reduce) {
    body.csc-intermittor-studio :is(#content, #csc-mobile-tabbar, #csc-web-titlebar) :is(button, summary, [role="button"]):not(:disabled):active { transform: none; }
  }
}

/* Statistiques, téléphone : « Période et filtres » replié comme dans l'app. */
.web-stats-filters { margin: 0 0 16px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 18px; background: var(--studio-surface, #fff); }
#content .web-stats-filters-toggle { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; width: 100%; min-height: 52px; padding: 0 16px; border: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
.web-stats-filters-toggle > span { display: flex; align-items: center; gap: 10px; color: var(--studio-primary, #6d3df2); }
.web-stats-filters-toggle b { color: var(--studio-ink, #17151d); font-size: 16px; font-weight: 600; }
.web-stats-filters-toggle small { color: var(--studio-muted, #5f5867); font-size: 13px; }
.web-stats-filters-chevron { color: var(--studio-muted, #5f5867); transition: transform 200ms ease; }
.web-stats-filters-toggle[aria-expanded="true"] .web-stats-filters-chevron { transform: rotate(180deg); }
.web-stats-filters-body { padding: 4px 14px 2px; border-top: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 85%, transparent); }
.web-stats-filters-body > div:first-child { margin-top: 10px; }

/* Accueil : « Ton résumé de l'année est prêt » (NativeYearReviewHomeProposal). */
#content .web-home-proposal { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 64px; margin: 0 0 12px; padding: 10px 14px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 18px; background: var(--studio-surface, #fff) !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
.web-home-proposal-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 16%, transparent); color: var(--studio-primary, #6d3df2); }
.web-home-proposal-copy { display: grid; gap: 3px; min-width: 0; }
.web-home-proposal-copy strong { font-size: 16px; font-weight: 650; }
.web-home-proposal-copy span { color: var(--studio-muted, #5f5867); font-size: 13px; line-height: 1.35; }
.web-home-proposal-chevron { color: var(--studio-muted, #5f5867); }

/* Chrono, journée terminée (NativeChronoView.completedActions) : message de
   rangement, « Autre projet » et « Nouvelle journée » côte à côte ; un volet
   ouvert prend toute la largeur. */
.web-chrono-message.is-success { background: color-mix(in srgb, var(--studio-success, #247a55) 12%, var(--studio-surface, #fff)); }
.web-chrono-message.is-warning { background: color-mix(in srgb, var(--studio-warning, #b8500a) 12%, var(--studio-surface, #fff)); }
.web-chrono-after { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; justify-self: stretch; }
.web-chrono-after > :only-child, .web-chrono-after:has(> details[open]) > * { grid-column: 1 / -1; }
.web-chrono-after > details { width: 100%; min-width: 0; }
#content .web-chrono-secondary { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 44px; padding: 0 12px; border: 0; border-radius: 12px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 12%, transparent) !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 600; list-style: none; cursor: pointer; white-space: nowrap; }
.web-chrono-secondary::-webkit-details-marker { display: none; }
.web-chrono-confirm { display: grid; gap: 8px; margin-top: 10px; padding: 12px; border: 1px solid var(--studio-surface-3, #e3d7ee); border-radius: 14px; }
.web-chrono-confirm b { color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 650; }
.web-chrono-confirm p { margin: 0; color: var(--studio-muted, #5f5867); font-size: 14px; line-height: 1.4; }
#content .web-chrono-confirm button { min-height: 44px; padding: 0 12px; border: 0; border-radius: 12px; background: color-mix(in srgb, var(--studio-ink, #17151d) 6%, transparent) !important; color: var(--studio-ink, #17151d) !important; font-size: 15px; font-weight: 600; }
#content .web-chrono-confirm button.is-danger { background: color-mix(in srgb, var(--studio-danger, #b33f50) 14%, transparent) !important; color: var(--studio-danger, #b33f50) !important; }

/* 507 h : couleurs de la jauge de l'app (Native507Arc) — violet par défaut
   (NativeWidgetColorHex.defaultGauge #8B5CF6, dégradé 82 % → 100 %) et part
   prévue en bleu (#0566BF ; nuit #45ADFF). Même géométrie, déjà commune. */
body.csc-intermittor-studio #content #csc-arc-brand stop { stop-color: #8b5cf6; }
body.csc-intermittor-studio #content #csc-arc-brand stop:first-child { stop-opacity: .82; }
body.csc-intermittor-studio #content #csc-arc-forecast stop { stop-color: #0566bf; }
body.csc-intermittor-studio #content #csc-arc-forecast stop:first-child { stop-opacity: .8; }
body.dark.csc-intermittor-studio #content #csc-arc-forecast stop { stop-color: #45adff; }

/* Simulations (simulationsRouteContent) : icône 3D et sous-titre de l'app,
   sélecteur « Projection 507 h / Scénario libre », « Lire la projection »
   replié, carte « Pour atteindre 507 h » avec sa barre. */
#content [data-ts-plus-tool="simulator"] > header { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 12px; align-items: center; }
#content [data-ts-plus-tool="simulator"] > header > .csc-back { grid-column: 1 / -1; justify-self: start; }
#content [data-ts-plus-tool="simulator"] > header > .web-sim-hero-icon { grid-column: 1; grid-row: span 2; }
#content [data-ts-plus-tool="simulator"] > header > :is(h1, p) { grid-column: 2; margin-top: 0; }
#content [data-ts-plus-tool="simulator"] > header > p { color: var(--studio-muted, #5f5867); font-size: 15px; }
.web-sim-modes { margin: 0 0 12px; }
.web-sim-guide { margin: 0 0 12px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 16px; background: var(--studio-surface, #fff); }
.web-sim-guide summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 48px; padding: 0 14px; color: var(--studio-primary, #6d3df2); font-size: 15px; font-weight: 600; cursor: pointer; list-style: none; }
.web-sim-guide summary::-webkit-details-marker { display: none; }
.web-sim-guide summary svg { color: var(--studio-muted, #5f5867); transition: transform 200ms ease; }
.web-sim-guide[open] summary svg { transform: rotate(90deg); }
.web-sim-guide > div { display: grid; gap: 8px; padding: 0 14px 14px; color: var(--studio-ink, #17151d); font-size: 13px; line-height: 1.45; }
.web-sim-guide > div p { margin: 0; }
.web-sim-guide > div b { font-size: 15px; font-weight: 650; }
.web-sim-goal { display: grid; gap: 4px; margin: 0 0 12px; padding: 16px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 20px; background: var(--studio-surface, #fff); color: var(--studio-ink, #17151d); }
.web-sim-goal-label { color: var(--studio-muted, #5f5867); font-size: 15px; }
.web-sim-goal > b { font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; }
.web-sim-goal > small { color: var(--studio-ink, #17151d); font-size: 13px; }
.web-sim-progress { height: 6px; margin-top: 10px; overflow: hidden; border-radius: 999px; background: color-mix(in srgb, var(--studio-ink, #17151d) 10%, transparent); }
.web-sim-progress > i { display: block; height: 100%; border-radius: inherit; background: var(--studio-primary, #6d3df2); }
.web-sim-progress-scale { display: flex; justify-content: space-between; color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 500; font-variant-numeric: tabular-nums; }

/* Le « ? » d'aide (renderGuideHint) reste un petit cercle, comme dans l'app :
   la hauteur tactile de 44 px des pages Droits l'étirait en pilule. Sa zone
   tactile vient de .csc-hit (débord de 10 px). */
body.csc-intermittor-studio #content .csc-studio-rights button.csc-hit[data-action="ts-guide-hint"] { min-height: 0; min-width: 0; }

/* Planning (Plus › Organisation), comme l'outil de l'app
   (NativePlanningCalendarView) : vues Mois / Semaine / Année, repères, grille
   à pastilles, filtres, agenda du jour. Teintes de statut de l'app
   (NativeSemanticStatusPresentation) ; bleu = prévisionnel. */
.web-planning { display: grid; gap: 14px; --web-planning-forecast: #007aff; }
body.dark .web-planning { --web-planning-forecast: #0a84ff; }
.web-planning .is-to_confirm, .web-planning-project.is-to_confirm { --web-planning-tone: #623b91; }
.web-planning .is-confirmed, .web-planning-project.is-confirmed { --web-planning-tone: #22623f; }
.web-planning .is-cancelled, .web-planning-project.is-cancelled { --web-planning-tone: #595663; }
body.dark .web-planning .is-to_confirm, body.dark .web-planning-project.is-to_confirm { --web-planning-tone: #d9beff; }
body.dark .web-planning .is-confirmed, body.dark .web-planning-project.is-confirmed { --web-planning-tone: #94dfb1; }
body.dark .web-planning .is-cancelled, body.dark .web-planning-project.is-cancelled { --web-planning-tone: #cecad6; }
.web-planning-header { display: grid; justify-items: start; gap: 8px; }
.web-planning-header h1 { margin: 0; color: var(--studio-ink, #17151d); font-size: 30px; font-weight: 800; letter-spacing: -.02em; }
@media (max-width: 767px) {
  body.csc-web-native-header #content [data-web-planning] > .web-planning-header { display: none; }
}
.web-planning-forecast { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--web-planning-forecast); font-size: 13px; }
.web-planning-nav { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; gap: 8px; }
#content .web-planning-arrow { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: var(--studio-surface-2, #efe7ff) !important; color: var(--studio-ink, #17151d) !important; }
.web-planning-title { display: grid; justify-items: center; gap: 3px; text-align: center; }
.web-planning-title b { color: var(--studio-ink, #17151d); font-size: 22px; font-weight: 700; }
.web-planning-title small { color: var(--studio-muted, #5f5867); font-size: 15px; }
.web-planning-nav-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; }
#content .web-planning-nav-actions > button { min-height: 44px; padding: 0; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 600; }
.web-planning-jump { position: relative; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--studio-primary, #6d3df2); font-size: 15px; font-weight: 600; cursor: pointer; }
body.csc-intermittor-studio #content .web-planning-jump input { position: absolute; inset: 0; width: 100%; min-height: 0; padding: 0; border: 0 !important; opacity: 0; cursor: pointer; }
#content .web-planning-export { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 70%, transparent); border-radius: 12px; background: var(--studio-surface, #fff) !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 600; }
.web-planning-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.web-planning-metric { display: grid; align-content: start; gap: 5px; padding: 10px; border-radius: 14px; background: var(--studio-surface-2, #efe7ff); }
.web-planning-metric b { display: flex; align-items: center; gap: 6px; color: var(--studio-ink, #17151d); font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; }
.web-planning-metric b span { color: var(--studio-primary, #6d3df2); font-size: 15px; }
.web-planning-metric small { color: var(--studio-ink, #17151d); font-size: 12px; line-height: 1.25; }
.web-planning-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px 2px; }
.web-planning-weekday { padding-bottom: 2px; color: var(--studio-muted, #5f5867); font-size: 12px; font-weight: 600; text-align: center; }
#content .web-planning-day { display: grid; justify-items: center; align-content: start; gap: 4px; min-width: 0; min-height: 66px; padding: 6px 0 4px; border: 1px solid transparent; border-radius: 11px; background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 65%, transparent) !important; color: var(--studio-ink, #17151d) !important; }
#content .web-planning-day.is-outside { background: color-mix(in srgb, var(--studio-surface-2, #efe7ff) 25%, transparent) !important; color: var(--studio-muted, #5f5867) !important; }
#content .web-planning-day.is-today { border-color: color-mix(in srgb, var(--studio-primary, #6d3df2) 60%, transparent); }
#content .web-planning-day.is-selected { border: 2px solid var(--studio-primary, #6d3df2); background: color-mix(in srgb, var(--studio-primary, #6d3df2) 14%, transparent) !important; color: var(--studio-primary, #6d3df2) !important; }
.web-planning-day-number { min-height: 24px; font-size: 16px; font-weight: 500; line-height: 24px; font-variant-numeric: tabular-nums; }
.web-planning-day:is(.is-today, .is-selected) .web-planning-day-number { font-weight: 700; }
.web-planning-marks { display: flex; align-items: flex-end; gap: 2px; height: 8px; }
.web-planning-marks i { width: 6px; height: 4px; border-radius: 2px; background: var(--web-planning-tone, var(--studio-primary, #6d3df2)); opacity: .35; }
.web-planning-marks i.is-recorded { height: 8px; opacity: 1; }
.web-planning-marks i.is-forecast { background: var(--web-planning-forecast); }
.web-planning-marks b { font-size: 9px; line-height: 8px; }
.web-planning-day-foot { min-height: 9px; font-size: 9px; line-height: 9px; font-variant-numeric: tabular-nums; }
.web-planning-legend { display: flex; flex-wrap: wrap; column-gap: 12px; row-gap: 4px; color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-planning-legend > span, .web-planning-kind { display: inline-flex; align-items: center; gap: 6px; }
.web-planning-legend i, .web-planning-kind i { width: 10px; height: 10px; border: 1.5px solid currentColor; border-radius: 2px; }
.web-planning-legend i.is-filled, .web-planning-kind i.is-filled { background: currentColor; }
.web-planning-legend p { flex-basis: 100%; margin: 0; }
.web-planning-search { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 14px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 70%, transparent); border-radius: 14px; background: var(--studio-surface, #fff); color: var(--studio-muted, #5f5867); }
body.csc-intermittor-studio #content .web-planning-search input { flex: 1; min-width: 0; min-height: 44px; padding: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--studio-ink, #17151d) !important; font-size: 16px; }
.web-planning-filters { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.web-planning-filters::-webkit-scrollbar { display: none; }
#content .web-planning-filters button { flex: none; display: inline-flex; align-items: center; gap: 5px; min-height: 44px; padding: 0 13px; border: 0; border-radius: 999px; background: var(--studio-surface-2, #efe7ff) !important; color: var(--studio-ink, #17151d) !important; font-size: 15px; font-weight: 600; white-space: nowrap; }
#content .web-planning-filters button[aria-pressed="true"] { background: color-mix(in srgb, var(--studio-primary, #6d3df2) 15%, transparent) !important; }
.web-planning-availability { display: grid; gap: 3px; }
#content .web-planning-availability button { justify-self: start; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0; border: 0; background: transparent !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 600; text-align: left; }
.web-planning-availability p { margin: 0; color: var(--studio-ink, #17151d); font-size: 13px; }
.web-planning-availability small { color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-planning-agenda { display: grid; gap: 10px; padding: 14px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 18px; background: var(--studio-surface, #fff); }
.web-planning-agenda header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.web-planning-agenda header b { color: var(--studio-ink, #17151d); font-size: 17px; font-weight: 650; }
.web-planning-agenda header span { display: grid; place-items: center; min-width: 26px; height: 26px; border-radius: 50%; background: var(--studio-surface-2, #efe7ff); color: var(--studio-ink, #17151d); font-size: 12px; font-weight: 700; }
.web-planning-overlap { margin: 0; color: var(--studio-warning, #b8500a); font-size: 13px; }
.web-planning-empty { margin: 0; padding: 8px 0; color: var(--studio-muted, #5f5867); font-size: 15px; }
.web-planning-project { display: grid; grid-template-columns: 4px minmax(0, 1fr) 44px; align-items: stretch; gap: 10px; }
.web-planning-stripe { border-radius: 3px; background: var(--web-planning-tone); }
#content .web-planning-open { display: grid; justify-items: start; align-content: start; gap: 5px; min-width: 0; padding: 6px 0; border: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
.web-planning-open b { font-size: 17px; font-weight: 650; }
.web-planning-production { color: var(--studio-muted, #5f5867); font-size: 15px; }
.web-planning-kind { color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-planning-times { font-size: 15px; font-variant-numeric: tabular-nums; }
.web-planning-when { color: var(--studio-muted, #5f5867); font-size: 12px; font-weight: 700; }
.web-planning-when.is-forecast { color: var(--web-planning-forecast); }
.web-planning-hours { font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; }
.web-planning-ht { display: flex; gap: 8px; font-size: 12px; }
.web-planning-status { color: var(--web-planning-tone); font-size: 12px; font-weight: 600; }
.web-planning-status-menu { position: relative; }
.web-planning-status-menu summary { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--studio-primary, #6d3df2); list-style: none; cursor: pointer; }
.web-planning-status-menu summary::-webkit-details-marker { display: none; }
.web-planning-status-menu > div { position: absolute; top: 44px; right: 0; z-index: 5; display: grid; min-width: 168px; padding: 6px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 70%, transparent); border-radius: 14px; background: var(--studio-surface, #fff); box-shadow: 0 12px 32px rgb(23 21 29 / 18%); }
#content .web-planning-status-menu > div button { min-height: 44px; padding: 0 12px; border: 0; border-radius: 10px; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 15px; text-align: left; }
#content .web-planning-status-menu > div button[aria-pressed="true"] { color: var(--studio-primary, #6d3df2) !important; font-weight: 700; }
.web-planning-lock { display: grid; place-items: center; color: var(--studio-muted, #5f5867); }
.web-planning-year { display: grid; grid-template-columns: repeat(auto-fill, minmax(145px, 1fr)); gap: 12px; }
#content .web-planning-month { display: grid; align-content: start; gap: 8px; padding: 10px; border: 0; border-radius: 14px; background: var(--studio-surface-2, #efe7ff) !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
.web-planning-month b { font-size: 15px; font-weight: 700; }
.web-planning-month-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px 2px; }
.web-planning-month-grid span { display: grid; place-items: center; min-height: 16px; border-radius: 4px; font-size: 10px; font-variant-numeric: tabular-nums; }
.web-planning-month-grid span.is-active { background: color-mix(in srgb, var(--studio-primary, #6d3df2) 25%, transparent); }
.web-planning-month-grid span.is-forecast { background: color-mix(in srgb, var(--web-planning-forecast) 25%, transparent); }
.web-planning-footnote { margin: 0; color: var(--studio-muted, #5f5867); font-size: 13px; }
.web-planning-undated { border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 16px; background: var(--studio-surface, #fff); }
.web-planning-undated summary { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 14px; color: var(--studio-primary, #6d3df2); font-size: 15px; font-weight: 600; list-style: none; cursor: pointer; }
.web-planning-undated summary::-webkit-details-marker { display: none; }
.web-planning-undated > div { display: grid; gap: 10px; padding: 0 14px 14px; }
#content .web-planning-create { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 48px; border: 0; border-radius: 14px; font-size: 17px; font-weight: 600; }

/* Partage & collaboration (web-collab.js), comme l'app : boîte de réception,
   choix de sa feuille, section « Collaboration » d'un projet, lien temporaire,
   bannière d'invitation. */
.web-collab { display: grid; gap: 12px; }
.web-collab-hero { display: grid; justify-items: start; gap: 10px; }
.web-collab-hero-row { display: flex; align-items: center; gap: 12px; }
.web-collab-hero-row h1 { margin: 0; color: var(--studio-ink, #17151d); font-size: 22px; font-weight: 700; }
.web-collab-hero-row p { margin: 2px 0 0; color: var(--studio-muted, #5f5867); font-size: 15px; }
@media (max-width: 767px) {
  body.csc-web-native-header #content [data-web-collab-inbox] .web-collab-hero > .csc-back { display: none; }
}
.web-collab-title { margin: 6px 4px 0; color: var(--studio-ink, #17151d); font-size: 17px; font-weight: 650; }
.web-collab-card { display: grid; gap: 10px; padding: 12px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 18px; background: var(--studio-surface, #fff); }
.web-collab-empty { display: grid; justify-items: center; gap: 8px; padding: 12px 16px; border-radius: 14px; background: var(--studio-surface-2, #efe7ff); text-align: center; }
.web-collab-empty b { color: var(--studio-ink, #17151d); font-size: 15px; }
.web-collab-empty span, .web-collab-muted { color: var(--studio-muted, #5f5867); font-size: 13px; line-height: 1.4; }
.web-collab-muted { margin: 0; }
.web-collab-invitation { display: grid; gap: 10px; padding: 14px; border-radius: 16px; background: var(--studio-surface-2, #efe7ff); }
.web-collab-invitation-head { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 10px; align-items: start; }
.web-collab-invitation-head > div { display: grid; gap: 3px; min-width: 0; }
.web-collab-invitation-head b { color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 650; }
.web-collab-invitation-head small { color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-collab-invitation-head em { color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-collab-invitation-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
#content :is(.web-collab-invitation-actions, .web-collab-row, .web-collab-invite-actions, .web-collab-paywall, .web-collab-sheet) button { min-height: 44px; padding: 0 14px; border: 0; border-radius: 12px; background: color-mix(in srgb, var(--studio-ink, #17151d) 7%, transparent) !important; color: var(--studio-ink, #17151d) !important; font-size: 15px; font-weight: 600; }
#content :is(.web-collab-invitation-actions .is-primary, .web-collab-primary) { background: var(--studio-primary, #6d3df2) !important; color: var(--studio-on-primary, #fff) !important; }
#content :is(.web-collab-row, .web-collab-menu, .web-collab-sheet) .is-danger { color: var(--studio-danger, #b33f50) !important; }
#content :is(.web-collab, .web-collab-section) button:disabled { opacity: .55; }
.web-collab-row { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 4px; border-bottom: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 80%, transparent); }
.web-collab-row:last-child { border-bottom: 0; }
.web-collab-row > div { display: grid; gap: 2px; min-width: 0; }
.web-collab-row b { overflow: hidden; color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.web-collab-row small { color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-collab-row-icon { width: 22px; height: 22px; border-radius: 50%; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 18%, transparent); }
.web-collab-row-icon.is-accepted { background: color-mix(in srgb, var(--studio-success, #247a55) 26%, transparent); }
.web-collab-row-icon:is(.is-declined, .is-revoked, .is-expired) { background: color-mix(in srgb, var(--studio-ink, #17151d) 12%, transparent); }
.web-collab-notice { margin: 0; padding: 10px 12px; border-radius: 12px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 10%, var(--studio-surface, #fff)); color: var(--studio-ink, #17151d); font-size: 14px; }
.web-collab-notice.is-success { background: color-mix(in srgb, var(--studio-success, #247a55) 13%, var(--studio-surface, #fff)); }
.web-collab-notice.is-error { background: color-mix(in srgb, var(--studio-danger, #b33f50) 12%, var(--studio-surface, #fff)); }
.web-collab-paywall { display: grid; justify-items: center; gap: 10px; padding: 14px; border-radius: 18px; background: var(--studio-surface, #fff); border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); text-align: center; }
.web-collab-paywall b { color: var(--studio-ink, #17151d); font-size: 18px; }
.web-collab-paywall p { margin: 0; color: var(--studio-muted, #5f5867); font-size: 13px; line-height: 1.4; }
#content .web-collab-paywall button { width: 100%; background: var(--studio-secondary, #b85a1a) !important; color: #fff !important; }
.web-collab-section { display: grid; gap: 12px; margin: 16px 0; padding: 14px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 55%, transparent); border-radius: 20px; background: var(--studio-surface, #fff); }
.web-collab-section-title { display: flex; align-items: center; gap: 10px; margin: 0; color: var(--studio-ink, #17151d); font-size: 20px; font-weight: 700; }
.web-collab-header, .web-collab-share { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.web-collab-header > div, .web-collab-share > div { display: grid; gap: 2px; min-width: 0; }
.web-collab-header b, .web-collab-share b { color: var(--studio-ink, #17151d); font-size: 16px; font-weight: 650; }
.web-collab-header small, .web-collab-share small { color: var(--studio-muted, #5f5867); font-size: 13px; line-height: 1.35; }
.web-collab-badge { padding: 4px 10px; border-radius: 999px; background: color-mix(in srgb, var(--studio-secondary, #b85a1a) 14%, transparent); color: var(--studio-secondary, #b85a1a); font-size: 12px; font-weight: 700; white-space: nowrap; }
#content .web-collab-share .web-collab-primary { min-height: 44px; padding: 0 16px; border: 0; border-radius: 12px; font-size: 15px; font-weight: 600; }
#content :is(.web-collab-link-open, .web-collab-invite-open) { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 48px; padding: 0 12px; border: 0; border-radius: 14px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 8%, transparent) !important; color: var(--studio-primary, #6d3df2) !important; font-size: 15px; font-weight: 600; text-align: left; }
.web-collab-link-open span { flex: 1; }
.web-collab-member { display: grid; gap: 8px; padding: 10px 0; border-top: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 80%, transparent); }
.web-collab-member-head { display: grid; grid-template-columns: 32px minmax(0, 1fr) 44px; align-items: center; gap: 10px; }
.web-collab-member-head > div { display: grid; gap: 2px; min-width: 0; }
.web-collab-member-head b { overflow: hidden; color: var(--studio-ink, #17151d); font-size: 15px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.web-collab-member-head small { color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-collab-menu { position: relative; }
.web-collab-menu summary { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--studio-primary, #6d3df2); list-style: none; cursor: pointer; }
.web-collab-menu summary::-webkit-details-marker { display: none; }
.web-collab-menu > div { position: absolute; top: 44px; right: 0; z-index: 5; display: grid; min-width: 200px; padding: 6px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 70%, transparent); border-radius: 14px; background: var(--studio-surface, #fff); box-shadow: 0 12px 32px rgb(23 21 29 / 18%); }
#content .web-collab-menu > div button { min-height: 44px; padding: 0 12px; border: 0; border-radius: 10px; background: transparent !important; color: var(--studio-ink, #17151d) !important; font-size: 15px; text-align: left; }
.web-collab-binding, .web-collab-field { display: grid; gap: 4px; padding: 8px 12px; border-radius: 12px; background: var(--studio-surface-2, #efe7ff); }
.web-collab-binding span, .web-collab-field span { color: var(--studio-muted, #5f5867); font-size: 12px; }
body.csc-intermittor-studio #content :is(.web-collab-binding, .web-collab-field) :is(select, input) { width: 100%; min-height: 32px; padding: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--studio-ink, #17151d) !important; font-size: 16px; font-weight: 600; }
.web-collab-invite { display: grid; gap: 10px; padding: 14px; border: 1px solid color-mix(in srgb, var(--studio-primary, #6d3df2) 14%, transparent); border-radius: 16px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 5.5%, transparent); }
.web-collab-invite-actions { display: flex; justify-content: space-between; gap: 10px; }
/* Grand écran : colonne de lecture des autres pages Studio, boutons à leur
   taille (l'iPad garde la même ligne de décision sous le texte). */
@media (min-width: 768px) {
  body.csc-intermittor-studio #content [data-web-collab-inbox] { max-width: 880px; margin-inline: auto; }
  .web-collab-invitation-actions { grid-template-columns: repeat(2, max-content); justify-content: start; padding-left: 42px; }
  #content .web-collab-invitation-actions button { min-width: 144px; }
}
.web-collab-banner { display: grid; grid-template-columns: 32px minmax(0, 1fr) 44px; align-items: center; gap: 10px; margin: 0 0 12px; padding: 10px 6px 10px 12px; border: 1px solid color-mix(in srgb, var(--studio-primary, #6d3df2) 22%, transparent); border-radius: 18px; background: color-mix(in srgb, var(--studio-primary, #6d3df2) 8%, var(--studio-surface, #fff)); }
#content .web-collab-banner-open { display: grid; gap: 2px; min-width: 0; padding: 0; border: 0; background: transparent !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
.web-collab-banner-open b { font-size: 15px; font-weight: 650; }
.web-collab-banner-open small { color: var(--studio-muted, #5f5867); font-size: 13px; }
#content .web-collab-banner-close { width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent !important; color: var(--studio-muted, #5f5867) !important; font-size: 16px; }
.web-collab-sheet-backdrop { position: fixed; inset: 0; z-index: 80; display: grid; align-items: end; background: rgb(23 21 29 / 42%); }
.web-collab-sheet { display: grid; grid-template-rows: auto minmax(0, 1fr); max-height: 92vh; overflow: hidden; border-radius: 22px 22px 0 0; background: var(--studio-surface, #fff); box-shadow: 0 -10px 40px rgb(23 21 29 / 25%); animation: web-collab-sheet-in 260ms cubic-bezier(.22, 1, .36, 1) both; }
@media (min-width: 768px) { .web-collab-sheet-backdrop { align-items: center; justify-items: center; } .web-collab-sheet { width: min(560px, 92vw); border-radius: 22px; } }
@keyframes web-collab-sheet-in { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .web-collab-sheet { animation: none; } }
.web-collab-sheet > header { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; min-height: 52px; padding: 4px 8px; border-bottom: 1px solid color-mix(in srgb, var(--studio-surface-3, #e3d7ee) 80%, transparent); }
.web-collab-sheet > header b { color: var(--studio-ink, #17151d); font-size: 16px; text-align: center; }
#content .web-collab-sheet-close { width: 44px; min-height: 44px; padding: 0; border-radius: 50%; }
.web-collab-sheet-body { display: grid; align-content: start; gap: 10px; overflow-y: auto; padding: 16px; }
.web-collab-sheet-body h2 { margin: 0; color: var(--studio-ink, #17151d); font-size: 22px; font-weight: 700; }
.web-collab-sheet-body h3 { margin: 6px 0 0; color: var(--studio-ink, #17151d); font-size: 15px; }
.web-collab-sheet-project { margin: 0; color: var(--studio-ink, #17151d); font-size: 17px; font-weight: 650; }
.web-collab-options { display: grid; gap: 8px; }
#content .web-collab-options button { display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: start; gap: 10px; min-height: 52px; padding: 10px 12px; border: 0; border-radius: 14px; background: var(--studio-surface-2, #efe7ff) !important; color: var(--studio-ink, #17151d) !important; text-align: left; }
.web-collab-options button > span:last-child { display: grid; gap: 2px; }
.web-collab-options b { font-size: 15px; font-weight: 650; }
.web-collab-options em { color: var(--studio-primary, #6d3df2); font-size: 12px; font-style: normal; }
.web-collab-options small { color: var(--studio-muted, #5f5867); font-size: 12px; }
.web-collab-radio { width: 20px; height: 20px; margin-top: 1px; border: 2px solid var(--studio-primary, #6d3df2); border-radius: 50%; }
.web-collab-options button[aria-checked="true"] .web-collab-radio { background: radial-gradient(circle at center, var(--studio-primary, #6d3df2) 0 45%, transparent 50%); }
.web-collab-link-url { width: 100%; min-height: 44px; padding: 0 12px; border: 1px solid color-mix(in srgb, var(--studio-line, #c7b8d8) 70%, transparent); border-radius: 12px; background: var(--studio-surface-2, #efe7ff); color: var(--studio-ink, #17151d); font-size: 13px; }
#content .web-collab-sheet .web-collab-primary { display: flex; align-items: center; justify-content: center; gap: 8px; }
.web-collab-links { display: grid; }

/* Invité en lecture (csc-ts-shared-readonly) : comme l'app, aucune commande
   d'écriture sur le projet ni ses feuilles ; le serveur refuse de toute façon. */
body.csc-ts-shared-readonly #content :is([data-action="ts-add-day"], [data-action="ts-add-many"], [data-action="ts-clear-days"], [data-action="ts-create-feuille"], [data-action="ts-edit-project"], [data-action="ts-edit-feuille"], [data-action="ts-feuille-save"], [data-action="ts-feuille-status"], [data-action="ts-day-move"], [data-action="ts-day-voyage-preset"], [data-action="ts-add-rendu"], [data-action="ts-add-essais"], [data-action="ts-add-chargement"], [data-action="ts-set-payment-status"], [data-action="ts-project-planning-status"], [data-action="ts-toggle-project-tracking"], [data-action="ts-p-toggle-bijoute"], [data-action="ts-f-forfait-set-otmode"], [data-action="ts-required-doc-toggle"], [data-action^="ts-project-clock-"], [data-action^="ts-delete-"], [data-action^="ts-duplicate"]) { display: none !important; }
body.csc-ts-shared-readonly #content :is(input, select, textarea):not([type="search"]):not([data-web-collab-section] *) { pointer-events: none; opacity: .72; }