.app-header{padding:0 40px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:28px;background:var(--canvas);z-index:20}.app-brand{font-size:1.5625rem;letter-spacing:-0.044em;font-weight:650;color:var(--ink)}.header-actions{display:flex;gap:18px;align-items:center;margin-left:auto}.header-actions{min-width:0}.profile-name{max-width:24ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-actions button,.profile-name{background:none;border:0;font-size:var(--text-control);padding:8px 0;min-height:44px;display:flex;align-items:center}.header-actions .logout{color:var(--muted)}.main-scroll{overflow:auto;min-width:0;min-height:0;scrollbar-width:thin;scrollbar-color:var(--line) transparent;overscroll-behavior:contain}.home-content{width:min(var(--content-width),calc(100% - 80px));margin:0 auto;padding:56px 0 48px}.home-welcome>div{min-width:0}.home-welcome{display:flex;justify-content:space-between;gap:24px;align-items:center;min-height:154px;margin-bottom:48px}.home-welcome h1{font-size:var(--text-title);line-height:1.22;letter-spacing:-0.02813em;font-weight:550;margin-top:12px;overflow-wrap:anywhere}.home-welcome p{font-size:var(--text-body);line-height:1.6;color:var(--muted);margin-top:13px}.companion-home{border:0;background:none;display:flex;align-items:center;min-width:136px;padding:8px;border-radius:14px}.companion-art{width:112px;height:108px;display:block;overflow:hidden;position:relative}.companion-art .monomer{position:absolute;left:32px;top:31px;transform:scale(2.12);transform-origin:center}.course-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.course-heading h2{font-size:var(--text-subtitle);letter-spacing:-0.01176em;font-weight:550}.course-heading span{font-size:var(--text-label);color:var(--muted)}.type-list{display:grid;gap:12px}.type-item{border:1px solid var(--line);border-radius:var(--surface-radius);background:var(--paper);overflow:hidden}.type-toggle{background:none;border:0;width:100%;display:grid;grid-template-columns:2.5rem minmax(0,1fr) 22px;gap:1rem;align-items:center;text-align:left;padding:20px 24px;min-height:84px}.type-number{font-size:1.6875rem;font-weight:450;color:var(--muted);letter-spacing:-0.03704em;line-height:1}.type-name{font-size:var(--text-subtitle);line-height:1.5;font-weight:600;max-width:570px;overflow-wrap:anywhere}.type-toggle[aria-expanded=true] .chevron{transform:rotate(180deg)}.type-toggle[aria-expanded=true] .type-number{color:var(--blue)}.type-details{padding:0 1.5rem 1.5rem 5rem;overflow:hidden}.type-progress{display:flex;align-items:center;gap:13px;margin:2px 0 23px}.type-progress .ring-svg{width:40px;height:40px}.type-progress .ring-track,.type-progress .ring-fill{stroke-width:2}.type-progress strong{display:block;font-size:var(--text-control);font-weight:550;font-variant-numeric:tabular-nums}.type-progress small{display:block;font-size:var(--text-label);color:var(--muted);margin-top:2px}.type-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.type-actions button{display:flex;align-items:center;justify-content:center;min-height:48px;padding:12px 19px;font-size:var(--text-control);border-radius:7px;border:1px solid var(--line);background:transparent}.type-actions button.primary{background:var(--blue);border-color:var(--blue);color:white}.saved-session{display:flex;align-items:center;gap:7px;font-size:var(--text-label);color:var(--muted);margin-top:13px;line-height:1.5}.saved-session i{width:5px;height:5px;background:var(--blue);border-radius:50%;flex:none}.home-footnote{color:var(--muted);font-size:var(--text-label);line-height:1.6;margin-top:24px;max-width:550px}
@media(max-width:600px){.app-header{padding:0 16px;gap:16px}.app-brand{font-size:1.375rem}.header-actions{gap:15px}.header-actions{min-width:0}.profile-name{max-width:24ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-actions button,.profile-name{font-size:var(--text-control)}.profile-name{max-width:104px;overflow:hidden;text-overflow:ellipsis;display:block;white-space:nowrap;padding-top:12px}.header-actions .logout{font-size:var(--text-control)}.home-content{width:calc(100% - 36px);padding:29px 0 30px}.home-welcome{min-height:131px;margin-bottom:30px;gap:8px;align-items:center}.home-welcome h1{font-size:1.75rem;line-height:1.23;letter-spacing:-0.02692em;margin-top:9px}.home-welcome p{font-size:var(--text-body);margin-top:10px;max-width:220px}.companion-home{min-width:82px;max-width:90px;padding:0;gap:2px;font-size:var(--text-label)}.companion-art{width:84px;height:88px}.companion-art .monomer{left:19px;top:25px;transform:scale(1.65)}.course-heading{margin-bottom:9px}.course-heading h2{font-size:var(--text-subtitle)}.course-heading span{font-size:var(--text-label)}.type-toggle{grid-template-columns:2rem minmax(0,1fr) 18px;gap:.75rem;min-height:86px;padding:16px}.type-number{font-size:1.5rem}.type-name{font-size:var(--text-subtitle);line-height:1.5}.type-details{padding:0 1rem 1rem 3.75rem}.type-progress{gap:10px;margin:0 0 18px}.type-progress .ring-svg{width:34px;height:34px}.type-progress strong{font-size:var(--text-control)}.type-progress small{font-size:var(--text-label)}.type-actions{gap:7px;align-items:stretch}.type-actions button{font-size:var(--text-control);padding:10px 12px}.type-actions button.primary{flex:1}.saved-session{font-size:var(--text-label);margin-top:11px}.home-footnote{font-size:var(--text-label);margin-top:20px}}

@media(min-width:601px) and (max-width:1000px){#app[data-screen=home] .app-header{padding:0 24px}#app[data-screen=home] .home-content{width:calc(100% - 40px);padding-top:35px}#app[data-screen=home] .home-welcome{gap:10px}#app[data-screen=home] .home-welcome h1{font-size:1.6875rem}#app[data-screen=home] .companion-home{min-width:105px}#app[data-screen=home] .type-details{padding-left:0}#app[data-screen=home] .type-actions{flex-wrap:wrap}}
.award-notes{margin:0 0 6px}.award-note{padding:14px 18px;margin:0 0 18px;background:var(--blue-pale);border-radius:9px;font-size:var(--text-control)}.award-note strong{display:block;font-weight:550;margin-bottom:3px}.award-note p{margin:0}.award-note button{border:0;background:none;float:right;width:44px;min-height:44px;font-size:1.25rem;line-height:1}
.type-item{container-type:inline-size}
.type-toggle:focus-visible{outline-offset:-4px}
.type-actions button{min-width:0;max-width:100%;overflow-wrap:anywhere}
/* Keep controls readable when large text leaves no room for decorative indentation. */
@container(max-width:22rem){.type-details{padding-left:1rem;padding-right:1rem}.type-actions{align-items:stretch}.type-actions button{flex:1 1 100%}}

/* A named destination with the same restrained button treatment as the shell. */
.header-actions .profile-name{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;max-width:none;white-space:normal;padding:.625rem .75rem;min-height:44px;border:1px solid var(--line);border-radius:.75rem;background:var(--paper);font-size:var(--text-control);line-height:1.4}
.profile-icon{width:1.125rem;height:1.125rem;flex:none}
@media(hover:hover){.header-actions .profile-name:hover{background:var(--blue-pale);border-color:var(--blue)}}