/* Shared screen primitives. Print layouts and branding remain in their own stylesheets. */
@media screen{
 :root{--ui-readable:#17212f;--ui-secondary:#475569;--ui-focus:#9b4d00}
 #workspace main,#workspace .panel,#workspace .card,dialog{color:var(--ui-readable)}
 #workspace main p,#workspace main label,#workspace main td,#workspace main input,#workspace main select,#workspace main textarea,dialog p,dialog label,dialog td,dialog input,dialog select,dialog textarea{color:var(--ui-readable)}
 #workspace main small,dialog small,#workspace main .muted,dialog .muted{color:var(--ui-secondary)}
 #workspace main h1,#workspace main h2,#workspace main h3,dialog h2,dialog h3{color:#1b2e41}
 #workspace main .dash-hero :is(h1,h2,h3,p,small){color:#fff}
 button,a,input,select,textarea,summary{scroll-margin-block:90px}
 :is(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--ui-focus);outline-offset:3px}
 #workspace main button.secondary,dialog button.secondary{background:#edf2f5;color:#20374a;border:1px solid #a8bdc9;font-weight:650;box-shadow:0 1px 2px #17212f12}
 #workspace main button.secondary:hover,dialog button.secondary:hover{background:#dfeaf0;border-color:#738c9c}
 #workspace main button.danger,dialog button.danger{color:#8c1e20;border-color:#c38182;background:#fff1f1}
 #workspace main input,#workspace main textarea,#workspace main select,dialog input,dialog textarea,dialog select{background-color:#fff;border-color:#9aadb9}
 dialog{max-height:94dvh;overflow:auto;scroll-padding-top:90px;overscroll-behavior:contain}
 dialog>.dialoghead{position:sticky;top:0;z-index:20;background:#f3f7f9;flex-shrink:0;border-bottom:1px solid #d3dfe5}
 dialog>.dialoghead .icon{flex-shrink:0;min-width:40px;min-height:40px;color:#253b4c}
 #editor[open]{display:flex;flex-direction:column;overflow:hidden}
 #editor>#editor-form{min-height:0;overflow-y:auto;overscroll-behavior:contain}
 #editor .dialogfoot{position:sticky;bottom:0;background:#fff;z-index:10;border-top:1px solid #d4e0e6;padding-block:.8rem}
 dialog:not(#editor)>.dialoghead{margin-top:0}
 dialog .dialoghead h2{overflow-wrap:anywhere}
 #workspace main .badge,dialog .badge{font-weight:650}
 @media(max-width:700px){dialog{max-width:96vw;width:96vw;max-height:94dvh}dialog>.dialoghead{padding:1rem;gap:.8rem}.actions{flex-wrap:wrap}button{min-height:38px}}
 @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
}