/* The shared bar is the only header above the study workspace. */
:root{--guppi-header-height:49px;--product-header-height:64px;--site-header-height:var(--guppi-header-height)}
guppi-header{display:block;position:fixed;inset:0 0 auto;min-height:var(--guppi-header-height);z-index:60;--guppi-header-width:100%;box-shadow:0 2px 6px var(--region-shadow)}
guppi-header:not(:defined){background:#202625;color:#f5f7f6}
guppi-header>a{display:flex;align-items:center;min-height:var(--guppi-header-height);padding:0 32px;color:inherit;text-decoration:none}
.topbar{top:var(--guppi-header-height)}
.workspace{margin-top:var(--site-header-height)}
.site-layout .workspace{margin-top:calc(var(--guppi-header-height) + var(--product-header-height))}
.sidebar{top:var(--site-header-height);height:calc(100dvh - var(--site-header-height))}
@media(min-width:900px){
 .layout[data-scope=study],.layout.afternoon-layout{min-height:calc(100dvh - var(--site-header-height))}
 .workspace.afternoon-workspace-page{height:calc(100dvh - var(--site-header-height));min-height:0}
 .workspace.afternoon-workspace-page.af-spread-page{height:auto;min-height:calc(100dvh - var(--site-header-height))}
 .layout:has(.main[data-page=question]) .topbar,.layout:has(.main:is([data-page=full],[data-page=afternoon-quiz])) .topbar{height:var(--product-header-height);min-height:var(--product-header-height)}
 .layout:has(.main[data-page=question]) .workspace,.layout:has(.main:is([data-page=full],[data-page=afternoon-quiz])) .workspace{margin-top:var(--site-header-height);height:calc(100dvh - var(--site-header-height))}
}
@media print{guppi-header{display:none}.workspace{margin-top:0}}

/* Product identity, exam choice, and tools stay with the learning navigation. */
.sidebar-product{padding:12px 12px 16px;border-bottom:var(--region-border)}
.sidebar-product-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:36px;margin-bottom:12px}
.sidebar-product .header-home{font-size:12px;gap:7px;min-width:0}
.sidebar-product .header-home img{width:24px;height:24px}
.sidebar-product .header-home span{white-space:normal;line-height:1.5}
.sidebar-product .sidebar-toggle{width:32px;min-width:32px;min-height:36px;padding:7px}
.sidebar-exam-controls .header-exam-selector{display:block}
.sidebar-exam-controls .header-exam-selector>span{display:none}
.sidebar-exam-controls wa-select{display:block;width:100%;min-width:0}
.sidebar-exam-controls wa-select::part(combobox){font-size:12px;min-height:38px;padding-inline:8px}
.sidebar-exam-controls wa-select::part(listbox){min-width:360px;max-width:calc(100vw - 32px)}
.sidebar-exam-shortcut{display:none}
.sidebar-utilities{display:grid;gap:6px;margin-top:auto;padding:12px;border-top:var(--region-border)}
.sidebar-utilities>button{display:flex;align-items:center;gap:10px;min-height:38px;padding:8px 10px;border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:12px;text-align:left}
.sidebar-utilities>button:hover{background:var(--accent-soft);color:var(--ink)}
.sidebar-utilities svg,.sidebar-utilities kbd{width:18px;height:18px;flex:none}
.sidebar-utilities kbd{display:grid;place-items:center;border:1px solid var(--line);border-radius:4px;font-size:11px;line-height:1}
.sidebar .study-side-note{margin-top:0;border:0;padding:4px 20px 16px}
.sidebar-collapsed .sidebar-product{padding:10px 9px 12px}
.sidebar-collapsed .sidebar-product-heading{justify-content:center;margin:0}
.sidebar-collapsed .sidebar-product .header-home,.sidebar-collapsed .sidebar-exam-controls{display:none}
.sidebar-collapsed .sidebar-product .sidebar-toggle{width:44px;min-width:44px;min-height:40px}
.sidebar-collapsed .sidebar-exam-shortcut{display:flex;align-items:center;justify-content:center;width:44px;min-height:36px;margin-top:8px;padding:4px;border:1px solid var(--line);border-radius:6px;background:var(--surface);font-size:12px;font-weight:600}
.sidebar-collapsed .sidebar-utilities{padding:12px 9px}
.sidebar-collapsed .sidebar-utilities>button{width:44px;min-height:44px;justify-content:center;padding:10px}
.sidebar-collapsed .sidebar-utilities span{display:none}
.sidebar button:focus-visible,.sidebar .header-home:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
