/* Shared header identity. Builder uses inset buttons; teaching uses edge controls. */
:is(.sp-forloeb-builder,.spfs) .spf-header{
 position:relative;z-index:10;flex:0 0 auto;display:flex;align-items:stretch;justify-content:space-between;
 min-height:var(--spf-header-height);padding:0;gap:0;background:var(--spf-header-bg);color:var(--spf-header-ink);
 font-family:"Geist",system-ui,sans-serif;letter-spacing:.02em;box-shadow:0 1px 0 #00000024;
}
.spf-header .spfb-header-inner{display:flex;align-items:center;justify-content:space-between;width:100%;min-width:0;min-height:70px;gap:16px;padding:14px var(--spfb-gutter,25px)}
.spf-header :is(.spfb-header-actions,.spfs-topbar-left,.spfs-topbar-right){display:flex;align-items:stretch;gap:0;min-width:0}
.spf-header .spfb-header-actions,.spf-header .spfs-topbar-right{flex-shrink:0}
.spf-header .spfs-topbar-left{flex:1}
.spf-header .spfb-header-copy{min-width:0;align-self:center;padding:0}
.spf-header .spfb-eyebrow{margin:0 0 2px;font-size:10px;font-weight:550;letter-spacing:.09em;text-transform:uppercase;color:var(--spf-header-muted)}
.spf-header :is(.spfb-title,.spfs-course-title,.spfs-panel-title){margin:0;font-size:16px;line-height:1.25;font-weight:600;letter-spacing:.025em;color:var(--spf-header-ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spf-header :is(.spfs-course-title,.spfs-panel-title){align-self:center;padding:0 var(--spf-header-space)}
.spf-header :is(.spfb-more-wrap,.spfs-tools-wrap){position:relative;display:flex;align-items:stretch}
:is(.sp-forloeb-builder,.spfs) .spf-header .spf-header-action{
 appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;
 min-height:var(--spf-header-height);height:auto;margin:0;padding:0 var(--spf-header-space);
 border:0;border-left:1px solid var(--spf-header-line);border-radius:0;box-shadow:none;
 background:transparent;color:var(--spf-header-ink)!important;font:620 var(--spf-header-font)/1.25 "Geist",system-ui,sans-serif;
 letter-spacing:.025em;text-transform:none;text-decoration:none!important;white-space:nowrap;cursor:pointer;
 transition:background-color var(--spf-t) var(--spf-ease);
}
:is(.sp-forloeb-builder,.spfs) .spf-header .spf-header-action:hover{background:var(--spf-header-hover)}
:is(.sp-forloeb-builder,.spfs) .spf-header .spf-header-action:is(.is-active,[aria-expanded="true"],[aria-pressed="true"]){background:var(--spf-header-active)}
:is(.sp-forloeb-builder,.spfs) .spf-header .spf-header-action:focus-visible{outline:2px solid var(--spf-header-focus);outline-offset:-5px;background:var(--spf-header-hover)}
:is(.sp-forloeb-builder,.spfs) .spf-header .spf-header-action.spf-header-primary{background:var(--spf-header-active)}
:is(.sp-forloeb-builder,.spfs) .spf-header .spf-header-action.spf-header-primary:hover{background:#FFFFFF40}
.spf-header .spf-header-action svg{width:18px;height:18px;flex:0 0 18px;margin:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* Builder variant, sampled from the approved mockup. The gutter also
   positions the plan/library surfaces, keeping the outer edges aligned. */
.spf-header .spfb-header-actions{align-items:center;gap:8px}
.sp-forloeb-builder .spfb-header .spf-header-action{min-height:36px;padding:9px 12px;gap:7px;border:1px solid #ffffff29;border-radius:6px;background:transparent;color:#f2f4f6!important;font-size:12px;font-weight:580;line-height:1.3}
.sp-forloeb-builder .spfb-header .spf-header-action:hover,
.sp-forloeb-builder .spfb-header .spf-header-action[aria-expanded="true"]{background:#ffffff21}
.sp-forloeb-builder .spfb-header .spf-header-action:focus-visible{outline-offset:3px}
.sp-forloeb-builder .spfb-header .spf-header-action.spf-header-primary{padding-inline:15px;border-color:#fff;background:#fff;color:#20242b!important}
.sp-forloeb-builder .spfb-header .spf-header-action.spf-header-primary:hover{background:#e7ecf1;border-color:#b7c6d2}
.sp-forloeb-builder .spfb-header .spf-header-action svg{width:16px;height:16px;flex-basis:16px}
.spf-header .spfs-back-label{max-width:240px;overflow:hidden;text-overflow:ellipsis}
.spf-header .spfs-tool-save{align-self:center;color:var(--spf-header-muted);font-size:11px;line-height:1.4;max-width:135px;padding-right:12px}
.spf-header .spfs-tool-save.is-error{color:#FFC8B9}
:is(.spfb-more-menu,.spfs-tools-menu) .spf-menu-exit{border-top:1px solid var(--spf-hairline);border-radius:0;margin-top:6px;padding-top:14px}
.spfs-notice{position:absolute;left:50%;bottom:48px;transform:translateX(-50%);z-index:30;max-width:min(90%,620px);padding:12px 18px;border-radius:8px;background:#20242B;color:#fff;font-size:14px;box-shadow:0 4px 20px #0002}
.spfs-notice:empty{display:none}
@media(max-width:1100px){.spf-header{--spf-header-space:12px}.spf-header .spfs-tool-save{display:none}.spf-header .spfs-back-label{max-width:180px}}
@media(max-width:760px){
 :is(.sp-forloeb-builder,.spfs) .spf-header{flex-wrap:wrap;--spf-header-height:48px;--spf-header-space:12px}
 .spf-header .spfb-header-inner{flex-wrap:wrap;gap:12px}
 .spf-header .spfb-header-copy{flex:1 1 100%;padding:0}
 .spf-header .spfs-topbar-left{flex:1 1 100%;min-height:48px}
 .spf-header .spfs-topbar-right{flex:1 1 100%;flex-wrap:wrap;border-top:1px solid var(--spf-header-line)}
 .spf-header .spfs-panel-title{font-size:14px;padding-left:10px}
 .spf-header .spfs-back-label{max-width:190px}
 .spf-header .spfb-header-actions{width:100%}
 .spf-header .spfb-header-actions>button{flex:1}
}
