.thot-app-shell { position: relative; width: 100%; min-width: 0; min-height: 0; height: var(--thoth-app-height, 100dvh); overflow: hidden; container: application / inline-size; } .thot-evidence-filters { display: grid; grid-template-columns: minmax(14rem, 2fr) repeat(3, minmax(8rem, 1fr)) auto; align-items: end; gap: 0.75rem; } .thot-evidence-filters > label { min-width: 0; } .thot-pi-guide { max-width: 75ch; } .thot-pi-guide ol { list-style: decimal; gap: 2rem; } .thot-pi-guide h4 { font-size: var(--text-body); } .thot-pi-guide pre { font-size: var(--text-control); line-height: 1.6; padding: 0.75rem 1rem; } .thot-pi-guide p > code { font-size: var(--text-control); } @container administration (max-width: 68rem) { .thot-evidence-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); } .thot-evidence-search { grid-column: 1 / -1; } } @container administration (max-width: 30rem) { .thot-evidence-filters { grid-template-columns: minmax(0, 1fr); } } .thot-session-documents[data-layout="compact"]:not([hidden]) { position: absolute; z-index: 35; inset: 0; width: 100%; max-width: none; border-inline-end: 0; } .thot-app-shell[data-administration-narrow="true"] .thot-session-documents[data-layout="compact"] { inset-block-start: 3rem; } .thot-administration-page, .thot-work-area-page { display: flex; min-width: 0; min-height: 0; flex: 1; flex-direction: column; overflow: auto; background: oklch(var(--background)); color: oklch(var(--foreground)); container: administration / inline-size; } .thot-administration-header { display: flex; flex: none; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.25rem; padding: 1.25rem 1.5rem; border-bottom: 1px solid oklch(var(--border)); background: oklch(var(--muted) / 0.35); } .thot-administration-header__copy { min-width: 0; flex: 1 1 20rem; } .thot-administration-header h1 { margin: 0.25rem 0 0; font-family: var(--font-heading); font-size: var(--text-page); line-height: 1.3; font-weight: 600; letter-spacing: -0.025em; overflow-wrap: anywhere; } .thot-administration-eyebrow { margin: 0; font: 500 var(--text-meta)/1.5 var(--font-sans); color: oklch(var(--muted-foreground)); text-transform: none; letter-spacing: normal; } .thot-administration-description { max-width: 68ch; margin: 0.6rem 0 0; font-size: 0.875rem; line-height: 1.6; color: oklch(var(--muted-foreground)); } .thot-administration-header__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; min-width: 0; max-width: 100%; } .thot-administration-header__actions > label { min-width: 0; width: 15rem; max-width: 100%; } .thot-administration-page :where(input, select, textarea, fieldset) { min-width: 0; max-width: 100%; } .thot-administration-page :where(pre, code, dd) { overflow-wrap: anywhere; } .thot-administration-page :where(p, li) { overflow-wrap: anywhere; } .thot-administration-toolbar { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: end; padding: 1.25rem 1.75rem; } .thot-administration-toolbar > label { min-width: 0; flex: 1 1 10rem; } .thot-administration-split { display: grid; flex: none; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr); min-height: 18rem; margin: 1.25rem 1.75rem; border: 1px solid oklch(var(--border)); background: oklch(var(--card)); } .thot-administration-index { min-width: 0; background: oklch(var(--muted) / 0.45); border-inline-end: 1px solid oklch(var(--border)); } .thot-administration-detail { min-width: 0; padding: 1.35rem; } .thot-administration-index :where(button[aria-current]) { background: oklch(var(--nav-active)); color: oklch(var(--nav-active-foreground)); } .thot-administration-index button { overflow-wrap: anywhere; } .thot-administration-section-label { padding: 1rem 1.25rem 0; font: 600 var(--text-control)/1.5 var(--font-sans); color: oklch(var(--foreground)); } .thot-administration-link { color: oklch(var(--primary)); text-decoration: underline; text-underline-offset: 0.2em; font-size: 0.875rem; } .thot-administration-link:focus-visible { outline: 2px solid oklch(var(--ring)); outline-offset: 3px; } .thot-administration-dependency { padding: 1rem 1.25rem; border-block: 1px solid oklch(var(--border)); background: oklch(var(--muted) / 0.35); font-size: 0.875rem; } .thot-administration-dependency p { max-width: 72ch; margin-bottom: 0.5rem; } .thot-administration-mobile-nav { position: absolute; inset: 0 0 auto; z-index: 30; display: flex; height: 3rem; align-items: center; justify-content: space-between; gap: 0.5rem; padding: 0 1rem; border-bottom: 1px solid oklch(var(--border)); background: oklch(var(--background)); } .thot-app-shell[data-administration-narrow="true"] { padding-top: 3rem; } .thot-work-area-page .thot-work-area-panel__body--flush { display: flex; overflow: hidden; } .thot-work-area-page .thot-workspace-manager__layout { flex: 1; min-height: 0; } .thot-work-area-page .thot-workspace-manager__content { padding: 1.4rem; } .thot-work-area-page__body--pi { display: flex; padding: 1.5rem 1.75rem; overflow: hidden; } .thot-pi-workbench { display: grid; flex: 1; min-width: 0; min-height: 0; grid-template-columns: minmax(12rem, 0.55fr) minmax(0, 1.5fr); border: 1px solid oklch(var(--border)); background: oklch(var(--card)); } .thot-pi-index { background: oklch(var(--muted) / 0.45); border-inline-end: 1px solid oklch(var(--border)); padding: 1.25rem; } .thot-pi-index a { display: block; padding: 0.65rem 0; font-size: 0.875rem; } .thot-pi-index { min-height: 0; overflow-y: auto; } .thot-pi-detail { min-width: 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 1.35rem; } .thot-pi-detail :where(section, ol, li, div, pre, dl, dd) { min-width: 0; max-width: 100%; } .thot-pi-detail :where(p, dt, dd) { overflow-wrap: anywhere; } .thot-pi-detail [data-testid="pi-platform-instructions-scroll"] { max-height: none; overflow: visible; } .thot-workspace-preparation { border-block-start: 1px solid oklch(var(--border)); padding-top: 1.25rem; } .thot-workspace-preparation .thot-preprocessing-control { max-width: 40rem; } .thot-preprocessing-control[data-presentation="page"] { padding: 1rem; margin-top: 0.75rem; } .thot-preprocessing-control[data-presentation="page"] :where(strong, span, small, button) { font-size: var(--text-control); line-height: 1.5; } .thot-preprocessing-control[data-presentation="page"] button { height: auto; min-height: 2.25rem; white-space: normal; } .thot-administration-database .thot-fleet-ledger__kpi-value { font-size: var(--text-body); } .thot-administration-database .thot-administration-dependency { flex: none; } .thot-database-workbench { grid-template-columns: minmax(10rem, 0.55fr) minmax(0, 1.5fr); } .thot-database-workbench form > .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } @container administration (max-width: 48rem) { .thot-administration-split, .thot-pi-workbench { grid-template-columns: minmax(0, 1fr); } .thot-pi-workbench { grid-template-rows: auto minmax(0, 1fr); } .thot-database-workbench form > .grid { grid-template-columns: minmax(0, 1fr); } .thot-administration-index, .thot-pi-index { border-inline-end: 0; border-block-end: 1px solid oklch(var(--border)); } .thot-administration-index { max-height: 22rem; overflow-y: auto; } .thot-administration-header { padding: 1.25rem; } .thot-administration-split { margin: 1rem; } .thot-work-area-page .thot-workspace-manager__layout { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, auto) minmax(0, 1fr); } .thot-work-area-page .thot-workspace-manager__navigation { max-height: 10rem; border-inline-end: 0; border-block-end: 1px solid oklch(var(--border)); } } @container administration (max-width: 30rem) { .thot-pi-detail dl { display: block; } .thot-pi-detail dt { margin-top: 0.75rem; } .thot-administration-header h1 { font-size: 1.5rem; } .thot-administration-header, .thot-administration-toolbar, .thot-work-area-page__body--pi { padding: 1rem; } .thot-administration-detail, .thot-pi-detail { padding: 1rem; } .thot-administration-split { margin: 0.75rem; } }