:root{--bg:#07111e;--panel:#102238;--panel2:#142b45;--text:#f6fbff;--muted:#9fb4c8;--green:#25d08a;--cyan:#28c8da;--orange:#ff9b42;--danger:#ff6275;--line:#27425d;--shadow:0 18px 50px #0006}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 15% -10%,#163a55 0,#07111e 42%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #28c8da88;outline-offset:2px}[hidden]{display:none!important}.topbar{height:70px;position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:16px;padding:10px clamp(14px,3vw,30px);background:#08111ff2;backdrop-filter:blur(18px);border-bottom:1px solid #1d344b}.global-back{border:1px solid var(--line);border-radius:12px;padding:9px 12px;background:#102238;color:#fff;font-weight:800;white-space:nowrap}.global-back:hover:not(:disabled){background:#1a3551}.global-back:disabled{opacity:.38;cursor:default}.brand{border:0;background:transparent;color:#fff;font-size:25px;font-weight:900;letter-spacing:.2px}.brand small{font-size:10px;color:var(--muted);margin-left:6px}.brand-v{color:#DA251D}.brand-n{color:#FFCD00}.brand-i{color:#28c8da}.brand-q{color:#ff9b42}.active-label{font-weight:750;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-actions{display:flex;gap:8px}.ghost,.secondary,.danger,.primary,.chip{border-radius:12px;border:1px solid var(--line);padding:10px 14px;background:#13283e;color:#fff}.primary{background:linear-gradient(135deg,var(--green),var(--cyan));color:#04131a;border:0;font-weight:850}.secondary:hover,.ghost:hover{background:#1a3551}.danger{border-color:#803648;background:#3d1d29}.chip{padding:7px 10px;border-radius:999px;color:var(--muted)}main{max-width:1320px;margin:auto;padding:26px 22px 105px}.startup,.fatal{margin:60px auto;max-width:650px;padding:28px;border:1px solid var(--line);border-radius:20px;background:#102238;text-align:center}.hero{display:grid;grid-template-columns:1.6fr .85fr;gap:18px;align-items:stretch}.hero-card,.panel,.class-card,.student-card,.mode-card{background:linear-gradient(145deg,#102238,#0d1c2f);border:1px solid #1f3b56;border-radius:20px;box-shadow:var(--shadow)}.hero-card{padding:32px}.eyebrow{color:var(--green);font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:1.6px}.hero h1{font-size:clamp(30px,5vw,56px);line-height:1;margin:10px 0}.hero p{color:var(--muted);max-width:650px}.hero-actions,.toolbar,.row-actions{display:flex;gap:10px;flex-wrap:wrap}.metric-card{padding:22px;display:grid;gap:10px;align-content:center}.metric{font-size:38px;font-weight:900}.muted{color:var(--muted)}.small-note{font-size:12px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:30px 0 14px}.section-title.compact{margin:0 0 14px}.section-title h2{margin:0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}.class-card{padding:20px;transition:.18s transform}.class-card:hover{transform:translateY(-3px)}.class-card h3{font-size:24px;margin:8px 0}.class-meta{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.badge{display:inline-flex;padding:5px 8px;border-radius:999px;background:#183550;color:#bfe7ff;font-size:12px}.badge.warn{background:#4a3317;color:#ffd69a}.badge.ok{background:#143c32;color:#97efcf}.panel{padding:22px;margin-bottom:16px}.setup-steps{display:flex;gap:8px;overflow:auto;padding-bottom:4px}.step{white-space:nowrap;padding:8px 11px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}.step.active{background:#193d52;color:#fff;border-color:var(--cyan)}.field{display:grid;gap:6px;margin:12px 0}.field label{font-size:13px;color:var(--muted);font-weight:700}.field input,.field textarea,.field select{width:100%;border-radius:12px;border:1px solid #2a4864;background:#0b1a2a;color:#fff;padding:12px}.field textarea{min-height:130px;resize:vertical}.import-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}.import-card{padding:18px;border:1px dashed #345a77;background:#0c1b2b;border-radius:16px}.import-card h3{margin:4px 0 8px}.class-header{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;flex-wrap:wrap}.class-header h1{margin:0;font-size:36px}.mode-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:12px}.mode-card{padding:18px;border:1px solid #254661;text-align:left}.mode-card strong{display:block;font-size:18px}.mode-card span{display:block;color:var(--muted);font-size:13px;margin-top:6px}.students{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}.student-card{overflow:hidden;position:relative}.student-card.eliminated{opacity:.42;filter:grayscale(.7)}.student-photo{width:100%;aspect-ratio:4/3;object-fit:contain;background:#07111e;display:block;padding:3px}.photo-placeholder{aspect-ratio:4/3;display:grid;place-items:center;background:linear-gradient(135deg,#1b334b,#0c1726);color:#6f8ba4;font-size:44px}.student-info{padding:13px}.student-info h3{margin:0 0 4px;font-size:19px}.student-num{color:var(--green);font-weight:900}.student-score{font-size:18px;font-weight:900;color:#fff}.student-tools{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-top:10px}.student-tools button{padding:8px;border-radius:9px}.score-buttons{display:flex;gap:6px;margin-top:8px}.score-buttons button{flex:1;padding:7px}.quiz-wrap{max-width:900px;margin:auto}.quiz-photo{width:min(100%,620px);max-height:68vh;aspect-ratio:4/3;object-fit:contain;border-radius:24px;border:1px solid #31516c;background:#07111e;display:block;margin:16px auto}.quiz-placeholder{width:min(100%,620px);aspect-ratio:4/3;border-radius:24px;background:#14293f;display:grid;place-items:center;margin:16px auto;font-size:80px}.options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.option{padding:16px;border-radius:14px;border:1px solid #31516c;background:#11263a;color:#fff;font-weight:750}.option .student-photo{max-height:260px}.option.correct{background:#123f32;border-color:var(--green)}.option.wrong{background:#48202a;border-color:var(--danger)}.scorebar{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted)}.empty{padding:50px 20px;text-align:center;border:1px dashed #2d4b66;border-radius:18px;color:var(--muted)}.empty.slim{padding:22px}.modal{position:fixed;inset:0;z-index:100;background:#02070dd4;display:grid;place-items:center;padding:18px}.modal-card{width:min(760px,100%);max-height:90vh;overflow:auto;background:#0c1b2c;border:1px solid #294762;border-radius:20px;box-shadow:0 30px 90px #000b}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid #223d56}.modal-head h2{margin:0}.modal-card #modalBody{padding:20px}.icon-btn{border:0;background:transparent;color:#fff;font-size:20px}.toast{position:fixed;z-index:200;bottom:88px;left:50%;transform:translateX(-50%);background:#172d43;border:1px solid #34546e;border-radius:999px;padding:10px 16px;box-shadow:var(--shadow);max-width:min(90vw,620px);text-align:center}.bottomnav{display:none}.split{display:grid;grid-template-columns:1fr 1fr;gap:14px}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:10px;border-bottom:1px solid #203b53}.table th{color:var(--muted);font-size:12px}.level{font-weight:800;color:var(--green)}.rota-next strong{font-size:22px}.rota-next-name{font-size:24px;font-weight:900}.rota-next-name span{color:var(--muted);font-weight:700}.rota-countdown{font-size:30px;font-weight:900;color:var(--cyan);margin:8px 0}.today-lessons{display:grid;gap:8px}.today-lesson{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px;border-radius:12px;background:#0b1a2a;border:1px solid #213d56}.today-lesson span{display:block;color:var(--muted);font-size:13px;margin-top:3px}.rota-scroll{overflow:auto}.rota-table{width:100%;border-collapse:collapse;min-width:820px}.rota-table th,.rota-table td{border:1px solid #29445e;padding:8px;text-align:center}.rota-table th small{display:block;color:var(--muted);font-weight:400}.rota-cell{width:100%;border:0;background:#163852;color:#fff;border-radius:10px;padding:10px}.rota-cell strong,.rota-cell span,.rota-cell small{display:block}.rota-cell span{color:#bdefff}.rota-cell small{color:#b0c2d2;margin-top:3px}.rota-free{color:#6f879c}.today{background:#102e3d}.rota-image{width:100%;height:auto;display:block;border-radius:16px;background:#fff}.buttonlink{text-decoration:none;display:inline-flex;align-items:center}.winner{font-size:30px;font-weight:900;color:var(--green);text-align:center}.bottomnav button{cursor:pointer}@media(max-width:760px){.topbar{height:60px;padding:8px 8px;gap:7px}.global-back{padding:8px 9px;font-size:12px}.brand{font-size:20px}.topbar .active-label{display:none}.top-actions .ghost:not(#closeClassBtn){display:none}main{padding:16px 14px 95px}.hero{grid-template-columns:1fr}.hero-card{padding:22px}.bottomnav{display:grid;position:fixed;z-index:30;bottom:0;left:0;right:0;grid-template-columns:repeat(auto-fit,minmax(52px,1fr));background:#091625f5;border-top:1px solid #213a51;padding:7px calc(7px + env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) calc(7px + env(safe-area-inset-left))}.bottomnav button{border:0;background:transparent;color:#b2c5d5;padding:9px 2px;font-size:11px}.split{grid-template-columns:1fr}.students{grid-template-columns:repeat(2,1fr)}.options{grid-template-columns:1fr}.student-info{padding:10px}.student-info h3{font-size:16px}.class-header h1{font-size:29px}.student-tools{grid-template-columns:1fr}.quiz-photo{max-height:52vh}.rota-countdown{font-size:24px}}@media(min-width:761px) and (max-width:1100px){.students{grid-template-columns:repeat(3,1fr)}.hero{grid-template-columns:1fr 1fr}}@media(min-width:1101px){.students{grid-template-columns:repeat(5,1fr)}}
/* VuNarIQ 1.5.1 classroom layout restoration */
body.class-active{overflow:hidden}
body.class-active main{max-width:none;height:calc(100dvh - 70px);padding:8px 12px 10px;overflow:hidden}
.class-screen{height:100%;min-height:0;display:flex;flex-direction:column;gap:7px;overflow:hidden}
.class-compact-header{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;flex:0 0 auto}.class-compact-header h1{font-size:clamp(24px,3vw,38px);line-height:1;margin:1px 0}.class-summary{color:var(--muted);font-size:12px}.class-quick{display:flex;gap:6px}.compact{padding:7px 10px;border-radius:9px}
.class-controlbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;flex:0 0 auto}.mode-controls,.layout-controls{display:flex;gap:5px;align-items:center;min-width:0}.mode-controls button,.layout-controls button{border:1px solid #294862;background:#10253a;color:#dcebf7;border-radius:8px;padding:6px 9px;font-size:12px;font-weight:800;white-space:nowrap}.layout-controls>span{font-size:10px;color:var(--muted);font-weight:900;text-transform:uppercase;letter-spacing:.7px}.layout-controls button.active-layout{background:linear-gradient(135deg,var(--green),var(--cyan));color:#04131a;border-color:transparent}.layout-controls .reset-out{border-color:#9b4855;color:#ffc0c8}
.class-board-wrap{position:relative;flex:1;min-height:0;overflow:hidden;border:1px solid #1c3b55;border-radius:16px;background:#07111d;padding:5px}
.class-board{height:100%;min-height:0}.seating-board{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));grid-template-rows:repeat(var(--rows),minmax(0,1fr));gap:5px}
.face-card{position:relative;display:block;width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;padding:0;border:1px solid #284963;border-radius:10px;background:#0a1725;color:#fff;box-shadow:none}.face-card:hover{border-color:var(--cyan);transform:none}.face-card.class-face-card{display:grid;grid-template-rows:minmax(0,1fr) auto}.face-photo,.face-card>.photo-placeholder{width:100%;height:100%;min-height:0;aspect-ratio:auto;object-fit:contain;background:#040a11;padding:0;display:block}.class-face-card>.face-photo,.class-face-card>.photo-placeholder{grid-row:1;grid-column:1}.face-card>.photo-placeholder{display:grid;place-items:center;color:#567088;font-size:clamp(18px,4vmin,44px)}
.face-num,.face-score{position:absolute;z-index:2;top:4px;border-radius:999px;padding:3px 6px;font-size:clamp(9px,1.1vw,12px);line-height:1;font-weight:900;background:#07111ed9;border:1px solid #ffffff24}.face-num{left:4px;color:#d9e9f6}.face-score{right:4px;color:#fff}.face-score.positive{background:#0d6a48e8;border-color:#25d08a}.face-score.negative{background:#7a2331e8;border-color:#ff6275}.face-card.eliminated{opacity:.48;filter:grayscale(.85)}.face-out{position:absolute;inset:0;z-index:3;display:grid;place-items:center;color:#fff;font-weight:1000;font-size:clamp(13px,2.2vw,26px);letter-spacing:2px;background:linear-gradient(135deg,#7e142777,#0004);text-shadow:0 2px 8px #000}.face-caption{grid-row:2;grid-column:1;display:block;min-width:0;padding:3px 4px 4px;background:#0d2133;border-top:1px solid #294862;text-align:center;line-height:1.05}.face-caption strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(8px,1.35vmin,14px);color:#fff}.face-caption small{display:block;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(7px,1.05vmin,11px);font-weight:700;color:#8eddea}.face-card.seat-selected{outline:3px solid #2de2d0;outline-offset:-3px;box-shadow:0 0 0 2px #07111d,0 0 18px #2de2d088}.arrange-hint{position:absolute;z-index:20;top:8px;left:50%;transform:translateX(-50%);max-width:88%;padding:6px 12px;border-radius:999px;background:#082b35ee;border:1px solid #2de2d0;color:#dffffb;font-size:11px;font-weight:900;pointer-events:none;box-shadow:0 4px 18px #0008}.layout-controls button.arrange-active{background:#2de2d0;color:#04131a;border-color:#2de2d0}
.team-board{height:100%;display:grid;grid-template-columns:repeat(var(--team-count),minmax(0,1fr));gap:6px}.team-lane{min-width:0;min-height:0;display:flex;flex-direction:column;border:1px solid #26455e;border-radius:12px;background:#0a1827;overflow:hidden}.team-lane-head{display:flex;align-items:center;justify-content:space-between;gap:5px;padding:4px 6px;background:#10283d;flex:0 0 auto}.team-lane-head>strong{font-size:12px}.team-score{display:flex;align-items:center;gap:4px}.team-score span{min-width:22px;text-align:center;font-size:13px;font-weight:900}.team-score button{border:0;border-radius:6px;padding:3px 6px;color:#fff;font-size:10px;font-weight:900}.mini-plus{background:#17895e}.mini-minus{background:#a62d40}.team-faces{flex:1;min-height:0;display:grid;grid-template-columns:repeat(var(--subcols),minmax(0,1fr));grid-template-rows:repeat(var(--teamrows),minmax(0,1fr));gap:4px;padding:4px}
.student-popout{display:grid;grid-template-columns:minmax(220px,1.15fr) minmax(220px,.85fr);gap:18px;align-items:stretch}.popout-visual{position:relative;min-height:320px;background:#050c14;border-radius:16px;overflow:hidden;border:1px solid #294a65}.popout-photo,.popout-visual>.photo-placeholder{width:100%;height:100%;max-height:68vh;object-fit:contain;background:#050c14;display:block}.popout-visual>.photo-placeholder{display:grid;place-items:center;font-size:70px;color:#5e788e}.popout-out{position:absolute;inset:0;display:grid;place-items:center;background:#68192b88;color:white;font-size:28px;font-weight:1000;letter-spacing:3px}.popout-info{display:flex;flex-direction:column;gap:10px}.popout-info h2{font-size:clamp(28px,5vw,48px);margin:0}.pron-block{padding:11px 13px;background:#0a1a2a;border:1px solid #24435e;border-radius:12px}.pron-block span{display:block;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase}.pron-block strong{display:block;margin-top:4px;font-size:18px}.audio-button{border:0;border-radius:12px;padding:13px;background:linear-gradient(135deg,#28c8da,#25d08a);color:#03131a;font-weight:900}.point-panel{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;align-items:center}.point-panel>div{text-align:center}.point-panel span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase}.point-panel strong{font-size:32px}.point-minus,.point-plus{border:0;border-radius:12px;padding:14px 8px;color:#fff;font-size:20px;font-weight:1000}.point-minus{background:#bc3349}.point-plus{background:#148e60}.eliminate-btn,.reinstate-btn{border:0;border-radius:12px;padding:12px;color:#fff;font-weight:900}.eliminate-btn{background:#761f31}.reinstate-btn{background:#147b58}.popup-team{display:flex;align-items:center;gap:6px}.popup-team>span{color:var(--muted);font-size:12px;font-weight:800}.active-chip{background:#177558!important;color:#fff!important;border-color:#2fdca0!important}.full-btn{width:100%}
@media(max-width:760px){body.class-active main{height:calc(100dvh - 60px - 67px);padding:5px 6px}.class-screen{gap:4px}.class-compact-header{min-height:39px}.class-compact-header h1{font-size:22px}.class-summary{font-size:9px}.class-quick .compact{padding:5px 7px;font-size:10px}.class-controlbar{grid-template-columns:1fr;gap:3px}.mode-controls,.layout-controls{display:grid;gap:3px}.mode-controls{grid-template-columns:repeat(6,1fr)}.layout-controls{grid-template-columns:repeat(6,minmax(0,1fr))}.mode-controls button,.layout-controls button{padding:4px 2px;font-size:8.5px}.layout-controls>span{display:none}.class-board-wrap{padding:3px;border-radius:10px}.seating-board{gap:3px}.team-board{gap:3px}.team-lane-head{padding:2px 3px}.team-lane-head>strong{font-size:9px}.team-score button{padding:2px 4px;font-size:8px}.team-score span{font-size:9px;min-width:12px}.team-faces{gap:2px;padding:2px}.face-card{border-radius:6px}.face-num,.face-score{top:2px;padding:2px 4px;font-size:8px}.face-num{left:2px}.face-score{right:2px}.face-caption{padding:2px 2px 3px}.face-caption strong{font-size:clamp(7px,2.25vw,10px)}.face-caption small{font-size:clamp(6px,1.75vw,8px);margin-top:1px}.arrange-hint{top:4px;padding:4px 8px;font-size:9px}.student-popout{grid-template-columns:1fr;gap:10px}.popout-visual{min-height:220px;max-height:45vh}.popout-photo,.popout-visual>.photo-placeholder{max-height:45vh}.popout-info h2{font-size:30px}}
@media(min-width:761px) and (max-width:1100px){.class-controlbar{grid-template-columns:1fr}.mode-controls,.layout-controls{justify-content:center}.student-popout{grid-template-columns:1.1fr .9fr}}

/* VuNarIQ 1.5.1 Teacher drag/drop 3-team synchronized layout upgrade */
.team-board{grid-template-columns:repeat(3,minmax(0,1fr))}
.class-team-board .team-lane-head{background:linear-gradient(180deg,#112b42,#0e2235)}
.team-1{border-top-color:#28c8da}.team-2{border-top-color:#25d08a}.team-3{border-top-color:#ff9b42}
.drop-label{font-size:9px;color:#8eddea;font-weight:800;letter-spacing:.2px}
.face-card[data-drag-student]{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.dragging-student .face-card[data-drag-student]{cursor:grabbing}
.face-card.drag-source{opacity:.38;outline:2px dashed #28c8da;pointer-events:none}
.face-card.drop-target{outline:3px solid #25d08a;outline-offset:-3px;box-shadow:0 0 0 2px #06121e,0 0 20px #25d08a88}
.team-lane.drop-team-target,.team-faces.drop-team-target{outline:3px solid #28c8da;outline-offset:-3px;background:#103249}
.drag-hint{position:absolute;z-index:12;top:4px;left:50%;transform:translateX(-50%);max-width:92%;padding:4px 10px;border-radius:999px;background:#071823e8;border:1px solid #25516a;color:#c8eef6;font-size:9px;font-weight:800;pointer-events:none;opacity:.9}
.class-team-board .team-faces{padding-top:12px}.team-scoring-board .team-faces{padding-top:4px}
.class-compact-header .eyebrow{font-size:10px}
@media(max-width:760px){.drag-hint{font-size:7px;padding:3px 6px;top:2px}.class-team-board .team-faces{padding-top:9px}.drop-label{display:none}.layout-controls{grid-template-columns:repeat(6,minmax(0,1fr))}.layout-controls button{min-width:0;overflow:hidden;text-overflow:ellipsis}.class-summary{max-width:58vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}

/* v1.5.1 persistent seating + easy pronunciation */
.easy-pron{font-weight:800;color:#8eddea}.center-pron{text-align:center;margin:-4px 0 10px}.quiz-name{display:flex;flex-direction:column;gap:3px;align-items:center}.quiz-name strong{font-size:1.05em}.quiz-name small{font-size:.78em;color:#8eddea;font-weight:800}.layout-controls button:disabled{opacity:.42;cursor:default}.seating-board .face-card{min-height:0}.seating-board .face-caption strong{font-size:clamp(8px,1.45vmin,14px)}.seating-board .face-caption small{font-size:clamp(7px,1.08vmin,11px)}

/* v1.5.1 fixed real-classroom seating grids */
.fixed-seating-board{grid-auto-flow:row}
/* 1C1: three paired desks across with clear aisles, four rows deep. */
.paired-desk-grid{column-gap:2px}
.paired-desk-grid>:nth-child(6n+2),.paired-desk-grid>:nth-child(6n+4){margin-right:7px}
.paired-desk-grid>:nth-child(6n+3),.paired-desk-grid>:nth-child(6n+5){margin-left:7px}
.empty-seat{width:100%;height:100%;min-width:0;min-height:0;border:1px dashed #31526b;border-radius:10px;background:linear-gradient(145deg,#0a1623,#0b1d2c);color:#7892a7;display:grid;place-items:center;align-content:center;gap:3px;padding:4px;cursor:default}
.empty-seat span{font-size:clamp(8px,1.25vmin,12px);font-weight:900;text-transform:uppercase;letter-spacing:.5px}
.empty-seat small{font-size:clamp(6px,.95vmin,9px);font-weight:800;color:#58758d}
.layout-controls .arrange-active~* .empty-seat,.empty-seat.drop-target{border-style:solid;border-color:#25d08a;box-shadow:inset 0 0 0 2px #25d08a33,0 0 18px #25d08a44;background:#0d2a29}
body.dragging-student .empty-seat{cursor:grabbing;border-color:#34627e}
.fixed-seating-board .face-card.drop-target,.fixed-seating-board .empty-seat.drop-target{outline:3px solid #25d08a;outline-offset:-3px;box-shadow:0 0 0 2px #06121e,0 0 20px #25d08a88}
@media(max-width:760px){.empty-seat{border-radius:6px;padding:2px}.empty-seat span{font-size:7px}.empty-seat small{font-size:6px}}

/* v1.5.1 main-class controls + automatic team-by-seat */
.face-card{display:flex!important;flex-direction:column;position:relative;overflow:hidden}
.face-card.class-face-card{display:flex!important}
.face-main{position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto;flex:1 1 auto;min-width:0;min-height:0;width:100%;overflow:hidden;padding:0;border:0;border-radius:0;background:#0a1725;color:#fff;cursor:pointer}
.face-main>.face-photo,.face-main>.photo-placeholder{grid-row:1;grid-column:1;width:100%;height:100%;min-height:0;aspect-ratio:auto;object-fit:contain;background:#040a11;padding:0;display:block}
.face-main>.photo-placeholder{display:grid;place-items:center;color:#567088;font-size:clamp(18px,4vmin,44px)}
.face-main>.face-caption{grid-row:2;grid-column:1}
.face-team-badge{position:absolute;z-index:4;top:4px;left:50%;transform:translateX(-50%);border-radius:999px;padding:3px 6px;font-size:clamp(8px,1vw,11px);line-height:1;font-weight:1000;color:#fff;border:1px solid #ffffff3b;box-shadow:0 1px 4px #0007}
.team-badge-1{background:#157c94e8}.team-badge-2{background:#147b58e8}.team-badge-3{background:#ad5d20e8}
.face-card.seat-team-1{border-color:#28c8da}.face-card.seat-team-2{border-color:#25d08a}.face-card.seat-team-3{border-color:#ff9b42}
.face-card.seat-team-1::after,.face-card.seat-team-2::after,.face-card.seat-team-3::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff0d}
.face-card.eliminated{opacity:1;filter:none}
.face-card.eliminated .face-main{opacity:.45;filter:grayscale(.85)}
.face-tile-actions{position:relative;z-index:6;flex:0 0 auto;display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:2px;padding:2px;background:#07111d;border-top:1px solid #294862}
.face-tile-actions button{min-width:0;border:0;border-radius:5px;padding:3px 2px;line-height:1;font-size:clamp(10px,1.35vmin,14px);font-weight:1000;color:#fff;cursor:pointer;touch-action:manipulation}
.tile-minus{background:#a82738}.tile-plus{background:#148857}.tile-eliminate{background:#7b2333;font-size:clamp(7px,1vmin,10px)!important;letter-spacing:.2px}.tile-eliminate.reinstate{background:#176e56}
.face-tile-actions button:active{transform:translateY(1px)}
.face-score{right:4px}.face-num{left:4px}
.seat-team-readout,.popup-score-readout{padding:10px 12px;background:#0a1a2a;border:1px solid #24435e;border-radius:12px}
.seat-team-readout strong,.popup-score-readout strong{display:block;font-size:17px}.seat-team-readout small,.popup-score-readout small{display:block;margin-top:3px;color:var(--muted);font-size:10px;font-weight:700}.popup-score-readout>span{display:block;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase}.popup-score-readout>strong{font-size:26px}
.empty-seat.seat-team-1{border-color:#267f93;background:linear-gradient(145deg,#0a1a25,#0d2730)}
.empty-seat.seat-team-2{border-color:#237a5a;background:linear-gradient(145deg,#0a1a25,#0d2923)}
.empty-seat.seat-team-3{border-color:#9b6332;background:linear-gradient(145deg,#0a1a25,#2a2016)}
.team-board .face-card[data-drag-student]{cursor:default;touch-action:auto}
.team-board .face-main{cursor:pointer}
@media(max-width:760px){
  .face-team-badge{top:2px;padding:2px 3px;font-size:7px}
  .face-tile-actions{gap:1px;padding:1px}
  .face-tile-actions button{padding:2px 1px;border-radius:3px;font-size:8px}
  .tile-eliminate{font-size:6px!important}
}

/* v1.5.1 team plan = exact saved seating-plan mirror */
.team-mirror-board{height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:4px}
.team-mirror-scorebar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;min-height:0}
.team-mirror-score{min-width:0;display:flex;align-items:center;justify-content:space-between;gap:5px;padding:4px 7px;border:1px solid #26455e;border-radius:9px;background:#10283d}
.team-mirror-score>strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-mirror-score.team-1{border-color:#28c8da}.team-mirror-score.team-2{border-color:#25d08a}.team-mirror-score.team-3{border-color:#ff9b42}
.team-mirror-grid{min-height:0;height:100%}
.team-mirror-grid .face-card[data-drag-student]{cursor:default;touch-action:auto}
.team-mirror-empty{cursor:default!important}
@media(max-width:760px){.team-mirror-board{gap:2px}.team-mirror-scorebar{gap:2px}.team-mirror-score{padding:2px 3px;border-radius:5px}.team-mirror-score>strong{font-size:7px}.team-mirror-score .team-score{gap:2px}.team-mirror-score .team-score button{padding:2px 3px;font-size:7px}.team-mirror-score .team-score span{font-size:8px;min-width:10px}}


/* v1.5.1 FACE-FOCUS classroom tiles: photo first, compact scoring */
.face-card.class-face-card{display:flex!important;flex-direction:column}
.face-card.sex-m{border:4px solid #3197ff!important;box-shadow:inset 0 0 0 1px #b9ddff66}
.face-card.sex-f{border:4px solid #ff6fb7!important;box-shadow:inset 0 0 0 1px #ffd0e766}
.manual-link{text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font-weight:800}
.face-main{display:block!important;position:relative;flex:1 1 auto;min-height:0;overflow:hidden;background:#040a11}
.face-main>.face-photo,.face-main>.photo-placeholder{
  position:absolute;inset:0;width:100%;height:100%;min-height:0;
  object-fit:contain!important;object-position:center center;background:#040a11;padding:0
}
.face-caption{
  position:absolute!important;z-index:5;left:0;right:0;bottom:0;
  display:block!important;padding:2px 3px 3px!important;
  border-top:1px solid #ffffff18!important;
  background:linear-gradient(180deg,#07111d12 0%,#07111dd9 32%,#07111df7 100%)!important;
  text-align:center;line-height:1.02;pointer-events:none
}
.face-caption strong{font-size:clamp(9px,1.42vmin,14px)!important;line-height:1.02}
.face-caption small{margin-top:1px!important;font-size:clamp(7px,1.03vmin,10px)!important;line-height:1.02;color:#9ee9f2!important}
.face-num{top:3px!important;left:3px!important;padding:2px 4px!important;font-size:clamp(8px,1vmin,10px)!important;background:#07111ee8!important}
.face-team-badge{
  top:3px!important;right:3px!important;left:auto!important;transform:none!important;
  padding:2px 4px!important;font-size:clamp(7px,.9vmin,9px)!important
}
/* score is no longer over the face */
.face-score{display:none!important}
.face-tile-actions{
  flex:0 0 18px!important;min-height:18px;display:grid!important;
  grid-template-columns:18px minmax(18px,.72fr) 18px minmax(25px,.95fr)!important;
  align-items:stretch;gap:1px!important;padding:1px!important;
  background:#06101b!important;border-top:1px solid #22394d!important
}
.face-tile-actions button{
  min-width:0!important;padding:0!important;border-radius:3px!important;
  font-size:10px!important;line-height:16px!important;font-weight:1000!important
}
.face-tile-actions .tile-minus,.face-tile-actions .tile-plus{font-size:12px!important}
.tile-score{
  display:grid;place-items:center;min-width:0;border-radius:3px;
  background:#0e2132;color:#f6fbff;border:1px solid #29445e;
  font-size:9px;font-weight:1000;line-height:1
}
.tile-score.positive{color:#89efc8;border-color:#1f7557;background:#0b3328}
.tile-score.negative{color:#ffadb8;border-color:#7e3040;background:#341821}
.tile-eliminate{font-size:7px!important;letter-spacing:.1px!important}
.face-out{
  z-index:4!important;background:linear-gradient(135deg,#7e142755,#0002)!important;
  font-size:clamp(12px,1.7vw,20px)!important;pointer-events:none
}
/* keep the face as the primary visual in both Seating Plan and exact Team mirror */
.seating-board .face-main,.team-mirror-grid .face-main{min-height:0}
.seating-board .face-photo,.team-mirror-grid .face-photo{image-rendering:auto}

@media(max-width:760px){
  .face-caption{padding:1px 2px 2px!important}
  .face-caption strong{font-size:clamp(7px,2.15vw,9px)!important}
  .face-caption small{font-size:clamp(5.5px,1.55vw,7px)!important}
  .face-num{top:1px!important;left:1px!important;padding:1px 2px!important;font-size:6.5px!important}
  .face-team-badge{top:1px!important;right:1px!important;padding:1px 2px!important;font-size:5.5px!important}
  .face-tile-actions{flex-basis:14px!important;min-height:14px;grid-template-columns:14px minmax(14px,.7fr) 14px minmax(20px,.9fr)!important}
  .face-tile-actions button{font-size:7px!important;line-height:12px!important}
  .face-tile-actions .tile-minus,.face-tile-actions .tile-plus{font-size:9px!important}
  .tile-score{font-size:6.5px!important}
  .tile-eliminate{font-size:5.5px!important}
}

/* Per-session scoring and browsable monthly tally */
.session-start,.session-end{border:0;border-radius:9px;padding:8px 11px;color:#fff;font-weight:900;cursor:pointer}
.session-start{background:#137f5b;box-shadow:inset 0 0 0 1px #62e6b13b}
.session-end{background:#b64c28;box-shadow:inset 0 0 0 1px #ffb27844}
.history-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;padding:10px 12px;border:1px solid #29465f;border-radius:12px;background:#0b1a29}
.history-toolbar label{font-weight:900;color:#ddecf7}
.history-toolbar input{width:auto;min-width:155px;padding:8px 10px;border:1px solid #3a5f7d;border-radius:8px;background:#07121e;color:#fff;color-scheme:dark}
.history-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}
.history-summary span{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border:1px solid #29465f;border-radius:10px;background:#0b1a29;color:#9eb3c4;font-size:12px;font-weight:800}
.history-summary strong{font-size:18px;color:#fff}
.score-history-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,.85fr);gap:16px;align-items:start}
.score-history-grid h4{margin:10px 0 8px;color:#ddecf7}
.history-table-wrap{max-height:43vh;overflow:auto;border:1px solid #29465f;border-radius:10px}
.history-table-wrap .table{margin:0}
.history-score{font-size:16px;font-weight:1000}.history-score.positive{color:#76e4b8}.history-score.negative{color:#ff98a6}
.history-team-totals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:16px}
.history-team-totals span{display:grid;gap:3px;padding:9px 6px;border:1px solid #29465f;border-radius:9px;background:#0c1e2e;text-align:center;font-size:10px;font-weight:900}
.history-team-totals strong{font-size:21px;color:#fff}.history-team-totals .team-1{border-color:#28c8da}.history-team-totals .team-2{border-color:#25d08a}.history-team-totals .team-3{border-color:#ff9b42}
.history-note{margin:12px 0 0}.compact-empty{padding:24px}
@media(max-width:760px){.score-history-grid{grid-template-columns:1fr}.history-summary{grid-template-columns:1fr}.history-toolbar{align-items:flex-start;flex-direction:column}.history-toolbar input{width:100%}.history-table-wrap{max-height:34vh}}
.class-end-countdown{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 0 10px;padding:8px 14px;border:2px solid #ffb020;border-radius:14px;background:linear-gradient(135deg,#fff7df,#ffe7a3);color:#3b2a00;box-shadow:0 7px 20px rgba(255,176,32,.22)}
.class-end-countdown span{font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.75rem}.class-end-countdown strong{font-variant-numeric:tabular-nums;font-size:1.8rem;line-height:1;color:#b84212}.class-end-countdown small{font-weight:700;color:#6c4a00}
@media(max-width:640px){.class-end-countdown{gap:8px;padding:8px 10px}.class-end-countdown strong{font-size:1.55rem}.class-end-countdown small{display:none}}

.name-format-control{display:grid;gap:3px;min-width:150px;padding:5px 8px;border:1px solid rgba(255,255,255,.24);border-radius:10px;background:#0b2742;color:#fff}.name-format-control span{font-size:.68rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#63e6be}.name-format-control select{width:100%;border:0;border-radius:6px;padding:5px 7px;background:#fff;color:#102c46;font:700 .78rem system-ui}@media(max-width:700px){.name-format-control{min-width:132px;flex:1}.name-format-control select{font-size:.74rem}}

/* Ordered Personal-edition teaching categories */
.feature-categories{margin:10px 0;padding:12px;border:1px solid #294b66;border-radius:16px;background:linear-gradient(135deg,#0b1d2e,#0d263b)}
.feature-categories-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px;color:#ddecf7}.feature-categories-title strong{font-size:.9rem}.feature-categories-title span{color:#62e6be;font-size:.7rem;font-weight:850;text-transform:uppercase;letter-spacing:.06em}
.feature-category-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}.feature-category{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:6px!important;min-width:0!important;min-height:42px!important;padding:7px 8px!important;border:1px solid #355a74!important;border-radius:10px!important;background:#102c42!important;color:#eef8ff!important;font-size:.72rem!important;font-weight:850!important;text-align:left!important;white-space:normal!important}.feature-category:hover,.feature-category:focus-visible{border-color:#53d9ce!important;background:#123b52!important}.feature-category.active{border-color:#5de6bd!important;box-shadow:inset 0 0 0 1px #5de6bd55}.feature-category>span{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border-radius:7px;background:#193f58;color:#65e8c0;font-size:.68rem;font-weight:1000}
.sprint-hud{position:fixed;z-index:12000;top:max(10px,env(safe-area-inset-top));left:50%;display:flex;align-items:center;gap:10px;transform:translateX(-50%);padding:8px 12px;border:2px solid #ffb020;border-radius:14px;background:#071727;color:#fff;box-shadow:0 12px 35px #0008}.sprint-hud span{font-size:.72rem;font-weight:900;text-transform:uppercase;color:#ffd166}.sprint-hud strong{font-size:1.45rem;font-variant-numeric:tabular-nums}.sprint-hud button{width:28px!important;height:28px!important;padding:0!important;border-radius:50%!important;background:#8c2637!important;color:#fff!important}
.confusion-pair-list{display:grid;gap:8px;max-height:58vh;overflow:auto}.confusion-pair-list article{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px;padding:9px;border:1px solid #29465f;border-radius:12px;background:#0b1a29}.confusion-pair-list article>div{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;column-gap:8px}.confusion-pair-list .pair-photo,.confusion-pair-list .photo-placeholder{grid-row:1/3;width:42px;height:42px;border-radius:50%;object-fit:cover}.confusion-pair-list strong{overflow:hidden;text-overflow:ellipsis}.confusion-pair-list span{color:#62e6be;font-size:.72rem;font-weight:850}.file-button{display:inline-flex;align-items:center;cursor:pointer}
@media(max-width:980px){.feature-category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:640px){.feature-categories{padding:9px}.feature-categories-title{align-items:flex-start;flex-direction:column;gap:3px}.feature-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.feature-category{min-height:38px!important;padding:6px!important;font-size:.68rem!important}.feature-category>span{flex-basis:20px;width:20px;height:20px}.confusion-pair-list article>div{grid-template-columns:32px minmax(0,1fr)}.confusion-pair-list .pair-photo,.confusion-pair-list .photo-placeholder{width:32px;height:32px}}

/* Three-team header cleanup: keep the centre header clear and readable. */
.class-board-wrap:has(.team-mirror-board)>.drag-hint{display:none}
.team-mirror-score{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
.team-mirror-score>strong{display:block;min-width:0;color:#fff;font-size:clamp(10px,1.15vw,13px);line-height:1.15}
.team-mirror-score .team-score{flex:0 0 auto}
@media(max-width:760px){.team-mirror-score{grid-template-columns:minmax(38px,1fr) auto;gap:2px}.team-mirror-score>strong{font-size:8.5px;line-height:1.1}}


/* John Personal face-focus rendering: crop the classroom display around heads/faces. */
.student-photo,.face-photo,.face-main>.face-photo,.popout-photo,.quiz-photo,.confusion-pair-list .pair-photo{
  object-fit:cover!important;
  object-position:center 16%!important;
  background-color:#040a11!important;
  filter:brightness(1.08) contrast(1.06)
}
.face-photo,.face-main>.face-photo{
  transform:scale(1.35);
  transform-origin:center 16%
}
/* A few portraits were photographed much lower in the original frame. */
.face-photo[src$="/1Q1/19.jpg"],.face-main>.face-photo[src$="/1Q1/19.jpg"]{
  object-position:center 48%!important;
  transform:scale(1.35);
  transform-origin:center 48%
}
.face-photo[src$="/2Q2/17.jpg"],.face-main>.face-photo[src$="/2Q2/17.jpg"]{
  object-position:center 45%!important;
  transform:scale(1.35);
  transform-origin:center 45%
}
.face-photo[src$="/2Q2/19.jpg"],.face-main>.face-photo[src$="/2Q2/19.jpg"]{
  object-position:center 68%!important;
  transform:scale(1.35);
  transform-origin:center 68%
}

/* John Personal final shell: PRO-styled responsive side navigation. */
.brand-i{color:#ff8838}.brand-q{color:#935df5}
.app-shell{min-height:100vh}
.app-content{min-width:0;margin-left:248px}
.side-menu{position:fixed;z-index:80;inset:0 auto 0 0;width:248px;display:flex;flex-direction:column;padding:18px 14px max(18px,env(safe-area-inset-bottom));background:linear-gradient(180deg,#0d2940 0%,#071827 70%,#06131f 100%);border-right:1px solid #294b65;box-shadow:14px 0 45px #0004}
.side-brand-wrap{display:flex;align-items:flex-start;gap:6px}
.side-brand{display:block;min-width:0;padding:4px 2px;text-align:left;font-size:31px;letter-spacing:-1.6px}
.side-brand small{display:block;margin:2px 0 0 2px;color:#63e6be;font-size:9px;letter-spacing:.11em;text-transform:uppercase}
.side-close{display:none;margin-left:auto;border:0;background:transparent;color:#fff;font-size:20px;padding:7px}
.side-edition{margin:8px 2px 19px;padding:7px 9px;border:1px solid #335a72;border-radius:9px;background:#102f45;color:#b8d1e1;font-size:10px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.side-nav{display:grid;gap:6px}
.side-nav button{display:grid;grid-template-columns:31px minmax(0,1fr);align-items:center;gap:8px;width:100%;min-height:46px;padding:8px 10px;border:1px solid transparent;border-radius:12px;background:transparent;color:#d8e9f4;text-align:left}
.side-nav button:hover,.side-nav button[aria-current="page"]{border-color:#3a667f;background:linear-gradient(135deg,#16445a,#103248);color:#fff}
.side-nav button[aria-current="page"]{box-shadow:inset 3px 0 0 #63e6be}
.side-nav button span{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#173a51;color:#63e6be;font-size:17px;font-weight:1000}
.side-nav button b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.side-menu-footer{display:grid;gap:10px;margin-top:auto;padding:16px 5px 0;border-top:1px solid #213b50}
.side-menu-footer .manual-link{justify-content:flex-start;color:#dcedf7;font-size:13px}
.side-menu-footer small{color:#7894a8;font-size:9px;line-height:1.4}
.menu-toggle{display:none;border:1px solid var(--line);border-radius:10px;padding:7px 10px;background:#102238;color:#fff;font-size:20px;line-height:1}
.menu-scrim{display:none}
.topbar{grid-template-columns:auto minmax(0,1fr) auto}
.topbar .active-label{font-size:14px}
.top-actions{justify-self:end}
body.class-active .app-content{margin-left:248px}
.builder-fields{display:grid;grid-template-columns:minmax(180px,2fr) minmax(150px,1fr) 90px 110px minmax(160px,1fr);gap:12px;align-items:end}
.small-field input{min-width:0}
.universal-drop{margin:16px 0;padding:26px 20px;border:2px dashed rgba(71,226,185,.55);border-radius:18px;text-align:center;background:linear-gradient(180deg,#1c5c5e38,#091a2d6b);transition:.18s ease}
.universal-drop.dragover{transform:scale(1.01);border-color:#6fffd2;background:#238e7b3b}
.drop-icon{font-size:32px;font-weight:900;line-height:1}
.universal-drop h2{margin:5px 0 4px}.universal-drop p{margin:0 0 14px}.centered{justify-content:center}
.supported-types{margin-top:14px;color:#9fb4c8;font-size:.82rem;line-height:1.45}
.compact-imports{grid-template-columns:repeat(4,minmax(0,1fr))}
.table-wrap{overflow:auto}
.builder-table input,.builder-table select{min-width:90px;width:100%;padding:7px 8px;border:1px solid #2a4864;border-radius:8px;background:#0b1a2a;color:#fff;font:inherit}
.builder-table .mini-input{width:58px;min-width:58px}.builder-table td{min-width:95px}.builder-table td:first-child{min-width:62px}.builder-table td:nth-last-child(-n+3){min-width:58px}
@media(max-width:900px){
  .app-content,body.class-active .app-content{margin-left:0}
  .side-menu{transform:translateX(-105%);transition:transform .2s ease;width:min(286px,86vw);box-shadow:22px 0 70px #000b}
  body.menu-open{overflow:hidden}.menu-open .side-menu{transform:translateX(0)}
  .menu-open .menu-scrim{display:block;position:fixed;z-index:70;inset:0;width:100%;border:0;background:#02070dbb}
  .side-close,.menu-toggle{display:block}
  .topbar{grid-template-columns:auto auto minmax(0,1fr) auto}
}
@media(max-width:820px){.builder-fields,.compact-imports{grid-template-columns:1fr 1fr}}
@media(max-width:760px){
  .topbar{grid-template-columns:auto auto minmax(0,1fr) auto}
  .topbar .active-label{display:block;font-size:11px}
  body.class-active main{height:calc(100dvh - 60px);padding-bottom:5px}
}
@media(max-width:520px){.builder-fields,.compact-imports{grid-template-columns:1fr}.universal-drop{padding:20px 12px}.top-actions{display:none}.topbar{grid-template-columns:auto auto minmax(0,1fr)}}

/* Shared Name & Face Learning hub for Personal, Friends, PRO and demo builds. */
.learning-hub-header{margin-bottom:18px}.learning-mode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.learning-mode-grid>button{display:grid;grid-template-columns:38px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:11px;min-height:116px;padding:16px;border:1px solid #315874;border-radius:17px;background:linear-gradient(145deg,#123149,#0b1e30);color:#fff;text-align:left}.learning-mode-grid>button:hover,.learning-mode-grid>button:focus-visible{border-color:#62e6be;background:linear-gradient(145deg,#17445b,#0d293d);transform:translateY(-2px)}.learning-mode-grid>button>span{grid-row:1/3;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#1a5264;color:#79f0c9;font-size:15px;font-weight:1000}.learning-mode-grid>button>strong{align-self:end;font-size:17px}.learning-mode-grid>button>small{align-self:start;margin-top:5px;color:#a9c0d0;line-height:1.35}
.learning-class-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:13px}.learning-class-list>button{display:grid;grid-template-columns:78px minmax(0,1fr);align-items:center;gap:13px;padding:12px;border:1px solid #315874;border-radius:16px;background:#10283d;color:#fff;text-align:left}.learning-class-list>button:hover{border-color:#62e6be}.learning-class-face,.learning-class-list .photo-placeholder{width:78px;height:78px;aspect-ratio:1;object-fit:cover;object-position:center 16%;border-radius:13px;background:#07111e}.learning-class-list span{display:grid;gap:5px}.learning-class-list strong{font-size:18px}.learning-class-list small{color:#9fb4c8}
.learning-students{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:15px}.learning-student-card{display:flex;flex-direction:column;border-width:2px}.learning-student-card.sex-m{border-color:#3186d8}.learning-student-card.sex-f{border-color:#d957a5}.learning-face,.learning-student-card>.photo-placeholder{width:100%;aspect-ratio:1/1;display:block;object-fit:cover;object-position:center 16%;background:#040a11}.learning-face{transform:scale(1.18);transform-origin:center 16%}.learning-student-copy{position:relative;z-index:1;padding:14px 14px 8px;background:linear-gradient(180deg,#0c2034,#0b1928)}.learning-student-copy small{color:#65e8c0;font-weight:900}.learning-student-copy h2{margin:3px 0;font-size:clamp(22px,3vw,30px);line-height:1.05}.learning-student-copy p{min-height:20px;margin:6px 0 0;color:#c0d5e4;font-weight:750}.practice-tools{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding:8px 14px 10px;background:#0b1928}.practice-tools button{min-width:0;padding:9px 7px;font-size:12px;font-weight:850}.practice-tools button:disabled{opacity:.42;cursor:not-allowed}.practice-status{position:relative;z-index:1;min-height:43px;padding:2px 14px 12px;background:#0b1928;color:#819bae;font-size:11px;line-height:1.35}
@media(max-width:900px){.learning-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.learning-mode-grid{grid-template-columns:1fr}.learning-mode-grid>button{min-height:95px}.learning-students{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.learning-student-copy{padding:10px 9px 6px}.learning-student-copy h2{font-size:18px}.learning-student-copy p{font-size:11px}.practice-tools{grid-template-columns:1fr;padding:6px 9px}.practice-tools button{font-size:10px;padding:7px 4px}.practice-status{padding:2px 9px 9px;font-size:9px}.learning-face,.learning-student-card>.photo-placeholder{aspect-ratio:4/5}}

/* All-photo visibility pass: 137 supplied portraits checked across all six classes. */
img[src*="/1C1/"]{--face-y:18%;--face-zoom:1.18;--learning-face-zoom:1.08}
img[src*="/1Q1/"]{--face-y:20%;--face-zoom:1.24;--learning-face-zoom:1.12}
img[src*="/1Q2/"]{--face-zoom:1.28;--learning-face-zoom:1.15}
img[src*="/2Q2/"]{--face-y:22%;--face-zoom:1.24;--learning-face-zoom:1.12}
img[src*="/3Q1/"]{--face-y:20%;--face-zoom:1.22;--learning-face-zoom:1.10}
img[src*="/3Q2/"]{--face-y:20%;--face-zoom:1.22;--learning-face-zoom:1.10}
img[src*="/Demo/"]{--face-y:16%;--face-zoom:1.02;--learning-face-zoom:1.00}

/* Portraits whose face sits outside the class-wide crop. */
img[src$="/1Q1/06.jpg"]{--face-y:27%}
img[src$="/1Q1/13.jpg"]{--face-x:44%;--face-y:25%}
img[src$="/1Q1/14.jpg"]{--face-y:31%}
img[src$="/1Q1/16.jpg"]{--face-y:30%}
img[src$="/1Q1/17.jpg"]{--face-y:29%}
img[src$="/1Q1/19.jpg"]{--face-y:48%;--face-zoom:1.15;--learning-face-zoom:1.08}
img[src$="/1Q1/21.jpg"]{--face-x:44%;--face-y:25%}

img[src$="/2Q2/01.jpg"]{--face-x:44%;--face-y:27%}
img[src$="/2Q2/11.jpg"]{--face-x:57%;--face-y:29%}
img[src$="/2Q2/12.jpg"]{--face-y:34%}
img[src$="/2Q2/17.jpg"]{--face-x:45%;--face-y:45%;--face-zoom:1.15;--learning-face-zoom:1.08}
img[src$="/2Q2/19.jpg"]{--face-x:42%;--face-y:68%;--face-zoom:1.15;--learning-face-zoom:1.08}
img[src$="/2Q2/22.jpg"]{--face-x:43%;--face-y:34%}
img[src$="/2Q2/26.jpg"]{--face-y:33%}

img[src$="/3Q1/16.jpg"]{--face-x:54%;--face-y:29%}
img[src$="/3Q1/21.jpg"]{--face-y:27%}
img[src$="/3Q1/23.jpg"]{--face-x:57%;--face-y:27%}
img[src$="/3Q1/24.jpg"]{--face-x:55%;--face-y:27%}

img[src$="/3Q2/02.jpg"]{--face-x:56%;--face-y:26%}
img[src$="/3Q2/12.jpg"]{--face-x:45%;--face-y:27%}
img[src$="/3Q2/17.jpg"]{--face-x:38%;--face-y:27%}
img[src$="/3Q2/20.jpg"]{--face-x:58%;--face-y:26%}
img[src$="/3Q2/23.jpg"]{--face-x:43%;--face-y:27%}
img[src$="/3Q2/24.jpg"]{--face-y:29%}
img[src$="/3Q2/26.jpg"]{--face-y:29%}

/* 1Q2 was checked one portrait at a time because framing varies most there. */
img[src$="/1Q2/01.jpg"]{--face-y:18%}img[src$="/1Q2/02.jpg"]{--face-y:19%}
img[src$="/1Q2/03.jpg"]{--face-y:31%}img[src$="/1Q2/04.jpg"]{--face-y:24%}
img[src$="/1Q2/05.jpg"]{--face-y:16%}img[src$="/1Q2/06.jpg"]{--face-y:25%}
img[src$="/1Q2/07.jpg"]{--face-y:24%}img[src$="/1Q2/08.jpg"]{--face-y:23%}
img[src$="/1Q2/09.jpg"]{--face-y:19%}img[src$="/1Q2/10.jpg"]{--face-y:20%}
img[src$="/1Q2/11.jpg"]{--face-y:19%}img[src$="/1Q2/12.jpg"]{--face-x:56%;--face-y:19%}
img[src$="/1Q2/13.jpg"]{--face-x:55%;--face-y:22%}img[src$="/1Q2/14.jpg"]{--face-y:20%}
img[src$="/1Q2/15.jpg"]{--face-y:20%}img[src$="/1Q2/16.jpg"]{--face-x:45%;--face-y:21%}
img[src$="/1Q2/17.jpg"]{--face-y:21%}img[src$="/1Q2/18.jpg"]{--face-y:16%}
img[src$="/1Q2/19.jpg"]{--face-x:55%;--face-y:22%}img[src$="/1Q2/20.jpg"]{--face-y:25%}
img[src$="/1Q2/21.jpg"]{--face-y:17%}img[src$="/1Q2/22.jpg"]{--face-y:18%}
img[src$="/1Q2/23.jpg"]{--face-x:32%;--face-y:18%}img[src$="/1Q2/24.jpg"]{--face-y:26%}
.student-photo,.face-photo,.face-main>.face-photo,.popout-photo,.quiz-photo,.learning-face,.learning-class-face,.confusion-pair-list .pair-photo{
  object-position:var(--face-x,50%) var(--face-y,16%)!important
}
.face-photo,.face-main>.face-photo{
  transform:scale(var(--face-zoom,1.55));
  transform-origin:var(--face-x,50%) var(--face-y,16%)
}
.learning-face{
  transform:scale(var(--learning-face-zoom,1.30));
  transform-origin:var(--face-x,50%) var(--face-y,16%)
}

/* Final professional visual system: bundled Vietnamese-safe typography and responsive QA fixes. */
@font-face{font-family:'VuNarIQ Sans';src:url('assets/fonts/NotoSans-Regular.ttf') format('truetype');font-style:normal;font-weight:400 699;font-display:swap}
@font-face{font-family:'VuNarIQ Sans';src:url('assets/fonts/NotoSans-Bold.ttf') format('truetype');font-style:normal;font-weight:700 1000;font-display:swap}
html,body,button,input,textarea,select{font-family:'VuNarIQ Sans',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
button,input,textarea,select{letter-spacing:normal}
button{transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease}
button:active:not(:disabled){transform:translateY(1px)}
.primary{box-shadow:0 7px 20px rgba(37,208,138,.18)}
.panel,.class-card,.student-card,.mode-card{border-color:#294760;box-shadow:0 14px 38px rgba(0,0,0,.27)}
.field input,.field textarea,.field select{min-height:44px}
.student-photo,.face-photo,.popout-photo,.quiz-photo,.learning-face,.learning-class-face,.pair-photo{image-orientation:from-image}
.face-photo,.face-main>.face-photo{transform:scale(var(--face-zoom,1.22))}
.learning-face{transform:scale(var(--learning-face-zoom,1.10))}
.face-caption strong,.learning-student-copy h2,.class-compact-header h1{font-feature-settings:"kern" 1,"liga" 1}
.drive-sync-panel{display:grid;gap:14px}.drive-sync-panel .field{margin:0}.drive-sync-status{display:grid;gap:3px;padding:12px 14px;border:1px solid #36526a;border-radius:14px;background:#0a1b2b}.drive-sync-status.connected{border-color:#269b75;background:#0b2c29}.drive-sync-status strong{color:#f5fbff}.drive-sync-status.connected strong{color:#7ff0c8}.drive-sync-status span{color:var(--muted);font-size:12px;line-height:1.45}.drive-private-badge{align-self:center;padding:6px 10px;border:1px solid #2f745f;border-radius:999px;background:#103b32;color:#91f1cd;font-size:11px;font-weight:900;white-space:nowrap}.drive-auto-control{display:flex;align-items:flex-start;gap:11px;padding:13px 14px;border:1px solid #2a4864;border-radius:14px;background:#0b1a2a;cursor:pointer}.drive-auto-control input{width:19px;height:19px;accent-color:var(--green);flex:0 0 auto}.drive-auto-control span{display:grid;gap:3px}.drive-auto-control small{color:var(--muted);line-height:1.4}.drive-sync-panel input[type="url"]{font-variant-ligatures:none}
.face-tile-actions button{font-variant-numeric:tabular-nums}
.tile-score,.team-score span,.metric,.history-score{font-variant-numeric:tabular-nums}

@media(max-width:900px){
  .class-compact-header>div:first-child{min-width:0}
  .class-summary{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .class-quick{min-width:0;max-width:58vw;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding-bottom:2px}
  .class-quick::-webkit-scrollbar{display:none}
  .class-quick>*{flex:0 0 auto}
}
@media(max-width:760px){
  body.class-active main{height:calc(100dvh - 60px - 67px - env(safe-area-inset-bottom));padding-bottom:4px}
  .class-compact-header{min-height:52px;gap:6px}
  .class-compact-header h1{font-size:20px}
  .class-compact-header .eyebrow{font-size:7.5px;letter-spacing:.05em}
  .class-quick{max-width:61vw;gap:4px}
  .class-quick .compact{min-height:34px;padding:5px 7px;font-size:9px}
  .class-quick .name-format-control{min-width:118px;padding:3px 5px}
  .class-quick .name-format-control span{font-size:8px}
  .class-quick .name-format-control select{padding:3px 5px;font-size:9px}
  .feature-categories{margin:2px 0;padding:5px 5px 4px;border-radius:10px}
  .feature-categories-title{display:none}
  .feature-category-grid{display:flex;gap:4px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding-bottom:1px}
  .feature-category-grid::-webkit-scrollbar{display:none}
  .feature-category{flex:0 0 126px!important;min-height:32px!important;padding:4px 6px!important;font-size:9px!important;white-space:nowrap!important}
  .feature-category>span{flex-basis:18px;width:18px;height:18px;font-size:8px}
  .mode-controls,.layout-controls{overflow-x:auto;grid-template-columns:repeat(7,minmax(76px,1fr));scrollbar-width:none}
  .mode-controls::-webkit-scrollbar,.layout-controls::-webkit-scrollbar{display:none}
  .mode-controls button,.layout-controls button{min-height:30px;font-size:8px}
  .class-board-wrap{border-radius:9px}
  .face-caption strong{font-size:clamp(8px,2.35vw,10px)}
  .face-caption small{font-size:clamp(6px,1.8vw,8px)}
}
@media(max-width:460px){
  .class-summary{display:none}
  .class-compact-header{min-height:46px}
  .class-quick{max-width:64vw}
  .face-caption small{display:none}
  .face-caption{padding:2px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* VUNARIQ_RANDOM_SELECTOR_153_CSS_LOCK_START */
.vnq-random-result{display:grid;justify-items:center;gap:10px;text-align:center}.vnq-random-result .quiz-photo{width:min(320px,78vw)!important;height:auto!important;aspect-ratio:1/1!important;object-fit:cover!important;object-position:center center!important;image-orientation:from-image!important;border-radius:20px!important;background:#040a11!important}.vnq-random-result h2{margin:0;font-size:clamp(30px,5vw,48px)}.vnq-random-location{display:grid;gap:4px;width:min(420px,100%);padding:13px 16px;border:2px solid #ffd33d;border-radius:13px;background:#3a310b;color:#fff5b5}.vnq-random-location strong{font-size:clamp(18px,3vw,25px)}.vnq-random-location small{font-weight:800}.vnq-flag-button{min-width:150px;border:2px solid currentColor!important;font-weight:900!important}.vnq-flag-button.green,.tile-observation.green{background:#0f5138!important;color:#87f5c6!important}.vnq-flag-button.red,.tile-observation.red{background:#661f2b!important;color:#ffb5bf!important}.face-main>.face-photo,.face-main>.photo-placeholder{width:min(94%,112px)!important;height:auto!important;aspect-ratio:1/1!important;border-radius:16px!important;object-fit:cover!important;object-position:center center!important;image-orientation:from-image!important}.face-tile-actions:has(.tile-observation){grid-template-columns:14px minmax(12px,.5fr) 14px minmax(18px,.65fr) 14px 14px 14px!important;gap:2px!important;min-height:20px!important;flex-basis:20px!important;padding:1px!important}.face-tile-actions:has(.tile-observation) button{font-size:9px!important;line-height:16px!important;border-radius:5px!important}.tile-audio,.tile-observation{min-width:0!important;padding:0!important;font-size:9px!important;line-height:16px!important}.tile-audio{background:#173b53!important;color:#d8f4ff!important}.vnq-random-seat-highlight{outline:4px solid #ffd33d!important;outline-offset:-4px!important;box-shadow:0 0 0 3px #071727,0 0 24px #ffd33daa!important}.history-green{color:#70e6b5;font-weight:900}.history-red{color:#ff929f;font-weight:900}
/* VUNARIQ_RANDOM_SELECTOR_153_CSS_LOCK_END */

/* V3_FACE_SAFE_BLACK_BACKGROUND */
.face-photo,.student-photo,.learning-face,.quiz-photo,.popout-photo,.pair-photo{object-fit:contain!important;object-position:center center!important;background:#000!important}

/* VUNARIQ_V3_ONE_SCREEN_COMPACT_START */
:root{--vnq-topbar-h:54px;--vnq-gap:7px;--vnq-radius:12px}
html,body{height:100%;height:100dvh;overflow:hidden}
.app-shell,.app-content{height:100%;height:100dvh;overflow:hidden}
.topbar{height:var(--vnq-topbar-h)!important;min-height:var(--vnq-topbar-h);padding:5px 10px!important;gap:7px!important}
.brand-logo-button{padding:0!important;min-width:0}.brand-logo-button img{display:block;max-height:40px;max-width:150px;width:auto;height:auto;object-fit:contain}
.global-back,.top-actions .ghost,.top-actions .secondary,.top-actions .primary{padding:6px 9px!important;border-radius:8px!important;font-size:11px!important;min-height:30px}
.top-actions{gap:4px!important;flex-wrap:nowrap!important}.topbar .active-label{font-size:12px!important}
.app-content{margin-left:216px!important}body.class-active .app-content{margin-left:216px!important}
.side-menu{width:216px!important;padding:10px 9px max(10px,env(safe-area-inset-bottom))!important}
.side-brand{font-size:26px!important}.side-edition{margin:5px 2px 8px!important;padding:4px 7px!important}.side-nav{gap:3px!important}.side-nav button{min-height:36px!important;padding:5px 7px!important;border-radius:8px!important;grid-template-columns:25px minmax(0,1fr)!important;gap:6px!important}.side-nav button span{width:24px!important;height:24px!important;border-radius:7px!important;font-size:13px!important}.side-nav button b{font-size:11px!important}.side-menu-footer{gap:5px!important;padding-top:8px!important}.side-menu-footer .manual-link{font-size:11px!important}
main{max-width:none!important;margin:0!important;height:calc(100dvh - var(--vnq-topbar-h));padding:9px 11px!important;overflow:hidden!important;transform-origin:top left}
body.class-active main{height:calc(100dvh - var(--vnq-topbar-h))!important;padding:5px 7px!important}
.hero{gap:8px!important}.hero-card{padding:14px!important}.hero h1{font-size:clamp(26px,3.2vw,40px)!important;margin:5px 0!important}.hero p{font-size:12px!important;line-height:1.35;margin:6px 0!important}.hero-actions,.toolbar,.row-actions{gap:5px!important}.metric-card{padding:12px!important;gap:5px!important}.metric{font-size:27px!important}.eyebrow{font-size:9px!important;letter-spacing:.9px!important}
.section-title{margin:9px 0 6px!important;gap:7px!important}.section-title.compact{margin:0 0 6px!important}.section-title h1,.section-title h2{font-size:20px!important}.grid{grid-template-columns:repeat(auto-fit,minmax(205px,1fr))!important;gap:7px!important}.class-card{padding:10px!important;border-radius:12px!important}.class-card h3{font-size:19px!important;margin:4px 0!important}.class-meta{gap:4px!important;margin:5px 0!important}.badge{padding:3px 6px!important;font-size:9px!important}.class-card .row-actions button{padding:5px 7px!important;font-size:9px!important;border-radius:7px!important}
.panel{padding:10px!important;margin-bottom:7px!important;border-radius:12px!important}.field{gap:3px!important;margin:5px 0!important}.field label{font-size:10px!important}.field input,.field textarea,.field select{min-height:30px!important;padding:5px 7px!important;border-radius:7px!important;font-size:11px!important}.field textarea{min-height:68px!important;resize:none!important}.small-note,.muted,.supported-types{font-size:10px!important;line-height:1.28!important}
.setup-steps{gap:4px!important;padding:0!important;overflow:hidden!important}.step{padding:4px 7px!important;font-size:9px!important}.builder-fields{gap:6px!important;grid-template-columns:minmax(145px,2fr) minmax(125px,1fr) 62px 74px minmax(125px,1fr)!important}.universal-drop{margin:6px 0!important;padding:8px 10px!important;border-radius:11px!important}.drop-icon{font-size:20px!important}.universal-drop h2{font-size:16px!important;margin:2px 0!important}.universal-drop p{font-size:10px!important;margin:0 0 5px!important}.supported-types{margin-top:5px!important}.compact-imports{gap:5px!important}.import-card{padding:7px!important;border-radius:9px!important}.import-card h3{font-size:12px!important;margin:1px 0 2px!important}.import-card p{margin:2px 0 4px!important}.import-card button{padding:5px 6px!important;font-size:9px!important}
.class-header{gap:7px!important;align-items:center!important}.class-header h1{font-size:24px!important}.class-header p{margin:3px 0!important;font-size:10px!important}.class-header .row-actions{flex-wrap:nowrap!important}
.table,.builder-table{font-size:9px!important;line-height:1.05!important}.table th,.table td,.builder-table th,.builder-table td{padding:2px 3px!important}.builder-table input,.builder-table select{min-height:23px!important;padding:2px 4px!important;font-size:9px!important;border-radius:5px!important}.builder-table .mini-input{width:44px!important;min-width:44px!important}.table-wrap,.rota-scroll,.setup-steps,.history-table-wrap,.confusion-pair-list{overflow:hidden!important;max-height:none!important}
.mode-grid{gap:6px!important;grid-template-columns:repeat(auto-fit,minmax(130px,1fr))!important}.mode-card{padding:9px!important;border-radius:10px!important}.mode-card strong{font-size:14px!important}.mode-card span{font-size:10px!important;margin-top:2px!important}
.learning-hub-header{margin-bottom:7px!important}.learning-mode-grid{gap:6px!important}.learning-mode-grid>button{min-height:68px!important;padding:8px!important;grid-template-columns:27px minmax(0,1fr)!important;column-gap:7px!important;border-radius:10px!important}.learning-mode-grid>button>span{width:27px!important;height:27px!important;border-radius:7px!important;font-size:10px!important}.learning-mode-grid>button>strong{font-size:13px!important}.learning-mode-grid>button>small{font-size:9px!important;margin-top:2px!important;line-height:1.15!important}.learning-class-list{grid-template-columns:repeat(auto-fit,minmax(185px,1fr))!important;gap:6px!important}.learning-class-list>button{grid-template-columns:50px minmax(0,1fr)!important;gap:7px!important;padding:6px!important;border-radius:9px!important}.learning-class-face,.learning-class-list .photo-placeholder{width:50px!important;height:50px!important;border-radius:8px!important}.learning-class-list strong{font-size:13px!important}.learning-class-list small{font-size:9px!important}.learning-students{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:5px!important}.learning-student-card{min-width:0!important}.learning-face,.learning-student-card>.photo-placeholder{aspect-ratio:4/3!important;max-height:120px!important}.learning-student-copy{padding:5px 6px 3px!important}.learning-student-copy h2{font-size:13px!important;margin:1px 0!important}.learning-student-copy p{min-height:0!important;margin:2px 0 0!important;font-size:8px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.learning-student-copy small{font-size:8px!important}.practice-tools{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:3px!important;padding:3px 6px!important}.practice-tools button{padding:4px 3px!important;font-size:8px!important}.practice-status{min-height:0!important;padding:1px 6px 4px!important;font-size:7px!important}
.quiz-wrap{max-width:760px!important}.quiz-photo,.quiz-placeholder{width:min(100%,440px)!important;max-height:46vh!important;margin:6px auto!important;border-radius:14px!important}.options{gap:5px!important}.option{padding:8px!important;border-radius:9px!important;font-size:11px!important}.scorebar{gap:6px!important;font-size:10px!important}.winner{font-size:22px!important}
.rota-next strong{font-size:15px!important}.rota-next-name{font-size:17px!important}.rota-countdown{font-size:21px!important;margin:2px 0!important}.today-lessons{gap:3px!important}.today-lesson{padding:5px 7px!important;border-radius:7px!important}.today-lesson strong{font-size:10px!important}.today-lesson span{font-size:8px!important;margin-top:1px!important}.rota-table{min-width:0!important;font-size:8px!important}.rota-table th,.rota-table td{padding:2px!important}.rota-table th small{font-size:7px!important}.rota-cell{border-radius:5px!important;padding:3px!important;font-size:8px!important}.rota-cell small{margin-top:0!important;font-size:6.5px!important}
.modal{padding:6px!important}.modal-card{width:min(720px,98vw)!important;max-height:calc(100dvh - 12px)!important;overflow:hidden!important;border-radius:12px!important;transform-origin:center center}.modal-head{padding:8px 10px!important}.modal-head h2{font-size:18px!important}.modal-card #modalBody{padding:8px 10px!important;overflow:hidden!important}.student-popout{gap:8px!important;grid-template-columns:minmax(180px,1.05fr) minmax(180px,.95fr)!important}.popout-visual{min-height:210px!important;max-height:58vh!important;border-radius:10px!important}.popout-photo,.popout-visual>.photo-placeholder{max-height:58vh!important}.popout-info{gap:5px!important}.popout-info h2{font-size:24px!important}.pron-block,.seat-team-readout,.popup-score-readout{padding:6px 8px!important;border-radius:7px!important}.pron-block span{font-size:8px!important}.pron-block strong{font-size:13px!important}.audio-button,.eliminate-btn,.reinstate-btn{padding:7px!important;border-radius:7px!important;font-size:10px!important}.point-panel{gap:4px!important}.point-panel strong{font-size:22px!important}.point-minus,.point-plus{padding:7px 5px!important;font-size:15px!important}
.class-screen{gap:4px!important}.class-compact-header{min-height:36px!important}.class-compact-header h1{font-size:clamp(20px,2.3vw,29px)!important}.class-summary{font-size:9px!important}.class-quick{gap:3px!important}.class-quick .compact{padding:4px 6px!important;font-size:9px!important}.class-controlbar{gap:4px!important}.mode-controls,.layout-controls{gap:3px!important}.mode-controls button,.layout-controls button{padding:4px 6px!important;font-size:9px!important;border-radius:6px!important}.class-board-wrap{padding:3px!important;border-radius:9px!important}.seating-board{gap:3px!important}.face-card.sex-m,.face-card.sex-f{border-width:3px!important}.face-tile-actions{flex-basis:17px!important;min-height:17px!important}.face-tile-actions button{line-height:15px!important}.face-caption strong{font-size:clamp(7px,1.17vmin,12px)!important}.face-caption small{font-size:clamp(6px,.9vmin,9px)!important}
.toast{bottom:12px!important;padding:6px 10px!important;font-size:10px!important}.empty{padding:14px 10px!important}.empty.slim{padding:8px!important}
@media(max-width:1100px){.app-content,body.class-active .app-content{margin-left:0!important}.learning-students{grid-template-columns:repeat(4,minmax(0,1fr))!important}.top-actions .ghost{padding:5px 6px!important}}
@media(max-width:760px){:root{--vnq-topbar-h:48px}.topbar{height:48px!important;min-height:48px!important}.brand-logo-button img{max-height:34px;max-width:112px}.global-back{font-size:9px!important;padding:4px 5px!important}.topbar .active-label{font-size:9px!important}.bottomnav{height:48px!important;padding:3px calc(3px + env(safe-area-inset-right)) calc(3px + env(safe-area-inset-bottom)) calc(3px + env(safe-area-inset-left))!important}.bottomnav button{padding:3px 1px!important;font-size:8px!important}main{height:calc(100dvh - 96px)!important;padding:5px!important}body.class-active main{height:calc(100dvh - 96px)!important;padding:3px 4px!important}.hero{grid-template-columns:1fr 1fr!important}.hero-card{padding:8px!important}.hero h1{font-size:20px!important}.hero p{font-size:9px!important}.metric-card{padding:7px!important}.metric{font-size:20px!important}.grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.class-card{padding:6px!important}.class-card h3{font-size:14px!important}.class-card .row-actions{display:grid;grid-template-columns:1fr 1fr}.class-card .row-actions button{font-size:7px!important;padding:4px 3px!important}.builder-fields{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:3px!important}.builder-fields .field label{font-size:7px!important}.builder-fields .field input,.builder-fields .field select{font-size:8px!important;padding:3px!important}.universal-drop{padding:5px!important}.universal-drop p,.supported-types{display:none!important}.compact-imports{grid-template-columns:repeat(4,minmax(0,1fr))!important}.import-card p{display:none!important}.import-card h3{font-size:9px!important}.learning-mode-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.learning-mode-grid>button{min-height:54px!important;padding:5px!important}.learning-mode-grid>button small{display:none}.learning-students{grid-template-columns:repeat(4,minmax(0,1fr))!important}.learning-face,.learning-student-card>.photo-placeholder{max-height:92px!important}.practice-status{display:none!important}.learning-student-copy p{display:none!important}.quiz-photo,.quiz-placeholder{max-height:38vh!important}.student-popout{grid-template-columns:1fr 1fr!important}.popout-visual{min-height:150px!important;max-height:42vh!important}.popout-photo,.popout-visual>.photo-placeholder{max-height:42vh!important}.class-compact-header{min-height:30px!important}.class-compact-header h1{font-size:17px!important}.mode-controls button,.layout-controls button{font-size:7px!important;padding:3px 4px!important}.feature-category{min-height:26px!important}.face-caption small{display:none!important}}
@media(max-width:480px){.hero{grid-template-columns:1fr!important}.metric-card{display:none!important}.grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.learning-students{grid-template-columns:repeat(3,minmax(0,1fr))!important}.compact-imports{grid-template-columns:repeat(2,minmax(0,1fr))!important}.builder-fields{grid-template-columns:repeat(2,minmax(0,1fr))!important}.student-popout{grid-template-columns:1fr!important}.popout-visual{max-height:34vh!important}.popout-info h2{font-size:18px!important}}
/* VUNARIQ_V3_ONE_SCREEN_COMPACT_END */


/* VUNARIQ V3 CLEAN / ONE-SCREEN UI */
:root{--v3-clean-top:46px;--v3-clean-rota:30px;--v3-clean-gap:5px}
html,body{height:100%;overflow:hidden!important}body{margin:0!important}
.topbar{height:var(--v3-clean-top)!important;min-height:var(--v3-clean-top)!important;padding:3px 8px!important;gap:7px!important;border-bottom-width:1px!important}
.brand.brand-logo-button{width:118px!important;min-width:90px!important}.brand-logo-button img{max-height:39px!important;width:auto!important;max-width:118px!important}
.global-back{min-height:31px!important;padding:4px 7px!important;font-size:10px!important;white-space:nowrap}.active-label{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:11px!important;font-weight:900!important}
.top-actions{margin-left:auto!important;gap:0!important}.top-actions>*{display:none!important}.top-actions>#v3MainMenuButton{display:flex!important}
.v3-main-menu-button{align-items:center!important;gap:6px!important;min-height:32px!important;padding:5px 10px!important;border:1px solid #42637a!important;border-radius:9px!important;background:#0d2a40!important;color:#f4fbff!important;font:900 11px/1 system-ui!important}.v3-main-menu-button span{font-size:15px}.v3-main-menu-button:hover{border-color:#64e4c0!important;background:#12394f!important}
.bottomnav{display:none!important}
.v3-rota-overlay{height:var(--v3-clean-rota)!important;min-height:var(--v3-clean-rota)!important;padding:3px 9px!important;gap:8px!important;flex-wrap:nowrap!important;overflow:hidden!important;white-space:nowrap!important;font-size:9px!important;position:relative!important}.v3-rota-overlay strong{font-size:13px!important}.v3-rota-overlay b{font-size:10px!important;overflow:hidden;text-overflow:ellipsis}.v3-rota-overlay small{font-size:8px!important}
main,body.class-active main{height:calc(100dvh - var(--v3-clean-top) - var(--v3-clean-rota))!important;max-height:calc(100dvh - var(--v3-clean-top) - var(--v3-clean-rota))!important;min-height:0!important;padding:5px 7px!important;overflow:hidden!important}
.v3-ui-hidden-duplicate{display:none!important}
.hero{gap:7px!important;margin:0!important}.hero-card,.metric-card,.panel{padding:8px!important;border-radius:11px!important}.hero h1{font-size:clamp(19px,2.7vw,27px)!important;margin:2px 0!important}.hero p{font-size:10px!important;line-height:1.3!important;margin:4px 0 6px!important}.hero-actions,.row-actions{gap:4px!important}.hero-actions button,.row-actions button,.row-actions a{min-height:29px!important;padding:5px 8px!important;font-size:9px!important;border-radius:7px!important}.metric{font-size:24px!important}.section-title{margin:6px 0 4px!important}.section-title h1,.section-title h2{font-size:18px!important}.grid{gap:5px!important}.class-card{padding:7px!important}.class-card h3{font-size:16px!important;margin:2px 0!important}.class-meta{margin:3px 0!important}.class-card .row-actions button{min-height:26px!important;padding:4px 6px!important}
.class-screen{gap:3px!important}.class-compact-header{min-height:30px!important;gap:4px!important}.class-compact-header h1{font-size:20px!important;margin:0!important}.class-compact-header .eyebrow{font-size:8px!important}.class-summary{font-size:8px!important;line-height:1.15!important;max-height:20px!important;overflow:hidden!important}.class-quick{gap:3px!important}.class-quick .compact{min-height:24px!important;padding:3px 6px!important;font-size:8px!important}.class-controlbar{margin:0!important;min-height:24px!important}.layout-controls{gap:3px!important}.layout-controls button{min-height:23px!important;padding:3px 5px!important;font-size:8px!important}.class-board-wrap{min-height:0!important;padding:2px!important}.drag-hint{font-size:8px!important;padding:2px 5px!important;min-height:17px!important}.seating-board,.team-board{gap:2px!important}.face-card{border-radius:6px!important}.face-caption{padding:1px 2px 2px!important}.face-caption strong{font-size:clamp(7px,1.05vmin,11px)!important}.face-caption small{font-size:clamp(6px,.78vmin,8px)!important}.face-tile-actions{min-height:17px!important;flex-basis:17px!important}.face-tile-actions button{height:15px!important;min-height:15px!important;font-size:7px!important}
.learning-hub-header{margin-bottom:5px!important}.learning-hub-header p{font-size:9px!important;margin:2px 0!important}.learning-mode-grid{gap:5px!important}.learning-mode-grid>button{min-height:56px!important;padding:6px!important}.learning-mode-grid>button strong{font-size:11px!important}.learning-mode-grid>button small{font-size:8px!important;line-height:1.2!important}.learning-students{gap:5px!important}.learning-student-card{padding:5px!important}.learning-student-copy h2{font-size:14px!important}.learning-student-copy p{font-size:8px!important}.practice-tools button{min-height:24px!important;padding:3px 5px!important;font-size:8px!important}
.modal{padding:5px!important}.modal-card{max-height:calc(100dvh - 10px)!important;overflow:auto!important;border-radius:12px!important;padding:8px!important}.modal-head{min-height:31px!important}.modal-head h2{font-size:17px!important}
/* Drawer */
#v3MenuBackdrop{display:none;position:fixed;inset:0;z-index:5000;border:0;background:#0009;backdrop-filter:blur(2px)}#v3MainMenu{position:fixed;z-index:5001;top:0;right:0;width:min(440px,94vw);height:100dvh;transform:translateX(104%);transition:transform .18s ease;background:linear-gradient(180deg,#071b2c,#071522 55%,#06111d);border-left:1px solid #35566d;box-shadow:-24px 0 80px #0009;color:#eef8ff;display:grid;grid-template-rows:auto minmax(0,1fr)}body.v3-menu-open #v3MenuBackdrop{display:block}body.v3-menu-open #v3MainMenu{transform:none}
#v3MainMenu>header{display:flex;align-items:center;justify-content:space-between;padding:10px 11px 8px;border-bottom:1px solid #29465a}#v3MainMenu>header div{display:grid;gap:1px}#v3MainMenu>header strong{font-size:17px}#v3MainMenu>header small{font-size:9px;color:#91aabe}#v3MenuClose{width:30px;height:30px;padding:0;border:1px solid #3c5a6e;border-radius:8px;background:#102b3e;color:#fff;font-size:20px}.v3-menu-scroll{min-height:0;overflow:auto;padding:7px 8px 12px}.v3-menu-section{display:grid;gap:3px;margin-bottom:8px}.v3-menu-section h3{margin:4px 3px 3px;font-size:9px;letter-spacing:.11em;text-transform:uppercase;color:#70dfbd}
.v3-menu-row{display:grid;grid-template-columns:minmax(0,1fr) 31px;gap:3px}.v3-menu-main,.v3-option-card{min-height:42px;border:1px solid #294a60;border-radius:9px;background:#0d2639;color:#eef8ff}.v3-menu-main{display:grid;grid-template-columns:27px minmax(0,1fr) auto;align-items:center;gap:6px;padding:4px 7px;text-align:left}.v3-menu-main:disabled{opacity:.38}.v3-menu-main:not(:disabled):hover{border-color:#5ce0bb;background:#11334a}.v3-menu-icon{display:grid;place-items:center;width:25px;height:25px;border-radius:7px;background:#183b52;color:#76e8c7;font-size:13px;font-weight:1000}.v3-menu-copy{display:grid;gap:1px;min-width:0}.v3-menu-copy b{font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.v3-menu-copy small{font-size:7.7px;color:#9ab0c0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.v3-lock{padding:3px 5px;border-radius:999px;background:#402116;color:#ffc98c;font-size:7px;font-weight:1000}.v3-info{width:31px;min-height:42px;padding:0;border:1px solid #294a60;border-radius:9px;background:#0c2132;color:#9ed8ef;font-size:14px}.v3-info:hover{border-color:#64e4c0;color:#fff}
.v3-option-card{display:grid;grid-template-columns:minmax(124px,.9fr) minmax(130px,1.25fr) 31px;align-items:center;gap:5px;padding:4px 5px}.v3-option-card>div{display:grid;grid-template-columns:27px minmax(0,1fr);align-items:center;gap:6px}.v3-option-card select{min-width:0;width:100%;height:30px;padding:3px 20px 3px 6px;border:1px solid #34566c;border-radius:7px;background:#071a2a;color:#fff;font-size:9px}.v3-option-card .v3-info{min-height:30px;height:30px}
.v3-menu-help-panel{margin-top:6px;padding:8px 9px;border:1px solid #31576c;border-left:3px solid #65e3be;border-radius:9px;background:#081c2b}.v3-menu-help-title{font-size:12px;font-weight:950;color:#fff}.v3-menu-help-panel p{margin:4px 0;font-size:9px;line-height:1.35;color:#c8d8e4}.v3-menu-help-panel small{display:block;font-size:8px;line-height:1.35;color:#78d9bd}
/* View modes */
body[data-v3-view="standard"] main{padding:7px 9px!important}body[data-v3-view="standard"] .class-card{padding:9px!important}body[data-v3-view="presentation"] .class-summary,body[data-v3-view="presentation"] .drag-hint,body[data-v3-view="presentation"] .face-caption small{display:none!important}body[data-v3-view="presentation"] .class-compact-header{min-height:25px!important}body[data-v3-view="presentation"] .face-caption strong{font-size:clamp(8px,1.35vmin,14px)!important}body[data-v3-view="presentation"] .face-main>.face-photo,body[data-v3-view="presentation"] .face-main>.photo-placeholder{width:98%!important;max-width:none!important}
@media(max-width:760px){:root{--v3-clean-top:42px;--v3-clean-rota:27px}.topbar{padding:2px 4px!important}.brand.brand-logo-button{width:88px!important}.brand-logo-button img{max-width:88px!important;max-height:33px!important}.global-back{font-size:8px!important;padding:3px 4px!important}.active-label{font-size:8px!important}.v3-main-menu-button{min-height:28px!important;padding:4px 7px!important;font-size:9px!important}.v3-rota-overlay{padding:2px 5px!important;gap:5px!important}.v3-rota-overlay span,.v3-rota-overlay small{display:none!important}.v3-rota-overlay strong{font-size:11px!important}.v3-rota-overlay b{font-size:8px!important}.hero-card{padding:6px!important}.hero h1{font-size:17px!important}.hero p{display:none!important}.metric-card{padding:5px!important}.metric{font-size:18px!important}.class-summary{display:none!important}.class-compact-header h1{font-size:16px!important}.layout-controls button{font-size:7px!important;padding:2px 3px!important}.v3-option-card{grid-template-columns:minmax(105px,.8fr) minmax(112px,1.2fr) 28px}.v3-option-card select{font-size:8px}.v3-menu-scroll{padding:5px}.v3-menu-row{grid-template-columns:minmax(0,1fr) 29px}.v3-menu-main{min-height:38px}.v3-info{width:29px;min-height:38px}.v3-menu-copy b{font-size:9.5px}.v3-menu-copy small{font-size:7px}}
@media(max-width:480px){#v3MainMenu{width:96vw}.v3-option-card{grid-template-columns:1fr 1fr 27px}.class-quick{max-width:42%}.class-quick .session-start,.class-quick .session-end{font-size:7px!important}.grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}


/* V3 CONTROL CENTER REFINEMENT */
:root{--v3-clean-top:54px}
.topbar{grid-template-columns:auto auto minmax(0,1fr) auto!important}
.brand.brand-logo-button{width:172px!important;min-width:150px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important}
.brand-logo-button img{max-width:172px!important;max-height:48px!important;width:auto!important;height:auto!important;object-fit:contain!important}
.v3-main-menu-button{min-height:40px!important;padding:4px 10px 4px 7px!important;gap:7px!important;border-radius:11px!important;background:linear-gradient(135deg,#11354d,#0b2539)!important;border-color:#4a728a!important;box-shadow:0 7px 22px #0004!important}
.v3-control-icon{display:grid!important;place-items:center!important;width:30px!important;height:30px!important;border-radius:9px!important;background:linear-gradient(135deg,#6ff0c8,#39bfd4)!important;color:#061925!important;font-size:18px!important;font-weight:1000!important;box-shadow:0 0 0 1px #b5ffe966 inset!important}
.v3-control-label{display:grid!important;gap:0!important;text-align:left!important;line-height:1!important}.v3-control-label b{font-size:11px!important;color:#fff!important;letter-spacing:.01em}.v3-control-label small{font-size:8px!important;color:#8ee7cc!important;font-weight:850!important;margin-top:2px!important}
body:not(.v3-menu-open) #v3MainMenu{visibility:hidden!important;pointer-events:none!important}body.v3-menu-open #v3MainMenu{visibility:visible!important;pointer-events:auto!important}
#v3MainMenu>header strong{font-size:16px!important;letter-spacing:.01em!important;color:#fff!important}#v3MainMenu>header small{color:#78d9bd!important}
.v3-social-footer{position:fixed;z-index:4900;left:50%;bottom:6px;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:7px;max-width:calc(100vw - 18px);min-height:31px;padding:4px 6px 4px 10px;border:1px solid #2e5268;border-radius:12px;background:linear-gradient(135deg,#081b2aee,#0d2a3ddd);backdrop-filter:blur(14px);box-shadow:0 10px 30px #0006;color:#b7cedd;font-size:8px;white-space:nowrap}
.v3-social-title{font-weight:950;color:#74e7c5;letter-spacing:.02em}.v3-social-item{color:#b7cedd;text-decoration:none;padding:2px 3px}.v3-social-item:hover{color:#fff}.v3-footer-upgrade{min-height:23px!important;padding:3px 8px!important;border:0!important;border-radius:8px!important;background:linear-gradient(135deg,#d6a64a,#f2d37c)!important;color:#281b05!important;font:950 8px/1 system-ui!important;box-shadow:none!important}.v3-footer-upgrade:hover{filter:brightness(1.07)}
body.v3-home-screen main{padding-bottom:43px!important}
body.v3-home-screen .hero-actions [data-action="demo-upgrade"]{display:none!important}
@media(max-width:760px){:root{--v3-clean-top:48px}.brand.brand-logo-button{width:118px!important;min-width:105px!important}.brand-logo-button img{max-width:118px!important;max-height:42px!important}.v3-main-menu-button{min-height:36px!important;padding:3px 7px!important;gap:5px!important}.v3-control-icon{width:27px!important;height:27px!important;font-size:16px!important}.v3-control-label b{font-size:8.5px!important}.v3-control-label small{font-size:7px!important}.v3-social-footer{bottom:4px;gap:3px;padding:3px 4px;min-height:28px;font-size:6.8px}.v3-social-title{display:none}.v3-social-item{padding:1px 2px}.v3-footer-upgrade{font-size:7px!important;padding:3px 6px!important}body.v3-home-screen main{padding-bottom:36px!important}}
@media(max-width:520px){.active-label{display:none!important}.brand.brand-logo-button{width:104px!important;min-width:96px!important}.brand-logo-button img{max-width:104px!important}.v3-main-menu-button{max-width:108px!important}.v3-control-label b{font-size:7.5px!important}.v3-control-label small{font-size:6.6px!important}.v3-social-footer .v3-social-item:nth-of-type(3){display:none}}


/* VUNARIQ V3.2 — CONFIRMED CONTROL CENTER DESIGN */
.top-actions>*{display:none!important}.top-actions>#v3MainMenuButton{display:flex!important}
.v3-main-menu-button{min-width:172px!important;justify-content:flex-start!important}
.brand.brand-logo-button{width:172px!important;min-width:172px!important;height:42px!important;padding:0!important}
.brand-logo-button img{width:100%!important;max-width:172px!important;max-height:42px!important;object-fit:contain!important;object-position:left center!important}
.v3-control-label b{font-size:11.5px!important}.v3-control-label small{font-size:8.5px!important}
.v3-control-icon{font-size:19px!important}
body.v3-home-screen .hero-actions [data-action="demo-upgrade"]{display:none!important}
@media(max-width:760px){.brand.brand-logo-button{width:118px!important;min-width:118px!important;height:36px!important}.brand-logo-button img{max-width:118px!important;max-height:36px!important}.v3-main-menu-button{min-width:118px!important;max-width:128px!important}.v3-control-label b{font-size:8.8px!important}.v3-control-label small{font-size:7px!important}}
@media(max-width:520px){.brand.brand-logo-button{width:100px!important;min-width:100px!important}.brand-logo-button img{max-width:100px!important}.v3-main-menu-button{min-width:104px!important;max-width:110px!important}}

/* VuNarIQ V3.2 — Responsive Breathing Room / QR + Web Sync */
:root{--v32-space-1:6px;--v32-space-2:10px;--v32-space-3:14px;--v32-radius:14px}
.topbar{padding:6px 12px!important;gap:10px!important;min-height:60px!important;height:60px!important}
.brand.brand-logo-button{width:180px!important;min-width:180px!important;height:46px!important}
.brand-logo-button img{max-width:180px!important;max-height:46px!important}
.v3-main-menu-button{min-width:190px!important;min-height:44px!important;padding:6px 12px 6px 8px!important;gap:9px!important;border-radius:13px!important}
.v3-control-icon{width:32px!important;height:32px!important;font-size:19px!important;border-radius:10px!important}
.v3-control-label{line-height:1.08!important;gap:2px!important}.v3-control-label b{font-size:12px!important;line-height:1.12!important}.v3-control-label small{font-size:9px!important;line-height:1.1!important}
.active-label{padding-inline:3px!important;font-size:11px!important;line-height:1.2!important}
main,body.class-active main{height:calc(100dvh - 60px - var(--v3-clean-rota))!important;max-height:calc(100dvh - 60px - var(--v3-clean-rota))!important;padding:9px 12px!important}
.hero{gap:10px!important}.hero-card,.metric-card,.panel{padding:12px!important;border-radius:var(--v32-radius)!important}.hero h1{margin:3px 0 6px!important;line-height:1.12!important}.hero p{margin:5px 0 8px!important;line-height:1.42!important}.hero-actions,.row-actions{gap:7px!important}
.grid{gap:9px!important}.class-card{padding:10px!important;border-radius:13px!important}.class-card h3{margin:3px 0 5px!important}.class-meta{gap:5px!important;margin:5px 0 7px!important}
.class-screen{gap:5px!important}.class-compact-header{gap:8px!important;min-height:34px!important}.class-compact-header h1{line-height:1.08!important}.class-controlbar{gap:5px!important}.mode-controls,.layout-controls{gap:5px!important}.class-board-wrap{padding:4px!important}.seating-board,.team-board{gap:3px!important}
#v3MainMenu>header{padding:14px 14px 11px!important}#v3MainMenu>header strong{font-size:17px!important;line-height:1.15!important}#v3MainMenu>header small{font-size:10px!important;line-height:1.25!important;margin-top:3px!important}.v3-menu-scroll{padding:10px 11px 16px!important}.v3-menu-section{gap:6px!important;margin-bottom:12px!important}.v3-menu-section h3{margin:7px 4px 4px!important;font-size:10px!important}.v3-menu-row{gap:5px!important}.v3-menu-main,.v3-option-card{min-height:48px!important;border-radius:11px!important}.v3-menu-main{gap:8px!important;padding:6px 9px!important;grid-template-columns:29px minmax(0,1fr) auto!important}.v3-menu-icon{width:28px!important;height:28px!important}.v3-menu-copy{gap:2px!important}.v3-menu-copy b{font-size:11.5px!important;line-height:1.15!important}.v3-menu-copy small{font-size:8.5px!important;line-height:1.25!important}.v3-info{min-height:48px!important;border-radius:11px!important}.v3-option-card{gap:7px!important;padding:6px 7px!important}.v3-option-card select{height:34px!important;font-size:10px!important}.v3-menu-help-panel{padding:11px 12px!important;margin-top:9px!important}.v3-menu-help-title{font-size:13px!important}.v3-menu-help-panel p{font-size:10px!important;line-height:1.45!important}.v3-menu-help-panel small{font-size:9px!important;line-height:1.4!important}
/* Social / upgrade belongs at the bottom of the HOME screen only. */
body:not(.v3-home-screen) .v3-social-footer{display:none!important}
.v3-social-footer{width:auto!important;max-width:min(860px,calc(100vw - 24px))!important;min-height:38px!important;bottom:8px!important;gap:10px!important;padding:6px 8px 6px 12px!important;border-radius:14px!important;font-size:9px!important;white-space:normal!important;flex-wrap:wrap!important;row-gap:4px!important}
.v3-social-title{font-size:9px!important}.v3-social-item{padding:3px 5px!important;line-height:1.2!important}.v3-footer-upgrade{min-height:28px!important;padding:5px 11px!important;border-radius:9px!important;font-size:8.5px!important;letter-spacing:.01em!important}
body.v3-home-screen main{padding-bottom:54px!important}
/* The legacy hero upgrade/update shortcut never appears at the top. */
body .hero-actions [data-action="demo-upgrade"],body .topbar [data-action="demo-upgrade"],body .top-actions [data-action="demo-upgrade"]{display:none!important}

@media(max-width:900px){
  .topbar{padding:6px 9px!important;gap:8px!important}.brand.brand-logo-button{width:148px!important;min-width:148px!important}.brand-logo-button img{max-width:148px!important}.v3-main-menu-button{min-width:156px!important}.v3-control-label b{font-size:10.5px!important}.v3-control-label small{font-size:8.3px!important}
}
@media(max-width:760px){
  :root{--v3-clean-top:58px;--v3-clean-rota:29px}
  .topbar{height:58px!important;min-height:58px!important;padding:7px 8px!important;gap:7px!important}
  .brand.brand-logo-button{width:126px!important;min-width:126px!important;height:40px!important}.brand-logo-button img{max-width:126px!important;max-height:40px!important}
  .global-back{min-height:34px!important;padding:5px 7px!important;font-size:9px!important}
  .v3-main-menu-button{min-width:138px!important;max-width:148px!important;min-height:40px!important;padding:5px 8px!important;gap:7px!important}
  .v3-control-icon{width:29px!important;height:29px!important;font-size:17px!important}.v3-control-label b{font-size:9.5px!important;line-height:1.16!important}.v3-control-label small{font-size:7.7px!important;line-height:1.16!important}
  main,body.class-active main{height:calc(100dvh - 58px - var(--v3-clean-rota))!important;max-height:calc(100dvh - 58px - var(--v3-clean-rota))!important;padding:7px 8px!important}
  .hero-card,.metric-card,.panel{padding:9px!important}.hero h1{font-size:18px!important;line-height:1.15!important}.hero p{display:block!important;font-size:9px!important;line-height:1.35!important;max-height:2.8em!important;overflow:hidden!important}
  #v3MainMenu{width:min(470px,96vw)!important}.v3-menu-scroll{padding:8px!important}.v3-menu-main,.v3-option-card{min-height:46px!important}.v3-menu-copy b{font-size:10.5px!important}.v3-menu-copy small{font-size:8px!important}.v3-info{min-height:46px!important}
  .v3-social-footer{width:calc(100vw - 16px)!important;max-width:none!important;bottom:6px!important;justify-content:center!important;gap:5px 8px!important;padding:7px 8px!important;font-size:8px!important}.v3-social-title{width:100%;text-align:center;display:block!important;font-size:8px!important}.v3-footer-upgrade{font-size:8px!important;padding:5px 9px!important}.v3-social-item{padding:2px 4px!important}
  body.v3-home-screen main{padding-bottom:72px!important}
}
@media(max-width:520px){
  :root{--v3-clean-top:62px}
  .topbar{height:62px!important;min-height:62px!important;padding:8px 7px!important;gap:6px!important;grid-template-columns:auto auto minmax(0,1fr) auto!important}
  .brand.brand-logo-button{width:112px!important;min-width:112px!important;height:42px!important}.brand-logo-button img{max-width:112px!important;max-height:42px!important}
  .active-label{display:none!important}
  .v3-main-menu-button{min-width:132px!important;max-width:138px!important;min-height:43px!important;padding:5px 7px!important;gap:6px!important}
  .v3-control-icon{width:30px!important;height:30px!important;flex:0 0 auto!important}.v3-control-label b{font-size:9.4px!important;line-height:1.18!important;white-space:normal!important}.v3-control-label small{font-size:7.5px!important;line-height:1.18!important;white-space:normal!important}
  main,body.class-active main{height:calc(100dvh - 62px - var(--v3-clean-rota))!important;max-height:calc(100dvh - 62px - var(--v3-clean-rota))!important;padding:7px!important}
  .class-compact-header{gap:6px!important}.class-compact-header h1{font-size:17px!important;line-height:1.1!important}.class-quick{max-width:48%!important;gap:4px!important}.class-quick .compact{min-height:27px!important;padding:4px 6px!important;font-size:7.5px!important}
  #v3MainMenu>header{padding:13px 12px 10px!important}#v3MainMenu>header strong{font-size:15px!important;line-height:1.2!important}#v3MainMenu>header small{font-size:9px!important}.v3-menu-main{grid-template-columns:29px minmax(0,1fr) auto!important;padding:6px 8px!important}.v3-menu-copy b{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.2!important}.v3-menu-copy small{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.25!important}.v3-option-card{grid-template-columns:1fr!important;padding:8px!important}.v3-option-card>div{grid-template-columns:29px minmax(0,1fr)!important}.v3-option-card select{width:100%!important;height:36px!important}.v3-option-card .v3-info{position:absolute!important;right:18px!important;width:30px!important;height:30px!important;min-height:30px!important}
  .v3-social-footer{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;width:calc(100vw - 14px)!important;gap:4px!important;padding:7px!important}.v3-social-title{grid-column:1/-1!important}.v3-social-item{text-align:center!important;font-size:7.4px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.v3-footer-upgrade{grid-column:1/-1!important;width:100%!important;min-height:30px!important;font-size:8px!important;margin-top:1px!important}
  body.v3-home-screen main{padding-bottom:96px!important}
}
@media(max-width:390px){
  .brand.brand-logo-button{width:98px!important;min-width:98px!important}.brand-logo-button img{max-width:98px!important}.global-back{padding:4px 5px!important}.v3-main-menu-button{min-width:122px!important;max-width:126px!important}.v3-control-label b{font-size:8.8px!important}.v3-control-label small{font-size:7.2px!important}
}

/* V3.2 agreed student flag system — restored */
.face-flag-status{position:absolute;z-index:6;top:4px;right:4px;display:flex;flex-direction:column;align-items:flex-end;gap:2px;pointer-events:none}.face-flag-pill{display:inline-flex;align-items:center;gap:2px;min-width:22px;justify-content:center;padding:2px 5px;border-radius:999px;border:1px solid currentColor;font-size:9px;line-height:1;font-weight:1000;box-shadow:0 1px 5px #0008}.face-flag-pill.good{background:#083b2adf;color:#79efb5}.face-flag-pill.attention{background:#551923df;color:#ff93a2}.tile-observation{font-weight:1000!important;border:1px solid currentColor!important}.tile-observation.green{background:#0b5238!important;color:#82f4bd!important}.tile-observation.red{background:#6b1d2b!important;color:#ff9cab!important}.student-flag-panel{display:grid;gap:7px;padding:9px 10px;border:1px solid #2e536d;border-radius:12px;background:#091a29}.student-flag-summary,.student-flag-actions{display:flex;gap:7px;flex-wrap:wrap}.student-flag-summary span{display:inline-flex;align-items:center;gap:4px;padding:4px 7px;border-radius:999px;font-size:11px;font-weight:1000}.flag-summary-good{background:#0a3c2c;color:#8ef5c5;border:1px solid #2fa873}.flag-summary-attention{background:#4d1923;color:#ffabb6;border:1px solid #bd4558}.compact-flag{min-width:0!important;padding:6px 9px!important;font-size:11px!important}.student-flag-panel small{color:#9db3c3;font-weight:700}.vnq-random-result .vnq-flag-button.green{background:#0b5238!important;color:#8ef5c5!important}.vnq-random-result .vnq-flag-button.red{background:#6b1d2b!important;color:#ffabb6!important}@media(max-width:760px){.face-flag-status{top:2px;right:2px;gap:1px}.face-flag-pill{padding:1px 3px;font-size:6.5px;min-width:17px}.student-flag-panel{padding:6px;gap:5px}.student-flag-summary span{font-size:9px;padding:3px 5px}.compact-flag{font-size:9px!important;padding:5px 7px!important}}