/* EduInteractive 28 — shared interface. Loaded after legacy page styles. */
html body.ui-v28{--navy:#122b4b;--blue:#215bd6;--muted:#5f7086;--line:#dde5ef;--v13-bg:#f3f6fb;background:#f3f6fb;color:#24364d;font:15px/1.65 'Segoe UI',Arial,sans-serif;overflow-wrap:break-word}
html body.ui-v28 *,html body.ui-v28 *:before,html body.ui-v28 *:after{box-sizing:border-box}
html body.ui-v28 [hidden]{display:none!important}
html body.ui-v28 :is(h1,h2,h3,p){overflow-wrap:anywhere}
html body.ui-v28 :is(button,a,input,select,textarea):focus-visible{outline:3px solid #4c85ee;outline-offset:3px}
html body.ui-v28 :is(.app-shell,.student-shell-v11){display:block!important;min-height:100vh!important;width:100%!important;background:#f3f6fb!important}
html body.ui-v28 .app-shell>.sidebar{position:fixed!important;inset:0 auto 0 0!important;transform:none!important;width:256px!important;height:100vh!important;height:100dvh!important;z-index:100!important;padding:20px 12px!important;background:#102b49!important;border:0!important;box-shadow:none!important;overflow-y:auto!important}
html body.ui-v28 .app-main{margin:0 0 0 256px!important;width:calc(100% - 256px)!important;max-width:none!important;min-width:0!important;background:transparent!important}
html body.ui-v28 .sidebar .side-brand{padding:8px 10px 22px!important;gap:10px!important}
html body.ui-v28 .sidebar .side-brand strong{font-size:15px!important;line-height:1.35!important;color:#fff!important}
html body.ui-v28 .sidebar .side-brand small{font-size:10px!important;color:#b6cce5!important;letter-spacing:.07em!important;margin-top:5px!important}
html body.ui-v28 .sidebar .side-brand img{max-width:52px!important;max-height:52px!important;object-fit:contain!important}
html body.ui-v28 .sidebar nav.side-menu{display:grid!important;gap:4px!important;padding:8px 0 24px!important}
html body.ui-v28 .sidebar nav.side-menu>b{font-size:10px!important;color:#a9c1df!important;margin:20px 12px 8px!important;letter-spacing:.13em!important}
html body.ui-v28 .sidebar nav.side-menu>a:not(.btn){display:flex!important;align-items:center!important;gap:10px!important;min-height:46px!important;padding:9px 12px!important;border:0!important;border-radius:10px!important;color:#e4edf7!important;font-size:13px!important;font-weight:600!important;background:transparent!important;box-shadow:none!important;transform:none!important}
html body.ui-v28 .sidebar nav.side-menu>a.active:not(.btn){background:#255ba0!important;color:#fff!important;box-shadow:inset 3px 0 #7dd3fc!important}
html body.ui-v28 .sidebar nav.side-menu>a:hover:not(.btn){background:#1c4168!important}
html body.ui-v28 .sidebar nav.side-menu>a>i{display:grid!important;place-items:center!important;flex:0 0 30px!important;width:30px!important;height:30px!important;background:#ffffff0d!important;color:inherit!important;border:0!important}
html body.ui-v28 :is(.topbar,.student-topbar-v11){position:sticky!important;top:0!important;z-index:45!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;padding:16px 30px!important;min-height:86px!important;background:#ffffffed!important;border-bottom:1px solid #dfe6ef!important;box-shadow:none!important;backdrop-filter:blur(12px)}
html body.ui-v28 :is(.topbar,.student-topbar-v11) h1{font-size:22px!important;line-height:1.25!important;margin:3px 0!important;color:#122b4b!important}
html body.ui-v28 :is(.topbar,.student-topbar-v11) small{font-size:12px!important;color:#5f7086!important}
html body.ui-v28 :is(.v10-top-kicker,.student-kicker-v11){font-size:10px!important;letter-spacing:.1em!important;color:#215bd6!important}
html body.ui-v28 :is(.content,.student-content-v11,.v11-admin-content){width:100%!important;max-width:1440px!important;margin:0 auto!important;padding:28px 30px 48px!important}
html body.ui-v28 :is(.panel,.v24-card,.q24-card,.game-play-v10){border:1px solid #dfe6ef!important;border-radius:18px!important;background:#fff!important;box-shadow:0 4px 18px #15365b05!important;min-width:0}
html body.ui-v28 :is(.panel-head,.v24-head,.q24-head){padding:20px 24px!important;background:#fff!important;border-bottom:1px solid #e6ebf2!important;flex-wrap:wrap;gap:12px}
html body.ui-v28 :is(.panel-head,.v24-head,.q24-head) :is(h2,h3){font-size:18px!important;line-height:1.4!important;color:#122b4b!important}
html body.ui-v28 :is(.panel-body,.v24-body,.q24-body){padding:24px!important}
html body.ui-v28 :is(.panel-head,.v24-head,.q24-head) small{font-size:12px!important;color:#5f7086!important;line-height:1.5}
html body.ui-v28 :is(.dashboard-hero,.v24-hero){border:0!important;border-radius:20px!important;padding:30px!important;background:linear-gradient(115deg,#123452,#175888)!important;box-shadow:none!important;color:#fff!important}
html body.ui-v28 :is(.dashboard-hero,.v24-hero) h2{font-size:clamp(22px,2.5vw,32px)!important;line-height:1.25!important;letter-spacing:-.025em!important;color:#fff!important;margin:9px 0!important}
html body.ui-v28 :is(.dashboard-hero,.v24-hero) p{font-size:14px!important;line-height:1.7!important;color:#dce9f6!important}
html body.ui-v28 :is(.dashboard-hero,.v24-hero) small{font-size:11px!important;color:#c1def5!important;letter-spacing:.1em}
html body.ui-v28 .status-card{background:#ffffff0c!important;border:1px solid #ffffff24!important;border-radius:14px!important;padding:20px!important}
html body.ui-v28 .status-card b{color:#b0ebda!important;font-size:12px!important}
html body.ui-v28 .btn{min-height:46px!important;max-width:100%;padding:11px 17px!important;border-radius:10px!important;font-size:14px!important;line-height:1.45!important;font-weight:650!important;letter-spacing:0!important;text-align:center;white-space:normal!important;word-break:normal;background:#215bd6!important;border:1px solid #215bd6!important;color:#fff!important;box-shadow:0 3px 8px #215bd61a!important;touch-action:manipulation}
html body.ui-v28 .btn:hover{background:#194bb5!important;transform:none!important}
html body.ui-v28 :is(.btn-secondary,.btn-ghost){background:#fff!important;border-color:#cfdae7!important;color:#284969!important;box-shadow:none!important}
html body.ui-v28 :is(.btn-secondary,.btn-ghost):hover{background:#edf3fd!important}
html body.ui-v28 .btn-danger{background:#b73349!important;border-color:#b73349!important}
html body.ui-v28 .btn-success{background:#137659!important;border-color:#137659!important}
html body.ui-v28 :is(button,.btn):disabled{opacity:.5!important;cursor:not-allowed!important;box-shadow:none!important;transform:none!important}
html body.ui-v28 :is(.form-grid,.v24-form-grid,.q24-form,.v1701-create-form,.v1501-editor-form){display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px!important;min-width:0}
html body.ui-v28 :is(.form-grid,.v24-form-grid,.q24-form)>.full{grid-column:1/-1!important}
html body.ui-v28 form :is(label,.v28-field-label){font-size:14px!important;color:#263e59!important;font-weight:600!important;line-height:1.55!important;min-width:0}
html body.ui-v28 form label:not(.check):not(:has(input[type=checkbox])):not(:has(input[type=radio])){display:flex;flex-direction:column;gap:7px}
html body.ui-v28 :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=color]),select,textarea){max-width:100%!important;width:100%;min-width:0!important;min-height:46px!important;border:1px solid #cbd7e5!important;border-radius:9px!important;background:#fff!important;color:#20364f!important;padding:11px 13px!important;font-size:16px!important;line-height:1.5!important;box-shadow:inset 0 1px 2px #18365704!important}
html body.ui-v28 textarea{min-height:108px!important;resize:vertical}
html body.ui-v28 input::placeholder,html body.ui-v28 textarea::placeholder{color:#77879a!important;font-weight:400!important;opacity:1}
html body.ui-v28 :is(input,textarea,select):focus{border-color:#3974df!important}
html body.ui-v28 :is(input[type=checkbox],input[type=radio]){width:20px!important;height:20px!important;min-width:20px!important;accent-color:#215bd6;margin:0 8px 0 0;flex-shrink:0}
html body.ui-v28 label.check,html body.ui-v28 :is(.v24-checks,.v24-classes) label{display:flex!important;align-items:center!important;gap:5px!important;min-height:48px!important;background:#f6f8fc!important;border:1px solid #dce5f0!important;border-radius:9px!important;padding:10px 12px!important}
html body.ui-v28 form :is(small,.v24-help,.v28-help){font-size:12px!important;color:#5f7086!important;line-height:1.55;font-weight:400!important}
html body.ui-v28 .v28-fieldset{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;min-width:0;margin:0;padding:22px;border:1px solid #e0e7f1;border-radius:13px;background:#fcfdff}
html body.ui-v28 .v28-fieldset legend{padding:0 8px;font-size:15px;font-weight:700;color:#153b63}
html body.ui-v28 .v28-fieldset .full{grid-column:1/-1!important}
html body.ui-v28 .v28-required{color:#b52b44;font-weight:700;font-size:11px;display:inline;margin-left:4px}
html body.ui-v28 .v28-form-note{grid-column:1/-1;margin:0;padding:11px 14px;border-radius:9px;background:#eef4ff;color:#345786;font-size:13px}
html body.ui-v28 :is(.v1701-create-submit,.v171-create-submit){background:#f4f7fd!important;border:1px solid #dce5f4!important;border-radius:12px!important;padding:18px!important;gap:14px!important}
html body.ui-v28 .v28-invalid{border-color:#bc3450!important;background:#fffafb!important}
html body.ui-v28 .v28-error{grid-column:1/-1;color:#aa243f!important;background:#fff1f3;border:1px solid #f0c8d0;border-radius:9px;padding:10px 14px;font-size:13px;margin:8px 0}
html body.ui-v28 :is(.v171-workflow){background:transparent!important;box-shadow:none!important;border:0!important;justify-content:flex-start!important;padding:15px 0!important;gap:16px!important}
html body.ui-v28 .v171-workflow span{font-size:12px!important;color:#4c637e!important}
html body.ui-v28 .v171-workflow span b{background:#e2ebfa!important;color:#215bd6!important}
html body.ui-v28 :is(.v171-game-picker,.interactive-game-cards){display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;gap:18px!important}
html body.ui-v28 :is(.v171-game-picker,.interactive-game-cards)>article{border:1px solid #dce5ef!important;border-radius:16px!important;padding:24px!important;background:#fff!important;box-shadow:0 3px 12px #15365b05!important;min-width:0;display:flex;flex-direction:column;transition:box-shadow .2s,border-color .2s}
html body.ui-v28 :is(.v171-game-picker,.interactive-game-cards)>article:hover{border-color:#9fbbe6!important;box-shadow:0 8px 25px #15365b0d!important}
html body.ui-v28 :is(.v171-game-picker,.interactive-game-cards) h3{font-size:19px!important;line-height:1.35!important;margin:12px 0!important;color:#163652!important}
html body.ui-v28 :is(.v171-game-picker,.interactive-game-cards) p{font-size:14px!important;color:#5b6e84!important;flex:1;line-height:1.65!important}
html body.ui-v28 :is(.v171-game-picker,.interactive-game-cards) small{font-size:11px!important;color:#506b87!important}
html body.ui-v28 :is(.game-meta,.meta){gap:8px;flex-wrap:wrap}
html body.ui-v28 .game-meta span{font-size:12px!important;padding:5px 9px!important;background:#eef3fb!important;color:#3c5571!important}
html body.ui-v28 .v1701-game-switch>a{padding:17px!important;border-radius:12px!important;box-shadow:none!important}
html body.ui-v28 .v1701-game-switch>a.active{background:#edf4ff!important;border-color:#79a2e7!important}
html body.ui-v28 .v1701-game-switch small{font-size:12px!important}
html body.ui-v28 .badge{font-size:11px!important;line-height:1.5!important;padding:5px 10px!important}
html body.ui-v28 .v171-guide span{font-size:13px!important}
html body.ui-v28 .v10-game-list article{padding:18px!important;gap:16px!important;flex-wrap:wrap}
html body.ui-v28 .v10-game-list article strong{font-size:16px!important}
html body.ui-v28 .v10-game-list article :is(small,span){font-size:12px!important}
html body.ui-v28 .actions{gap:9px!important;align-items:center;min-width:0}
html body.ui-v28 .table-wrap{max-width:100%;overflow:auto;overscroll-behavior-x:contain}
html body.ui-v28 :is(th,td){padding:13px 16px!important;font-size:13px!important;line-height:1.6}
html body.ui-v28 th{font-size:11px!important;background:#f3f6fb!important;color:#526880!important}
html body.ui-v28 .v28-table-hint{font-size:12px;color:#60748a;margin:0;padding:8px 16px}
html body.ui-v28 .v28-search{display:flex;align-items:center;gap:12px;margin:20px 0 14px}
html body.ui-v28 .v28-search label{flex:1;min-width:0;font-size:13px;font-weight:600;color:#375574}
html body.ui-v28 .v28-search input{margin-top:6px}
html body.ui-v28 .v28-search output{font-size:12px;color:#5b718a;white-space:nowrap}
html body.ui-v28 .v28-skip{position:fixed;top:-100px;left:16px;z-index:300;background:#fff;padding:12px;border:2px solid #215bd6;border-radius:8px}
html body.ui-v28 .v28-skip:focus{top:10px}
html body.ui-v28 .v28-mobile-toggle,html body.ui-v28 .v28-menu-close,html body.ui-v28 .v28-menu-overlay{display:none!important}
/* Game player */
html body.ui-v28 .game-play-head{padding:26px!important;background:linear-gradient(115deg,#163959,#1d5680)!important;color:#fff!important;gap:20px!important}
html body.ui-v28 .game-play-head h2{font-size:26px!important;line-height:1.3!important;color:#fff!important}
html body.ui-v28 .game-play-head p{font-size:14px!important;color:#dce8f6!important}
html body.ui-v28 .game-play-head aside{border-radius:12px!important;background:#ffffff12!important;padding:14px!important;min-width:0}
html body.ui-v28 .interactive-game-form{padding:24px!important}
html body.ui-v28 .game-instruction{font-size:14px!important;padding:16px!important;color:#2b4c74!important;background:#edf4ff!important;border-radius:11px!important;margin:0 0 20px!important}
html body.ui-v28 .word-puzzle-card{border:1px solid #dce6f3!important;border-radius:16px!important;padding:26px!important;background:#fbfdff!important;min-width:0}
html body.ui-v28 .word-puzzle-card p{font-size:18px!important;line-height:1.7!important;color:#28425e!important;margin:20px 0!important}
html body.ui-v28 .scramble{font-size:clamp(21px,4vw,34px)!important;letter-spacing:.17em!important;line-height:1.8!important;color:#1f5abe!important;overflow-wrap:anywhere!important;word-break:break-word!important;white-space:normal!important}
html body.ui-v28 .seq-progress-v141{padding:14px 0!important;background:transparent!important;border:0!important;font-size:12px!important;margin-bottom:12px!important;color:#31587e!important}
html body.ui-v28 .seq-nav-v141{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px!important;justify-content:space-between}
html body.ui-v28 .game-submit-v10{width:100%;margin:22px 0 0!important;min-height:50px!important}
html body.ui-v28 .v28-completion{font-size:13px;color:#42678d;padding:10px 0}
html body.ui-v28 .spin-play-v11{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:24px!important;padding:0!important}
html body.ui-v28 .spin-wheel-shell-v11{width:min(100%,360px)!important;aspect-ratio:1;--spin-radius:125px}
html body.ui-v28 .spin-wheel-label-v11{transform:rotate(calc(360deg * (var(--i) + .5) / var(--n))) translateY(calc(-1 * var(--spin-radius))) rotate(calc(-360deg * (var(--i) + .5) / var(--n)))!important}
html body.ui-v28 .spin-question-v11{padding:22px!important;background:#f6f9ff!important;border:1px solid #dbe6f4!important;border-radius:15px!important;min-width:0}
html body.ui-v28 .spin-question-v11 h3{font-size:22px!important;line-height:1.55!important;color:#173754!important}
html body.ui-v28 .spin-question-v11 :is(p,label){font-size:14px!important;color:#45627f!important}
html body.ui-v28 .spin-question-v11 .btn{width:100%;margin-top:16px}
html body.ui-v28 .crossword-layout{display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(250px,.75fr)!important;gap:22px!important;padding:0!important;align-items:start}
html body.ui-v28 .v28-grid-scroll{max-width:100%;min-width:0;overflow:auto;overscroll-behavior:contain;padding:10px;border:1px solid #dbe4f0;border-radius:12px;background:#eaf0f8;max-height:65vh}
html body.ui-v28 .crossword-grid{display:grid!important;grid-template-columns:repeat(var(--cw-cols),40px)!important;grid-auto-rows:40px!important;width:max-content!important;max-width:none!important;gap:3px!important;padding:0!important;background:transparent!important;border:0!important;overflow:visible!important}
html body.ui-v28 :is(.crossword-cell,.crossword-blank){width:40px!important;height:40px!important;min-width:40px!important;border-radius:5px!important;margin:0!important;display:block!important}
html body.ui-v28 .crossword-cell{position:relative;border:1px solid #c1cedf!important;background:#fff!important}
html body.ui-v28 .crossword-cell input{width:38px!important;height:38px!important;min-height:38px!important;min-width:0!important;padding:7px 0 0!important;border:0!important;border-radius:4px!important;text-align:center!important;font-size:19px!important;font-weight:700!important;background:transparent!important;color:#345171!important}
html body.ui-v28 .crossword-cell small{position:absolute!important;top:0!important;left:3px!important;font-size:9px!important;z-index:1;line-height:1.1!important;pointer-events:none}
html body.ui-v28 .crossword-cell.active-focus{background:#e1edff!important;border:2px solid #5289db!important;box-shadow:none!important}
html body.ui-v28 .crossword-cell.active-focus input{width:36px!important;height:36px!important;min-height:36px!important;color:#164892!important}
html body.ui-v28 .crossword-blank{background:#d5dfeb!important;opacity:.5}
html body.ui-v28 .crossword-clues{position:static!important;padding:20px!important;min-width:0;background:#f7faff!important;border:1px solid #dce6f5!important;border-radius:13px!important}
html body.ui-v28 .crossword-clues .seq-clue-v141{font-size:16px!important;line-height:1.7!important;color:#244465!important}
html body.ui-v28 .crossword-clues .muted{font-size:12px!important}
html body.ui-v28 :is(.quiz-page,.live-student-page){background:#f3f6fb}
html body.ui-v28.quiz-page,html body.ui-v28.live-student-page{background:#f3f6fb!important;color:#233d5b!important;min-height:100vh}
html body.ui-v28 :is(.quiz-top,.live-student-top){background:#133351!important;border-bottom:0!important;color:#fff!important;padding:18px 24px!important;gap:16px}
html body.ui-v28 :is(.quiz-top,.live-student-top) :is(a,small,strong,span){color:#e8f1ff!important}
html body.ui-v28 .quiz-wrap{width:min(900px,calc(100% - 32px))!important;padding:28px 0!important;margin:auto!important}
html body.ui-v28 .q-card{padding:30px!important;background:#fff!important;border:1px solid #dce5f1!important;border-radius:20px!important;box-shadow:0 8px 25px #14365b06!important}
html body.ui-v28 .q-card h2{font-size:clamp(20px,3vw,28px)!important;line-height:1.55!important;color:#173b61!important}
html body.ui-v28 .q-number{font-size:12px!important;color:#436688!important}
html body.ui-v28 .options{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:13px!important}
html body.ui-v28 .option{min-width:0;position:relative}
html body.ui-v28 .option input{position:absolute!important;opacity:0;display:block!important;top:20px;left:12px}
html body.ui-v28 .option label{min-height:76px!important;display:flex!important;flex-direction:row!important;gap:10px!important;align-items:center!important;background:#f8faff!important;border:2px solid #dce5f1!important;border-radius:12px!important;color:#2c4665!important;font-size:16px!important;line-height:1.55!important;padding:17px!important;cursor:pointer}
html body.ui-v28 .option input:checked+label{background:#eaf1ff!important;border-color:#215bd6!important;color:#174492!important;box-shadow:inset 4px 0 #215bd6!important}
html body.ui-v28 .option input:focus-visible+label{outline:3px solid #5285e3;outline-offset:3px}
html body.ui-v28 .quiz-nav{display:flex;gap:12px;justify-content:space-between;margin-top:18px}
html body.ui-v28 .live-student-wrap{max-width:980px;padding:30px 0!important}
html body.ui-v28 :is(.live-join-card,.live-wait,.live-question-card,.live-answer-result,.live-leader-card){background:#fff!important;border:1px solid #dce5f1!important;box-shadow:0 8px 25px #14365b08!important;color:#234261!important;padding:30px!important;backdrop-filter:none!important}
html body.ui-v28 .live-join-card{margin:5vh auto!important}
html body.ui-v28 :is(.live-join-card,.live-wait,.live-question-card) h1{font-size:clamp(23px,4vw,34px)!important;line-height:1.4}
html body.ui-v28 :is(.live-join-card,.live-answer-result) :is(p,small){color:#5c728a!important}
html body.ui-v28 .live-join-card .eyebrow{background:#eaf2ff;color:#275ea8;border:0}
html body.ui-v28 .live-option{border-radius:12px!important;font-size:16px!important;min-height:86px!important;line-height:1.55;min-width:0}
html body.ui-v28 .live-option span{flex-shrink:0}
html body.ui-v28 .live-option.c0{background:#b8334b!important}.ui-v28 .live-option.c1{background:#235bb8!important}.ui-v28 .live-option.c2{background:#845810!important}.ui-v28 .live-option.c3{background:#137451!important}
html body.ui-v28 .live-question-head span,html body.ui-v28 .live-leader-card>small{color:#315d9a!important}
html body.ui-v28 .live-rank{background:#f1f5fb!important}.ui-v28 .live-rank em{color:#2255a2!important}.ui-v28 .live-rank span small{color:#5e7389!important}
html body.ui-v28 .pin-input{font-size:28px!important;letter-spacing:.3em!important;min-height:64px!important}
html body.ui-v28 .v28-timer-warning{color:#a42639!important;background:#fff0f2!important;border-radius:6px;padding:3px 7px}
html body.ui-v28 .public-shell{width:min(1020px,100%);margin:auto;padding:30px}
html body.ui-v28 .public-hero{background:linear-gradient(110deg,#133657,#1c5887);border-radius:18px;padding:30px;color:#fff;margin:18px 0 24px}
html body.ui-v28 .public-hero h1{font-size:clamp(25px,4vw,36px);line-height:1.3;margin:12px 0}
html body.ui-v28 .public-card{background:#fff;border:1px solid #dce5ef;border-radius:16px;padding:24px;margin-bottom:20px}
html body.ui-v28 .public-card h2{font-size:20px;color:#153b62;margin-top:0}
html body.ui-v28 .public-hero .meta{display:flex;gap:8px}
html body.ui-v28 .public-hero .meta span{font-size:12px;background:#ffffff17;border:1px solid #ffffff24;padding:5px 10px;border-radius:20px}
html body.ui-v28 .public-result{text-align:center}.ui-v28 .public-result .score{font-size:72px;font-weight:800;color:#2059c8;line-height:1.3}
html body.ui-v28 .public-footer{text-align:center;color:#60758b;font-size:12px;padding:20px}
@media(max-width:1180px){html body.ui-v28 .v171-game-picker{grid-template-columns:repeat(2,minmax(0,1fr))!important}html body.ui-v28 :is(.split,.q24-grid,.crossword-layout){grid-template-columns:1fr!important}}
@media(max-width:960px){
 html body.ui-v28 .app-shell>.sidebar{left:0!important;transform:translateX(-105%)!important;width:min(300px,86vw)!important;transition:transform .2s ease!important;visibility:hidden!important;z-index:160!important}
 html body.ui-v28 .app-shell>.sidebar.open{transform:translateX(0)!important;visibility:visible!important}
 html body.ui-v28 .app-main{margin:0!important;width:100%!important;max-width:100%!important}
 html body.ui-v28 .v28-mobile-toggle{display:inline-flex!important;flex:0 0 46px;width:46px!important;padding:8px!important;font-size:21px!important}
 html body.ui-v28 .v28-menu-close{display:flex!important;margin:0 0 12px auto;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #7491b1;border-radius:9px;background:#1c4168;color:#fff;font-size:24px}
 html body.ui-v28 .v28-menu-overlay:not([hidden]){display:block!important;position:fixed;inset:0;z-index:150;background:#07172baa;border:0;width:100%;height:100%}
 html body.ui-v28.v28-menu-open{overflow:hidden}
 html body.ui-v28 :is(.topbar,.student-topbar-v11){padding:13px 18px!important;gap:12px!important;min-height:76px!important}
 html body.ui-v28 :is(.content,.student-content-v11,.v11-admin-content){padding:22px 18px 40px!important}
 html body.ui-v28 .dashboard-hero{grid-template-columns:1fr!important}
 html body.ui-v28 .dashboard-hero .status-card{display:none!important}
 html body.ui-v28 .spin-play-v11{grid-template-columns:1fr!important}
 html body.ui-v28 .spin-wheel-shell-v11{width:min(100%,340px)!important}
}
@media(max-width:640px){
 html body.ui-v28 :is(.form-grid,.v24-form-grid,.q24-form,.v1701-create-form,.v1501-editor-form,.v28-fieldset,.v1701-game-switch,.v171-game-picker,.interactive-game-cards,.v171-guide,.v24-classes,.options,.live-options,.grid){grid-template-columns:minmax(0,1fr)!important}
 html body.ui-v28 :is(.topbar,.student-topbar-v11) h1{font-size:18px!important}
 html body.ui-v28 :is(.user-chip,.student-account-v11){display:none!important}
 html body.ui-v28 :is(.content,.student-content-v11,.v11-admin-content){padding:16px 12px 32px!important}
 html body.ui-v28 :is(.panel-head,.v24-head,.q24-head){padding:18px 16px!important}
 html body.ui-v28 :is(.panel-body,.v24-body,.q24-body,.interactive-game-form,.q-card,.public-card){padding:18px 16px!important}
 html body.ui-v28 :is(.dashboard-hero,.v24-hero,.public-hero){padding:23px 20px!important}
 html body.ui-v28 .v28-fieldset{padding:16px 12px!important;gap:17px}
 html body.ui-v28 .v1701-game-switch{gap:8px!important}
 html body.ui-v28 .v1701-game-switch>a{padding:12px 15px!important}
 html body.ui-v28 .v171-workflow{gap:9px!important;padding:12px 0!important}.ui-v28 .v171-workflow i{display:none}
 html body.ui-v28 .v171-workflow span{font-size:11px!important}.ui-v28 .v171-workflow span b{width:22px;height:22px}
 html body.ui-v28 .v1501-head-actions{position:static!important;flex-wrap:wrap}
 html body.ui-v28 :is(.game-play-head){grid-template-columns:1fr!important;padding:22px 18px!important}
 html body.ui-v28 .game-play-head h2{font-size:23px!important}
 html body.ui-v28 .game-play-head aside{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:10px!important}
 html body.ui-v28 .game-play-head aside strong{font-size:21px!important}
 html body.ui-v28 .word-puzzle-card{padding:20px 16px!important}
 html body.ui-v28 .word-puzzle-card p{font-size:16px!important}
 html body.ui-v28 .seq-nav-v141 .btn{flex:1;min-width:110px}
 html body.ui-v28 .crossword-clues{order:-1!important;padding:16px!important}
 html body.ui-v28 .v28-grid-scroll{max-height:48vh;padding:6px}
 html body.ui-v28 .spin-wheel-shell-v11{width:min(100%,290px)!important;--spin-radius:97px}
 html body.ui-v28 .spin-wheel-label-v11{width:23px;height:23px;margin:-11.5px;font-size:10px}
 html body.ui-v28 :is(.live-join-card,.live-wait,.live-question-card,.live-answer-result,.live-leader-card){padding:22px 17px!important;border-radius:16px!important}
 html body.ui-v28 .live-student-top{display:flex!important;flex-wrap:wrap;justify-content:space-between;padding:14px 16px!important}
 html body.ui-v28 .live-student-top>span{width:100%;text-align:left!important}
 html body.ui-v28 .live-options{gap:10px!important}.ui-v28 .live-option{min-height:72px!important}
 html body.ui-v28 .quiz-top{display:flex!important;flex-wrap:wrap;padding:15px 16px!important}
 html body.ui-v28 .quiz-hud{gap:8px!important;flex-wrap:wrap}
 html body.ui-v28 .quiz-wrap{padding:18px 0!important;width:calc(100% - 24px)!important}
 html body.ui-v28 .quiz-nav .btn{flex:1;padding:10px!important}
 html body.ui-v28 .public-shell{padding:14px 12px}
 html body.ui-v28 .v28-search{align-items:flex-end}.ui-v28 .v28-search output{padding-bottom:10px}
 html body.ui-v28 .v28-mobile-table{display:block!important;min-width:0!important;width:100%!important}
 html body.ui-v28 .v28-mobile-table thead{display:none}
 html body.ui-v28 .v28-mobile-table tbody{display:grid!important;gap:12px;padding:12px}
 html body.ui-v28 .v28-mobile-table tr{display:block!important;border:1px solid #dce5ef;border-radius:12px;padding:6px 12px;background:#fff}
 html body.ui-v28 .v28-mobile-table td{display:grid!important;grid-template-columns:minmax(75px,.35fr) minmax(0,1fr);gap:12px;padding:10px 0!important;font-size:13px!important;min-width:0;overflow-wrap:anywhere}
 html body.ui-v28 .v28-mobile-table td:before{content:attr(data-label);color:#60748c;font-size:11px;font-weight:600;padding-top:2px}
 html body.ui-v28 .v28-mobile-table td:last-child{border-bottom:0}
 html body.ui-v28 .v28-mobile-table td[colspan]{display:block!important}
 html body.ui-v28 .v28-mobile-table td[colspan]:before{display:none}
 html body.ui-v28 .v28-mobile-table .actions{flex-direction:column;align-items:stretch}.ui-v28 .v28-mobile-table .actions form{width:100%}
 html body.ui-v28 .v28-mobile-table .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){html body.ui-v28 *,html body.ui-v28 *:before{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media print{html body.ui-v28 :is(.v28-mobile-toggle,.v28-menu-close,.v28-menu-overlay,.v28-skip){display:none!important}}
/* Required markers stay on the caption line, never between caption and input. */
html body.ui-v28 form label:has(>.v28-required){position:relative;padding-top:0}
html body.ui-v28 form label>.v28-required{position:absolute;right:0;top:2px;margin:0;font-size:10px;background:#fff3f5;color:#a62943;padding:1px 6px;border-radius:4px}
html body.ui-v28 .v28-help{font-size:13px;color:#5f7086}
html body.ui-v28 .live-answer-result>div{color:white}
html body.ui-v28 .live-question-head b{background:#edf3ff;color:#244d88}
html body.ui-v28 .crossword-clues .seq-clue-v141 :is(span,b){font-size:16px!important;line-height:1.65!important}
html body.ui-v28 .crossword-clues .seq-clue-v141{padding:13px!important;gap:10px!important}
html body.ui-v28 .game-setting-field{min-width:0!important;display:flex;flex-direction:column;gap:7px}
html body.ui-v28 .game-setting-field>label{font-size:14px!important;font-weight:600!important}
@media(min-width:1181px){html body.ui-v28 .v171-game-picker{grid-template-columns:repeat(5,minmax(0,1fr))!important}html body.ui-v28 .v171-game-picker>article{padding:18px!important}}
html body.ui-v28 .v21-share-box{display:grid;grid-template-columns:minmax(0,1fr) 100px auto;gap:18px;align-items:end}
html body.ui-v28 .share-pin{font-size:26px;font-weight:700;letter-spacing:.12em;color:#1c4a7d}
@media(max-width:960px){html body.ui-v28 .v21-share-box{grid-template-columns:minmax(0,1fr)}html body.ui-v28 .v1501-save-bar{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:14px!important}}
