@font-face{font-family:"Noto Sans Arabic";font-style:normal;font-weight:100 900;font-display:swap;src:url("/theme/noto-sans-arabic.woff2") format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
/* TeachTally design system: public site, student portal, sign-in, demo shell and teacher panel pages. */
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url("/theme/inter-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url("/theme/inter-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{
  --tgh-bg:#121a2e;--tgh-card:#1a2440;--tgh-card2:#202b4c;--tgh-row:#1e2a4a;--tgh-row2:#1b2544;--tgh-pop:#223052;
  --tgh-line:rgba(255,255,255,.09);--tgh-line2:rgba(255,255,255,.14);--tgh-ink:#f4f6fb;--tgh-soft:#d0d8ee;--tgh-mute:#9ba8c8;
  --tgh-acc:#6cb8ff;--tgh-acc-soft:rgba(108,184,255,.16);--tgh-acc-line:rgba(108,184,255,.55);--tgh-red:#ff7d72;--tgh-logo:#1a2440;
  --tgh-font:"Inter","Noto Sans Arabic","Noto Kufi Arabic",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  color-scheme:dark;
}
html{background:var(--tgh-bg)!important}
body{background:var(--tgh-bg)!important;color:var(--tgh-ink)!important;font-family:var(--tgh-font)!important;font-weight:400!important;font-size:15px!important;line-height:1.55!important;-webkit-font-smoothing:antialiased;letter-spacing:-.003em}
*,*::before,*::after,dialog::backdrop{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
button,input,select,textarea,a,code{font-family:var(--tgh-font)!important}
::selection{background:rgba(108,184,255,.3)}
:focus-visible{outline:2px solid var(--tgh-acc)!important;outline-offset:2px}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:99px;border:2px solid var(--tgh-bg)}::-webkit-scrollbar-track{background:transparent}
h1{font-weight:650!important;letter-spacing:-.03em!important;color:var(--tgh-ink)!important}
h2,h3{font-weight:560!important;letter-spacing:-.015em!important;color:var(--tgh-ink)!important}
.eyebrow,.onboarding-kicker{color:var(--tgh-acc)!important;font-size:12px!important;font-weight:540!important;letter-spacing:.16em!important;text-transform:uppercase}
.ambient,.shell::before{display:none!important}

/* shared controls */
.button,.back,.share,.pin-share,.install-app,.change-class,.feedback-launch,.manage button,.actions button,.actions a,.tour-card button,.text-button,.feedback-actions button,.offline-card button{
  display:inline-flex;align-items:center;justify-content:center;min-height:42px!important;padding:8px 18px!important;border:1px solid var(--tgh-line2)!important;border-radius:999px!important;
  background:rgba(255,255,255,.035)!important;color:var(--tgh-soft)!important;font-size:14px!important;font-weight:500!important;text-decoration:none!important;box-shadow:none!important;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease}
.button:hover,.back:hover,.share:hover,.pin-share:hover,.install-app:hover,.change-class:hover,.feedback-launch:hover,.manage button:hover,.actions button:hover,.actions a:hover,.tour-card button:hover,.feedback-actions button:hover{
  background:rgba(108,184,255,.08)!important;border-color:rgba(108,184,255,.45)!important;color:#fff!important}
.button.primary,.actions .primary,.tour-card .primary,.submit,body[data-page="migration"] button{background:#fff!important;color:#121a2e!important;border-color:#fff!important;font-weight:540!important}
.button.primary:hover,.actions .primary:hover,.tour-card .primary:hover,.submit:hover{background:#e9eef7!important;color:#121a2e!important}
.text-button{min-height:auto!important;padding:4px 0!important;border:0!important;background:transparent!important;color:var(--tgh-mute)!important;justify-content:flex-start}
.text-button:hover{color:var(--tgh-acc)!important;background:transparent!important}
input,select,textarea{background:rgba(255,255,255,.03)!important;border:1px solid var(--tgh-line2)!important;color:var(--tgh-ink)!important;font-size:15px!important;box-shadow:none!important}
input:focus,select:focus,textarea:focus{border-color:var(--tgh-acc-line)!important;background:rgba(108,184,255,.05)!important;outline:0!important}
input::placeholder,textarea::placeholder{color:#74819f!important}
select option{background:var(--tgh-card2);color:var(--tgh-ink)}
.segmented,.auth-tabs{display:flex;gap:4px;padding:4px!important;border:1px solid var(--tgh-line)!important;border-radius:999px!important;background:rgba(255,255,255,.035)!important}
.segmented button,.auth-tabs button{min-height:40px!important;border:1px solid transparent!important;border-radius:999px!important;background:transparent!important;color:var(--tgh-mute)!important;font-size:14px!important;font-weight:500!important}
.segmented button[aria-selected="true"],.auth-tabs button[aria-selected="true"]{background:var(--tgh-acc-soft)!important;border-color:var(--tgh-acc-line)!important;color:#fff!important}
.error{color:#ffb3c1!important;font-size:13px!important}
.message,.feedback-status{color:var(--tgh-acc)!important;font-size:13px!important}

/* panel bar (teacher panel, schedule, demo) */
.bar,.demo-bar{background:#141d34!important;border-bottom:1px solid var(--tgh-line)!important;box-shadow:none!important}
.brand{display:inline-flex;align-items:center;gap:10px;color:var(--tgh-ink)!important;font-weight:560!important;letter-spacing:-.01em!important;font-size:15px}
.brand-symbol{display:block;width:30px;height:30px;flex:0 0 auto;padding:5px;border:1px solid var(--tgh-line2);border-radius:10px;background:var(--tgh-logo)}
.brand-wordmark{display:block;width:132px;height:auto}
.brand-suffix{color:var(--tgh-mute);font-weight:500}
.bar .brand::before{content:"";display:block;width:30px;height:30px;flex:0 0 auto;border:1px solid var(--tgh-line2);border-radius:10px;background:var(--tgh-logo) url("/theme/logo-mark.svg") center/20px no-repeat}
.demo-bar .brand::before{content:"";display:block;width:124px;height:32px;flex:0 0 auto;border:0;border-radius:0;background:transparent url("/theme/teachtally-logo-on-dark.svg") center/contain no-repeat}
nav a,nav button,.demo-nav button{border-radius:999px!important;color:var(--tgh-mute)!important;font-size:14px!important;font-weight:500!important;padding:7px 13px!important;border:1px solid transparent!important;background:transparent!important}
nav a:hover,nav button:hover,.demo-nav button:hover{color:#fff!important;background:rgba(255,255,255,.04)!important}
nav a[aria-current="page"],.demo-nav button[aria-current="page"]{color:#fff!important;background:var(--tgh-acc-soft)!important;border-color:var(--tgh-acc-line)!important}
.network{color:var(--tgh-mute)!important;font-size:12px!important}
.network[data-offline="true"]{color:var(--tgh-red)!important}
iframe{background:var(--tgh-bg)!important}

/* cards */
.card,.top,.hero,.access-head,.pin-card,.stat,.message,.pin-message,.access-card,.performance,.homework,.demo-entry,.feedback-card,.event-card,
body[data-page="admin"] .panel,body[data-page="legal"] main{
  background:var(--tgh-card)!important;border:1px solid var(--tgh-line)!important;box-shadow:none!important;border-radius:24px!important}
.demo-entry,.feedback-card,.event-card,.stat{background:var(--tgh-row)!important;border-radius:18px!important}
.pin-card code,.card code{padding:16px!important;border:1px solid var(--tgh-acc-line)!important;border-radius:14px!important;background:var(--tgh-acc-soft)!important;color:#fff!important;font-size:24px!important;font-weight:600!important;letter-spacing:.16em!important}
.pin-card p,.card p{color:var(--tgh-mute)!important;font-size:13px!important}
.pin-card h2,.card h2{font-size:20px!important}
.stat strong{font-size:30px!important;font-weight:620!important;letter-spacing:-.03em}
.stat span,.panel-copy{color:var(--tgh-mute)!important;font-size:12px!important}
.status{background:var(--tgh-acc-soft)!important;color:var(--tgh-acc)!important;font-size:12px!important}
.status.suspended,.severity.error{background:rgba(255,125,114,.12)!important;color:#ffb3c1!important}
.health{color:var(--tgh-acc)!important}.health.alert{color:var(--tgh-red)!important}
.table th{color:var(--tgh-mute)!important;font-size:12px!important;font-weight:540!important}
.table td{font-weight:400!important}

/* dialogs */
.feedback-dialog,dialog{background:var(--tgh-pop)!important;border:1px solid rgba(108,184,255,.35)!important;border-radius:26px!important;box-shadow:0 30px 80px rgba(0,0,0,.5)!important;color:var(--tgh-ink)!important}
.feedback-dialog::backdrop,dialog::backdrop{background:rgba(8,12,26,.62)!important}
.feedback-card select,.feedback-card textarea{border-radius:14px!important}
.designer-credit{color:#74819f!important;font-size:12px!important;letter-spacing:0!important}

/* ===== sign-in gate (teacher panel + schedule) */
body[data-page="panel"] .gate,body[data-page="schedule"] .gate{background:var(--tgh-bg)}
body[data-page="panel"] .card,body[data-page="schedule"] .card{width:min(100%,540px)!important;padding:40px!important;border-radius:28px!important;background:var(--tgh-pop)!important;border-color:rgba(108,184,255,.25)!important}
.gate-wordmark{display:block;width:min(220px,65%);height:auto;margin:0 0 26px}
body[data-page="panel"] .gate .card,body[data-page="schedule"] .gate .card{text-align:center}
body[data-page="panel"] .gate .card::before,body[data-page="schedule"] .gate .card::before{content:"";display:block;width:min(220px,65%);height:48px;margin:0 auto 28px;background:url("/theme/teachtally-logo-on-dark.svg") center/contain no-repeat}
body[data-page="panel"] .gate .eyebrow,body[data-page="schedule"] .gate .eyebrow{display:none}
body[data-page="panel"] .card h1,body[data-page="schedule"] .card h1{font-size:clamp(34px,6vw,46px)!important;line-height:1.04!important}
body[data-page="panel"] .card p{color:var(--tgh-soft)!important}
body[data-page="panel"] .card h1,body[data-page="panel"] .card>p,body[data-page="schedule"] .card h1,body[data-page="schedule"] .card>p{text-align:center}
body[data-page="panel"] input{border-radius:999px!important;min-height:48px;padding:12px 18px!important}
body[data-page="panel"] .early-access{display:inline-flex;align-items:center;justify-content:center;margin:-6px auto 20px!important;padding:6px 12px;border:1px solid rgba(79,227,176,.25);border-radius:999px;background:rgba(79,227,176,.08);color:#4fe3b0!important;font-size:12px!important}
body[data-page="panel"] .auth-tabs{margin-inline:auto!important}
body[data-page="panel"] .auth-tabs button:first-child[aria-selected="true"]{background:rgba(108,184,255,.2)!important;border-color:#6cb8ff!important;color:#fff!important}
body[data-page="panel"] .auth-tabs button:last-child[aria-selected="true"]{background:rgba(79,227,176,.18)!important;border-color:#4fe3b0!important;color:#fff!important}
body[data-page="panel"] #authSubmit{background:#6cb8ff!important;border-color:#6cb8ff!important;color:#0b1630!important}
body[data-page="panel"] .card:has([data-auth-mode="signup"][aria-selected="true"]) #authSubmit{background:#4fe3b0!important;border-color:#4fe3b0!important;color:#07140d!important}
body[data-page="panel"] .auth-row{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin-top:12px!important}
body[data-page="panel"] #googleSignIn{grid-row:1;position:relative;width:100%;min-height:48px!important;padding-left:48px!important;background:#fff!important;border-color:#fff!important;color:#202124!important;font-weight:540!important}
body[data-page="panel"] #googleSignIn::before{content:"";position:absolute;left:18px;width:21px;height:21px;background:url("/theme/google-g.svg") center/contain no-repeat}
body[data-page="panel"] #googleSignIn:hover{background:#eef2f7!important;border-color:#eef2f7!important;color:#202124!important}
body[data-page="panel"] #forgotPassword{grid-row:2;justify-self:center!important;width:auto!important;color:var(--tgh-acc)!important;text-align:center!important}
body[data-page="panel"] .divider{color:var(--tgh-mute)!important;font-size:12px!important}
body[data-page="panel"] .divider::before,body[data-page="panel"] .divider::after{background:var(--tgh-line)!important}
body[data-page="panel"] .demo-entry{align-items:center!important;flex-direction:column!important;justify-content:center!important;text-align:center!important;border-color:rgba(184,162,255,.28)!important;background:rgba(184,162,255,.06)!important}
body[data-page="panel"] .demo-entry span{color:var(--tgh-mute)!important;font-size:13px!important}
body[data-page="panel"] .demo-entry strong{font-weight:540!important}
body[data-page="panel"] .demo-entry .button{min-width:132px!important;background:rgba(184,162,255,.18)!important;border-color:#b8a2ff!important;color:#f3efff!important}
body[data-page="panel"] .demo-entry .button:hover{background:rgba(184,162,255,.28)!important}
body[data-page="panel"] .legal-links a{color:var(--tgh-mute)!important;font-size:12px!important}
body[data-page="panel"] .legacy{border-top-color:var(--tgh-line)!important}
body[data-page="panel"] .legacy .text-button{justify-content:center!important;width:100%!important;text-align:center!important}
body[data-page="panel"] .access-head h1{font-size:40px!important}

/* ===== demo shell */
body[data-page="demo"] .veil{background:rgba(8,12,26,.5)!important}
body[data-page="demo"] .spotlight{border:1.5px solid rgba(108,184,255,.75)!important;box-shadow:0 0 0 4000px rgba(8,12,26,.12)!important;border-radius:16px!important}
body[data-page="demo"] .tour-card{background:var(--tgh-pop)!important;border:1px solid rgba(108,184,255,.35)!important;border-radius:26px!important;box-shadow:0 30px 80px rgba(0,0,0,.5)!important;padding:26px!important}
body[data-page="demo"] .tour-card h1{font-size:26px!important;font-weight:620!important}
body[data-page="demo"] .tour-card p{color:var(--tgh-soft)!important;font-size:15px!important}
body[data-page="demo"] .tour-card .eyebrow{color:var(--tgh-mute)!important}
body[data-page="demo"] .progress i{background:rgba(255,255,255,.12)!important}
body[data-page="demo"] .progress i.active{background:var(--tgh-acc)!important}
body[data-page="demo"] .brand{gap:12px}
body[data-page="demo"] .brand-wordmark{width:124px}
body[data-page="demo"] .demo-bar .brand{font-size:0}
body[data-page="demo"] .demo-bar .brand::after{content:"Interactive demo";color:var(--tgh-mute);font-size:13px;font-weight:500}

/* ===== student portal */
body[data-page="portal"]{font-size:15px!important}
body[data-page="portal"] .shell{padding:clamp(10px,2.4vw,28px)!important}
body[data-page="portal"] .window{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;overflow:visible!important}
body[data-page="portal"] header{border-bottom:1px solid var(--tgh-line)!important;min-height:76px!important}
body[data-page="portal"] .mark{width:44px!important;height:44px!important;border:0!important;border-radius:14px!important;background:var(--tgh-logo)!important;color:#f2ebe7!important;font-size:0!important;position:relative}
body[data-page="portal"] .mark::after{content:"";position:absolute;inset:9px;background:url("/theme/logo-mark.svg") center/contain no-repeat}
body[data-page="portal"] .brand{font-size:16px!important}
body[data-page="portal"] .brand small{color:var(--tgh-mute)!important;font-size:11px!important;font-weight:540!important;letter-spacing:.16em!important}
body[data-page="portal"] .read-only,body[data-page="portal"] .pwa-actions{color:var(--tgh-mute)!important;font-size:13px!important}
body[data-page="portal"] .read-only::before,body[data-page="portal"] .status-dot{background:var(--tgh-acc)!important;box-shadow:none!important}
body[data-page="portal"] .access{min-height:calc(100vh - 170px)!important}
body[data-page="portal"] .intro h1{font-size:clamp(44px,6.4vw,84px)!important;line-height:.98!important;letter-spacing:-.04em!important}
body[data-page="portal"] .intro h1 br+*{color:var(--tgh-acc)}
body[data-page="portal"] .intro p{color:var(--tgh-soft)!important;font-size:18px!important;max-width:520px!important}
body[data-page="portal"] .intro .eyebrow{font-size:13px!important}
body[data-page="portal"] .access-note{color:var(--tgh-mute)!important;font-size:14px!important;border-top-color:var(--tgh-line)!important}
body[data-page="portal"] .access-card{padding:28px!important;border-radius:28px!important;background:var(--tgh-pop)!important;border-color:rgba(108,184,255,.25)!important}
body[data-page="portal"] .card-title{font-size:17px!important;font-weight:560;border-bottom-color:var(--tgh-line)!important}
body[data-page="portal"] label{color:var(--tgh-mute)!important;font-size:12px!important;font-weight:540!important;letter-spacing:.12em!important}
body[data-page="portal"] #classPin{border-radius:16px!important;min-height:58px;font-size:22px!important;font-weight:600!important;letter-spacing:.2em!important;text-align:center}
body[data-page="portal"] #classPin::placeholder{font-size:15px!important;font-weight:400!important;letter-spacing:0!important}
body[data-page="portal"] .submit{border-radius:999px!important;min-height:52px;padding:12px 22px!important;font-size:15px!important}
body[data-page="portal"] .controls{background:transparent!important;border-bottom-color:var(--tgh-line)!important}
body[data-page="portal"] .heading h1{font-size:clamp(26px,3vw,38px)!important}
body[data-page="portal"] .heading p{color:var(--tgh-mute)!important;font-size:14px!important}
body[data-page="portal"] .summary{color:var(--tgh-mute)!important;font-size:14px!important;border-bottom-color:var(--tgh-line)!important}
body[data-page="portal"] .class-name{font-size:18px!important;font-weight:600}
body[data-page="portal"] .summary-stats strong{font-weight:600!important}
body[data-page="portal"] .legend{font-size:12px!important}
body[data-page="portal"]{--green:#4fe3b0;--blue:#6cb8ff;--gold:#ffc75a;--rose:#ff7d72}
body[data-page="portal"] .table-wrap{border-bottom:1px solid var(--tgh-line)}
body[data-page="portal"] table{background:transparent!important}
body[data-page="portal"] th,body[data-page="portal"] td{border-color:var(--tgh-line)!important;font-size:14px}
body[data-page="portal"] thead th{background:#172038!important;color:#dfe3ee!important;font-size:12px!important;font-weight:540!important}
body[data-page="portal"] thead tr:nth-child(2) th,body[data-page="portal"] thead tr:nth-child(3) th{background:var(--tgh-row)!important;color:var(--tgh-mute)!important;font-size:12px!important}
body[data-page="portal"] thead .number-head,body[data-page="portal"] thead .name-head,body[data-page="portal"] thead .average-head{background:#16203a!important}
body[data-page="portal"] tbody td{background:var(--tgh-card)!important}
body[data-page="portal"] tbody tr:nth-child(even) td{background:var(--tgh-row2)!important}
body[data-page="portal"] tbody tr:hover td{background:#24315a!important}
body[data-page="portal"] tbody .number-cell,body[data-page="portal"] tbody .name-cell{background:var(--tgh-card)!important;box-shadow:none!important}
body[data-page="portal"] tbody tr:nth-child(even) .number-cell,body[data-page="portal"] tbody tr:nth-child(even) .name-cell{background:var(--tgh-row2)!important}
body[data-page="portal"] tbody .name-cell,body[data-page="portal"] .name-cell{font:500 15px/1.35 var(--tgh-font)!important}
body[data-page="portal"] .score{color:var(--tgh-soft)!important}
body[data-page="portal"] .average-cell{background:color-mix(in srgb,var(--tone) 14%,#1a2440)!important;font-weight:600!important;font-size:15px!important;box-shadow:none!important}
body[data-page="portal"] .note-cell{color:var(--tgh-soft)!important;font-size:13px!important}
body[data-page="portal"] .week-badge{text-shadow:none!important}
body[data-page="portal"] .student-rank-medal,body[data-page="portal"] .student-rank-medal .rank-star{filter:none!important}
body[data-page="portal"] .performance,body[data-page="portal"] .homework{margin:22px 0!important;padding:28px!important;border-radius:28px!important}
body[data-page="portal"] .chart-head h2,body[data-page="portal"] .homework h2{font-size:24px!important}
body[data-page="portal"] .chart-head p,body[data-page="portal"] .weekly-podium-copy{color:var(--tgh-mute)!important;font-size:14px!important}
body[data-page="portal"] .chart-badge{color:var(--tgh-soft)!important;font-size:12px!important;border-color:var(--tgh-line)!important}
body[data-page="portal"] .chart-stage,body[data-page="portal"] .weekly-podium{background:var(--tgh-row)!important;border-color:var(--tgh-line)!important;border-radius:20px!important}
body[data-page="portal"] .weekly-podium h3{font-size:19px!important}
body[data-page="portal"] .axis-label{font:12px var(--tgh-font)!important;fill:var(--tgh-mute)!important}
body[data-page="portal"] .x-label{font:13px var(--tgh-font)!important;fill:var(--tgh-soft)!important}
body[data-page="portal"] .chart-grid{stroke:rgba(255,255,255,.07)!important}
body[data-page="portal"] .chart-dot{stroke:#1a2440!important;stroke-width:2!important}
body[data-page="portal"] .chart-tooltip,body[data-page="portal"] .podium-radar{background:var(--tgh-pop)!important;border:1px solid rgba(108,184,255,.4)!important;border-radius:16px!important;box-shadow:0 20px 50px rgba(0,0,0,.45)!important}
body[data-page="portal"] .chart-tooltip-title,body[data-page="portal"] .radar-title span{color:var(--tgh-mute)!important;font-size:12px!important}
body[data-page="portal"] .chart-tooltip-person,body[data-page="portal"] .legend-person,body[data-page="portal"] .podium-name,body[data-page="portal"] .radar-title strong{font-family:var(--tgh-font)!important;font-weight:500!important}
body[data-page="portal"] .chart-tooltip-person{font-size:14px!important}
body[data-page="portal"] .legend-person{font-size:13px!important;color:var(--tgh-soft)!important}
body[data-page="portal"] .podium-name{font-size:14px!important;font-weight:540!important}
body[data-page="portal"] .podium-points{font-size:12px!important;color:var(--tgh-mute)!important}
body[data-page="portal"] .podium-person{background:rgba(108,184,255,.06)!important;border-color:var(--tgh-line2)!important;border-radius:16px 16px 8px 8px!important}
body[data-page="portal"] .podium-person.rank-1{background:rgba(108,184,255,.16)!important;border-color:var(--tgh-acc-line)!important}
body[data-page="portal"] .radar-shape{fill:rgba(108,184,255,.2)!important;stroke:var(--tgh-acc)!important}
body[data-page="portal"] .radar-label{font:12px var(--tgh-font)!important}
body[data-page="portal"] .radar-value{font:540 13px var(--tgh-font)!important}
body[data-page="portal"] .homework p{color:var(--tgh-soft)!important;font-size:16px!important}
body[data-page="portal"] footer{color:#74819f!important;font-size:12px!important;letter-spacing:0!important;padding:26px 20px!important}
body[data-page="portal"] footer a:hover{color:var(--tgh-acc)!important}

/* ===== small pages */
body[data-page="access"] h1,body[data-page="admin"] .hero h1{font-size:40px!important}
body[data-page="access"] .top p:last-child,body[data-page="admin"] .hero p:last-child{color:var(--tgh-soft)!important}
body[data-page="legal"] main{padding:44px!important;border-radius:28px!important}
body[data-page="legal"] h1{font-size:40px!important}
body[data-page="legal"] h2{font-size:20px!important;margin-top:30px!important}
body[data-page="legal"] p,body[data-page="legal"] li{color:var(--tgh-soft)!important;font-size:16px!important}
body[data-page="legal"] a{color:var(--tgh-acc)!important}
body[data-page="offline"] .card,body[data-page="migration"] .card{padding:40px!important;border-radius:28px!important;background:var(--tgh-pop)!important}
body[data-page="offline"] h1,body[data-page="migration"] h1{font-size:40px!important}
body[data-page="offline"] p,body[data-page="migration"] p{color:var(--tgh-soft)!important}
body[data-page="offline"] button{border-radius:999px!important;background:#fff!important;color:#121a2e!important;border-color:#fff!important;font-weight:540!important;min-height:44px;padding:10px 20px!important}
body[data-page="migration"] button{border-radius:999px!important;min-height:48px}
.actions button,.actions a{gap:.3em}
/* compact bars on small screens */
.demo-shell,.panel{min-width:0;max-width:100vw}
.demo-bar,.bar{min-width:0;max-width:100vw}
@media(max-width:900px){
  .demo-nav button,nav a,nav button{font-size:13px!important;padding:6px 9px!important}
  .actions button,.actions a{min-height:36px!important;padding:6px 12px!important;font-size:13px!important}
}
@media(max-width:620px){
  .demo-bar{gap:4px!important;padding:0 6px!important}
  .demo-nav{min-width:0;overflow-x:auto;scrollbar-width:none;flex:1 1 auto;justify-content:flex-start!important;margin:0!important}
  .demo-nav::-webkit-scrollbar{display:none}
  .demo-nav button{font-size:12px!important;padding:5px 8px!important;white-space:nowrap;flex:0 0 auto}
  .actions{flex:0 0 auto;gap:4px!important}
  .actions button,.actions a{min-height:32px!important;padding:5px 9px!important;font-size:12px!important;white-space:nowrap}
  nav{min-width:0;overflow-x:auto;scrollbar-width:none}
  nav::-webkit-scrollbar{display:none}
  nav a,nav button{font-size:12px!important;padding:5px 8px!important;white-space:nowrap;flex:0 0 auto}
  body[data-page="panel"] .card,body[data-page="schedule"] .card{padding:28px 22px!important}
  body[data-page="portal"] .controls .segmented button{min-height:36px!important;font-size:13px!important}
}
body[data-page="portal"] .summary-main{flex-wrap:wrap;row-gap:4px}
body[data-page="portal"] .class-name{white-space:nowrap}

/* credit sits at the end of the page instead of floating over content */
.designer-credit{position:static!important;transform:none!important;display:block;margin:28px auto 22px!important;text-align:center;white-space:normal!important;pointer-events:auto!important}
body[data-page="demo"] .designer-credit,body:has(.panel.ready) .designer-credit{display:none!important}
body[data-page="panel"],body[data-page="schedule"]{height:auto!important;min-height:100%}
body:has(.panel.ready){height:100%!important}
/* connection status: left side, green online, red offline */
.bar-left{display:inline-flex;align-items:center;gap:14px;min-width:0}
.bar .network,body[data-page] .bar .network{display:inline-flex!important;align-items:center;gap:7px;padding:4px 11px;border-radius:999px;border:1px solid rgba(79,227,176,.35);background:rgba(79,227,176,.08);color:#4fe3b0!important;font-size:12px!important;font-weight:540;white-space:nowrap}
.bar .network::before{content:"";width:7px;height:7px;border-radius:50%;background:#4fe3b0}
body[data-page] .bar .network[data-offline="true"],.bar .network[data-offline="true"]{border-color:rgba(255,125,114,.45);background:rgba(255,125,114,.1);color:var(--tgh-red)!important}
.bar .network[data-offline="true"]::before{background:var(--tgh-red)}
/* feedback dialog */
.feedback-dialog{width:min(560px,calc(100% - 24px))!important;padding:0!important}
.feedback-dialog form,.feedback-dialog .feedback-card{display:block!important;padding:28px!important;background:transparent!important;border:0!important;border-radius:0!important}
.feedback-card h2{font-size:24px!important;margin:0 0 6px!important}
.feedback-card p{color:var(--tgh-soft)!important;font-size:14px!important;margin:0 0 16px!important}
.feedback-card label{display:grid!important;gap:7px!important;margin-top:14px!important;color:var(--tgh-mute)!important;font-size:12px!important;font-weight:540;letter-spacing:.08em;text-transform:uppercase}
.feedback-card select,.feedback-card textarea{width:100%!important;min-height:46px;padding:11px 14px!important;border-radius:14px!important;text-transform:none;letter-spacing:0;font-weight:400}
.feedback-card textarea{min-height:140px!important;resize:vertical}
.feedback-actions{display:flex!important;justify-content:flex-end!important;gap:10px!important;margin-top:18px!important}
.feedback-actions .button{min-height:44px!important;padding:8px 20px!important;flex:0 0 auto}
.feedback-launch{min-height:38px!important;font-size:13px!important}

/* ===== v17: lively palette accents ===== */
:root{--tgh-blue:#6cb8ff;--tgh-mint:#4fe3b0;--tgh-coral:#ff8a7a;--tgh-amber:#ffc75a;--tgh-violet:#b8a2ff}
body[data-page]{background:radial-gradient(1200px 600px at 10% -10%,rgba(108,184,255,.10),transparent 60%),radial-gradient(900px 500px at 100% 0%,rgba(79,227,176,.07),transparent 60%),var(--tgh-bg)!important;background-attachment:fixed!important}
h1,h2,h3{font-weight:600!important}
strong,b,th{font-weight:560!important}

/* ===== v17: compact sign-in (fits one screen) ===== */
body[data-page="panel"] .gate{min-height:100svh!important;display:grid!important;place-items:center!important;padding:18px 14px!important;box-sizing:border-box;background:transparent!important}
body[data-page="panel"] .gate .card{width:min(400px,100%)!important;max-width:400px!important;box-sizing:border-box;padding:24px 24px 16px!important;border-radius:22px!important;margin:0 auto!important}
body[data-page="panel"] .gate .card::before{height:32px!important;width:170px!important;margin:0 auto 14px!important}
body[data-page="panel"] .gate h1{font-size:22px!important;line-height:1.25!important;font-weight:600!important;letter-spacing:-.02em!important;margin:0 0 6px!important}
body[data-page="panel"] .gate h1 br{display:none}
body[data-page="panel"] #gateText{font-size:13.5px!important;line-height:1.45!important;margin:0 0 10px!important;color:var(--tgh-mute)!important}
body[data-page="panel"] .early-access{margin:0 auto 14px!important;padding:3px 10px!important;font-size:11.5px!important;font-weight:500!important}
body[data-page="panel"] .auth-tabs{margin:0 auto 10px!important;padding:3px!important}
body[data-page="panel"] .auth-tabs button{min-height:34px!important;height:34px!important;padding:0 10px!important;font-size:13.5px!important}
body[data-page="panel"] .auth-form{display:grid!important;gap:8px!important;margin:0!important}
body[data-page="panel"] .auth-form input{min-height:42px!important;height:42px!important;padding:0 14px!important;font-size:14.5px!important;border-radius:12px!important}
body[data-page="panel"] #authSubmit{min-height:42px!important;height:42px!important;border-radius:12px!important;font-size:14.5px!important;font-weight:560!important;margin:0!important}
body[data-page="panel"] .auth-row{gap:6px!important;margin-top:8px!important}
body[data-page="panel"] #googleSignIn{min-height:42px!important;height:42px!important;border-radius:12px!important;font-size:14px!important;font-weight:500!important}
body[data-page="panel"] #forgotPassword{font-size:13px!important;min-height:28px!important;padding:2px 8px!important}
body[data-page="panel"] .demo-entry{flex-direction:row!important;justify-content:space-between!important;text-align:left!important;gap:12px!important;padding:10px 12px 10px 14px!important;margin-top:10px!important;border-radius:14px!important}
body[data-page="panel"] .demo-entry>div{display:grid;gap:1px;min-width:0}
body[data-page="panel"] .demo-entry strong{font-size:13.5px!important}
body[data-page="panel"] .demo-entry span{font-size:12px!important;line-height:1.35!important}
body[data-page="panel"] .demo-entry .button{min-width:0!important;min-height:36px!important;padding:0 16px!important;flex:0 0 auto;font-size:13.5px!important}
body[data-page="panel"] .gate .message:empty,body[data-page="panel"] .gate .error:empty{display:none!important}
body[data-page="panel"] .gate .message,body[data-page="panel"] .gate .error{margin:8px 0 0!important;padding:8px 12px!important;font-size:13px!important}
body[data-page="panel"] .legacy{margin-top:10px!important;padding-top:8px!important}
body[data-page="panel"] .legacy .text-button{font-size:12.5px!important;min-height:28px!important;color:var(--tgh-mute)!important}
body[data-page="panel"] .student-entry{display:flex;justify-content:center;gap:6px;margin:8px 0 0;padding:8px 10px;border-radius:12px;background:rgba(255,199,90,.08);border:1px solid rgba(255,199,90,.22);color:var(--tgh-soft);font-size:13px;text-decoration:none}
body[data-page="panel"] .student-entry span{color:var(--tgh-amber);font-weight:500}
body[data-page="panel"] .student-entry:hover{background:rgba(255,199,90,.14)}
body[data-page="panel"] .legal-links{margin-top:8px!important;gap:14px!important}
@media (max-width:480px){
  body[data-page="panel"] .gate{padding:12px 10px!important;place-items:start center!important}
  body[data-page="panel"] .gate .card{padding:20px 16px 14px!important;border-radius:20px!important}
  body[data-page="panel"] .gate h1{font-size:20px!important}
  body[data-page="panel"] .early-access{display:none!important}
}

/* ===== v17: phone top bars — two rows, nothing cut off ===== */
h1{font-weight:560!important}
#scheduleTitle,#tourTitle{font-weight:560!important}
@media (max-width:620px){
  .demo-shell{grid-template-rows:auto 1fr!important}
  .panel.ready{grid-template-rows:auto 1fr!important}
  .demo-bar,.bar{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;row-gap:6px!important;column-gap:8px!important;height:auto!important;min-height:0!important;padding:8px 10px 6px!important}
  .demo-bar,.bar{overflow-x:clip!important}
  .demo-bar .brand,.bar .bar-left{flex:1 1 auto;min-width:0}
  body[data-page="demo"] .demo-bar .brand::before{width:104px!important;height:26px!important}
  body[data-page="demo"] .demo-bar .brand::after{display:none!important}
  .demo-bar .actions{flex:0 0 auto;margin-left:auto}
  .demo-bar .actions .reset-label,.demo-bar .actions .sign-label{display:none}
  #restartTour{font-size:0!important;width:34px;padding:0!important;justify-content:center}
  #restartTour::before{content:"?";font-size:15px;font-weight:600}
  .demo-nav,.bar nav{grid-column:1/-1!important;grid-row:2;justify-content:flex-start!important;margin:0!important;width:100%;max-width:100%!important;min-width:0!important;box-sizing:border-box;display:flex!important;gap:4px!important;overflow-x:auto!important;padding-bottom:2px}
  .bar .brand{font-size:14px!important}
  .bar .brand::before{width:26px!important;height:26px!important;background-size:17px!important}
  .bar .network{font-size:11.5px!important;padding:3px 9px!important}
}

/* ===== v17: student portal accents ===== */
body[data-page="portal"] .access .eyebrow{color:var(--tgh-amber)!important}
body[data-page="portal"] .access h1{font-weight:560!important;letter-spacing:-.035em!important}
body[data-page="portal"] #submit{background:var(--tgh-blue)!important;border-color:var(--tgh-blue)!important;color:#0b1630!important;font-weight:560!important}
body[data-page="portal"] #submit:hover{background:#8ac8ff!important}
body[data-page="portal"] .segmented button[aria-selected="true"]{background:var(--tgh-blue)!important;border-color:var(--tgh-blue)!important;color:#0b1630!important}
body[data-page="portal"] .status-dot{background:var(--tgh-mint)!important}
body[data-page="portal"] .access-card{border-color:rgba(108,184,255,.28)!important}
body[data-page="portal"] .access-note{border-left:0!important;color:var(--tgh-mute)!important}
body[data-page="portal"] .change-class{color:var(--tgh-amber)!important;border-color:rgba(255,199,90,.32)!important;background:rgba(255,199,90,.07)!important}
body[data-page="portal"] .read-only{color:var(--tgh-amber)!important}
body[data-page="portal"] .read-only::before{background:var(--tgh-amber)!important}
/* panel bar: coloured active tab */
.bar nav a[aria-current="page"],.demo-nav button[aria-current="page"]{background:var(--tgh-blue)!important;border-color:var(--tgh-blue)!important;color:#0b1630!important}
body[data-page="demo"] .actions .primary{background:var(--tgh-mint)!important;border-color:var(--tgh-mint)!important;color:#07140d!important}
/* v17: student portal on phones */
.podium-name{white-space:normal!important;text-overflow:clip!important;overflow-wrap:anywhere;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.25!important;direction:auto!important;unicode-bidi:plaintext}
@media (max-width:620px){
  body[data-page="portal"] .chart-badge{white-space:nowrap;align-self:flex-start;max-width:100%;overflow:hidden;text-overflow:ellipsis}
  body[data-page="portal"] .performance>*:first-child,body[data-page="portal"] .performance header{flex-wrap:wrap!important;gap:8px!important}
  body[data-page="portal"] .controls .segmented button{white-space:nowrap;font-size:12.5px!important;padding:0 10px!important}
  body[data-page="portal"] .podium-name{font-size:12.5px!important}
}
/* v17.1: a hidden sign-in card must stay hidden once the teacher is signed in */
body[data-page] .gate[hidden],body[data-page="panel"] .gate[hidden],body[data-page="schedule"] .gate[hidden]{display:none!important}
[hidden]{display:none!important}
/* v19: student names in Times New Roman (student portal) */
body[data-page="portal"] .name-cell,body[data-page="portal"] .podium-name,body[data-page="portal"] .student-name-line{font-family:"Times New Roman",Times,"Noto Sans Arabic",serif!important;font-weight:600!important}
body[data-page="portal"] .name-cell{font-size:15px!important}