/* widgets-media.css — YouTube, world radio, Canvas, starboard, Kahoot, brain break. */
/* YouTube */
.yt-input-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:1.25rem;background:#f9f9f9}
.yt-url-inp{width:100%;height:clamp(2.25rem,9cqi,3.6rem);border:1.5px solid #dedede;border-radius:9999px;padding:0 .875rem;font-family:"Poppins",sans-serif;font-size:clamp(.8125rem,3.8cqi,1.6rem);outline:none;margin-bottom:.5rem;text-align:center}
.yt-url-inp:focus{border-color:#39b0bb}
.yt-ok-btn{height:clamp(2rem,8cqi,3.2rem);padding:0 1.25rem;border-radius:9999px;border:none;background:#39b0bb;color:#fff;font-family:"Poppins",sans-serif;font-size:clamp(.8125rem,3.8cqi,1.6rem);font-weight:600;cursor:pointer}
.yt-change-btn{position:absolute;top:.375rem;right:.375rem;width:1.75rem;height:1.75rem;border-radius:50%;border:none;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);color:#fff;cursor:pointer;display:grid;place-items:center;opacity:0;transition:opacity .15s}
.widget-body:hover .yt-change-btn{opacity:1}
.yt-change-btn .material-icons-outlined{font-size:.875rem}
.sl-warn{flex-shrink:0;display:flex;align-items:flex-start;gap:.5rem;padding:.6rem .7rem;background:#fff7e6;border-bottom:1px solid #f3d692;color:#6b4f10;font-size:.85rem;line-height:1.5}
.sl-warn-ic{font-size:1.2rem;flex-shrink:0;color:#d9a322}
.sl-warn-txt{flex:1;min-width:0}
.sl-warn-txt a{color:#39b0bb;text-decoration:none;white-space:nowrap;margin-left:.25rem;font-weight:600}
.sl-warn-x{flex-shrink:0;border:none;background:transparent;color:#9a7b3a;cursor:pointer;font-size:1rem;line-height:1;padding:.1rem .25rem}
body.student-mode .sl-warn{display:none!important}
/* Slides input screen — larger, readable type + a clear sharing guide. */
.sl-input{padding:clamp(1rem,4cqi,2.6rem) clamp(.9rem,3.4cqi,2rem)!important}
.sl-url{width:100%;max-width:min(92%,40rem);height:clamp(2.4rem,7cqi,3.8rem)!important;font-size:clamp(.9rem,3.1cqi,1.9rem)!important;text-align:center}
.sl-ok{height:clamp(2.3rem,6.6cqi,3.6rem)!important;padding:0 clamp(1.4rem,5cqi,2.8rem)!important;font-size:clamp(.9rem,3.1cqi,1.9rem)!important}
.sl-guide{margin-top:1rem;width:100%;max-width:min(92%,40rem);background:#fff;border:1px solid #e8ebee;border-radius:.75rem;padding:clamp(.8rem,3cqi,1.7rem) clamp(.9rem,3.2cqi,1.9rem);text-align:left;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.sl-guide-h{display:flex;align-items:center;gap:.4rem;font-size:clamp(.88rem,3cqi,1.7rem);font-weight:700;color:#374151;margin-bottom:.6rem}
.sl-guide-h .material-icons-outlined{font-size:clamp(1rem,3.4cqi,2rem)!important;color:#39b0bb}
.sl-guide-row{display:flex;align-items:center;gap:.6rem;margin-bottom:.55rem;font-size:clamp(.82rem,2.9cqi,1.6rem);line-height:1.45;color:#4b5563}
.sl-guide-row:last-child{margin-bottom:0}
.sl-guide-txt{flex:1;min-width:0}
.sl-guide-txt b{color:#374151}
.sl-brand-badge{width:clamp(2.4rem,9cqi,4.2rem);height:clamp(2.4rem,9cqi,4.2rem);border-radius:.55rem;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.15);flex-shrink:0}
.sl-brand-badge-sm{width:1.5rem;height:1.5rem;border-radius:.35rem;box-shadow:none;flex-shrink:0}
.sl-svc-row{display:flex;gap:clamp(.8rem,3cqi,1.8rem)}
.sl-svc-opt{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:clamp(.6rem,2.5cqi,1.2rem);border:1.5px solid transparent;border-radius:.9rem;background:transparent;cursor:pointer;font-family:inherit;transition:background .12s,border-color .12s}
.sl-svc-opt:hover{background:#fff;border-color:#e8ebee;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.sl-svc-opt .sl-brand-badge{width:clamp(2.8rem,10cqi,4.8rem);height:clamp(2.8rem,10cqi,4.8rem)}
.sl-svc-name{font-size:clamp(.8rem,2.9cqi,1.6rem);font-weight:600;color:#374151}
.sl-svc-back{align-self:flex-start;display:flex;align-items:center;gap:.3rem;border:none;background:transparent;color:#39b0bb;font-family:inherit;font-size:clamp(.75rem,2.6cqi,1.4rem);font-weight:600;cursor:pointer;padding:0;margin-bottom:.6rem}
.sl-svc-back:hover{text-decoration:underline}
.sl-svc-current{display:flex;align-items:center;gap:.55rem;font-size:clamp(.95rem,3.4cqi,2.1rem);font-weight:700;color:#222;margin-bottom:1rem}
.sl-svc-current .sl-brand-badge{width:clamp(2rem,7cqi,3.2rem);height:clamp(2rem,7cqi,3.2rem)}
/* Fullscreen embeds (student): header button on mobile cards, badge on desktop
   board widgets, and the in-app full-viewport overlay they both open. */
.mob-fs-btn{margin-left:auto;flex-shrink:0;width:1.9rem;height:1.9rem;border:none;border-radius:.5rem;background:#eef1f3;color:var(--main,#39b0bb);display:grid;place-items:center;cursor:pointer;padding:0}
.mob-fs-btn:active{transform:scale(.92)}
.mob-fs-btn .material-icons-outlined{font-size:1.15rem}
.kk-fs-badge{position:absolute;bottom:.5rem;right:.5rem;z-index:50;width:2rem;height:2rem;border:none;border-radius:.5rem;background:rgba(0,0,0,.55);color:#fff;display:grid;place-items:center;cursor:pointer;opacity:.85;transition:opacity .15s,transform .12s;pointer-events:none}
.kk-fs-badge .material-icons-outlined{font-size:1.2rem}
.kk-fs-badge:hover{opacity:1}
.kk-fs-badge:active{transform:scale(.93)}
body.student-mode .kk-fs-badge{pointer-events:auto}
.sfs-overlay{position:fixed;inset:0;z-index:2147482000;background:#000;display:flex}
.sfs-overlay .sfs-frame{flex:1;border:none;width:100%;height:100%}
.sfs-close{position:fixed;top:max(.6rem,env(safe-area-inset-top,0));right:max(.6rem,env(safe-area-inset-right,0));z-index:2;width:2.6rem;height:2.6rem;border:none;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;display:grid;place-items:center;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.sfs-close .material-icons-outlined{font-size:1.5rem}
/* ── World Radio widget ─────────────────────────────────────────── */
/* Now playing view */
.wr-now{position:relative;display:flex;flex-direction:column;height:100%;overflow:hidden;background:var(--panel)}
.wr-now-bg{display:none}
.wr-now-topbar{display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem;border-bottom:1px solid var(--divider);flex-shrink:0}
.wr-now-controls{display:flex;align-items:center;gap:.5rem}
.wr-now-stop{width:2.5rem;height:2.5rem;border-radius:50%;border:none;background:#e67c7a;color:#fff;cursor:pointer;display:grid;place-items:center;transition:all .15s;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.wr-now-stop:hover{background:#d65f5d;transform:scale(1.05)}
.wr-now-stop .material-icons-outlined{font-size:1.25rem}
.wr-now-content{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;padding:1.5rem;color:var(--font);text-align:center}
.wr-now-logo{width:6.5rem;height:6.5rem;border-radius:1.25rem;object-fit:contain;background:rgba(255,255,255,.1);padding:.5rem;flex-shrink:0}
.wr-now-logo--fallback{display:grid;place-items:center;background:rgba(255,255,255,.08)}
.wr-now-logo--fallback .material-icons-outlined{font-size:3rem;color:rgba(255,255,255,.4)}
.wr-now-name{font-size:1.125rem;font-weight:700;line-height:1.3;max-width:100%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--font)}
.wr-now-track{font-size:.875rem;font-weight:500;color:rgba(255,255,255,.85);line-height:1.35;max-width:100%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:0}
.wr-now-meta{font-size:.875rem;color:var(--font-sub);line-height:1.4}
.wr-now-tags{display:flex;flex-wrap:wrap;gap:.25rem;justify-content:center}
.wr-tag{font-size:.6875rem;padding:.125rem .5rem;border-radius:9999px;background:rgba(255,255,255,.12);color:rgba(255,255,255,.75);white-space:nowrap}
.wr-now-play{width:2.5rem;height:2.5rem;border-radius:50%;border:none;background:var(--main);color:#fff;cursor:pointer;display:grid;place-items:center;transition:all .15s;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.wr-now-play:hover{background:var(--main);filter:brightness(1.1);transform:scale(1.05)}
.wr-now-play .material-icons-outlined{font-size:1.25rem}
.wr-now-change{width:2.5rem;height:2.5rem;border-radius:50%;border:1px solid var(--border);background:var(--el);color:var(--font-sub);cursor:pointer;display:grid;place-items:center;transition:all .12s;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.wr-now-change:hover{background:var(--hover);color:var(--font);border-color:var(--main)}
.wr-now-change .material-icons-outlined{font-size:1.25rem}

/* Search view */
.wr-search-view{display:flex;flex-direction:column;height:100%;background:var(--panel)}
.wr-tabs{display:flex;gap:0;border-bottom:1px solid var(--divider);flex-shrink:0}
.wr-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:.375rem;padding:.5rem;border:none;background:transparent;font-family:"Poppins",sans-serif;font-size:.8125rem;font-weight:600;color:var(--font-sub);cursor:pointer;border-bottom:2px solid transparent;transition:color .12s,border-color .12s}
.wr-tab:hover{color:var(--font)}
.wr-tab.active{color:var(--main);border-bottom-color:var(--main)}
.wr-tab .material-icons-outlined{font-size:1.125rem}
.wr-sr-header{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border-bottom:1px solid var(--divider);flex-shrink:0}
.wr-sr-back{width:1.75rem;height:1.75rem;border-radius:50%;border:none;background:transparent;color:var(--font-sub);cursor:pointer;display:grid;place-items:center;flex-shrink:0}
.wr-sr-back:hover{background:var(--hover)}
.wr-sr-back .material-icons-outlined{font-size:1.125rem}
.wr-sr-header-name{font-size:.875rem;font-weight:700;color:var(--font)}
.wr-now-program{font-size:.75rem;font-weight:500;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.05em}
.wr-back{display:flex;align-items:center;gap:.5rem;padding:.625rem .875rem;border:none;background:transparent;font-family:"Poppins",sans-serif;font-size:.875rem;font-weight:600;color:var(--font);cursor:pointer;text-align:left;flex:1;min-width:0;transition:all .12s}
.wr-back:hover{color:var(--main)}
.wr-back .material-icons-outlined{font-size:1.25rem;flex-shrink:0}
.wr-back span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Search view topbar with controls */
.wr-search-topbar{display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem;border-bottom:1px solid var(--divider);background:var(--el);flex-shrink:0}
.wr-search-controls{display:flex;align-items:center;gap:.375rem;flex-shrink:0}
.wr-search-play,.wr-search-stop{width:2.25rem;height:2.25rem;border-radius:50%;border:none;cursor:pointer;display:grid;place-items:center;transition:all .12s}
.wr-search-play{background:var(--main);color:#fff}
.wr-search-play:hover{filter:brightness(1.1);transform:scale(1.05)}
.wr-search-stop{background:#e67c7a;color:#fff}
.wr-search-stop:hover{background:#d65f5d;transform:scale(1.05)}
.wr-search-play .material-icons-outlined,.wr-search-stop .material-icons-outlined{font-size:1.125rem}
.wr-search-wrap{display:flex;gap:.5rem;padding:.75rem;border-bottom:1px solid var(--divider);flex-shrink:0}
.wr-search-inp{flex:1;height:2.5rem;border:1px solid var(--border);border-radius:.5rem;padding:0 1rem;font-family:"Poppins",sans-serif;font-size:.9375rem;outline:none;background:var(--el)}
.wr-search-inp:focus{border-color:var(--main);box-shadow:0 0 0 2px var(--main-light)}
.wr-search-btn{width:2.5rem;height:2.5rem;border-radius:.5rem;border:none;background:var(--main);color:#fff;cursor:pointer;display:grid;place-items:center;flex-shrink:0;font-size:1.125rem}
.wr-results{flex:1;overflow-y:auto;padding:.25rem 0}
.wr-hint{font-size:.875rem;color:var(--font-sub);text-align:center;padding:1.5rem .5rem}
.wr-result{display:flex;align-items:center;gap:.5rem;width:100%;padding:.5rem .75rem;border:none;background:transparent;text-align:left;cursor:pointer;font-family:"Poppins",sans-serif;border-bottom:1px solid var(--divider);transition:background .1s}
.wr-result:hover{background:var(--hover)}
.wr-result:last-child{border-bottom:none}
.wr-result-logo{width:1.75rem;height:1.75rem;border-radius:.375rem;object-fit:contain;flex-shrink:0;background:rgba(0,0,0,.04)}
.wr-result-flag{font-size:1.1rem;flex-shrink:0;width:1.75rem;text-align:center}
.wr-result-info{flex:1;min-width:0}
.wr-result-name{font-size:.875rem;font-weight:600;color:var(--font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wr-result-meta{font-size:.75rem;color:var(--font-sub)}
.wr-verified{color:#22c55e;font-weight:700;font-size:.875rem}

/* Quick-start grid */
.wr-quick-section{padding:.75rem;border-bottom:1px solid var(--divider);flex-shrink:0}
.wr-quick-title{font-size:.8125rem;font-weight:600;color:var(--font);margin-bottom:.5rem}
.wr-quick-home{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}
.wr-quick-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border:1px solid var(--border);border-radius:.5rem;background:var(--el);font-family:"Poppins",sans-serif;font-size:.875rem;font-weight:500;color:var(--font);cursor:pointer;transition:all .12s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.wr-quick-btn:hover{background:var(--hover);border-color:var(--main);transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,.1)}
.wr-quick-btn--home{padding:.625rem 1rem;font-size:.9375rem;font-weight:600}
.wr-quick-btn--home .wr-quick-flag{font-size:1.5rem}
.wr-quick-flag{font-size:1.125rem;flex-shrink:0}
.wr-quick-name{overflow:hidden;text-overflow:ellipsis;max-width:7rem}
.wr-quick-btn--home .wr-quick-name{max-width:10rem}
.wr-quick-more{display:flex;align-items:center;gap:.375rem;padding:.375rem .625rem;border:1px solid var(--border);border-radius:.375rem;background:transparent;font-family:"Poppins",sans-serif;font-size:.8125rem;font-weight:500;color:var(--font-sub);cursor:pointer;margin-top:.25rem;transition:all .12s}
.wr-quick-more:hover{color:var(--font);background:var(--hover);border-color:var(--main)}
.wr-quick-others{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--divider)}
.wr-quick-country{display:flex;align-items:center;gap:.5rem}
.wr-quick-stations{display:flex;flex-wrap:wrap;gap:.375rem;flex:1}

/* Container queries */
@container (min-width:280px){
  .wr-now-logo{width:6rem;height:6rem}
  .wr-now-name{font-size:1rem}
  .wr-now-meta{font-size:.8125rem}
  .wr-now-play{width:3.25rem;height:3.25rem}
  .wr-now-play .material-icons-outlined{font-size:1.75rem}
  .wr-search-inp{font-size:.9375rem;height:2.2rem}
  .wr-hint{font-size:.9375rem}
  .wr-result-name{font-size:.9375rem}
  .wr-result-meta{font-size:.8125rem}
}
@container (min-width:380px){
  .wr-now-logo{width:7rem;height:7rem;border-radius:1.25rem}
  .wr-now-name{font-size:1.125rem}
  .wr-now-meta{font-size:.875rem}
  .wr-now-play{width:3.5rem;height:3.5rem}
.wr-now-play .material-icons-outlined{font-size:2rem}

/* Global stop button — always visible when radio is playing */
.wr-global-stop{position:fixed;bottom:1rem;right:1rem;width:3rem;height:3rem;border-radius:50%;border:none;background:#e67c7a;color:#fff;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 8px rgba(0,0,0,.2);z-index:9999;transition:all .15s}
.wr-global-stop:hover{background:#d65f5d;transform:scale(1.05)}
.wr-global-stop .material-icons-outlined{font-size:1.5rem}
  .wr-tag{font-size:.6875rem;padding:.1875rem .625rem}
  .wr-search-inp{font-size:1.0625rem;height:2.4rem}
  .wr-hint{font-size:1.0625rem}
  .wr-result-logo{width:2rem;height:2rem}
  .wr-result-name{font-size:1.0625rem}
  .wr-result-meta{font-size:.875rem}
}
@container (min-width:520px){
  .wr-now-logo{width:8.5rem;height:8.5rem;border-radius:1.5rem}
  .wr-now-name{font-size:1.375rem}
  .wr-now-meta{font-size:1rem}
  .wr-now-play{width:4rem;height:4rem}
  .wr-now-play .material-icons-outlined{font-size:2.25rem}
  .wr-tag{font-size:.75rem;padding:.25rem .75rem}
  .wr-search-inp{font-size:1.25rem;height:2.8rem}
  .wr-hint{font-size:1.25rem}
  .wr-result-logo{width:2.25rem;height:2.25rem}
  .wr-result-name{font-size:1.25rem}
  .wr-result-meta{font-size:1rem}
}

/* ── Student view: radio widget ────────────────────────────────────── */
.wr-student-idle{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;height:100%;padding:1.5rem;color:var(--text)}
.wr-vintage{width:100%;max-width:8rem;opacity:0.7}
.wr-vintage svg{width:100%;height:auto;display:block}
.wr-student-idle-text{font-size:.8125rem;font-weight:500;color:var(--text);opacity:0.55;text-align:center;line-height:1.4}
.wr-student-playing{display:flex;align-items:center;gap:.375rem;margin-top:.25rem;font-size:.75rem;font-weight:500;color:rgba(255,255,255,.6)}
.wr-student-dot{width:.5rem;height:.5rem;border-radius:50%;background:#4ade80;animation:wrPulse 1.5s ease-in-out infinite}
@keyframes wrPulse{0%,100%{opacity:1}50%{opacity:.4}}
.wr-now--student .wr-now-play{display:none}
.wr-now--student .wr-now-change{display:none}
/* ── Canvas LMS widget ──────────────────────────────────────────── */
.cv-open-btn{display:inline-flex;align-items:center;gap:.375rem;margin-top:.375rem;padding:.375rem .75rem;border-radius:9999px;background:#e0371f;color:#fff;font-size:.75rem;font-weight:600;text-decoration:none;transition:background .12s,transform .1s}
.cv-open-btn:hover{background:#c42e1a;transform:translateY(-1px)}
.cv-open-btn:active{transform:translateY(0)}
.cv-logo{flex-shrink:0;opacity:.9}

/* ── Starboard widget ───────────────────────────────────────────── */
.sb-header{display:flex;align-items:center;gap:.4em;padding:.55em .75em .45em;border-bottom:1.5px solid var(--border);font-family:"Poppins",sans-serif;font-weight:700;font-size:.9em;color:var(--font);flex-shrink:0}
.sb-header-icon{font-size:1.2em}
.sb-reset-btn{margin-left:auto;border:none;background:transparent;color:var(--font-sub);font-size:1.1em;cursor:pointer;padding:.1em .3em;border-radius:6px;transition:background .12s,color .12s;line-height:1}
.sb-reset-btn:hover{background:var(--hover);color:var(--font)}
.sb-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.1em;padding:.35em .5em .5em}
.sb-row{display:flex;align-items:center;gap:.5em;padding:.35em .45em;border-radius:10px;transition:background .12s;font-family:"Poppins",sans-serif}
.sb-row--top{background:linear-gradient(90deg,rgba(255,215,0,.08) 0%,transparent 100%)}
.sb-rank{width:1.4em;text-align:center;font-size:.78em;font-weight:700;color:var(--font-sub);flex-shrink:0}
.sb-medal{width:1.4em;text-align:center;font-size:.95em;flex-shrink:0}
.sb-avat{width:1.8em;height:1.8em;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.sb-avat-emoji{font-size:1.4em;line-height:1}
.sb-avat-color{width:1.8em;height:1.8em;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75em;font-weight:700;color:#fff}
.sb-name{flex:1;font-size:.82em;font-weight:600;color:var(--font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-stars{display:flex;align-items:center;gap:.2em;flex-shrink:0}
.sb-star-icon{font-size:.85em}
.sb-star-num{font-size:.88em;font-weight:700;color:var(--font);min-width:1.4em;text-align:right}
.sb-btns{display:flex;gap:.25em;flex-shrink:0}
.sb-give{width:1.6em;height:1.6em;border-radius:50%;border:none;font-size:.88em;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s,transform .08s}
.sb-give--plus{background:#d1fae5;color:#065f46}
.sb-give--plus:hover{background:#a7f3d0}
.sb-give--plus:active{transform:scale(.88)}
.sb-give--minus{background:#fee2e2;color:#991b1b}
.sb-give--minus:hover{background:#fecaca}
.sb-give--minus:active{transform:scale(.88)}
.sb-add-students-btn{display:flex;align-items:center;justify-content:center;gap:.3em;border:none;border-top:1.5px solid var(--border);background:transparent;color:var(--main);font-family:"Poppins",sans-serif;font-weight:700;font-size:.8em;padding:.5em .75em;cursor:pointer;flex-shrink:0;transition:background .12s;width:100%}
.sb-add-students-btn:hover{background:var(--main-sub)}
.sb-filter-btn{margin-left:auto;border:none;background:transparent;color:var(--font-sub);font-size:1em;cursor:pointer;padding:.1em .3em;border-radius:6px;display:flex;align-items:center;gap:.2em;position:relative;transition:background .12s,color .12s}
.sb-filter-btn:hover{background:var(--hover);color:var(--font)}
.sb-filter-badge{position:absolute;top:-.2em;right:-.2em;background:var(--main);color:#fff;font-size:.55em;font-weight:700;border-radius:999px;min-width:1.3em;height:1.3em;display:flex;align-items:center;justify-content:center;line-height:1}
.sb-back-btn{border:none;background:transparent;color:var(--font-sub);font-size:1em;cursor:pointer;padding:.1em .3em;border-radius:6px;display:flex;align-items:center;transition:background .12s,color .12s;margin-right:.2em}
.sb-back-btn:hover{background:var(--hover);color:var(--font)}
.sb-filter-row{display:flex;align-items:center;gap:.5em;padding:.35em .45em;border-radius:10px;cursor:pointer;font-family:"Poppins",sans-serif}
.sb-filter-row:hover{background:var(--hover)}
.sb-filter-check{width:1.1em;height:1.1em;margin-left:auto;flex-shrink:0;cursor:pointer;accent-color:var(--main)}
.sb-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5em;color:var(--font-sub);font-family:"Poppins",sans-serif;font-size:.85em;font-weight:600;text-align:center}
/* Student star score badge */
#sb-score-badge{display:none;align-items:center;gap:.2rem;padding:.35rem .55rem;border-radius:999px;background:rgba(57,176,187,.15);border:1.5px solid rgba(57,176,187,.4);color:#0e6e78;font-family:"Poppins",sans-serif;font-weight:700;font-size:.88rem;pointer-events:none;position:relative;flex-shrink:0;white-space:nowrap}
#sb-badge-count{font-size:.88rem;font-weight:700}
.sb-badge-plus{position:absolute;bottom:calc(100% + 4px);left:50%;transform:translateX(-50%);background:#22c55e;color:#fff;font-size:.65rem;font-weight:700;border-radius:999px;padding:.1rem .35rem;white-space:nowrap;animation:sb-plus-in .45s cubic-bezier(.22,1,.36,1) both}
@keyframes sb-plus-in{from{opacity:0;transform:translateX(-50%) translateY(4px) scale(.7)}to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}
/* ── Kahoot widget ─────────────────────────────────────────────── */
.kah-share-btn,.kah-start-btn,.kah-stop-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:none;border-radius:999px;font-family:"Poppins",sans-serif;font-weight:700;cursor:pointer}
.kah-start-btn{background:#46178f;color:#fff;font-size:clamp(.8rem,4.5cqi,1.5rem);padding:clamp(.5rem,2.5cqi,1rem) clamp(1rem,5cqi,2.2rem);width:100%}
.kah-stop-btn{background:#e74c3c;color:#fff;font-size:clamp(.75rem,4cqi,1.3rem);padding:clamp(.4rem,2cqi,.9rem) clamp(.8rem,4cqi,1.8rem)}
.kah-dot{display:inline-block;width:.65rem;height:.65rem;border-radius:50%;background:#22c55e;animation:bb-pulse 1.2s ease-in-out infinite}
/* ── Brain Break duration chips ────────────────────────────────── */
.bb-dur-chips{display:flex;gap:.3rem;flex-wrap:wrap}
.bb-dur-chip{padding:.2rem .55rem;border-radius:999px;border:1.5px solid var(--border);background:transparent;font-family:"Poppins",sans-serif;font-size:clamp(.7rem,3cqi,.95rem);font-weight:600;color:var(--font-sub);cursor:pointer;transition:background .1s,color .1s,border-color .1s}
.bb-dur-chip--on{background:var(--main);color:#fff;border-color:var(--main)}
