/* Tool interiors. Navigation owns the glass; working areas stay readable.
   Layout overrides use active panels so hidden tools never enter the grid. */
/* The rules scoped to one tool page live in workspace-interiors-<page>.css: parked behind that page and placed right after this sheet in index.html, in the order their rules had here. Keep a rule in this file when it is shared or ties with a later rule. */
html[data-rattib-material="glass"] .workspace-framed .panel { --interior-gap: 20px; --interior-heading-spacing: -.025em; --interior-detail-spacing: -.02em; }
html[data-rattib-material="glass"][dir="rtl"] .workspace-framed .panel { --interior-heading-spacing: 0; --interior-detail-spacing: 0; }
html[data-rattib-material="glass"] .workspace-framed .panel :is(.suite-header,.panel-head,.contracts-header,.finance-header,.calendar-head,.time-head,.knowledge-header) {
  gap: 12px 20px; align-items: center; padding-block: 0 20px; margin-block: 0 20px;
}
html[data-rattib-material="glass"] .workspace-framed :is(#panel-home,#panel-projects,#panel-tasks,#panel-crm,#panel-pricing,#panel-proposal,#panel-contracts,#panel-finance,#panel-week,#panel-calendar,#panel-timesheet,#panel-knowledge) :is(.suite-header,.panel-head,.contracts-header,.finance-header,.calendar-head,.time-head,.knowledge-header) :is(h1,h2) {
  font-family: var(--font); font-size: clamp(26px, 1.75vw, 32px); font-weight: 700; line-height: 1.3; letter-spacing: var(--interior-heading-spacing); margin-block: 0 8px;
}
html[data-rattib-material="glass"] .workspace-framed #panel-portal #client-portal-host > h2 {
  font-family: var(--font); font-size: clamp(26px, 1.75vw, 32px); font-weight: 700; line-height: 1.3; letter-spacing: var(--interior-heading-spacing); margin-block: 0 8px;
}
html[data-rattib-material="glass"] .workspace-framed .panel :is(.suite-detail-head h2,.knowledge-detail > h2,.finance-detail > h2,.contracts-detail > h2) {
  font-family: var(--font); font-size: 23px; font-weight: 600; line-height: 1.4; letter-spacing: var(--interior-detail-spacing);
}
html[data-rattib-material="glass"] .workspace-framed .panel :is(.suite-toolbar,.contracts-filters,.time-filters,.calendar-filters,.finance-filter-bar) {
  gap: 12px; padding: 14px 16px; margin-block: 16px 20px; border-radius: 12px; background: var(--rail); align-items: end;
}
html[data-rattib-material="glass"] .workspace-framed .panel :is(.suite-lead,.finance-caption,.contracts-caption,.calendar-note,.time-note,.forms-local-note,.scheduling-local-note) {
  font-size: 13px; line-height: 1.7; max-inline-size: 78ch;
}
html[data-rattib-material="glass"] .workspace-framed .panel :is(.suite-project-list,.contracts-library,.knowledge-library,.forms-library,.collaboration-library,.files-tools) {
  align-self: start; min-inline-size: 0;
}
/* 01 Today: visible totals, a next action, and useful saved-work widgets. */
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-next-step { min-block-size: 120px; padding: 24px; margin-block-end: 20px; }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-next-copy h2 { font-family: var(--font); font-weight: 600; font-size: 25px; }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; padding: 0; margin-block: 20px; }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-metric { display: flex; flex-direction: column; align-items: start; justify-content: space-between; gap: 12px; min-block-size: 108px; padding: 18px 20px; border-radius: 12px; border: 1px solid var(--border); background: var(--card); }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-metric strong { font-size: 30px; line-height: 1; color: var(--green); }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-overview { padding: 0; margin-block: 0 24px; border: 0; border-block: 1px solid var(--border); border-radius: 0; background: transparent; box-shadow: none; }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-overview > summary { min-block-size: 48px; padding: 12px 0; color: var(--muted); font-size: 13px; }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-overview .suite-toolbar { margin-block: 0 16px; }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-widgets { gap: 20px; }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-widget { padding: 20px; }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-widget-head { margin-block-end: 16px; padding-block-end: 12px; border-block-end: 1px solid var(--border); }
html[data-rattib-material="glass"] .workspace-framed #panel-home .home-widget-head h2 { font-family: var(--font); font-size: 16px; font-weight: 600; }
/* 04 Clients: identity, follow-up and action areas form one readable card. */
html[data-rattib-material="glass"] .workspace-framed #panel-crm :is(.crm-view,.crm-filters,.crm-tag-filters) { gap: 8px; }
html[data-rattib-material="glass"] .workspace-framed #panel-crm .crm-view { margin-block-end: 12px; }
html[data-rattib-material="glass"] .workspace-framed #panel-crm .crm-search { margin-block: 16px 24px; }
html[data-rattib-material="glass"] .workspace-framed #panel-crm .follow-card-list { grid-template-columns: repeat(auto-fit,minmax(min(100%,370px),1fr)); gap: 20px; }
html[data-rattib-material="glass"] .workspace-framed #panel-crm .follow-card { padding: 22px; gap: 16px; }
html[data-rattib-material="glass"] .workspace-framed #panel-crm .follow-card-name { font-family: var(--font); font-size: 19px; font-weight: 600; }
html[data-rattib-material="glass"] .workspace-framed #panel-crm .follow-card-top { margin: 0; gap: 16px; }
html[data-rattib-material="glass"] .workspace-framed #panel-crm .follow-card-top > div:first-child { flex-basis: 13rem; }
html[data-rattib-material="glass"] .workspace-framed #panel-crm .follow-card-when { flex: 1 1 11rem; max-inline-size: none; }
html[data-rattib-material="glass"] .workspace-framed #panel-crm .follow-bucket-title { font-family: var(--font); font-size: 14px; margin-block: 12px 16px; }
html[data-rattib-material="glass"] .workspace-framed #panel-crm .follow-card-actions { padding-block-start: 16px; border-block-start: 1px solid var(--border); gap: 8px; }
/* 07 Contracts: document library and revisions frame the reading pane. */
html[data-rattib-material="glass"] .workspace-framed #panel-contracts .contracts-workspace { grid-template-columns: minmax(230px,280px) minmax(0,1fr); gap: 24px; }
html[data-rattib-material="glass"] .workspace-framed #panel-contracts .contracts-library { padding: 12px; border-radius: 14px; background: var(--rail); }
html[data-rattib-material="glass"] .workspace-framed #panel-contracts .contracts-row { padding: 16px 12px; border-radius: 10px; flex-wrap: wrap; }
html[data-rattib-material="glass"] .workspace-framed #panel-contracts .contracts-row time { flex-basis: 100%; margin-inline-start: 0; }
html[data-rattib-material="glass"] .workspace-framed #panel-contracts .contracts-detail { padding: 28px; }
html[data-rattib-material="glass"] .workspace-framed #panel-contracts .contracts-detail > .contracts-actions { padding-block: 16px; border-block: 1px solid var(--border); margin-block: 20px; }
/* 08 Finance: reporting above the ledger, selected record beside it. */
html[data-rattib-material="glass"] .workspace-framed #panel-finance .finance-report { padding: 20px; border-radius: 14px; margin-block-end: 24px; }
html[data-rattib-material="glass"] .workspace-framed #panel-finance .finance-report th { font-size: 12px; font-weight: 500; }
html[data-rattib-material="glass"] .workspace-framed #panel-finance .finance-report td { font-size: 18px; font-weight: 600; padding-block: 16px; font-variant-numeric: tabular-nums; }
html[data-rattib-material="glass"] .workspace-framed #panel-finance .finance-workspace { grid-template-columns: minmax(0,1fr) minmax(280px,340px); gap: 24px; }
html[data-rattib-material="glass"] .workspace-framed #panel-finance .finance-results { padding: 16px; border-radius: 14px; }
html[data-rattib-material="glass"] .workspace-framed #panel-finance .finance-row { min-block-size: 84px; }
html[data-rattib-material="glass"] .workspace-framed #panel-finance .finance-row small { line-height: 1.7; }
html[data-rattib-material="glass"] .workspace-framed #panel-finance .finance-detail { padding: 24px; }
html[data-rattib-material="glass"] .workspace-framed #panel-finance .finance-detail .finance-actions { border-block-start: 1px solid var(--border); padding-block-start: 18px; margin-block-start: 20px; }
/* 09 Work week: daily planning first, financial context alongside. */
html[data-rattib-material="glass"] .workspace-framed #panel-week .week-glance-cards { gap: 14px; }
html[data-rattib-material="glass"] .workspace-framed #panel-week .week-glance-card { border-radius: 12px; padding: 18px; }
html[data-rattib-material="glass"] .workspace-framed #panel-week .week-main-layout { grid-template-columns: minmax(0,1.45fr) minmax(280px,.8fr); gap: 24px; align-items: start; }
html[data-rattib-material="glass"] .workspace-framed #panel-week :is(.week-focus,.week-money) { padding: 24px; border-radius: 14px; }
html[data-rattib-material="glass"] .workspace-framed #panel-week :is(.week-focus-title,.week-money-title) { font-family: var(--font); font-size: 19px; }
html[data-rattib-material="glass"] .workspace-framed #panel-week .week-rest-label { font-size: 14px; font-weight: 600; margin-block: 28px 16px; }
html[data-rattib-material="glass"] .workspace-framed #panel-week #week-table :is(th,td) { padding-block: 18px; }
/* 10 Calendar: a quiet date grid and an obvious selected-day inspector. */
html[data-rattib-material="glass"] .workspace-framed #panel-calendar .calendar-toolbar { justify-content: space-between; gap: 16px; }
html[data-rattib-material="glass"] .workspace-framed #panel-calendar .calendar-period { gap: 8px; }
html[data-rattib-material="glass"] .workspace-framed #panel-calendar .calendar-content { grid-template-columns: minmax(0,1fr) minmax(250px,300px); gap: 20px; }
html[data-rattib-material="glass"] .workspace-framed #panel-calendar .calendar-inspector { border-radius: 14px; padding: 22px; border-block-start: 3px solid var(--green); }
html[data-rattib-material="glass"] .workspace-framed #panel-calendar .calendar-date { border-radius: 8px; padding: 12px; min-block-size: 104px; }
html[data-rattib-material="glass"] .workspace-framed #panel-calendar .calendar-event { border-radius: 5px; padding: 5px 7px; line-height: 1.5; }
html[data-rattib-material="glass"] .workspace-framed #panel-calendar .calendar-selected-day { font-family: var(--font); font-weight: 600; font-size: 18px; }
/* 12 Knowledge: library rail, readable pages and organized content blocks. */
html[data-rattib-material="glass"] .workspace-framed #panel-knowledge .knowledge-layout { grid-template-columns: minmax(220px,260px) minmax(0,1fr); gap: 24px; }
html[data-rattib-material="glass"] .workspace-framed #panel-knowledge .knowledge-library { padding: 18px 14px; background: var(--rail); border-radius: 14px; }
html[data-rattib-material="glass"] .workspace-framed #panel-knowledge .knowledge-detail { padding: 28px; }
html[data-rattib-material="glass"] .workspace-framed #panel-knowledge :is(#knowledge-preview,#knowledge-history-preview) { max-inline-size: 80ch; font-size: 15px; }
html[data-rattib-material="glass"] .workspace-framed #panel-knowledge .knowledge-block { padding: 20px; background: var(--card); border-inline-start: 3px solid var(--tool-surface); }
html[data-rattib-material="glass"] .workspace-framed #panel-knowledge .knowledge-history { padding-block-start: 20px; margin-block-start: 28px; }
/* 16 Focus: readable timer and compact supporting windows. */
html[data-rattib-material="glass"] .workspace-framed #panel-focus .focus-stage { border-radius: 20px; }
html[data-rattib-material="glass"] .workspace-framed #panel-focus .focus-stage-top { gap: 12px; }
html[data-rattib-material="glass"] .workspace-framed #panel-focus .focus-card { padding: 20px; }
html[data-rattib-material="glass"] .workspace-framed #panel-focus .focus-card > h2 { font-family: var(--font); font-size: 16px; font-weight: 600; }
html[data-rattib-material="glass"] .workspace-framed #panel-focus .focus-history-list > li { padding-block: 12px; }
/* 17 Portal: preview and approval tools have distinct working areas. */
html[data-rattib-material="glass"] .workspace-framed #panel-portal #client-portal-host { padding: 24px; border-radius: 14px; }
html[data-rattib-material="glass"] .workspace-framed #panel-portal #portal-approvals-host { padding: 24px; border-radius: 14px; }
html[data-rattib-material="glass"] .workspace-framed #panel-portal #portal-approvals-host > h2 { font-family: var(--font); font-size: 21px; font-weight: 600; margin-block: 0 16px; }
html[data-rattib-material="glass"] .workspace-framed #panel-portal #portal-approvals-host > form { gap: 16px; }
html[data-rattib-material="glass"] .workspace-framed #panel-portal .portal-approval-receipt { padding: 20px; border-radius: 10px; }
/* Wide workspaces use available space without stretching libraries or text. */
@media (min-width: 1400px) {
  html[data-rattib-material="glass"] .workspace-framed #panel-home .home-widgets { grid-template-columns: repeat(2,minmax(0,1fr)); }
  html[data-rattib-material="glass"] .workspace-framed #panel-home .home-widget.is-wide { grid-column: span 2; }
}
@media (min-width: 1800px) {
  html[data-rattib-material="glass"] .workspace-framed #panel-home .home-widgets { grid-template-columns: repeat(4,minmax(0,1fr)); }
  html[data-rattib-material="glass"] .workspace-framed #panel-home .home-widget.is-wide { grid-column: span 4; }
}
@media (max-width: 1199px) {
  html[data-rattib-material="glass"] .workspace-framed #panel-calendar .calendar-content { grid-template-columns: minmax(0,1fr); }
html[data-rattib-material="glass"] .workspace-framed #panel-finance .finance-workspace { grid-template-columns: minmax(0,1fr); }
html[data-rattib-material="glass"] .workspace-framed #panel-week .week-main-layout { grid-template-columns: minmax(0,1fr); }
  html[data-rattib-material="glass"] .workspace-framed #panel-calendar .calendar-inspector { min-block-size: 0; }
}
@media (max-width: 1000px) {
  html[data-rattib-material="glass"] .workspace-framed #panel-home .home-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  html[data-rattib-material="glass"] .workspace-framed #panel-home .home-metric { min-block-size: 96px; }
html[data-rattib-material="glass"] .workspace-framed #panel-contracts .contracts-workspace { grid-template-columns: minmax(0,1fr); }
html[data-rattib-material="glass"] .workspace-framed #panel-knowledge .knowledge-layout { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 700px) {
  html[data-rattib-material="glass"] .workspace-framed .panel :is(.suite-header,.panel-head,.contracts-header,.finance-header,.calendar-head,.time-head,.knowledge-header) { padding-block-end: 16px; margin-block-end: 16px; }
  html[data-rattib-material="glass"] .workspace-framed #panel-home .home-metric { padding: 16px; }
  html[data-rattib-material="glass"] .workspace-framed #panel-home .home-metric strong { font-size: 26px; }
  html[data-rattib-material="glass"] .workspace-framed #panel-home .home-next-step { padding: 20px; }
  html[data-rattib-material="glass"] .workspace-framed #panel-home .home-next-copy h2 { font-size: 22px; }
html[data-rattib-material="glass"] .workspace-framed #panel-contracts .contracts-detail { padding: 20px; }
html[data-rattib-material="glass"] .workspace-framed #panel-knowledge .knowledge-detail { padding: 20px; }
  html[data-rattib-material="glass"] .workspace-framed #panel-calendar .calendar-date { padding: 6px; min-block-size: 72px; }
html[data-rattib-material="glass"] .workspace-framed #panel-portal :is(#client-portal-host,#portal-approvals-host) { padding: 20px; }
}
@media (max-height:560px) and (min-width:601px) and (max-width:1000px) {
  body.workspace-framed.workspace-fit .top {grid-template-columns:minmax(100px,1fr) minmax(150px,1fr) auto auto;gap:8px;padding-block:4px;}
  body.workspace-framed.workspace-fit .top > .brand {grid-column:1;grid-row:1;}
  body.workspace-framed.workspace-fit .top > .workspace-context {grid-column:2;grid-row:1;}
  body.workspace-framed.workspace-fit .top > .workspace-create {grid-column:3;grid-row:1;}
  body.workspace-framed.workspace-fit .top > .workspace-tools {grid-column:4;grid-row:1;}
}
/* A viewport-sized workspace: navigation stays put; the active tool owns scrolling. */
html.workspace-viewport {block-size:100%;overflow:hidden;}
body.workspace-framed.workspace-fit .workspace-tools:not([open]) > .workspace-tools-body {display:none;}
body.workspace-framed.workspace-fit {
  position:relative;
  block-size:100dvh;min-block-size:0;overflow:hidden;
  display:flex;flex-direction:column;box-sizing:border-box;
}
body.workspace-framed.workspace-fit > .top {flex:none;min-block-size:0;}
body.workspace-framed.workspace-fit > .app-shell {
  flex:1 1 0;min-block-size:0;min-inline-size:0;overflow:hidden;
  display:flex;box-sizing:border-box;
}
body.workspace-framed.workspace-fit .workspace {
  flex:1;min-block-size:0;min-inline-size:0;inline-size:100%;
  display:flex;flex-direction:column;box-sizing:border-box;padding-block-end:6px;
}
body.workspace-framed.workspace-fit .workspace > main:not([hidden]) {
  position:relative;
  flex:1 1 0;min-block-size:0;min-inline-size:0;overflow:auto;
  overscroll-behavior:contain;scrollbar-width:thin;scroll-padding-block:16px;
  box-sizing:border-box;
}
body.workspace-framed.workspace-fit > .foot {flex:none;padding-block:4px;margin-block:0;font-size:10px;line-height:1.4;}
body.workspace-framed.workspace-fit > .workspace-notices {
  flex:0 1 auto;min-block-size:0;max-block-size:min(40dvh,360px);
  overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;
}
body.workspace-framed.workspace-fit > .workspace-notices:has(.first-run-welcome[data-open="true"]) {
  max-block-size:min(72dvh,720px);
}
body.workspace-framed.workspace-fit .workspace-notices:has(> .workspace-recovery:not([hidden])) {max-block-size:75dvh;}
body.workspace-framed.workspace-fit .workspace-notices > :not([hidden]) {margin-block:6px;}
body.workspace-framed.workspace-fit .workspace > main[data-workspace-page="focus"] {
  display:flex;flex-direction:column;gap:8px;padding:10px;overflow:hidden;
}
body.workspace-framed.workspace-fit main[data-workspace-page="focus"] #first-run-root {flex:none;}
body.workspace-framed.workspace-fit main[data-workspace-page="focus"] #panel-focus.active {
  display:flex;flex-direction:column;flex:1 1 0;min-block-size:0;margin:0;
}
body.workspace-framed.workspace-fit #panel-focus #focus-local-notice:not([hidden]) {flex:none;margin-block:0 6px;}
@media (min-width:1001px) {
  body.workspace-framed.workspace-fit .workspace > main {min-height:0;}
  body.workspace-framed.workspace-fit .app-shell {display:flex;}
}
@media (max-width:1000px) {
  body.workspace-framed.workspace-mobile-ready.workspace-fit {padding-block-end:calc(72px + env(safe-area-inset-bottom));}
  body.workspace-framed.workspace-mobile-ready.workspace-fit .app-shell {display:flex;}
  body.workspace-framed.workspace-fit .top {padding:8px 14px;gap:4px 10px;}
  body.workspace-framed.workspace-fit .workspace {padding:4px 8px 0;}
  body.workspace-framed.workspace-fit .workspace > main {padding:16px;}
  body.workspace-framed.workspace-fit .workspace > main[data-workspace-page="focus"] {padding:0;border:0;background:transparent;gap:6px;}
  body.workspace-framed.workspace-fit > .foot {padding:2px 12px;font-size:9px;}
}
@media print {
  html.workspace-viewport {block-size:auto;overflow:visible;}
  body.workspace-framed.workspace-fit {block-size:auto;overflow:visible;}
  body.workspace-framed.workspace-fit > .app-shell,body.workspace-framed.workspace-fit .workspace > main {overflow:visible;block-size:auto;display:block;}
}
body.workspace-framed.workspace-fit .workspace-notices > #first-run-root {margin-inline:252px 88px;}
body.workspace-framed.workspace-fit .workspace-tools #first-run-root {border-block-start:1px solid var(--border);padding-block-start:12px;margin-block-start:12px;}
body.workspace-framed.workspace-fit .workspace-tools #first-run-root .first-run-guide {margin:0;}
body.workspace-framed.workspace-fit .workspace-tools #first-run-resume {padding-inline:10px;}
@media(max-width:1000px) {
body.workspace-framed.workspace-fit .workspace-notices > #first-run-root {margin-inline:12px;}
}
@media(max-height:560px) and (max-width:1000px) {
 body.workspace-framed.workspace-mobile-ready.workspace-fit {padding-block-end:calc(64px + env(safe-area-inset-bottom));}
 body.workspace-framed.workspace-fit > .foot {display:none;}
 body.workspace-framed.workspace-fit .workspace-mobile-item {min-height:44px;flex-direction:row;gap:8px;padding:4px;}
 body.workspace-framed.workspace-fit .workspace-mobile-nav {padding-block:4px;min-height:52px;}
}
