/* The shared top bar, the learner panel and text size. Loaded last, so it wins over every world's own header. */
:root{--mw-green:#196b5c;--mw-green-dark:#12574a;--mw-ink:#173e40;--mw-paper:#fffef9;--mw-line:#d0ded5;--mw-soft:#e7efe3}
.mw-header{display:flex;align-items:center;gap:16px 28px;flex-wrap:wrap;padding:14px max(20px,calc((100% - 1160px)/2));background:var(--mw-paper);border-bottom:1px solid var(--mw-line);font-family:'DM Sans',system-ui,sans-serif;color:var(--mw-ink)}
.mw-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--mw-ink)!important;font-family:'Space Grotesk','DM Sans',sans-serif;font-weight:700;font-size:22px;letter-spacing:-.02em}
.mw-brand b{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:var(--mw-green);color:#fff;font-size:22px;line-height:1;box-shadow:3px 3px 0 #e2c078}
.mw-nav{display:flex;gap:6px 22px;flex-wrap:wrap;margin-left:auto}
.mw-nav a{padding:10px 2px;font-weight:700;font-size:15px;color:var(--mw-ink)!important;text-decoration:none;border-bottom:3px solid transparent}
.mw-nav a:hover{border-bottom-color:#b9d3c6}
.mw-nav a[aria-current="page"]{color:var(--mw-green)!important;border-bottom-color:var(--mw-green)}
.mw-me{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:4px 14px 4px 4px;border:1px solid var(--mw-line);border-radius:999px;background:#fff;color:var(--mw-ink);font:700 14px 'DM Sans',sans-serif;cursor:pointer}
.mw-me:hover{background:var(--mw-soft)}
.mw-me-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#f3d27f;color:var(--mw-ink);font-size:16px}
.mw-header a:focus-visible,.mw-me:focus-visible{outline:3px solid #2d59d7;outline-offset:3px}
@media(max-width:620px){
 .mw-header{padding:10px 14px;gap:6px 12px}
 .mw-brand{font-size:19px}.mw-brand b{width:32px;height:32px;font-size:19px}
 .mw-nav{order:3;width:100%;margin:0;justify-content:space-between;gap:4px}
 .mw-nav a{font-size:15px;padding:8px 2px}
 .mw-me{margin-left:auto;padding-right:10px}
 .mw-me-name{max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media print{.mw-header{display:none}}

/* Learner panel */
.lp-dialog{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);border:0;border-radius:20px;padding:0;background:var(--mw-paper);color:var(--mw-ink);font:16px/1.55 'DM Sans',system-ui,sans-serif;box-shadow:0 18px 60px #0c2b2a40}
.lp-dialog::backdrop{background:#10302e80}
.lp-close-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px 0;margin:0}
.lp-close-row h2{margin:0;font:700 24px 'Space Grotesk','DM Sans',sans-serif}
.lp-close{width:44px;height:44px;border-radius:50%;border:1px solid var(--mw-line);background:#fff;font-size:18px;cursor:pointer;color:var(--mw-ink)}
.lp-status{min-height:1.2em;margin:6px 22px 0;font-weight:700;color:var(--mw-green)}
.lp-section{padding:14px 22px 18px;border-top:1px solid var(--mw-line)}
.lp-section:first-of-type{border-top:0}
.lp-section h3{margin:0 0 8px;font-size:17px}
.lp-small{margin:6px 0;font-size:14px;color:#46615f}
.lp-tip{margin:10px 0;padding:10px 12px;border-radius:12px;background:#fdf0cc;font-size:14px}
.lp-field{display:grid;gap:6px;font-weight:700;font-size:14px;margin:6px 0}
.lp-field input{font:inherit;font-size:17px;padding:10px 12px;border:2px solid #9bbcae;border-radius:10px;background:#fff;color:var(--mw-ink)}
.lp-learners,.lp-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.lp-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 16px;border:2px solid var(--mw-green);border-radius:999px;background:#fff;color:var(--mw-green)!important;font:700 15px 'DM Sans',sans-serif;text-decoration:none;cursor:pointer}
.lp-button:hover{background:var(--mw-soft)}
.lp-primary{background:var(--mw-green);color:#fff!important}.lp-primary:hover{background:var(--mw-green-dark)}
.lp-danger{border-color:#a8452f;color:#a8452f!important;margin:4px 8px 4px 0}
.lp-file{position:relative}
.lp-more{margin-top:10px}.lp-more summary{cursor:pointer;font-weight:700;font-size:14px;padding:6px 0}
.lp-choices{display:flex;flex-wrap:wrap;gap:10px}
.lp-choices label{display:flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--mw-line);border-radius:12px;background:#fff;cursor:pointer;min-height:44px}
.lp-choices label:has(:checked){border:2px solid var(--mw-green);background:var(--mw-soft)}
.lp-size-normal{font-size:15px}.lp-size-large{font-size:18px}.lp-size-largest{font-size:21px}
.lp-check{display:flex;gap:10px;align-items:flex-start;font-size:15px;cursor:pointer}.lp-check input{width:22px;height:22px;flex-shrink:0;accent-color:var(--mw-green)}
.lp-dialog :focus-visible{outline:3px solid #2d59d7;outline-offset:2px}
.lp-toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:50;max-width:calc(100vw - 32px);margin:0;padding:12px 18px;border-radius:14px;background:var(--mw-ink);color:#fff;font:700 15px 'DM Sans',sans-serif;box-shadow:0 8px 30px #0003}

/* Text size. Most of the app is sized in pixels, so the whole page is scaled rather than the root font. */
html[data-text-size="large"] #app{zoom:1.15}
html[data-text-size="largest"] #app{zoom:1.3}