:root{font-family:system-ui,-apple-system,sans-serif;color:#363034;background:#FFFFFF;font-size:17px;--accent:#574C3F;--focus:#363034;--sand:#B9A5A4;--surface:#ECE4DA;--paper:#FFFFFF}*{box-sizing:border-box}body{margin:0}header{padding:24px 5vw;border-bottom:1px solid #B9A5A4;display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{color:#363034;font-weight:700;letter-spacing:.12em;text-decoration:none;font-size:15px}.brand span{display:block;font-family:Georgia,serif;letter-spacing:0;font-size:19px;font-weight:400}main{max-width:1100px;margin:0 auto;padding:36px 24px 65px}h1,h2{font-family:Georgia,serif;font-weight:400}h1{font-size:clamp(2rem,5vw,3.5rem);margin:10px 0 20px;line-height:1.08}h2{font-size:1.8rem;margin:8px 0 16px}h3{margin:14px 0 8px}p{line-height:1.65;margin:10px 0 18px}small,.muted{color:#574C3F;font-size:.9rem}.eyebrow{color:#574C3F;letter-spacing:.1em;text-transform:uppercase;font-size:.85rem;font-weight:700}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,265px),1fr));gap:18px}.card{background:#ECE4DA;border:1px solid #B9A5A4;border-radius:12px;padding:24px}.card.active{border-top:5px solid var(--accent)}.card.planned{background:transparent}.card p{font-size:1rem}.row{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.spread{justify-content:space-between}.narrow{max-width:600px;margin:20px auto}.lesson{max-width:760px}.step{padding:24px 0;border-bottom:1px solid #B9A5A4}.step strong{color:var(--accent)}button,.button{display:inline-block;border:1px solid var(--accent);border-radius:7px;background:transparent;color:var(--accent);padding:12px 18px;cursor:pointer;font:inherit;text-decoration:none;line-height:1.3}button.secondary,.button.secondary{background:transparent;color:var(--accent)}button:disabled{opacity:.55;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--focus);outline-offset:3px}label{display:block;margin:15px 0 7px;font-weight:600}input{width:100%;padding:12px;border:1px solid #574C3F;border-radius:6px;font:inherit}input[type=checkbox]{width:auto}form{margin:16px 0}.error{color:#363034;font-weight:600}.feedback{padding:18px 0;font-size:1.15rem;line-height:1.5}.choice{display:block;width:100%;text-align:left;margin:12px 0;background:transparent;color:var(--accent)}.tap{width:100%;min-height:180px;font-size:2rem;background:transparent;margin:20px 0}.meter{width:100%;height:125px;background:#FFFFFF;border:1px solid #B9A5A4;border-radius:6px}.badge{display:inline-block;font-size:.85rem;color:#574C3F;background:#ECE4DA;border-radius:4px;padding:4px 8px}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.95rem}td,th{text-align:left;padding:13px;border-bottom:1px solid #B9A5A4}footer{text-align:center;color:#574C3F;padding:24px;border-top:1px solid #B9A5A4}ul{line-height:1.7;padding-left:22px}hr{border:0;border-top:1px solid #B9A5A4;margin:30px 0}#account{font-size:.9rem}#account button{padding:8px 12px}a{color:var(--accent)}.sample{padding:22px;background:#ECE4DA;border:1px solid #B9A5A4;border-radius:10px}.dots{font-size:2rem;color:var(--accent);letter-spacing:12px}iframe{max-width:100%;border:0}@media(max-width:650px){header{padding:18px}.brand{font-size:12px}main{padding:25px 18px}#account span{display:none}.card{padding:19px}h1{font-size:2.4rem}}

input{background:var(--paper);color:#363034}button:disabled{opacity:.55;background:transparent;color:#574C3F;border-color:var(--sand)}::selection{background:#B9A5A4;color:#363034}

/* Keep course controls comfortable on narrow touch screens. */
button,.button{min-height:44px;touch-action:manipulation}input{min-height:44px;min-width:0}header>*{min-width:0}.row>*{max-width:100%}.card{min-width:0;overflow-wrap:anywhere}.tap{user-select:none;-webkit-user-select:none;touch-action:manipulation}@media(max-width:450px){.row>button,.row>.button{flex:1 1 140px}header{gap:12px}.narrow{margin-top:10px}.feedback{font-size:1rem}}

textarea{display:block;width:100%;max-width:100%;padding:12px;border:1px solid #574C3F;border-radius:6px;font:inherit;color:#363034;background:#FFFFFF;resize:vertical;margin-bottom:14px}textarea:focus-visible{outline:3px solid var(--focus);outline-offset:3px}

#verifycode{font-size:1.75rem;letter-spacing:.25em;font-weight:700;}

select{width:100%;min-height:44px;padding:12px;border:1px solid #574C3F;border-radius:6px;font:inherit;color:#363034;background:#FFFFFF;margin-bottom:14px;}

/* The same clear feedback on every enabled action, including outlined choices. */
button,.button{transition:background-color 140ms ease,color 140ms ease,border-color 140ms ease}
@media(hover:hover){button:enabled:hover,.button:hover{background:#363034;color:var(--paper);border-color:#363034}}
button:enabled:active,.button:active{background:var(--accent);color:var(--paper);border-color:var(--accent)}
a:not(.button):hover{color:#363034;text-decoration:underline;text-underline-offset:3px}
@media(prefers-reduced-motion:reduce){button,.button{transition:none}}

/* Author button display rules must never reveal hidden progression controls. */
[hidden]{display:none!important}

/* Mode selectors remain neutral, with a clear selected outline. */
#leadermode[aria-pressed="true"],#individualmode[aria-pressed="true"]{font-weight:700;border-width:2px}
#lessonpath:focus{outline:none}

#account{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px}
@media(max-width:600px){header{align-items:flex-start}#account{max-width:65%}#account span{width:100%;text-align:right}}

/* Invitation accents use the approved palette; course overview colors stay unchanged. */
#leaderonboarding .card,#individualonboarding .card{background:#ECE4DA;border-color:#B9A5A4;color:#363034}

/* Explicit user-approved exception: preserve the course overview background and card accents. */
html.course-overview{background:#F6F3EC;--paper:#F6F3EC}
html.course-overview .card{background:#ECE4DA;border-color:#B9A590}
html.course-overview .card.active{border-top-color:#574C3F}
html.course-overview .card.planned{background:transparent}

.progress-navigation{margin-bottom:28px}#homepracticeoverview{margin:28px 0}#guidedoverview:empty{display:none}#exportmine{margin:8px 0 20px}