:root{--bg:#f4f5f7;--panel:#fff;--ink:#16181d;--muted:#5d6470;--line:#dde1e6;--accent:#1565c0;--accent-ink:#fff;--teacher:#0d47a1;--danger:#c62828;--ok:#2e7d32;--stage-bg:#111317;--overlay:#f4f5f7f5;--bar-h:48px;--tap:40px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#121418;--panel:#1b1e24;--ink:#eef0f3;--muted:#a2a9b4;--line:#2c313a;--accent:#64a8ff;--accent-ink:#0b0d10;--teacher:#8ec1ff;--danger:#ff6b6b;--ok:#66bb6a;--overlay:#121418f5;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);overscroll-behavior:none;margin:0;font:15px/1.5 system-ui,-apple-system,Segoe UI,Tahoma,Noto Sans Arabic,sans-serif}#room{height:var(--app-h,100dvh);flex-direction:column;display:flex;position:relative;overflow:hidden}#room[data-form=phone],#room[data-form=phone-land],#room[data-form=tablet]{--tap:44px}button,select,textarea{font:inherit;color:inherit}[hidden]{display:none!important}.bar{min-height:var(--bar-h);background:var(--panel);border-bottom:1px solid var(--line);flex:none;align-items:center;gap:8px;padding:4px 12px;display:flex}.count{white-space:nowrap;text-overflow:ellipsis;font-variant-numeric:tabular-nums;min-width:0;color:var(--muted);flex:0 auto;overflow:hidden}.controls{flex-wrap:wrap;align-items:center;gap:6px;margin-inline-start:auto;display:flex}.text-btn,.act{border:1px solid var(--line);background:var(--panel);cursor:pointer;white-space:nowrap;border-radius:8px;min-height:36px;padding:0 14px}.text-btn.danger{color:var(--danger);border-color:currentColor}select{border:1px solid var(--line);background:var(--panel);border-radius:8px;min-height:36px;padding:0 8px}.body{flex-direction:column;flex:auto;min-height:0;display:flex;position:relative}.stage-wrap{background:var(--stage-bg);flex-direction:column;flex:none;align-items:center;min-width:0;display:flex}.stage{aspect-ratio:16/9;background:var(--stage-bg);width:100%;position:relative;overflow:hidden}.board,.screen-video{width:100%;height:100%;display:block;position:absolute;inset:0}.board{touch-action:none;background:#fff}.board[data-kind=pdf]{background:0 0}.pdf-page{object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none;background:#fff;width:100%;height:100%;position:absolute;inset:0}.pdf-page[data-broken]{color:#0000;content-visibility:hidden}#room:not([data-role=teacher]) .board{touch-action:auto}.cam{pointer-events:none;background:#2a2f37;border-radius:8px;position:absolute;box-shadow:0 2px 8px #0006}.banner{inset-inline:8px;color:#fff;text-align:center;background:#000000b8;border-radius:8px;padding:6px 12px;position:absolute;top:8px}.tools{scrollbar-width:none;background:var(--panel);border-bottom:1px solid var(--line);align-items:center;gap:2px;width:100%;padding:4px 8px;display:flex;overflow-x:auto}.tools .sep{background:var(--line);flex:0 0 1px;align-self:stretch;margin:4px 6px}.icon,.swatch,.width{width:var(--tap);height:var(--tap);cursor:pointer;background:0 0;border:0;border-radius:8px;flex:none;place-items:center;padding:0;display:inline-grid}.icon.on,.swatch.on,.width.on{background:color-mix(in srgb, var(--accent) 16%, transparent);color:var(--accent)}.icon:disabled{opacity:.35;cursor:default}.swatch:before{content:"";background:var(--c);width:20px;height:20px;box-shadow:0 0 0 1px var(--line);border-radius:50%}.width:before{content:"";width:calc(var(--w) * 1.4px + 3px);height:calc(var(--w) * 1.4px + 3px);background:currentColor;border-radius:50%}.page-no{text-align:center;font-variant-numeric:tabular-nums;min-width:2ch}[dir=rtl] .flip svg{transform:scaleX(-1)}.side{background:var(--panel);flex-direction:column;flex:auto;min-height:0;display:flex;position:relative}.pin{border-bottom:1px solid var(--line);background:color-mix(in srgb, var(--accent) 8%, var(--panel));flex:none;gap:6px;max-height:4.6em;padding:6px 12px;display:flex;overflow:hidden}.pin b{text-overflow:ellipsis;white-space:nowrap;unicode-bidi:isolate;flex:none;max-width:40%;overflow:hidden}.pin span{overflow-wrap:anywhere;-webkit-line-clamp:2;unicode-bidi:isolate;-webkit-box-orient:vertical;min-width:0;display:-webkit-box;overflow:hidden}.msgs{overflow-anchor:none;overscroll-behavior:contain;flex:auto;min-height:0;margin:0;padding:4px 0;list-style:none;overflow-y:auto}.msg{padding:4px 12px}.msg .name{text-overflow:ellipsis;white-space:nowrap;max-width:100%;color:var(--muted);unicode-bidi:isolate;font-size:13px;display:block;overflow:hidden}.msg.teacher .name{color:var(--teacher)}.msg .text{white-space:pre-wrap;overflow-wrap:anywhere;unicode-bidi:isolate;margin:0}.msg.mine .text{color:var(--accent)}.new-pill{inset-inline:0;background:var(--accent);width:max-content;max-width:calc(100% - 24px);color:var(--accent-ink);cursor:pointer;white-space:nowrap;border:0;border-radius:999px;margin-inline:auto;padding:4px 14px;position:absolute;bottom:64px}.compose{border-top:1px solid var(--line);flex:none;align-items:flex-end;gap:6px;padding:8px;display:flex}.compose textarea{min-width:0;min-height:var(--tap);border:1px solid var(--line);background:var(--bg);resize:none;field-sizing:content;unicode-bidi:plaintext;border-radius:10px;flex:auto;max-height:7.5em;padding:8px 10px}.send{color:var(--accent)}.send[data-wait]:not([data-wait=""]) svg{display:none}.send[data-wait]:not([data-wait=""]):after{content:attr(data-wait);font-variant-numeric:tabular-nums;color:var(--muted)}.drawer-btn,.overlay{display:none}#room[data-screen=full] .overlay,#room[data-screen=lobby] .overlay,#room[data-screen=joining] .overlay{z-index:10;background:var(--overlay);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:24px;display:flex;position:absolute;inset:0}#room[data-screen=joining] .overlay{pointer-events:none;background:0 0}#room[data-screen=joining] .overlay .act{pointer-events:auto}#room[data-screen=joining] .stage{background:linear-gradient(100deg,#1d2128 40%,#2a2f38 50%,#1d2128 60%) 0 0/300% 100%;animation:1.6s linear infinite skeleton}#room[data-screen=joining] .stage>*,#room[data-screen=joining] .side>*{visibility:hidden}@keyframes skeleton{to{background-position:-150% 0}}@media (prefers-reduced-motion:reduce){#room[data-screen=joining] .stage{animation:none}}.say{max-width:32ch;margin:0;font-size:20px;font-weight:600}#room[data-screen=joining] .say{background:var(--overlay);border-radius:10px;padding:8px 16px}.lobby-time{color:var(--muted);margin:0;font-size:20px}.lobby-count{font-variant-numeric:tabular-nums;margin:0;font-size:48px;font-weight:700}#room[data-form=tablet] .body,#room[data-form=desktop] .body{flex-direction:row}#room[data-form=tablet] .stage-wrap{flex:0 0 65%;justify-content:center}#room[data-form=desktop] .stage-wrap{flex:0 0 70%;justify-content:center}#room[data-form=tablet] .stage,#room[data-form=desktop] .stage{width:min(100%, calc((var(--app-h,100dvh) - var(--bar-h) - 64px) * 16 / 9))}#room[data-form=tablet] .side,#room[data-form=desktop] .side{border-inline-start:1px solid var(--line);flex:1 1 0;min-width:0}#room[data-form=phone-land] .bar{inset-inline:0;z-index:4;pointer-events:none;background:0 0;border:0;min-height:0;padding:6px 10px;position:absolute;top:0}#room[data-form=phone-land] .bar>*{pointer-events:auto}#room[data-form=phone-land] .count{color:#fff;background:#0009;border-radius:999px;padding:2px 10px}#room[data-form=phone-land] .text-btn{color:#fff;background:#0009;border:0;min-height:30px}#room[data-form=phone-land] .stage-wrap{flex:auto;justify-content:center;min-height:0}#room[data-form=phone-land] .stage{width:min(100%, calc(var(--app-h,100dvh) * 16 / 9))}#room[data-form=phone-land] .side{z-index:5;width:40%;display:none;position:absolute;inset-block:0;inset-inline-end:0;box-shadow:0 0 16px #00000059}#room[data-form=phone-land][data-drawer=open] .side{display:flex}#room[data-form=phone-land] .side:focus-within{width:100%}#room[data-form=phone-land] .drawer-btn{inset-inline-end:12px;z-index:6;color:#fff;background:#0009;border-radius:50%;display:inline-grid;position:absolute;bottom:12px}#room[data-form=phone-land][data-drawer=open] .drawer-btn{inset-inline-end:calc(40% + 12px)}.cam{overflow:hidden}.cam-video{object-fit:cover;width:100%;height:100%;display:block}#room:not([data-role=teacher]) .cam{transition:left .3s,top .3s,width .3s,height .3s}#room[data-role=teacher] .cam{pointer-events:auto;cursor:grab;touch-action:none}#room[data-role=teacher] .cam.dragging{cursor:grabbing;outline:2px solid var(--accent)}.cam-grip{cursor:nwse-resize;background:linear-gradient(135deg,#0000 50%,#fffc 50%);width:18px;height:18px;display:none;position:absolute;bottom:0;right:0}#room[data-role=teacher] .cam-grip{display:block}.watermark{white-space:nowrap;text-overflow:ellipsis;color:gray;opacity:.15;pointer-events:none;-webkit-user-select:none;user-select:none;unicode-bidi:isolate;max-width:80%;font-size:clamp(14px,3.2cqi,28px);font-weight:600;transition:left 1s,top 1s;position:absolute;overflow:hidden;transform:translate(-50%,-50%)}.stage{container-type:inline-size}.text-btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.text-btn.quiet{min-height:30px;color:var(--muted);background:0 0;border-color:#0000;padding:0 8px}.tag{background:color-mix(in srgb, var(--muted) 16%, transparent);color:var(--muted);white-space:nowrap;border-radius:999px;flex:none;padding:1px 8px;font-size:12px}.tag.live{background:var(--ok);color:#fff}.tag.shown{background:color-mix(in srgb, var(--accent) 16%, transparent);color:var(--accent)}.tag.danger{background:color-mix(in srgb, var(--danger) 12%, transparent);color:var(--danger)}.empty{color:var(--muted);text-align:center;margin:0;padding:16px 8px;list-style:none}.dock{border-top:1px solid var(--line);flex:none;align-items:flex-end;gap:6px;padding:8px;display:flex}.dock .compose{border-top:0;flex:auto;min-width:0;padding:0}.hand-btn{min-height:var(--tap);border:1px solid var(--line);background:var(--panel);cursor:pointer;border-radius:10px;flex:none;max-width:42%;padding:4px 12px;line-height:1.25}.hand-btn[data-state=up]{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, var(--panel));color:var(--accent)}.hand-btn[data-state=speaking]{border-color:var(--ok);background:var(--ok);color:#fff}.hand-btn[data-state=blocked]{color:var(--danger);border-color:currentColor;font-size:13px}.hand-fab{display:none}#room[data-form=phone-land][data-role=student] .hand-fab{inset-inline-start:12px;z-index:6;color:#fff;background:#0009;border:0;max-width:40%;display:block;position:absolute;bottom:12px}#room[data-form=phone-land] .dock .hand-btn{display:none}.strip{border-top:1px solid var(--line);flex-wrap:wrap;flex:none;align-items:center;gap:6px;padding:6px 8px;display:flex}.meter-label{color:var(--muted);white-space:nowrap;flex:none;font-size:13px}.chip{min-height:calc(var(--tap) - 8px);border-radius:999px;flex:none;padding:0 12px}.chip.yes[aria-pressed=true]{border-color:var(--ok);background:var(--ok);color:#fff}.chip.no[aria-pressed=true]{border-color:var(--danger);background:var(--danger);color:#fff}.chip.ask{margin-inline-start:auto}.mcq-card{overscroll-behavior:contain;background:var(--panel);border-bottom:1px solid var(--line);flex-direction:column;flex:none;gap:8px;max-height:60%;padding:10px 12px;display:flex;overflow-y:auto}.mcq-card>*,.ask-sheet>*,.pane>*{flex-shrink:0}.sheet-head{align-items:center;gap:8px;display:flex}.sheet-head .quiet{margin-inline-start:auto}.q-text{white-space:pre-wrap;overflow-wrap:anywhere;unicode-bidi:isolate;margin:0;font-weight:600}.q-img{object-fit:contain;background:#fff;border-radius:6px;align-self:center;max-width:100%;max-height:28vh;display:block}.opts{gap:6px;margin:0;padding:0;list-style:none;display:grid}.opt{isolation:isolate;border:1px solid var(--line);background:var(--panel);text-align:start;cursor:pointer;border-radius:10px;align-items:center;gap:10px;width:100%;min-height:48px;padding:8px 12px;display:flex;position:relative;overflow:hidden}.opt:before{content:"";z-index:-1;width:var(--p,0%);background:color-mix(in srgb, var(--accent) 14%, transparent);position:absolute;inset-block:0;inset-inline-start:0}.opt:disabled{color:inherit;cursor:default}.opt .letter{background:var(--bg);border-radius:50%;flex:none;place-items:center;width:28px;height:28px;font-weight:700;display:inline-grid}.opt-text{overflow-wrap:anywhere;unicode-bidi:isolate;flex:auto;min-width:0}.opt .pct{font-variant-numeric:tabular-nums;flex:none;font-weight:600}.opt.mine{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.opt.mine .letter{background:var(--accent);color:var(--accent-ink)}.opt.correct{border-color:var(--ok);box-shadow:inset 0 0 0 1px var(--ok)}.opt.correct .letter{background:var(--ok);color:#fff}.opt.correct:after{content:"✓";color:var(--ok);flex:none;font-weight:700}.opt.wrong{border-color:var(--danger)}#room[data-form=phone] .mcq-card:not(.teacher){border-top:1px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0;flex:0 auto;order:1;max-height:85%;box-shadow:0 -6px 18px #0000002e}#room[data-form=phone] .strip,#room[data-form=phone] .dock{order:2}#room[data-form=phone] .msgs{flex-basis:0;min-height:40px}#room[data-form=phone-land][data-sheet=mcq] .side{display:flex}#room[data-form=phone-land][data-sheet=mcq]:not([data-drawer=open]) .side>:not(.mcq-card){display:none}#room[data-form=phone-land][data-sheet=mcq]:not([data-drawer=open]) .mcq-card:not(.teacher){flex:auto;max-height:none}#room[data-form=phone-land][data-sheet=mcq] .drawer-btn{inset-inline-end:calc(40% + 12px)}.ask-sheet{overscroll-behavior:contain;flex-direction:column;flex:auto;gap:8px;min-height:0;padding:10px 12px;display:none;overflow-y:auto}.side[data-view=asks] .ask-sheet{display:flex}.side[data-view=asks]>.msgs,.side[data-view=asks]>.new-pill{display:none}.ask-form{align-items:flex-end;gap:6px;display:flex}.ask-form textarea{min-width:0;min-height:var(--tap);border:1px solid var(--line);background:var(--bg);resize:none;field-sizing:content;unicode-bidi:plaintext;border-radius:10px;flex:auto;max-height:7.5em;padding:8px 10px}.ask-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.ask{border:1px solid var(--line);border-radius:10px;padding:8px 10px}.ask.shown{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 6%, var(--panel))}.ask .name{text-overflow:ellipsis;white-space:nowrap;color:var(--muted);unicode-bidi:isolate;font-size:13px;display:block;overflow:hidden}.ask .text{white-space:pre-wrap;overflow-wrap:anywhere;unicode-bidi:isolate;margin:2px 0 6px}.ask-foot{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.votes{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:600}.tabs{border-bottom:1px solid var(--line);flex-wrap:wrap;flex:none;gap:2px;padding:4px 6px 0;display:flex}.tab{min-height:36px;color:var(--muted);white-space:nowrap;cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;flex:none;align-items:center;gap:6px;padding:0 10px;display:inline-flex}.tab[aria-selected=true]{border-bottom-color:var(--accent);color:var(--ink);font-weight:600}.badge{background:var(--danger);color:#fff;text-align:center;font-variant-numeric:tabular-nums;border-radius:999px;min-width:18px;height:18px;padding:0 5px;font-size:12px;line-height:18px}.meter{border-bottom:1px solid var(--line);flex-wrap:wrap;flex:none;align-items:center;gap:4px 8px;padding:6px 10px;font-size:14px;display:flex}.meter-nums b{font-variant-numeric:tabular-nums}.meter-bar{background:linear-gradient(to left, var(--ok) var(--yes), var(--danger) var(--yes));border-radius:999px;flex:60px;height:8px}[dir=ltr] .meter-bar{background:linear-gradient(to right, var(--ok) var(--yes), var(--danger) var(--yes))}.meter-bar[data-empty=true]{background:var(--line)}.pane{overscroll-behavior:contain;flex-direction:column;flex:auto;gap:8px;min-height:0;padding:8px 10px;display:none;overflow-y:auto}.side[data-tab=hands]>.pane[data-pane=hands],.side[data-tab=mcq]>.pane[data-pane=mcq],.side[data-tab=asks]>.pane[data-pane=asks],.side[data-tab=roster]>.pane[data-pane=roster]{display:flex}.side[data-tab]:not([data-tab=chat])>:is(.pin,.msgs,.new-pill,.compose){display:none}.pane-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.rows{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.row{border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:6px 8px;padding:8px 2px;display:flex}.row .name{text-overflow:ellipsis;white-space:nowrap;unicode-bidi:isolate;flex:8em;min-width:0;overflow:hidden}.row .acts{flex-wrap:wrap;gap:6px;margin-inline-start:auto;display:flex}.row.live{background:color-mix(in srgb, var(--ok) 8%, transparent)}.row.away .name{color:var(--muted)}.timer{font-variant-numeric:tabular-nums;font-weight:600}.dot{background:var(--line);border-radius:50%;flex:none;width:8px;height:8px}.dot.on{background:var(--ok)}.prep-text{overflow-wrap:anywhere;-webkit-line-clamp:2;unicode-bidi:isolate;-webkit-box-orient:vertical;flex:12em;min-width:0;margin:0;display:-webkit-box;overflow:hidden}.row.used .prep-text{color:var(--muted)}.mcq-card.teacher{border:1px solid var(--line);border-radius:10px;max-height:none}.mcq-card .acts{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.answered{color:var(--muted);margin-inline-end:auto}.msg.pickable{cursor:pointer}.msg.picked{background:color-mix(in srgb, var(--accent) 8%, transparent)}.msg-acts{gap:6px;margin-top:4px;display:flex}.pin .quiet{flex:none;margin-inline-start:auto}[data-gone]{opacity:.4}.row .confirm{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--danger);unicode-bidi:isolate;flex:8em;font-weight:600;overflow:hidden}
