/* Page headings keep their text inside the card, at every text size. */
html[data-mode] body .shell .main>.top{box-sizing:border-box!important;padding:clamp(20px,2.5vw,34px)!important;gap:20px!important;min-width:0!important;align-items:center!important}
html[data-mode] body .shell .main>.top>div:first-child{flex:1 1 320px;min-width:0!important;max-width:100%;text-align:start}
html[data-mode] body .shell .main>.top .title{margin:6px 0 10px!important;line-height:1.5!important;letter-spacing:0!important;overflow-wrap:anywhere;word-break:normal;max-width:100%}
html[data-mode] body .shell .main>.top .eyebrow{letter-spacing:0!important;line-height:1.7!important;margin:0!important}
html[data-mode] body .shell .main>.top .subtitle{margin:0!important;max-width:100%!important;line-height:1.85!important;overflow-wrap:anywhere}
html[data-mode] body .shell .main>.top>.actions{flex:0 1 auto!important;min-width:0;max-width:100%;margin:0!important;gap:10px!important}
html[data-mode] body .shell .main :is(.sectionhead,.section-head){min-width:0;gap:14px;align-items:center}
html[data-mode] body .shell .main :is(.sectionhead,.section-head)>:is(h2,h3,div){min-width:0;overflow-wrap:anywhere;line-height:1.65}
html[data-mode] body .shell .main .hub-widget .sectionhead h2{flex:1 1 auto;margin:0!important}
html[data-mode] body .shell .main :is(.hub-list-row,.notice)>:is(div,b,span){min-width:0;overflow-wrap:anywhere}
.hub-welcome bdi{unicode-bidi:isolate}
#zahraaNotifications{display:grid;gap:12px;margin:0 auto 24px!important;width:100%;min-width:0}
#zahraaNotifications[hidden]{display:none!important}
.zahraa-notification-popup{display:flex;align-items:flex-start;gap:14px;padding:20px;border:1px solid var(--ui-line,#3b506b);border-inline-start:4px solid var(--ui-accent,#e7c674);border-radius:var(--hub-card-radius,16px);background:var(--ui-surface,#152236);color:var(--ui-text,#edf3fc);box-shadow:0 8px 24px #00000012;animation:zahraa-notice-in .25s ease-out;min-width:0}
.zahraa-notification-icon{flex:0 0 auto;font-size:22px;line-height:1.5}
.zahraa-notification-body{flex:1;min-width:0}
.zahraa-notification-body h3{margin:0!important;font-size:1.1em!important;line-height:1.7;overflow-wrap:anywhere}
.zahraa-notification-body p{margin:6px 0 12px!important;color:var(--ui-muted,#b3c2d7);line-height:1.8;overflow-wrap:anywhere;white-space:pre-wrap}
html[data-mode] body .main .zahraa-notification-close{flex:0 0 44px;min-width:44px!important;min-height:44px!important;padding:6px!important;font-size:22px!important}
@keyframes zahraa-notice-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){html[data-mode] body .shell .main>.top{padding:20px 18px!important;gap:16px!important}html[data-mode] body .shell .main>.top>div:first-child{flex:auto!important;text-align:start!important}html[data-mode] body .shell .main>.top>.actions{justify-content:flex-start!important;width:100%}html[data-mode] body .shell .main>.top .title{font-size:clamp(24px,6vw,32px)!important}.zahraa-notification-popup{padding:16px 12px;gap:9px}.zahraa-notification-icon{display:none}}
@media(prefers-reduced-motion:reduce){.zahraa-notification-popup{animation:none}}