:root{--cream:#faf7f0;--cream-dark:#f2ecdf;--white:#fff;--burgundy:#5a1a2a;--burgundy-dark:#42121f;--gold:#c9a227;--gold-light:#e6d49b;--text:#332b29;--muted:#756b67;--border:#e3d9c8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--text);font:16px/1.6 Arial,Helvetica,sans-serif}a{text-decoration:none;color:inherit}.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);border-bottom:1px solid var(--border)}.header-inner{display:flex;align-items:center;gap:30px;max-width:1200px;margin:auto;padding:16px 30px}.brand{display:flex;align-items:center;gap:14px;color:var(--burgundy);flex-shrink:0}.brand-logo{width:52px;height:52px;object-fit:contain}.brand-name,.brand-subtitle{display:block}.brand-name{font:25px Georgia,"Times New Roman",serif;letter-spacing:.3px}.brand-subtitle{color:var(--gold);font-size:11px;letter-spacing:1.5px;text-transform:uppercase}.navigation{display:flex;align-items:center;gap:25px;margin-left:auto}.navigation a{font-size:14px;transition:.2s}.navigation a:hover{color:var(--burgundy)}.user-area{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:13px;line-height:1.35}.user-name{color:var(--burgundy);font-weight:600;white-space:nowrap}.user-email{color:var(--muted);white-space:nowrap}.signout{padding:3px 10px;border:1px solid var(--burgundy);border-radius:3px;background:var(--burgundy);color:#fff;font-size:12px;font-weight:600;line-height:1.25;transition:.2s}.signout:hover{background:var(--burgundy-dark)}.signin{color:var(--burgundy);font-weight:600}.menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--border);border-radius:4px;background:#fff;color:var(--burgundy);cursor:pointer;font-size:24px}.mobile-menu{display:none}.container{max-width:1150px;margin:auto;padding:0 30px}.dashboard-summary{display:flex;align-items:center;justify-content:space-between;gap:24px;max-width:1150px;margin:auto;padding:17px 30px;border-bottom:1px solid var(--border)}.welcome{text-align:left}.kicker{color:var(--gold);font-size:11px;font-weight:bold;letter-spacing:3px;text-transform:uppercase}.welcome .kicker{font-size:9px;letter-spacing:2px}.welcome h2{margin:2px 0;color:var(--burgundy);font:25px Georgia,"Times New Roman",serif}.welcome p{margin:0;color:var(--muted);font-size:14px}.session{width:max-content;margin-left:auto;padding:7px 16px;border:1px solid var(--border);border-radius:30px;background:#fff;color:var(--muted);font-size:13px;white-space:nowrap}.session-dot{display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:#4b9148}.hero{padding:95px 20px 80px;text-align:center;background:radial-gradient(circle at 50% 20%,rgba(201,162,39,.08),transparent 35%),var(--cream);border-bottom:1px solid var(--border)}.hero h1{margin:0 0 20px;color:var(--burgundy);font:68px/1.1 Georgia,"Times New Roman",serif}.hero p{max-width:680px;margin:auto;color:var(--muted);font:20px/1.8 Georgia,"Times New Roman",serif}.content{min-height:55vh;padding:36px 0 80px}.login-box{max-width:620px;margin:auto;padding:50px 45px;text-align:center;background:#fff;border:1px solid var(--border);border-top:3px solid var(--gold);border-radius:4px;box-shadow:0 8px 30px rgba(60,40,20,.06)}.login-box h2{margin:0 0 15px;color:var(--burgundy);font:32px Georgia,"Times New Roman",serif}.login-box p{max-width:470px;margin:0 auto 25px;color:var(--muted);font-size:16px}.microsoft-button{display:inline-flex;align-items:center;gap:12px;padding:13px 25px;border-radius:3px;background:var(--burgundy);color:#fff;font-size:15px;transition:.2s}.microsoft-button:hover{background:var(--burgundy-dark);transform:translateY(-1px)}.microsoft-icon{display:grid;grid-template:9px 9px/9px 9px;gap:2px}.microsoft-icon span{width:9px;height:9px}.microsoft-icon span:nth-child(1){background:#f25022}.microsoft-icon span:nth-child(2){background:#7fba00}.microsoft-icon span:nth-child(3){background:#00a4ef}.microsoft-icon span:nth-child(4){background:#ffb900}.courses{display:grid;grid-template-columns:minmax(280px,340px);justify-content:start}.course{position:relative;min-height:250px;padding:32px;background:#fff;border:1px solid var(--border);border-radius:4px;box-shadow:0 6px 22px rgba(60,40,20,.04)}.course:before{position:absolute;top:0;left:0;width:100%;height:3px;background:var(--gold-light);content:""}.course-number{margin-bottom:12px;color:var(--gold);font:34px Georgia,"Times New Roman",serif}.course h2{margin:0 0 12px;color:var(--burgundy);font:23px Georgia,"Times New Roman",serif}.course p{color:var(--muted);font-size:15px;line-height:1.7}.course-link{display:inline-block;margin-top:10px;color:var(--burgundy);font-size:14px;font-weight:bold}.site-footer{padding:45px 25px;background:var(--burgundy);color:var(--cream);text-align:center}.footer-brand{margin-bottom:8px;color:#fff;font:25px Georgia,"Times New Roman",serif}.footer-text{color:var(--gold-light);font-size:13px}.back-to-top{position:fixed;right:24px;bottom:24px;z-index:50;width:44px;height:44px;border:1px solid var(--gold);border-radius:50%;background:#fff;color:var(--burgundy);cursor:pointer;font-size:20px;box-shadow:0 4px 15px rgba(0,0,0,.12)}.back-to-top:hover{background:var(--gold)}@media(max-width:760px){.header-inner{padding:12px 20px}.desktop-navigation,.desktop-user{display:none}.menu-toggle{display:block}.brand-logo{width:44px;height:44px}.brand-name{font-size:21px}.brand-subtitle{font-size:9px;letter-spacing:1.2px}.mobile-menu{position:absolute;top:100%;right:0;left:0;padding:18px 20px;background:#fff;border-bottom:1px solid var(--border);box-shadow:0 8px 20px rgba(60,40,20,.08)}.mobile-menu.active{display:block}.mobile-user{padding:4px 0 16px;margin-bottom:8px;border-bottom:1px solid var(--border)}.mobile-user-name{color:var(--burgundy);font-size:15px;font-weight:600}.mobile-user-email{color:var(--muted);font-size:13px;word-break:break-word}.mobile-navigation{display:flex;flex-direction:column}.mobile-navigation a{padding:12px 4px;border-bottom:1px solid var(--cream-dark);font-size:15px}.mobile-navigation a:last-child{border-bottom:0}.mobile-signout{color:var(--burgundy);font-weight:600}.dashboard-summary{align-items:flex-start;flex-direction:column;padding:16px 20px}.session{margin-left:0}.hero{padding:70px 20px 60px}.hero h1{font-size:52px}.courses{justify-content:center}.container{padding:0 20px}.back-to-top{right:18px;bottom:18px}}@media(max-width:600px){.hero h1{font-size:44px}.hero p{font-size:17px}.login-box{padding:38px 25px}.content{padding:48px 0 80px}.session{max-width:100%;white-space:normal;text-align:center}}

/* Code references: contained textbox with local scrolling. */
pre {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    max-height: 32rem;
    margin: 16px 0;
    padding: 16px 18px;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--white);
    color: var(--text);
    font: 13px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    tab-size: 4;
}
pre code { font: inherit; color: inherit; white-space: inherit; overflow-wrap: inherit; }
details { min-width: 0; max-width: 100%; }
/* Allow narrow containers and long labels to fit. */
.container, .dashboard-summary, .welcome { min-width: 0; }
@media (max-width: 760px) {
    .header-inner { gap: 12px; }
    .brand { min-width: 0; flex-shrink: 1; }
    .brand > span, .brand > div { min-width: 0; }
    .brand-name, .brand-subtitle { overflow-wrap: anywhere; }
    .menu-toggle { flex-shrink: 0; margin-left: auto; }
    .courses { grid-template-columns: minmax(0, 340px); }
    .course { min-width: 0; }
    .container h1, .container h2, .container h3 { overflow-wrap: anywhere; }
    .microsoft-button { max-width: 100%; }
    .microsoft-icon { flex-shrink: 0; }
    pre { padding: 12px; font-size: 12px; max-height: 24rem; }
}

/* Draw the mobile icon without depending on a font or character encoding. */
.menu-toggle { position: relative; font-size: 0; overflow: hidden; }
.menu-toggle::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 13px;
    width: 20px;
    height: 2px;
    background: currentColor;
    box-shadow: 0 6px 0 currentColor, 0 12px 0 currentColor;
}
.menu-toggle:focus-visible { outline: 2px solid var(--burgundy); outline-offset: 3px; }

/* Shared header: keep desktop and mobile navigation mutually exclusive. */
@media (max-width: 760px) {
    .site-header > .header-inner {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 12px 20px;
    }
    .site-header > .header-inner > .navigation,
    .site-header > .header-inner > .user-area {
        display: none;
    }
    .site-header > .header-inner > .brand { flex: 1 1 auto; min-width: 0; }
    .site-header > .header-inner > .menu-toggle {
        display: block;
        flex: 0 0 42px;
        width: 42px;
        height: 42px;
        margin-left: auto;
    }
    .site-header > .mobile-menu { display: none; }
    .site-header > .mobile-menu.active {
        display: block;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        max-height: calc(100dvh - 90px);
        overflow-y: auto;
    }
}
@media (min-width: 761px) {
    .site-header > .mobile-menu,
    .site-header > .header-inner > .menu-toggle { display: none; }
}
