:root{
  --pengu-navy:#123c73;
  --pengu-blue:#22599c;
  --pengu-teal:#078084;
  --pengu-ink:#132238;
  --pengu-muted:#65758b;
  --pengu-yellow:#f5df12;
}

html.pengu-lock,body.pengu-lock{overflow:hidden!important;overscroll-behavior:none}

.pengu-onboarding{
  position:fixed;inset:0;z-index:2147483600;display:grid;
  min-height:100dvh;padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));
  background:
    radial-gradient(circle at 12% 12%,rgba(245,223,18,.2),transparent 27%),
    radial-gradient(circle at 88% 82%,rgba(31,181,173,.18),transparent 30%),
    linear-gradient(145deg,#0e315f 0%,#1e5496 54%,#087e83 130%);
  color:#fff;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s ease,visibility .28s ease;
}
.pengu-onboarding.is-open{opacity:1;visibility:visible;pointer-events:auto}
.pengu-onboarding::before,.pengu-onboarding::after{content:"";position:absolute;border:1px solid rgba(255,255,255,.13);border-radius:50%;pointer-events:none}
.pengu-onboarding::before{width:38vw;height:38vw;max-width:560px;max-height:560px;left:-13vw;bottom:-20vw}
.pengu-onboarding::after{width:24vw;height:24vw;max-width:350px;max-height:350px;right:-8vw;top:-10vw}

.pengu-onboarding-shell{position:relative;width:min(1180px,100%);height:min(760px,calc(100dvh - 36px));margin:auto;display:grid;grid-template-columns:minmax(300px,.9fr) minmax(420px,1.1fr);overflow:hidden;border:1px solid rgba(255,255,255,.26);border-radius:32px;background:rgba(255,255,255,.97);box-shadow:0 30px 90px rgba(3,20,44,.38);color:var(--pengu-ink)}
.pengu-visual{position:relative;display:grid;place-items:center;overflow:hidden;padding:40px;background:linear-gradient(155deg,#153f78 0%,#2461a7 65%,#087d83 120%)}
.pengu-visual::before{content:"";position:absolute;width:min(430px,80%);aspect-ratio:1;border-radius:50%;background:rgba(245,223,18,.95);box-shadow:0 0 0 28px rgba(255,255,255,.08),0 0 0 58px rgba(255,255,255,.04)}
.pengu-visual img{position:relative;z-index:1;width:min(390px,82%);height:auto;filter:drop-shadow(0 24px 24px rgba(3,20,44,.28));animation:penguFloat 4.2s ease-in-out infinite}
.pengu-visual-copy{position:absolute;z-index:2;left:30px;right:30px;bottom:26px;text-align:center;color:#fff}
.pengu-visual-copy b{display:block;font-size:clamp(1.25rem,2vw,1.7rem)}
.pengu-visual-copy span{display:block;margin-top:5px;color:#d9f4f1;font-size:.9rem}

.pengu-stage{min-width:0;display:grid;grid-template-rows:auto 1fr auto;padding:26px clamp(26px,4vw,58px) 30px;background:linear-gradient(180deg,#fff,#f8fbff)}
.pengu-stage-top{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-height:44px}
.pengu-back-button{display:none;align-items:center;gap:6px;min-height:44px;margin-right:auto;padding:8px 11px;border:0;border-radius:12px;background:#edf4f8;color:var(--pengu-navy);font:inherit;font-size:.82rem;font-weight:900;cursor:pointer}.pengu-back-button.is-visible{display:inline-flex}.pengu-back-button:hover,.pengu-back-button:focus-visible{background:#dfecef;outline:0}
.pengu-text-button,.pengu-icon-button{border:0;background:transparent;color:#607087;font:inherit;font-weight:800;cursor:pointer}
.pengu-text-button{min-height:44px;padding:8px 12px;border-radius:12px}.pengu-text-button:hover,.pengu-text-button:focus-visible{background:#edf4f8;color:var(--pengu-navy)}
.pengu-icon-button{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#eef3f7;font-size:1.25rem}.pengu-icon-button:hover,.pengu-icon-button:focus-visible{background:#dfeaf0;color:var(--pengu-navy)}
.pengu-stage-body{display:grid;align-content:center;min-height:0;padding:18px 0;overflow-y:auto;overscroll-behavior:contain}
.pengu-eyebrow{margin:0 0 10px;color:var(--pengu-teal);font-size:.78rem;font-weight:950;letter-spacing:.13em;text-transform:uppercase}
.pengu-stage h1{max-width:100%;margin:0;color:#12233a;font-size:clamp(2rem,4vw,3.25rem);line-height:1.08;letter-spacing:-.04em;overflow-wrap:normal;word-break:normal}
.pengu-stage h1 span{display:block;margin-top:8px;color:#315f99;font-size:.5em;letter-spacing:-.02em}
.pengu-intro{max-width:610px;margin:18px 0 25px;color:var(--pengu-muted);font-size:clamp(.96rem,1.5vw,1.08rem);line-height:1.55}
.pengu-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.pengu-onboarding[data-screen="student-home"] .pengu-choice-grid,.pengu-onboarding[data-screen="practice-choices"] .pengu-choice-grid,.pengu-onboarding[data-screen="student-account"] .pengu-choice-grid,.pengu-onboarding[data-screen="student-login-conflict"] .pengu-choice-grid{grid-template-columns:1fr;max-width:650px}
.pengu-choice{display:grid;grid-template-columns:54px minmax(0,1fr) 26px;align-items:center;gap:13px;min-height:92px;padding:16px;border:1px solid #dbe5ec;border-radius:20px;background:#fff;color:var(--pengu-ink);text-align:left;font:inherit;box-shadow:0 8px 24px rgba(18,60,115,.07);cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.pengu-choice:hover,.pengu-choice:focus-visible{transform:translateY(-2px);border-color:#78b9bd;box-shadow:0 13px 30px rgba(18,60,115,.13);outline:0}
.pengu-choice-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:17px;background:#e8f6f4;font-size:1.55rem}.pengu-choice.is-teacher .pengu-choice-icon{background:#eaf0fb}
.pengu-choice-copy{min-width:0}.pengu-choice-copy b,.pengu-choice-copy span{display:block;overflow-wrap:normal;word-break:normal}.pengu-choice-copy b{font-size:1rem;line-height:1.28}.pengu-choice-copy span{margin-top:4px;color:#78879a;font-size:.8rem;font-weight:750;line-height:1.32}.pengu-choice>i{color:#8ba0b2;font-size:1.25rem}
.pengu-choice.is-primary{border-color:#79bfc0;background:linear-gradient(145deg,#f4fffd,#fff)}.pengu-choice.is-primary .pengu-choice-icon{background:linear-gradient(145deg,#078084,#0a9c98);color:#fff}.pengu-choice.is-account{grid-column:1/-1;min-height:72px;background:#f8fafc;box-shadow:none}.pengu-choice-note{grid-column:1/-1;margin:-2px 2px 2px;color:#7a899b;font-size:.75rem;line-height:1.4}
.pengu-program-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.pengu-program-option{display:grid;grid-template-columns:42px minmax(0,1fr) 22px;align-items:center;gap:10px;min-height:66px;padding:11px;border:1px solid #dce6ed;border-radius:16px;background:#fff;color:#17283d;text-align:left;font:inherit;font-weight:900;cursor:pointer;box-shadow:0 7px 18px rgba(18,60,115,.06)}.pengu-program-option:hover,.pengu-program-option:focus-visible{border-color:#78b9bd;background:#f4fbfa;outline:0}.pengu-program-option>span:first-child{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#edf4fb;color:#235b99}.pengu-program-option small{display:block;margin-top:3px;color:#7a899b;font-size:.66rem}.pengu-program-option>i{color:#91a3b4}.pengu-selected-program{display:inline-flex;align-items:center;gap:7px;width:max-content;max-width:100%;margin:0 0 14px;padding:8px 11px;border-radius:999px;background:#e9f7f5;color:#087377;font-size:.76rem;font-weight:900}
.pengu-teacher-promo{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:18px 0 14px;padding:16px 18px;border-radius:19px;background:linear-gradient(135deg,#263fce,#7130dc);color:#fff;box-shadow:0 12px 28px rgba(65,54,190,.2)}.pengu-teacher-promo div{min-width:0}.pengu-teacher-promo b,.pengu-teacher-promo span{display:block}.pengu-teacher-promo b{font-size:1.02rem}.pengu-teacher-promo span{margin-top:5px;font-size:.8rem;line-height:1.4;opacity:.88}.pengu-teacher-promo button{flex:none;padding:10px 13px;border:0;border-radius:12px;background:#fff;color:#3f35bc;font:inherit;font-size:.78rem;font-weight:950;cursor:pointer}.pengu-teacher-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.pengu-teacher-choice{display:grid;grid-template-columns:42px minmax(0,1fr) 20px;align-items:center;gap:10px;min-height:68px;padding:11px 12px;border:1px solid #dce6ed;border-radius:16px;background:#fff;color:#17283d;text-align:left;font:inherit;cursor:pointer;box-shadow:0 7px 18px rgba(18,60,115,.06)}.pengu-teacher-choice:hover,.pengu-teacher-choice:focus-visible{border-color:#667eea;background:#f7f8ff;outline:0}.pengu-teacher-choice>i:first-child{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#eef1ff;color:#4857ce;font-size:1.2rem}.pengu-teacher-choice b,.pengu-teacher-choice small{display:block}.pengu-teacher-choice b{font-size:.86rem;line-height:1.25}.pengu-teacher-choice small{margin-top:3px;color:#7a899b;font-size:.68rem;line-height:1.25}.pengu-teacher-choice>i:last-child{color:#91a3b4}.pengu-teacher-choice:last-child{grid-column:1/-1}
.pengu-free-account{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px 18px;margin:16px 0 10px;padding:15px 17px;border:1px solid #b9e2dc;border-radius:19px;background:linear-gradient(145deg,#effcf9,#fff);box-shadow:0 9px 24px rgba(7,128,132,.08)}.pengu-free-account-copy b,.pengu-free-account-copy span{display:block}.pengu-free-account-copy b{color:#075f63;font-size:1rem}.pengu-free-account-copy span{margin-top:3px;color:#648080;font-size:.72rem;font-weight:800}.pengu-free-account ul{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:0;padding:0;list-style:none}.pengu-free-account li{display:flex;align-items:flex-start;gap:6px;color:#36565b;font-size:.72rem;font-weight:800;line-height:1.35}.pengu-free-account li i{flex:none;color:#079285;font-size:.95rem}.pengu-free-account>button{grid-column:2;grid-row:1;padding:9px 12px;border:0;border-radius:11px;background:#078084;color:#fff;font:inherit;font-size:.75rem;font-weight:950;cursor:pointer}.pengu-free-account>button:hover,.pengu-free-account>button:focus-visible{background:#056d70;outline:3px solid rgba(7,128,132,.18)}
.pengu-stage-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:16px;border-top:1px solid #e7edf2;color:#8190a3;font-size:.78rem}
.pengu-stage-foot span{display:flex;align-items:center;gap:7px}.pengu-stage-foot i{color:var(--pengu-teal)}

.pengu-launcher{position:fixed;z-index:1180;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));display:grid;place-items:center;width:66px;height:66px;padding:5px;border:2px solid rgba(255,255,255,.95);border-radius:22px;background:linear-gradient(145deg,#f7e91a,#eacb05);box-shadow:0 14px 34px rgba(12,48,86,.28);cursor:grab;touch-action:none;user-select:none;transition:left .2s ease,top .2s ease,transform .18s ease,opacity .18s ease,visibility .18s ease;-webkit-tap-highlight-color:transparent}
.pengu-launcher:hover,.pengu-launcher:focus-visible{transform:translateY(-3px) rotate(-2deg);outline:3px solid rgba(7,128,132,.23);outline-offset:3px}.pengu-launcher img{width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none}.pengu-launcher.is-hidden{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(14px)}
.pengu-launcher.is-dragging{cursor:grabbing;transition:none;transform:scale(1.06);outline:3px solid rgba(255,255,255,.7);outline-offset:2px}
.pengu-launcher::after{content:"";position:absolute;right:5px;top:5px;width:11px;height:11px;border:2px solid #fff;border-radius:50%;background:#11b981}

.pengu-quick-panel{position:fixed;z-index:1181;right:max(18px,env(safe-area-inset-right));bottom:calc(max(18px,env(safe-area-inset-bottom)) + 78px);width:min(360px,calc(100vw - 28px));padding:16px;border:1px solid #dbe5ec;border-radius:22px;background:rgba(255,255,255,.98);box-shadow:0 22px 60px rgba(12,48,86,.27);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(12px) scale(.97);transform-origin:bottom right;transition:opacity .18s ease,visibility .18s ease,transform .18s ease}
.pengu-quick-panel.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:none}
.pengu-quick-panel.is-left{transform-origin:bottom left}
.pengu-quick-head{display:grid;grid-template-columns:46px minmax(0,1fr) 38px;align-items:center;gap:10px}.pengu-quick-head>img{width:46px;height:46px;object-fit:contain;border-radius:14px;background:#f5df12}.pengu-quick-head b,.pengu-quick-head span{display:block}.pengu-quick-head span{margin-top:2px;color:#718096;font-size:.76rem}.pengu-quick-head button{display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:11px;background:#eef3f7;color:#526579;font-size:1.1rem;cursor:pointer}
.pengu-current-role{margin:13px 0;padding:10px 12px;border-radius:13px;background:#edf7f6;color:#27676a;font-size:.8rem;font-weight:800}
.pengu-quick-actions{display:grid;gap:8px}.pengu-quick-action{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:10px 12px;border:1px solid #e0e8ee;border-radius:13px;background:#fff;color:#1b2b41;text-align:left;font:inherit;font-weight:850;cursor:pointer}.pengu-quick-action:hover,.pengu-quick-action:focus-visible{background:#f4f9fb;border-color:#aacfd0;outline:0}.pengu-quick-action i{color:var(--pengu-teal);font-size:1.1rem}.pengu-quick-action.is-danger{color:#8b3e46}.pengu-quick-action.is-danger i{color:#ba4b57}
.pengu-hide-confirm{display:none;margin-top:10px;padding:12px;border:1px solid #f4c7ca;border-radius:14px;background:#fff7f7;color:#713c42}.pengu-hide-confirm.is-open{display:block}.pengu-hide-confirm b{display:block;font-size:.82rem}.pengu-hide-confirm p{margin:6px 0 10px;font-size:.72rem;line-height:1.45}.pengu-hide-confirm-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.pengu-hide-confirm-actions button{min-height:40px;border:1px solid #dce5eb;border-radius:10px;background:#fff;color:#425466;font:inherit;font-size:.75rem;font-weight:900;cursor:pointer}.pengu-hide-confirm-actions button:last-child{border-color:#ba4b57;background:#ba4b57;color:#fff}

@keyframes penguFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-11px) rotate(1deg)}}

@media(max-width:760px){
  .pengu-onboarding{padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
  .pengu-onboarding-shell{width:100%;height:100%;max-height:none;grid-template-columns:1fr;grid-template-rows:minmax(180px,32dvh) minmax(0,1fr);border:1px solid rgba(255,255,255,.34);border-radius:27px}
  .pengu-onboarding.is-flow-screen .pengu-onboarding-shell{grid-template-rows:minmax(125px,22dvh) minmax(0,1fr)}
  .pengu-onboarding.is-flow-screen .pengu-visual img{max-height:18dvh}
  .pengu-visual{padding:18px 22px;border-radius:26px 26px 0 0}.pengu-visual::before{width:min(260px,61vw)}.pengu-visual img{width:min(225px,53vw);max-height:27dvh}
  .pengu-visual-copy{display:none}
  .pengu-stage{padding:12px max(18px,env(safe-area-inset-right)) max(17px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));border-radius:0 0 26px 26px}
  .pengu-stage-top{display:grid;grid-template-columns:auto minmax(0,1fr) 40px;align-items:center;gap:6px;min-height:45px;margin-bottom:5px}.pengu-stage-top>.pengu-text-button{justify-self:end;min-height:40px;padding:5px 3px;font-size:.68rem;line-height:1.15;white-space:nowrap}.pengu-back-button{white-space:nowrap}.pengu-icon-button{width:40px;height:40px}
  .pengu-stage-body{align-content:start;padding:12px 0 18px;scrollbar-width:none}.pengu-stage-body::-webkit-scrollbar{display:none}.pengu-eyebrow{margin-bottom:8px;font-size:.68rem;line-height:1.35;letter-spacing:.08em}.pengu-stage h1{font-size:clamp(1.58rem,6.6vw,1.95rem);line-height:1.1;letter-spacing:-.03em}.pengu-stage h1 span{margin-top:6px;font-size:.5em;line-height:1.3}.pengu-intro{margin:14px 0 18px;font-size:.88rem;line-height:1.48;overflow-wrap:normal;word-break:normal}
  .pengu-choice-grid{grid-template-columns:1fr;gap:11px}.pengu-choice{grid-template-columns:48px minmax(0,1fr) 24px;min-height:76px;padding:12px 13px;border-radius:17px}.pengu-choice-icon{width:48px;height:48px;border-radius:14px;font-size:1.35rem}.pengu-choice-copy b{font-size:.96rem;line-height:1.25}.pengu-choice-copy span{margin-top:5px;font-size:.75rem;line-height:1.25}.pengu-teacher-promo{display:grid;gap:11px;margin:10px 0;padding:13px}.pengu-teacher-promo button{width:100%}.pengu-teacher-grid{grid-template-columns:1fr;gap:8px}.pengu-teacher-choice:last-child{grid-column:auto}
  .pengu-choice.is-account{min-height:68px}.pengu-program-grid{grid-template-columns:1fr;gap:8px}.pengu-program-option{grid-template-columns:42px minmax(0,1fr) 18px;min-height:62px;padding:9px 11px}.pengu-program-option>span:first-child{width:42px;height:42px}.pengu-program-option b{font-size:.86rem;line-height:1.25}.pengu-program-option small{font-size:.68rem;line-height:1.3}.pengu-back-button{min-height:40px;padding:7px 8px;font-size:.7rem}
  .pengu-stage-foot{padding-top:12px;font-size:.7rem;line-height:1.35}.pengu-stage-foot>span:last-child{display:none}
  .pengu-launcher{right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));width:58px;height:58px;border-radius:19px}
  .pengu-quick-panel{left:12px;right:12px;bottom:calc(max(14px,env(safe-area-inset-bottom)) + 70px);width:auto;transform-origin:bottom center}
}

@media(max-width:360px), (max-height:650px){
  .pengu-onboarding-shell{grid-template-rows:minmax(112px,23dvh) minmax(0,1fr)}
  .pengu-visual img{max-height:19dvh}.pengu-stage{padding-top:6px}.pengu-stage-top{min-height:36px;margin-bottom:0;grid-template-columns:auto minmax(0,1fr) 36px;gap:4px}.pengu-icon-button{width:36px;height:36px}.pengu-stage-top>.pengu-text-button{min-height:36px;font-size:.62rem}.pengu-back-button{min-height:36px;padding:5px 6px;font-size:.65rem}.pengu-stage-body{padding-top:6px}.pengu-eyebrow{display:none}.pengu-stage h1{font-size:1.43rem}.pengu-stage h1 span{margin-top:3px}.pengu-intro{margin:8px 0 11px;line-height:1.4}.pengu-choice-grid{gap:8px}.pengu-choice{min-height:64px;padding:8px 10px}.pengu-choice-icon{width:42px;height:42px}.pengu-stage-foot{padding-top:7px}
}

@media(max-width:760px){.pengu-free-account{grid-template-columns:1fr;margin:8px 0;padding:12px}.pengu-free-account ul{grid-template-columns:1fr;gap:4px}.pengu-free-account>button{grid-column:1;grid-row:auto;width:100%}}

@media(prefers-reduced-motion:reduce){.pengu-onboarding,.pengu-launcher,.pengu-quick-panel,.pengu-choice{transition:none!important}.pengu-visual img{animation:none!important}}
