/* No, Pero Why? home page (ia-audit 2.8, DECISIONS 8).
   Loaded on every page; every rule is scoped to the home sections (.hm-*). Same house look as release.css: navy outlines, offset blue, yellow and pink shadows,
   filled brand panels, sticker icons, Clash Display. Calmer by giving each home section its own full-width band. */

:root{
  --hm-ink:#142b46; --hm-blue:#124dec; --hm-gold:#ffdc52; --hm-pink:#c2185b;
  --hm-sky:#eaf1ff; --hm-sun:#fff4cf; --hm-rose:#ffe9f1; --hm-night:#142b46;
  --hm-line:2.5px solid var(--hm-ink);
  --hm-pad:clamp(48px,6vw,88px);
}

/* The footer invite repeats the Start button and the Duda sticker; the home page already has both. */
body[data-page="."] .npw-invite{display:none!important}

/* ---------- Bands: full canvas width, content on the page grid ---------- */
#main > .hm-band{margin:0!important;padding:var(--hm-pad) 0!important;border:0!important;border-radius:0!important;box-shadow:none!important}
#main > .hm-band--sky{background:var(--hm-sky)}
#main > .hm-band--sun{background:var(--hm-sun)}
#main > .hm-band--rose{background:var(--hm-rose)}
#main > .hm-band--night{background:var(--hm-night);color:#fff}
#main > .hm-band > .wrap{margin:0 auto!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
#main > .hm-band + .hm-band{border-top:0!important}

/* ---------- 1. Hero: the crew film in one even frame ---------- */
#main#main .hm-welcome{max-width:1240px;margin:clamp(16px,2.4vw,28px) auto 0!important;padding:0 clamp(16px,3vw,40px) clamp(40px,5vw,64px)!important;box-sizing:border-box;
  border:0!important;border-radius:0!important;overflow:visible!important;background:none!important;box-shadow:none!important}
#main#main .hm-welcome .welcome-film{margin:0 8px 8px 0!important;padding:0!important;aspect-ratio:auto!important;border-radius:0!important;overflow:visible!important}
/* white sticker edge, navy ring, one even gold offset */
#main#main .hm-welcome .mission-stage{border:6px solid #fff!important;border-radius:32px!important;box-shadow:0 0 0 2.5px var(--hm-ink),8px 8px 0 2.5px var(--hm-gold)!important;overflow:hidden}
/* overlays share one inset: bars on top, then the crew pill and the pink badge on one line */
#main .hm-welcome .mission-picture{--hx:20px;--hy:14px;--hh:34px}
#main .hm-welcome .mission-picture::after{height:96px}
#main .hm-welcome .gz-story-bar{top:var(--hy)!important;left:var(--hx)!important;right:var(--hx)!important;gap:6px!important}
#main .hm-welcome .gz-story-head,#main .hm-welcome .mission-picture > .gz-sticker{top:calc(var(--hy) + 16px)!important;height:var(--hh);box-sizing:border-box;margin:0!important;display:inline-flex!important;align-items:center}
#main .hm-welcome .gz-story-head{left:var(--hx)!important;padding:0 14px 0 4px!important;gap:8px!important;font-size:.85rem!important;line-height:1!important;border:2px solid var(--hm-ink)!important;box-shadow:3px 3px 0 var(--hm-gold)!important}
#main .hm-welcome .gz-story-head .gz-stack img{width:24px!important;height:24px!important}
/* the pill names the crew only; the current take's title is already in the tab strip below */
#main .hm-welcome .gz-story-head .gz-story-title{display:none!important}
#main .hm-welcome .mission-picture > .gz-sticker{right:var(--hx)!important;left:auto!important;padding:0 14px!important;font-size:.85rem!important;line-height:1!important;border:2px solid #fff!important;border-radius:99px!important;
  box-shadow:0 0 0 2px var(--hm-ink),3px 3px 0 2px var(--hm-ink)!important;--r:0deg;transform:none!important;animation:none!important}

/* the hook: the heading beside Mateo's message, a group-chat card that fits its column */
#main#main .hm-intro{display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(20px,4vw,64px);align-items:center;margin:clamp(40px,5vw,64px) 0 0!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
#main#main .hm-welcome h1{margin:0!important;font-size:clamp(2.6rem,5.6vw,4.6rem)!important;line-height:1!important;color:var(--hm-ink)!important;max-width:none}
#main#main .hm-welcome h1 em{display:inline-block;font-style:normal;color:var(--hm-blue)!important;background:none!important;box-shadow:none!important;padding:0!important;white-space:nowrap!important}
#main#main .hm-welcome h1 em::before,#main#main .hm-welcome h1 em::after{content:none!important}

/* Mateo's message: white card, navy outline, pink offset, the chat's name strip on top (added by genz.js) */
#main#main .hm-welcome .welcome-conversation{display:flex!important;flex-direction:column;align-items:stretch;gap:0;width:100%;max-width:500px;justify-self:end;margin:0 8px 8px 0!important;padding:0!important;overflow:hidden!important;
  background:#fff!important;border:var(--hm-line)!important;border-radius:28px 28px 28px 8px!important;box-shadow:8px 8px 0 var(--hm-pink)!important;box-sizing:border-box}
#main#main .hm-welcome .gz-chat-head{display:flex!important;align-items:center;gap:10px;margin:0!important;padding:12px 20px!important;background:var(--hm-rose)!important;border-bottom:var(--hm-line)!important}
#main#main .hm-welcome .gz-chat-head .gz-stack img{width:28px;height:28px}
#main#main .hm-welcome .gz-chat-head strong{font:700 1rem/1.2 var(--r-display)!important;color:var(--hm-ink)!important}
#main#main .hm-welcome .gz-chat-head small{font-size:.85rem!important;color:var(--hm-ink)!important}
#main#main .hm-welcome .gz-thread{display:grid!important;grid-template-columns:auto minmax(0,1fr);align-items:end;gap:12px 10px;margin:0!important;padding:20px 20px 0!important;background:none!important;border:0!important}
#main#main .hm-welcome .gz-row{display:grid!important;grid-column:1/-1;grid-template-columns:auto minmax(0,1fr);align-items:end;gap:10px}
#main#main .hm-welcome .gz-row.gz-mine{grid-template-columns:minmax(0,1fr);justify-items:end}
#main#main .hm-welcome .gz-bubble-face img{width:40px;height:40px;border:2px solid var(--hm-ink);border-radius:50%;background:#fff;display:block}
/* the message bubble (without scripts it sits straight in the card) */
#main#main .hm-welcome .conversation-copy{display:block!important;margin:0!important;padding:12px 16px!important;max-width:none!important;min-width:0;
  background:var(--hm-sky)!important;border:2px solid var(--hm-ink)!important;border-radius:22px 22px 22px 6px!important;box-shadow:none!important}
#main#main .hm-welcome .welcome-conversation > .conversation-copy{margin:20px 20px 0!important}
#main#main .hm-welcome .conversation-copy strong{display:block;font:700 1.05rem/1.2 var(--r-display)!important;color:var(--hm-blue)!important;margin:0 0 4px!important}
#main#main .hm-welcome .conversation-copy p{margin:0!important;font-size:1.08rem!important;line-height:1.5;color:var(--hm-ink)!important;max-width:none}
#main#main .hm-welcome .gz-out{margin:0!important;padding:10px 16px!important;max-width:85%;background:var(--hm-blue)!important;color:#fff!important;border:2px solid var(--hm-ink)!important;border-radius:22px 22px 6px 22px!important;font-weight:650}
#main#main .hm-welcome .gz-typing .conversation-copy{min-width:76px;max-width:76px!important;min-height:44px}
/* the reply: a gold pill at the bottom right of the chat */
#main#main .hm-welcome :is(#welcome-question,#welcome-case){align-self:flex-end;flex:0 0 auto;max-width:calc(100% - 40px);box-sizing:border-box;min-height:48px;margin:18px 20px 20px!important;padding:10px 22px!important;white-space:normal!important;text-align:left;
  background:var(--hm-gold)!important;color:var(--hm-ink)!important;border:var(--hm-line)!important;border-radius:999px!important;box-shadow:4px 4px 0 var(--hm-ink)!important;font:750 1rem/1.2 var(--r-body)!important;cursor:pointer;text-decoration:none!important;display:inline-flex!important;align-items:center}
#main#main .hm-welcome #welcome-case[hidden],#main#main .hm-welcome #welcome-question[hidden]{display:none!important}
#main#main .hm-welcome :is(#welcome-question,#welcome-case):hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--hm-ink)!important}

/* ---------- Shared: section heads, lists, the display face ---------- */
#main#main .hm-band :is(ol,ul){list-style:none;margin:0;padding:0}
#main#main .hm-band li{margin:0;max-width:none}
#main#main .hm-band li::before,#main#main .hm-band li::marker{content:none}
#main#main .hm-band h2{margin:0!important;font-size:clamp(2rem,3.6vw,3rem)!important;line-height:1.05!important;color:var(--hm-ink)!important;max-width:none}
#main#main .hm-band--night h2{color:#fff!important}
#main#main .hm-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:8px 24px;margin:0 0 clamp(24px,3vw,36px)}
#main#main .hm-head p{margin:10px 0 0!important;font-size:1.12rem;max-width:40em;color:var(--hm-ink)}
#main#main .hm-band .text-link{margin:0!important;font-size:1.05rem;font-weight:700;color:var(--hm-ink)!important;text-decoration-thickness:2px}

/* ---------- 2. The premise and the nine faces (sun band) ---------- */
#main#main .hm-premise{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center}
#main#main .hm-premise-copy p{margin:18px 0 0!important;font-size:clamp(1.08rem,1.3vw,1.22rem);line-height:1.6;max-width:34em;color:var(--hm-ink)}
#main#main .hm-premise-copy p em{color:inherit;font-style:italic}
#main#main .hm-premise-copy .text-link{display:inline-flex;margin-top:22px!important}
#main#main .hm-faces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,22px) clamp(10px,1.4vw,20px);justify-items:center}
#main#main .hm-faces a{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none!important;color:var(--hm-ink)!important}
#main#main .hm-faces img{width:clamp(76px,8vw,116px);height:auto;aspect-ratio:1;object-fit:cover;border-radius:50%;background:#fff;border:2.5px solid var(--hm-ink);box-shadow:4px 4px 0 var(--hm-face,var(--hm-blue));transition:transform .15s,box-shadow .15s}
#main#main .hm-faces li:nth-child(3n+2){--hm-face:var(--hm-gold)}
#main#main .hm-faces li:nth-child(3n){--hm-face:var(--hm-pink)}
#main#main .hm-faces a:hover img{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--hm-face,var(--hm-blue))}
#main#main .hm-faces span{font-weight:700;font-size:1rem}

/* ---------- 3. How a lesson works (white band) ---------- */
#main#main .hm-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,28px);counter-reset:none}
#main#main .hm-step{position:relative;display:flex;flex-direction:column;padding:24px 24px 26px;background:#fff;border:var(--hm-line);border-radius:24px;box-shadow:6px 6px 0 var(--hm-shadow,var(--hm-blue))}
#main#main .hm-step:nth-child(2){--hm-shadow:var(--hm-gold)}
#main#main .hm-step:nth-child(3){--hm-shadow:var(--hm-pink)}
#main#main .hm-step-no{position:absolute;top:20px;right:22px;font:700 2.2rem/1 var(--display)!important;color:var(--hm-ink)}
#main#main .hm-step .npw-icon{width:56px;height:56px}
#main#main .hm-step h3{margin:18px 0 0!important;font-size:1.4rem!important;line-height:1.15;color:var(--hm-ink)!important}
#main#main .hm-step p{margin:8px 0 0!important;font-size:1.02rem;line-height:1.55;color:var(--hm-ink);max-width:none}

/* ---------- 4. Your path: Unit 1 open, then Units 2 to 5 as a strip (sky band) ---------- */
#main#main .hm-unit--open{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2fr);gap:clamp(20px,3vw,40px);align-items:start;margin:0 8px 0 0;padding:clamp(22px,3vw,36px);
  background:var(--hm-blue);color:#fff;border:var(--hm-line);border-radius:28px;box-shadow:8px 8px 0 var(--hm-ink)}
#main#main .hm-unit-no{display:inline-flex;align-items:center;gap:6px;margin:0!important;padding:5px 14px;background:var(--hm-gold);color:var(--hm-ink);border:2px solid var(--hm-ink);border-radius:999px;font:750 .95rem/1.2 var(--body)!important}
#main#main .hm-unit--open h3{margin:14px 0 0!important;font-size:clamp(1.7rem,2.6vw,2.3rem)!important;line-height:1.08;color:#fff!important}
#main#main .hm-unit-q{margin:12px 0 0!important;font-size:1.1rem;line-height:1.5;color:#fff;max-width:none}
#main#main .hm-unit--open .hm-unit-meta{margin:14px 0 0!important;font-weight:700;color:#fff}
#main#main .hm-unit-go{display:inline-flex;margin-top:18px;padding:10px 20px;background:#fff;color:var(--hm-ink)!important;border:var(--hm-line);border-radius:999px;box-shadow:4px 4px 0 var(--hm-gold);font-weight:750;text-decoration:none!important}
#main#main .hm-lesson-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
#main#main .hm-lesson-list a{display:flex;align-items:center;gap:14px;height:100%;box-sizing:border-box;padding:14px 16px;background:#fff;color:var(--hm-ink)!important;border:2px solid var(--hm-ink);border-radius:20px;text-decoration:none!important;transition:transform .12s,box-shadow .12s}
#main#main .hm-lesson-list a:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--hm-gold)}
#main#main .hm-lesson-list img{flex:none;width:56px;height:56px;border-radius:50%;border:2px solid var(--hm-ink);background:var(--hm-sky)}
#main#main .hm-lesson-list span{display:flex;flex-direction:column;gap:2px;min-width:0}
#main#main .hm-lesson-list small{font-size:.85rem;font-weight:750;color:var(--hm-blue)}
#main#main .hm-lesson-list b{font:650 1.08rem/1.25 var(--display)!important;color:var(--hm-ink)}
#main#main .hm-lesson-list em{font-size:.92rem;font-style:normal;color:var(--hm-ink);font-weight:500}
#main#main .hm-units{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,24px);margin:clamp(22px,2.6vw,32px) 8px 0 0!important}
#main#main .hm-units .hm-unit{display:flex;flex-direction:column;padding:18px 20px 20px;background:#fff;border:var(--hm-line);border-radius:22px;box-shadow:5px 5px 0 var(--hm-shadow,var(--hm-pink))}
#main#main .hm-units .hm-unit:nth-child(2){--hm-shadow:var(--hm-gold)}
#main#main .hm-units .hm-unit:nth-child(3){--hm-shadow:var(--hm-blue)}
#main#main .hm-units .hm-unit:nth-child(4){--hm-shadow:var(--hm-pink)}
#main#main .hm-units .hm-unit-no{align-self:flex-start;background:var(--hm-sky)}
#main#main .hm-units h3{margin:12px 0 0!important;font-size:1.25rem!important;line-height:1.15;color:var(--hm-ink)!important}
#main#main .hm-units h3 a{color:inherit!important}
#main#main .hm-band :is(h2,h3,b,small,em){overflow-wrap:normal;word-break:normal;hyphens:manual}
#main#main .hm-units .hm-unit-meta{margin:auto 0 0!important;padding-top:10px;font-size:.95rem;color:var(--hm-ink);max-width:none}

/* ---------- 5. Who's here? (white band) ---------- */
#main#main .hm-who{text-align:center}
#main#main .hm-picks{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(14px,2vw,24px);margin:clamp(24px,3vw,36px) 8px 0 0!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
#main#main a.hm-pick{position:relative;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:148px;margin:0!important;padding:22px 14px!important;box-sizing:border-box;
  background:#fff!important;color:var(--hm-ink)!important;border:var(--hm-line)!important;border-radius:24px!important;box-shadow:6px 6px 0 var(--hm-shadow,var(--hm-blue))!important;text-decoration:none!important;transition:transform .12s,box-shadow .12s}
#main#main a.hm-pick:nth-child(3n+2){--hm-shadow:var(--hm-gold)}
#main#main a.hm-pick:nth-child(3n){--hm-shadow:var(--hm-pink)}
#main#main a.hm-pick:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--hm-shadow,var(--hm-blue))!important}
#main#main a.hm-pick .npw-icon{width:54px;height:54px}
#main#main a.hm-pick b{font:650 clamp(1.1rem,1.5vw,1.35rem)/1.15 var(--display)!important;letter-spacing:-.01em}
#main#main a.hm-pick.is-picked{background:var(--hm-sky)!important}
#main#main a.hm-pick.is-picked::after{content:"";position:absolute;top:12px;right:12px;width:26px;height:26px;border-radius:50%;border:2px solid var(--hm-ink);
  background:var(--hm-gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23142b46' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/16px no-repeat}

/* ---------- 6. True, false or needs context? (night band) ---------- */
#main#main .hm-claim{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,72px);align-items:start}
#main#main .hm-claim-intro{padding-top:clamp(0px,2vw,24px)}
#main#main .hm-claim-duda{width:clamp(96px,10vw,140px);height:auto;margin:0 0 14px;transform:rotate(-6deg)}
#main#main .hm-claim-intro p{margin:14px 0 0!important;font-size:1.12rem;line-height:1.55;color:#fff!important;max-width:30em}
#main#main .hm-claim-card{margin:0 8px 8px 0;padding:clamp(22px,3vw,34px);background:#fff;color:var(--hm-ink);border:3px solid #fff;border-radius:28px;box-shadow:0 0 0 2.5px var(--hm-ink),8px 8px 0 2.5px var(--hm-gold)}
#main#main .hm-claim-label{display:inline-block;margin:0!important;padding:4px 12px;background:var(--hm-rose);border:2px solid var(--hm-ink);border-radius:999px;font-weight:750;font-size:.9rem;color:var(--hm-ink)}
#main#main .hm-claim-card h3{margin:14px 0 0!important;font-size:clamp(1.5rem,2.4vw,2rem)!important;line-height:1.15;color:var(--hm-ink)!important}
#main#main .hm-claim-sides{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
#main#main .hm-claim-sides button{min-height:48px;padding:10px 22px;background:#fff;color:var(--hm-ink);border:var(--hm-line);border-radius:999px;box-shadow:4px 4px 0 var(--hm-ink);font:750 1.02rem/1.2 var(--body)!important;cursor:pointer;transition:transform .12s,box-shadow .12s,background .12s}
#main#main .hm-claim-sides button:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--hm-ink)}
#main#main .hm-claim-sides button[aria-pressed=true]{background:var(--hm-blue);color:#fff;box-shadow:4px 4px 0 var(--hm-gold)}
#main#main .hm-claim-reveal{margin-top:22px;padding-top:20px;border-top:2px solid var(--hm-ink)}
#main#main .hm-claim-you{margin:0 0 14px!important;font-weight:750;color:var(--hm-ink)}
#main#main .hm-reply{display:flex;align-items:flex-start;gap:12px;margin:0 0 14px!important;max-width:none}
#main#main .hm-reply img{flex:none;width:48px;height:48px;border-radius:50%;border:2px solid var(--hm-ink);background:var(--hm-sky)}
#main#main .hm-reply > span{display:block;padding:10px 16px;background:var(--hm-sky);border:2px solid var(--hm-ink);border-radius:6px 20px 20px 20px;line-height:1.5;color:var(--hm-ink)}
#main#main .hm-reply b{display:block;margin-bottom:2px}
#main#main .hm-reply b em{font-style:normal;font-weight:600;color:var(--hm-blue);margin-left:6px}
#main#main .hm-claim-reveal .text-link{margin-top:6px!important}
/* the sticker notice from genz.js: text and close on one line */
#main#main .hm-claim-card .gz-earned{flex-wrap:nowrap;width:100%;box-sizing:border-box}
#main#main .hm-claim-card .gz-earned span{flex:1 1 auto;min-width:0}

/* ---------- 7. Educators and families (rose band) ---------- */
#main#main .hm-doors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,3vw,36px)}
#main#main a.hm-door{display:flex!important;align-items:flex-start;gap:clamp(16px,2vw,24px);margin:0 8px 8px 0!important;padding:clamp(22px,3vw,32px)!important;background:#fff!important;color:var(--hm-ink)!important;border:var(--hm-line)!important;border-radius:26px!important;
  box-shadow:7px 7px 0 var(--hm-shadow,var(--hm-blue))!important;text-decoration:none!important;transition:transform .12s,box-shadow .12s}
#main#main a.hm-door--families{--hm-shadow:var(--hm-pink)}
#main#main a.hm-door:hover{transform:translate(-2px,-2px);box-shadow:9px 9px 0 var(--hm-shadow,var(--hm-blue))!important}
#main#main a.hm-door .npw-icon{flex:none;width:64px;height:64px}
#main#main a.hm-door > span{display:flex;flex-direction:column;gap:6px}
#main#main a.hm-door b{font:650 clamp(1.5rem,2.2vw,1.9rem)/1.1 var(--display)!important;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
#main#main a.hm-door > span > span{font-size:1.05rem;line-height:1.5}

/* ---------- Home at smaller widths ---------- */
@media (max-width:1100px){
  #main#main .hm-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  #main#main .hm-unit--open{grid-template-columns:1fr}
}
@media (max-width:1000px){
  #main#main .hm-units{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  #main#main .hm-intro,#main#main .hm-premise,#main#main .hm-claim{grid-template-columns:1fr}
  #main#main .hm-welcome .welcome-conversation{justify-self:start;max-width:560px}
  #main#main .hm-faces{grid-template-columns:repeat(9,minmax(0,1fr));gap:10px 6px}
  #main#main .hm-faces img{width:100%;max-width:84px}
  #main#main .hm-faces span{font-size:.9rem}
  #main#main .hm-picks{grid-template-columns:repeat(6,minmax(0,1fr))}
  #main#main a.hm-pick{grid-column:span 2}
  #main#main a.hm-pick:nth-child(n+4){grid-column:span 3}
}
@media (max-width:640px){
  #main#main .hm-welcome{padding:0 12px 36px!important}
  #main#main .hm-welcome .welcome-film{margin:0 6px 6px 0!important}
  #main#main .hm-welcome .mission-stage{border-width:4px!important;border-radius:22px!important;box-shadow:0 0 0 2px var(--hm-ink),6px 6px 0 2px var(--hm-gold)!important}
  #main .hm-welcome .mission-picture{--hx:12px;--hy:10px;--hh:28px}
  #main .hm-welcome .gz-story-head,#main .hm-welcome .mission-picture > .gz-sticker{top:calc(var(--hy) + 12px)!important;font-size:.72rem!important}
  #main .hm-welcome .gz-story-head{padding:0 10px 0 3px!important;gap:6px!important}
  #main .hm-welcome .gz-story-head .gz-stack img{width:20px!important;height:20px!important}
  #main .hm-welcome .mission-picture > .gz-sticker{padding:0 10px!important}
  #main#main .hm-welcome .welcome-conversation{margin-right:6px!important;margin-bottom:6px!important;box-shadow:6px 6px 0 var(--hm-pink)!important}
  #main#main .hm-welcome .gz-chat-head{padding:10px 16px!important}
  #main#main .hm-welcome .gz-thread{padding:16px 16px 0!important}
  #main#main .hm-welcome .welcome-conversation > .conversation-copy{margin:16px 16px 0!important}
  #main#main .hm-welcome :is(#welcome-question,#welcome-case){margin:16px!important;max-width:calc(100% - 32px)}
  #main#main .hm-welcome h1{font-size:clamp(2.4rem,11vw,3rem)!important}
  #main#main .hm-band h2{font-size:clamp(1.8rem,8vw,2.2rem)!important}
  #main#main .hm-faces{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 10px}
  #main#main .hm-faces img{width:84px}
  #main#main .hm-steps{grid-template-columns:1fr;gap:18px}
  #main#main .hm-step{padding:20px 20px 22px}
  #main#main .hm-unit--open{margin-right:6px;padding:20px;box-shadow:6px 6px 0 var(--hm-ink)}
  #main#main .hm-lesson-list{grid-template-columns:1fr;gap:10px}
  #main#main .hm-lesson-list a{padding:12px 14px}
  #main#main .hm-lesson-list img{width:48px;height:48px}
  #main#main .hm-units{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-right:6px!important}
  #main#main .hm-units .hm-unit{padding:14px 14px 16px}
  #main#main .hm-units h3{font-size:1.1rem!important}
  #main#main .hm-units .hm-unit-meta{font-size:.88rem}
  #main#main .hm-picks{gap:12px;margin-right:6px!important}
  #main#main .hm-picks{grid-template-columns:repeat(2,minmax(0,1fr))}
  #main#main a.hm-pick,#main#main a.hm-pick:nth-child(n+4){grid-column:auto}
  #main#main a.hm-pick:last-child{grid-column:1/-1}
  #main#main a.hm-pick{min-height:112px;padding:16px 12px!important;gap:8px;box-shadow:4px 4px 0 var(--hm-shadow,var(--hm-blue))!important}
  #main#main a.hm-pick .npw-icon{width:42px;height:42px}
  #main#main a.hm-pick b{font-size:clamp(1rem,4.2vw,1.12rem)!important;white-space:nowrap}
  #main#main .hm-claim-card{margin-right:6px;box-shadow:0 0 0 2px var(--hm-ink),6px 6px 0 2px var(--hm-gold)}
  #main#main .hm-claim-sides button{flex:1 1 auto;padding:10px 16px}
  #main#main .hm-doors{grid-template-columns:1fr}
  #main#main a.hm-door{margin-right:6px!important;align-items:flex-start;box-shadow:6px 6px 0 var(--hm-shadow,var(--hm-blue))!important}
  #main#main a.hm-door .npw-icon{width:52px;height:52px}
}