/* Direction C, how ready you are. Layout only, tokens only. */
.wc-col{max-width:760px;margin:0}
.wc-col a:focus-visible,.wc-col .btn:focus-visible{outline:3px solid var(--color-accent-text);outline-offset:2px}

.wc-switch{background:var(--color-bg);margin:0 0 var(--s-5);padding:0}
.wc-switch p{margin:0 0 var(--s-2);font-size:var(--t-base);color:var(--color-muted)}
.wc-switch-links{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.wc-switch .btn-sm{min-height:40px;display:inline-flex;align-items:center}

.wc-h1{margin:0 0 var(--s-2);font-size:var(--t-2xl);font-weight:700;line-height:1.15;color:var(--color-ink)}
.wc-course{margin:0 0 var(--s-5);font-size:var(--t-base);line-height:1.5;color:var(--color-body)}

.wc-band{background:var(--color-card);border-radius:var(--radius);padding:var(--s-5)}
.wc-h1b{margin:0 0 var(--s-4);font-size:var(--t-xl);font-weight:700;line-height:1.2;color:var(--color-ink)}
.wc-h2{margin:var(--s-6) 0 var(--s-3);font-size:var(--t-lg);font-weight:700;line-height:1.25;color:var(--color-ink)}
.wc-h3{margin:var(--s-4) 0 var(--s-2);font-size:var(--t-base);font-weight:600;line-height:1.3;color:var(--color-ink)}
.wc-sec-block p{margin:0 0 var(--s-3);line-height:1.5;color:var(--color-body)}
.wc-lead{margin:var(--s-4) 0 var(--s-2);font-size:var(--t-base);font-weight:600;color:var(--color-ink)}

/* the section-split bar */
.wc-sections{list-style:none;margin:0 0 var(--s-4);padding:0;display:flex;gap:var(--s-2);align-items:flex-start}
.wc-sec{flex:1 1 4.5rem;min-width:0;display:grid;grid-template-areas:"bar" "name" "count";gap:var(--s-2)}
.wc-w2{flex-grow:2}.wc-w6{flex-grow:6}.wc-w8{flex-grow:8}.wc-w5{flex-grow:5}.wc-w3{flex-grow:3}
.wc-sec .progress{grid-area:bar;height:12px}
.wc-sec .progress i{height:100%}
.wc-sec .wc-name{grid-area:name;font-size:var(--t-sm);font-weight:600;line-height:1.3;color:var(--color-ink);overflow-wrap:anywhere}
.wc-sec .wc-count{grid-area:count;font-size:var(--t-sm);line-height:1.3;color:var(--color-muted)}
.progress i.p0{width:0}.progress i.p17{width:16.67%}.progress i.p20{width:20%}.progress i.p100{width:100%}

.wc-toc{margin:0 0 var(--s-4);max-width:28rem}
.wc-toc a{font-size:var(--t-base);min-height:44px;align-items:center}
.wc-act{margin:var(--s-4) 0 0;display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-5);align-items:center}
.wc-link{display:inline-flex;align-items:center;min-height:44px;color:var(--color-accent-text);font-weight:600}
.app-who-mail{display:block}
.wc-meta{margin:var(--s-4) 0 0;font-size:var(--t-base);line-height:1.5;color:var(--color-muted);max-width:60ch}
.wc-meta a{color:var(--color-accent-text)}

.wc-repeat,.wc-past{margin:0 0 var(--s-3);padding-left:1.2rem;line-height:1.6;color:var(--color-body)}
.wc-flights{margin:0;padding:0;list-style:none;display:grid;gap:var(--s-3);color:var(--color-body);line-height:1.5}
.wc-flights b{color:var(--color-ink);font-weight:600}

.wc-people{list-style:none;margin:0 0 var(--s-3);padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3) var(--s-4)}
.wc-people li{display:flex;align-items:center;gap:var(--s-3);color:var(--color-ink);font-weight:600}
.wc-people .app-avatar{flex:0 0 auto;width:40px;height:40px;grid-row:auto}

/* course list: calm the shared month row and rows */
.course-list{box-shadow:none}
.course-list .mo{font-size:var(--t-sm);font-weight:600;letter-spacing:0;text-transform:none}
.crow .what h3{margin:0;font-size:var(--t-base);font-weight:700;color:var(--color-ink)}
.wc-state{flex:0 0 auto;font-size:var(--t-sm);color:var(--color-body)}
.crow{flex-wrap:wrap}
.crow .what{flex:1 1 12rem}
.crow.mine .wc-state{font-weight:600;color:var(--color-ink)}
.app-content > .hook,.wc-col > .hook{margin:var(--s-7) 0 0}

@media (max-width:720px){
  .wc-band{padding:var(--s-4)}
  .wc-sections{flex-direction:column;gap:var(--s-3)}
  .wc-sec{flex:none;width:100%;grid-template-areas:"name bar count";grid-template-columns:8.5rem minmax(0,1fr) 3.6rem;align-items:center;gap:var(--s-3)}
  .wc-sec .wc-count{text-align:right}
  .wc-people{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wc-act .btn-primary{width:100%;text-align:center}
}
@media (prefers-reduced-motion:reduce){.wc-col *{transition:none}}