/* Shared finishing layer. Scoped legacy components; bespoke approved editors retain their own CSS. */
.reference-ui { --sf-accent:#bee1ee; --sf-tint:#e9f4fa; }
.reference-ui.ui-family-guardian,.reference-ui.ui-family-academic { --sf-accent:#c9e6c3; --sf-tint:#eaf4e6; }
.reference-ui.ui-family-crm,.reference-ui.ui-family-reports { --sf-accent:#f9efbb; --sf-tint:#fff9d2; }
.reference-ui.ui-family-teaching { --sf-accent:#add7ee; --sf-tint:#e8f4fa; }
.reference-ui .page-shell,.reference-ui .page-shell>* { min-width:0; }
.reference-ui :is(.profile-grid,.journey-columns,.delivery-grid)>* { min-width:0; }
.reference-ui:not(.ui-family-dashboard):not(.ui-family-live) .page-shell>.page-heading,
.reference-ui:not(.ui-family-dashboard):not(.ui-family-live) .page-shell>.page-intro { padding:24px; margin:0 0 24px; background:var(--sf-accent); border:1px solid #223b4520; border-radius:18px; display:flex; justify-content:space-between; align-items:center; gap:18px; }
.reference-ui .page-heading :is(h1,p),.reference-ui .page-intro :is(h1,p) { overflow-wrap:anywhere; }
.reference-ui:not(.ui-family-dashboard) .page-heading h1 { font-size:clamp(26px,2.6vw,34px); line-height:1.25; margin:0 0 10px; }
.reference-ui .page-heading p:last-child { font-size:13px; line-height:1.8; margin:0; color:#344f5a; }
.reference-ui:not(.ui-family-dashboard):not(.ui-family-live) .page-shell>.panel,
.reference-ui .profile-grid>.panel,.reference-ui .profile-sidebar>.panel { border:1px solid #d0dfe5; border-top:4px solid var(--sf-accent); border-radius:16px; padding:24px; background:#fff; min-width:0; }
.reference-ui:not(.ui-family-dashboard):not(.ui-family-live) .page-shell>.panel:has(>h1) { max-width:100%; }
.reference-ui:not(.ui-family-dashboard) .page-shell>.panel>h1 { font-size:clamp(26px,2.6vw,34px); line-height:1.3; margin:0 0 18px; padding-bottom:18px; border-bottom:1px solid #dbe6e9; }
.reference-ui:not(.ui-family-dashboard) .page-shell>.panel>h2 { font-size:19px; line-height:1.5; padding:13px 15px; background:var(--sf-tint); border-radius:10px; margin:26px 0 18px; }
.reference-ui:not(.ui-family-dashboard) .page-shell>.panel>h2:first-child { margin-top:0; }
.reference-ui .panel p { line-height:1.8; }
.reference-ui .panel>article { border:1px solid #d9e4e8; border-left:4px solid var(--sf-accent); border-radius:12px; background:#fafcfd; padding:18px; margin-top:16px; }
.reference-ui .panel>article h2 { font-size:18px; }
.reference-ui .panel>article p:last-child { margin-bottom:0; }
.reference-ui .sf-record-list { list-style:none; padding:0; margin:16px 0; display:grid; gap:12px; }
.reference-ui .sf-record-list>li { padding:16px 18px; border:1px solid #d8e4e7; border-left:4px solid #c9e6c3; border-radius:11px; background:#fcfefe; font-size:13px; overflow-wrap:anywhere; line-height:1.8; }
.reference-ui .sf-record-list>li:nth-child(3n+2) { border-left-color:#add7ee; }
.reference-ui .sf-record-list>li:nth-child(3n) { border-left-color:#e2d691; }
.reference-ui .sf-record-list>li p { margin:8px 0; font-size:13px; }
.reference-ui .sf-record-list a { text-underline-offset:4px; font-weight:700; }
.reference-ui .panel :is(dt,dd,code,pre) { overflow-wrap:anywhere; }
.reference-ui .panel dl { min-width:0; }
.reference-ui .panel dt { font-size:12px; color:#4c6470; margin-bottom:5px; }
.reference-ui .panel dd { font-size:14px; line-height:1.8; margin-left:0; }
.reference-ui .table-wrap { min-width:0; width:100%; border-color:#d0e0e6; border-radius:12px; scrollbar-color:#9bbcc9 #edf5f8; }
.reference-ui .table-wrap table { margin:0; }
.reference-ui .table-wrap th { background:var(--sf-tint); color:#294854; }
.reference-ui .table-wrap td { background:#fff; vertical-align:top; }
.reference-ui .table-wrap tr:nth-child(even) td { background:#f6fafc; }
.reference-ui .table-wrap tbody tr:hover td { background:#fffbee; }
.reference-ui .table-wrap th,.reference-ui .table-wrap td { border-color:#dbe6e9; padding:14px 12px; font-size:12px; line-height:1.7; }
.reference-ui .sf-field { min-width:0; margin:0 0 21px; }
.reference-ui .sf-field-label { display:flex; flex-wrap:wrap; align-items:baseline; gap:7px; margin-bottom:8px; }
.reference-ui .sf-field label { margin:0; font-size:13px; font-weight:800; line-height:1.7; }
.reference-ui .sf-required { font-size:10px; color:#526873; }
.reference-ui .sf-field> :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { display:block; width:100%; min-width:0; max-width:100%; min-height:47px; padding:11px 13px; border:1px solid #a6bbc4; background:#fcfefe; color:#223b45; border-radius:10px; font:inherit; font-size:14px; }
.reference-ui .sf-field textarea { min-height:112px; height:132px; resize:vertical; }
.reference-ui .sf-field :is(select[multiple],input[type=file]) { height:auto; }
.reference-ui .sf-field select[multiple] { min-height:135px; }
.reference-ui .sf-field input[type=file] { border-style:dashed; background:#f0f8fb; }
.reference-ui .sf-field-help { margin-top:7px; color:#4c6470; font-size:12px; line-height:1.8; overflow-wrap:anywhere; }
.reference-ui .sf-field-help ul { margin:7px 0; padding-left:20px; }
.reference-ui .sf-check-row { display:flex; align-items:flex-start; gap:10px; padding:14px; border:1px solid #e5dba3; border-radius:10px; background:#fff9d2; }
.reference-ui .sf-check-row input[type=checkbox] { flex:0 0 20px; width:20px; height:20px; margin:2px 0 0; accent-color:#223b45; }
.reference-ui .sf-field-error :is(input,select,textarea) { border-color:#b26b68; }
.reference-ui .errorlist { color:#873c38; border-left:3px solid #cc9c94; background:#fff3ee; border-radius:4px; padding:10px 12px 10px 27px; margin:8px 0 15px; font-size:12px; line-height:1.8; overflow-wrap:anywhere; }
.reference-ui .panel .notice,.reference-ui .panel .quiet-note { overflow-wrap:anywhere; }
.reference-ui .notice { padding:16px 18px; border:1px solid #e5dba3; background:#fff9d2; border-radius:11px; line-height:1.8; font-size:13px; }
.reference-ui .panel form:not(.account-form):not(.logout-form) { padding:18px; background:#fbfdfe; border:1px solid #dce6e9; border-radius:12px; margin:16px 0; }
.reference-ui .panel form>button { margin-top:4px; }
.reference-ui .panel form>p { font-size:13px; }
.reference-ui form input[type=checkbox],.reference-ui form input[type=radio] { accent-color:#223b45; }
.reference-ui :is(button,input,textarea,select) { max-width:100%; }
.reference-ui :is(button,.button,.primary-button,.outline-button):disabled { opacity:.55; cursor:not-allowed; transform:none; }
.reference-ui .panel :is(nav,.pagination) { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:20px; font-size:12px; }
.reference-ui .panel nav>a,.reference-ui .pagination>a { min-height:44px; display:inline-flex; align-items:center; padding:9px 14px; border:1px solid #bdd2dc; background:#f1f8fc; color:#294854; border-radius:9px; text-decoration:none; font-weight:700; }
.reference-ui .audit-list { padding:0; list-style:none; }
.reference-ui .audit-list>li { padding:15px; margin:12px 0; border:1px solid #d8e4e7; border-left:4px solid #add7ee; background:#f6fafc; border-radius:10px; overflow-wrap:anywhere; font-size:12px; line-height:1.9; }
.reference-ui .error-page { border-top:5px solid var(--sf-accent); background:#fff; }
.reference-ui .auth-panel .sf-field input { width:100%; }
.reference-ui .auth-panel :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { min-width:0; max-width:100%; }
.reference-ui .auth-panel .errorlist { text-align:left; }
.reference-ui .profile-grid { grid-template-columns:minmax(0,1.45fr) minmax(230px,.85fr); align-items:start; gap:24px; }
.reference-ui .sf-state { display:inline-block; border:1px solid #bfd4dd; background:#e7f3f9; color:#294854; padding:4px 10px; border-radius:7px; font-size:11px; font-weight:800; line-height:1.7; }
.reference-ui .sf-state-active { background:#e2efdd; border-color:#b5d0af; }
.reference-ui .sf-state-pending { background:#fff9d2; border-color:#dfd195; }
.reference-ui :is(a,button,input,select,textarea,summary):focus-visible { outline:3px solid #4f8297; outline-offset:3px; }
@media(max-width:1200px) { .reference-ui .profile-grid,.reference-ui .journey-columns { grid-template-columns:minmax(0,1fr); } .reference-ui .journey-rail { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; } .reference-ui .journey-rail>section { margin:0; } }
@media(max-width:700px) { .reference-ui .journey-rail { grid-template-columns:minmax(0,1fr); } .reference-ui .page-heading,.reference-ui .page-intro { flex-wrap:wrap; } .reference-ui:not(.ui-family-dashboard):not(.ui-family-live) .page-shell>.page-heading,.reference-ui:not(.ui-family-dashboard):not(.ui-family-live) .page-shell>.page-intro { padding:20px; } .reference-ui:not(.ui-family-dashboard):not(.ui-family-live) .page-shell>.panel,.reference-ui .profile-grid>.panel,.reference-ui .profile-sidebar>.panel { padding:18px; } .reference-ui .panel form:not(.account-form):not(.logout-form) { padding:15px; } .reference-ui .sf-field> :is(input,select,textarea) { font-size:16px; } }
@media(prefers-reduced-motion:reduce) { .reference-ui *, .reference-ui *::before,.reference-ui *::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }
