.phone-menu-trigger,.phone-menu-shade,.phone-section-menu{display:none}
.teacher-made-section{margin:15px 0}.teacher-made-section .section-title{margin-bottom:9px}.teacher-made-section .section-title h2{font-size:19px;margin:0}.teacher-made-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.teacher-made-card{min-width:0;text-align:left;display:flex;flex-direction:column;gap:6px;padding:15px;background:linear-gradient(135deg,#644057,#472a3f)!important;border:1px solid var(--challenge-edge,#b57492)!important;border-top:3px solid var(--challenge-accent,#ffbf83)!important;border-radius:15px;color:#fff7ef!important}.teacher-made-card h3{font-size:17px;line-height:1.25;margin:4px 0}.teacher-made-card p{font-size:11px;line-height:1.4;color:#ead8dc;margin:0}.teacher-made-card b{margin-top:auto;font-size:12px;color:var(--challenge-accent,#ffbf83)}.teacher-made-card:focus-visible{outline:3px solid #ffd39f;outline-offset:3px}
@media(max-width:800px){
 .simple-shell .topbar{display:grid!important;grid-template-columns:1fr auto!important;grid-template-rows:auto auto;gap:5px 8px!important;align-items:center;padding:6px 10px!important;min-height:72px!important}
 .simple-shell .topbar .approved-phone-brand{grid-column:1;grid-row:1;justify-self:start;font-size:22px!important}
 .simple-shell .topbar .phone-menu-trigger{display:grid!important;place-items:center;grid-column:2;grid-row:1;justify-self:end;width:34px;min-width:34px;min-height:32px!important;padding:2px!important;border:1px solid #aa6e8a!important;border-radius:8px;background:#542d43!important;color:#fff6ed!important;font-size:21px!important;line-height:1}
 .simple-shell .topbar>div{grid-column:1/-1;grid-row:2;width:100%!important;justify-content:space-between!important;gap:5px!important}
 .simple-shell .topbar select{width:auto!important;max-width:31vw!important;flex:1 1 60px;font-size:11px!important}
 .simple-shell .topbar button:not(.approved-phone-brand):not(.phone-menu-trigger){min-height:30px!important}
 .phone-menu-shade:not([hidden]){display:block;position:fixed;inset:0;z-index:70;background:#140d19b8}
 .phone-section-menu:not([hidden]){display:flex;flex-direction:column;position:fixed;z-index:71;left:0;top:0;bottom:0;width:min(310px,86vw);padding:22px 15px calc(20px + env(safe-area-inset-bottom));background:#351b30;border-right:1px solid #b57c98;box-shadow:12px 0 50px #12091688;color:#fff7ef}
 .phone-menu-head{display:flex;align-items:center;justify-content:space-between;padding:0 3px 16px;border-bottom:1px solid #9a647d}.phone-menu-head b{font-size:19px}.phone-menu-close{width:38px;height:38px;padding:0!important;background:#5d344d!important;color:#fff7ef!important;border:1px solid #b47d93!important;font-size:25px}
 .phone-section-menu nav{display:grid;gap:6px;overflow:auto;padding:17px 0}.phone-section-menu nav button{min-height:49px;display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:#57354b;border:1px solid #99687f;color:#fff7ef;border-radius:11px;padding:10px 12px;font-size:14px}.phone-section-menu nav button[aria-current=page]{background:#f4b675;color:#321b2b;border-color:#ffd29a;font-weight:800}.phone-section-menu nav .approved-nav-icon{width:22px;height:22px;flex:0 0 22px}.phone-section-menu nav button span:nth-child(2){flex:1}.phone-section-menu>small{padding:10px 3px;color:#e5cbd9;line-height:1.4}
 .teacher-made-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.teacher-made-card{padding:11px}.teacher-made-card h3{font-size:15px}
}
@media(max-width:360px){.simple-shell .topbar .approved-phone-brand{font-size:20px!important}.phone-section-menu{width:min(285px,88vw)}}
@media(max-width:340px){.teacher-made-grid{grid-template-columns:1fr}}
/* Phone header: navigation and brand share the left edge; utilities form a tidy second row. */
@media(max-width:800px){
 .simple-shell .topbar{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:34px 32px!important;gap:5px!important;min-height:0!important;padding:6px 10px!important;align-content:center}
 .simple-shell .topbar .phone-brand-cluster{grid-column:1;grid-row:1;display:flex;align-items:center;gap:9px;min-width:0}
 .simple-shell .topbar .phone-brand-cluster .phone-menu-trigger{position:static;display:grid!important;place-items:center;flex:0 0 34px;min-width:34px;width:34px;height:34px;min-height:34px!important;padding:0!important;font-size:19px!important;border-radius:9px}
 .simple-shell .topbar .phone-brand-cluster .approved-phone-brand{position:static;display:inline-block!important;min-height:0!important;line-height:1!important;font-size:22px!important;padding:0!important}
 .simple-shell .topbar>div:not(.phone-brand-cluster){grid-column:1;grid-row:2;display:flex!important;align-items:center;justify-content:flex-start!important;flex-wrap:nowrap!important;min-width:0;width:100%!important;gap:5px!important;overflow:hidden}
 .simple-shell .topbar>div:not(.phone-brand-cluster)>*{flex:0 0 auto;min-width:0;max-width:none!important;white-space:nowrap}
 .simple-shell .topbar>div:not(.phone-brand-cluster)>select{flex:1 1 92px;min-width:70px;width:100%!important;max-width:none!important;height:31px!important}
 .simple-shell .topbar>div:not(.phone-brand-cluster)>button{min-height:31px!important;height:31px!important;padding:4px 7px!important;font-size:10px!important;line-height:1!important;box-shadow:none!important;white-space:nowrap}
 .simple-shell .topbar>div:not(.phone-brand-cluster)>button.theme-toggle{width:32px!important;overflow:hidden;text-indent:-999px;position:relative;padding:0!important}
 .simple-shell .topbar>div:not(.phone-brand-cluster)>button.theme-toggle::after{content:'◐';position:absolute;inset:0;display:grid;place-items:center;text-indent:0;font-size:19px}
 .simple-shell .topbar>div:not(.phone-brand-cluster)>button[aria-label="My rewards"]{font-size:10px!important}
 .simple-shell .topbar>div:not(.phone-brand-cluster)>button[onclick="enterRole('teacher')"],.simple-shell .topbar>div:not(.phone-brand-cluster)>button[onclick="enterRole('student')"]{font-size:10px!important}
}
@media(max-width:360px){.simple-shell .topbar{padding-inline:6px!important}.simple-shell .topbar>div:not(.phone-brand-cluster){gap:3px!important}.simple-shell .topbar>div:not(.phone-brand-cluster)>button{padding-inline:5px!important}}
/* Correct the fixed 80px legacy header and prevent the brand cluster from splitting apart. */
@media(max-width:800px){
 .simple-shell .topbar{height:auto!important;min-height:84px!important;grid-template-rows:34px 31px!important;align-content:start!important;overflow:visible!important}
 .simple-shell .topbar .phone-brand-cluster{justify-content:flex-start!important;width:auto!important;gap:10px!important;grid-column:1!important;grid-row:1!important}
 .simple-shell .topbar .phone-brand-cluster .approved-phone-brand{margin:0!important;justify-self:auto!important;grid-column:auto!important;grid-row:auto!important;flex:0 0 auto}
 .simple-shell .topbar .phone-brand-cluster .phone-menu-trigger{margin:0!important;justify-self:auto!important;grid-column:auto!important;grid-row:auto!important}
 .simple-shell .topbar>div:not(.phone-brand-cluster){grid-column:1!important;grid-row:2!important;margin:0!important}
 .simple-shell .topbar>div:not(.phone-brand-cluster)>button.theme-toggle{font-size:0!important;text-indent:0!important}
 .simple-shell .topbar>div:not(.phone-brand-cluster)>button.theme-toggle::after{font-size:18px!important}
}