/* The setup wizard and "Finish setting up" (js/app/setup.js), Look C. */
.setup-card{display:flex;flex-direction:column;gap:16px}
.welcome-card.setup-card{width:min(600px,100%)}
.setup-page .setup-card{margin:12px;padding:20px 20px 24px}
.setup-card h1,.setup-card .setup-h{margin:0;font-size:26px;line-height:1.2;font-weight:800}
.setup-card p{margin:0}
.setup-top{display:flex;align-items:center;gap:8px;margin:-8px -8px 0}
.setup-step{font-size:14px;font-weight:700;color:var(--hs-muted)}
.setup-dots{display:inline-flex;gap:6px;margin-left:auto;padding-right:8px}
.setup-dots i{width:8px;height:8px;border-radius:4px;background:var(--hs-border)}
.setup-dots i.past{background:var(--hs-primary)}
.setup-dots i.on{width:22px;background:var(--hs-primary)}
.setup-msg{min-height:0;margin:0}
.setup-msg:empty{display:none}
.setup-msg.err{color:var(--hs-danger);font-weight:600}
/* The Terms of Service checkbox, right above the button it unlocks (note 88). */
.setup-terms{display:flex;gap:10px;align-items:flex-start;margin:4px 0 0;font-size:15px;line-height:1.45;cursor:pointer}
.setup-terms input{width:22px;height:22px;margin:1px 0 0;flex:none;accent-color:var(--hs-primary)}
/* The two links are a finger's height to press on a phone; the padding doesn't move the lines. */
.setup-terms a{color:var(--hs-primary);padding:7px 0}
.setup-check{display:flex;gap:12px;align-items:flex-start;width:100%;min-height:48px;padding:12px 14px;border:1px solid var(--hs-border);border-radius:18px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.setup-check > span:last-child{display:flex;flex-direction:column;gap:4px;font-size:15px}
.setup-box{flex:none;width:24px;height:24px;margin-top:1px;border:2px solid var(--hs-control);border-radius:6px;display:inline-flex;align-items:center;justify-content:center;color:var(--hs-on-primary)}
.setup-check[aria-checked="true"] .setup-box{background:var(--hs-primary);border-color:var(--hs-primary)}
.setup-check:focus-visible{outline:2px solid var(--hs-primary);outline-offset:2px}
.setup-kids{display:flex;flex-direction:column;gap:12px}
.setup-kid{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:4px 12px;align-items:center}
.setup-kid .kb{align-self:end;margin-bottom:4px}
.setup-kid-fields{display:flex;gap:10px;min-width:0}
.setup-kid-fields .field:first-child{flex:1 1 auto;min-width:0}
.setup-year{flex:0 0 112px}
.setup-kid .icon-btn{align-self:end}
.setup-hint{grid-column:2 / -1}
.setup-add{align-self:flex-start}
.setup-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;position:sticky;bottom:0;z-index:2;background:var(--hs-surface);padding:10px 24px calc(6px + var(--hs-safe-b));margin:0 -24px -8px;border-top:1px solid var(--hs-border)}
.setup-page .setup-actions{padding-left:20px;padding-right:20px;margin-left:-20px;margin-right:-20px}
.done-acts{flex-direction:column;align-items:stretch;position:static;border-top:0}
.setup-groups{display:flex;flex-direction:column;gap:12px}
.setup-groups .group{box-shadow:none;border:1px solid var(--hs-border);border-top:4px solid var(--kc,transparent)}
.setup-row{min-height:56px}
.setup-pickers{display:flex;flex-direction:column;gap:10px;padding:4px 16px 16px}
/* A long course name wraps inside its chip instead of running past the card. */
.setup-pickers .wrap-flex .chip{max-width:100%;height:auto;min-height:36px;padding-top:6px;padding-bottom:6px;white-space:normal;text-align:left}
.setup-search{gap:8px}
.setup-search .select{width:auto;flex:none}
.setup-results{box-shadow:none;border:1px solid var(--hs-border)}
.setup-outline{margin:0;padding:10px 14px 10px 16px;max-height:220px;overflow-y:auto;border:1px solid var(--hs-border);border-radius:18px;list-style:none;display:flex;flex-direction:column;gap:4px;font-size:14px}
.setup-outline span{display:inline-block;min-width:36px;color:var(--hs-muted)}
/* The publisher's detail under a level's own rows (js/app/catalog.js, October 19, 2026): a view switch, lessons or
   sections nested under each chapter or unit, kinds as tags, and an "About" panel with the sources. */
.setup-views{align-self:flex-start;max-width:100%;flex-wrap:wrap}
.setup-outline .tag{height:18px;margin-left:4px;padding:0 6px;font-size:11px;vertical-align:1px}
.setup-outline.setup-detail{max-height:360px;gap:2px}
.setup-detail ol{margin:2px 0 8px 10px;padding:0 0 0 10px;list-style:none;display:flex;flex-direction:column;gap:3px;border-left:2px solid var(--hs-border)}
.setup-detail .sd-head b{font-weight:600}
/* A wrapped line starts under the text, not under the number. */
.setup-detail :is(.sd-head,.sd-row,.sd-sep,.sd-none){padding-left:40px;text-indent:-40px}
.setup-detail :is(span,.tag,.sd-meta){text-indent:0}
.setup-detail .sd-row.sub{padding-left:56px}
.setup-detail .sd-sep,.setup-detail .sd-none{color:var(--hs-muted)}
.setup-detail .sd-meta{font-style:normal;font-size:12px;color:var(--hs-muted)}
.setup-detail .sd-part{margin-top:6px;font-weight:700;font-size:13px}
.setup-about summary{cursor:pointer;font-size:var(--hs-small);font-weight:600;padding:4px 0;min-height:32px}
.setup-about[open] summary{margin-bottom:6px}
.setup-sources{margin:4px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.setup-gen{flex-wrap:wrap;gap:8px}
.setup-gen .input{width:110px}
.setup-course{display:flex;flex-direction:column;gap:10px;padding:12px 16px 16px;border-top:1px solid var(--hs-border)}
.setup-next{display:flex;flex-direction:column;gap:4px}
.setup-next .row-flex{gap:4px}
.setup-next .select{flex:1 1 auto;min-width:0}
.setup-len{gap:10px}
.setup-len .select{width:auto}
.setup-done{display:flex;gap:14px;align-items:flex-start}
.setup-done > .ms{color:var(--hs-success);flex:none}
.setup-done > span{display:flex;flex-direction:column;gap:4px}
.setup-week{box-shadow:none;border:1px solid var(--hs-border)}
.setup-day{align-items:flex-start;min-height:52px}
.setup-dow{width:56px;flex:none;display:flex;flex-direction:column;font-weight:700}
.setup-item{gap:8px;min-width:0;font-size:15px}
.setup-item .one{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.setup-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;color:var(--hs-muted);font-size:15px}
.setup-list li{display:flex;gap:10px;align-items:center}
.setup-card-today{margin:8px 12px}
.setup-card-today > .list-row:first-child .ms:first-child{color:var(--hs-gold)}
.setup-progress{margin:0 16px 4px}
.done-row .ms{color:var(--hs-success)}
.done-row .tx b{font-weight:500;color:var(--hs-muted)}
@media (max-width:420px){
  .setup-card h1,.setup-card .setup-h{font-size:23px}
  .setup-year{flex-basis:96px}
  .setup-search{flex-wrap:wrap}
  .setup-search .input{flex:1 1 100%}
}

/* The one-minute tour (js/app/tour.js) and Help's Getting started and Feature guide (js/app/screens/guide.js). */
/* An area's tour, offered the first few times it opens (tour.js tourNudge). */
.tour-nudge{display:flex;align-items:center;gap:10px;margin:8px 12px 0;padding:4px 4px 4px 14px;border-radius:16px;background:var(--hs-primary-soft);color:var(--hs-primary-on-soft);font-size:14px;line-height:1.35}
.tour-nudge a{display:inline-block;padding:7px 0;color:inherit;font-weight:700}
.tour-nudge > .ms{flex:none}
.tour-nudge .icon-btn{flex:none;width:40px;height:40px}
.tour-layer{position:fixed;inset:0;z-index:80}
.tour-layer.dim{background:var(--hs-scrim)}
.tour-hole{position:fixed;border-radius:16px;box-shadow:0 0 0 9999px var(--hs-scrim),0 0 0 3px var(--hs-primary);transition:left .18s ease,top .18s ease,width .18s ease,height .18s ease;pointer-events:none}
.tour-bubble{position:fixed;z-index:81;background:var(--hs-surface);color:var(--hs-text);border-radius:24px;box-shadow:var(--hs-shadow-raised);padding:6px 16px 14px;display:flex;flex-direction:column;gap:6px}
.tour-head{display:flex;align-items:center;justify-content:space-between;margin-right:-10px}
.tour-title{font-size:19px}
.tour-bubble p{margin:0;font-size:15px;line-height:1.45}
.tour-acts{display:flex;align-items:center;gap:8px;margin-top:6px}
.guide-page .section-h{padding-top:20px}
.tour-hero{margin:12px;padding:18px 18px 18px 16px;display:flex;gap:14px;align-items:flex-start}
.tour-hero > .ms{color:var(--hs-gold);flex:none}
.tour-hero-t{font-size:19px;margin:0;font-weight:700;line-height:1.3}
.tour-hero .wrap-flex{margin-top:8px}
.guide-part{padding:14px 16px 8px;display:flex;flex-direction:column;gap:6px}
.guide-part-h{display:flex;align-items:center;gap:10px;font-size:17px}
.guide-part-h .ms{color:var(--hs-primary)}
.guide-part-h h2{margin:0;font-size:17px;font-weight:700;line-height:1.3}
.guide-page .set-sec h2:focus-visible{outline:none}
.guide-part ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px;line-height:1.45}
.guide-part .btn{align-self:flex-start;padding:0 8px;margin-left:-8px}
.guide-tools{display:flex;flex-direction:column;gap:8px;padding:12px 12px 0}
/* Room for a chip's focus ring (3 px, 2 px out) inside the row, which scrolls on a phone, without moving the chips. */
.guide-tools .chips{padding:6px;margin:-6px}
.guide-lead{margin:0;padding:0 20px 8px}
.guide-list{list-style:none;margin:0;padding:0 12px;display:flex;flex-direction:column;gap:10px}
.guide-feature{padding:14px 16px;display:flex;flex-direction:column;gap:6px;line-height:1.45}
.guide-feature > b,.guide-feature .row-flex b{font-size:16px}
.guide-steps summary{cursor:pointer;color:var(--hs-primary);font-weight:600;min-height:40px;display:flex;align-items:center}
.guide-steps ol{margin:0 0 4px;padding-left:20px;display:flex;flex-direction:column;gap:4px}
.guide-open{align-self:flex-start;height:40px}
.guide-ask{margin:20px 12px 0;padding:16px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
