/* Sign-in (landing page and "Hello Admin"), the person menu, feedback, the class feedback screen and Rabinder's dashboard. */

/* ---------- until someone signs in, only the landing page shows ---------- */
body.gated #view-home > :not(#hero),body.gated #view-engine,body.gated #view-slides,body.gated #view-admin,body.gated #view-play,
body.gated .dock,body.gated .sym-fab,body.gated .symc,body.gated .nav,body.gated .top-r .seg,body.gated .top-r .seg-q,body.gated .act-chip,body.gated .conn,body.gated #menu-btn,body.gated #mnav,
body.gated .hero-cta,body.gated .who-wrap,body.gated .present,body.gated .spresent{display:none!important}
html:not([data-who="admin"]) .conn{display:none!important}
body.gated .hero{padding-bottom:calc(30px + env(safe-area-inset-bottom,0px))}
@media (min-width:641px){body.gated .hero-hint{bottom:calc(44px + env(safe-area-inset-bottom,0px))}}
@media (max-width:640px){
  /* the landing page on a phone: first the open background with the title, credit and lede at the bottom;
     scroll once for "Who's teaching today?", with the privacy note at the very end */
  body.gated .hero{justify-content:flex-start;padding:0 20px calc(30px + env(safe-area-inset-bottom,0px))}
  body.gated .hero .earth,body.gated .hero-shade{bottom:auto;height:100vh;height:100svh}
  body.gated .hero-shade{background:linear-gradient(to top,#080A12 0%,rgb(8 10 18 / .86) 15%,rgb(8 10 18 / .5) 36%,rgb(8 10 18 / .12) 58%,rgb(8 10 18 / 0) 72%)}
  body.gated .hero-top{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))}
  body.gated .hg-down{display:inline-flex;align-items:center;gap:6px;align-self:center;margin-top:30px;padding:8px 16px;border:0;border-radius:999px;background:rgb(255 255 255 / .07);box-shadow:inset 0 0 0 1px rgb(255 255 255 / .16);color:#D5DBE7;font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(13px * var(--m,1)));cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
  body.gated .hg-down .i{width:16px;height:16px;animation:hgbob 1.8s ease-in-out infinite}
  body.gated .hero-gate{margin-top:0;min-height:100vh;min-height:100svh;align-content:start;padding-top:calc(96px + env(safe-area-inset-top,0px))}
  body.gated .hero-hint{top:calc(33vh + min(49vw, 29vh) + 18px);top:calc(33svh + min(49vw, 29svh) + 18px);left:50%;right:auto;bottom:auto;transform:translateX(-50%);white-space:nowrap}
  body.gated .toast{bottom:auto;top:calc(86px + env(safe-area-inset-top,0px));transform:translate(-50%,-10px)}
  body.gated .toast.is-on{transform:translate(-50%,0)}
}

.hero-gate{margin-top:24px;max-width:640px;pointer-events:auto;display:grid;gap:12px}
.hero-gate[hidden]{display:none}
.hg-k{display:flex;align-items:center;gap:8px;margin:0;font-family:var(--f-display);font-weight:800;font-size:max(9px,calc(13px * var(--m,1)));letter-spacing:.14em;text-transform:uppercase;color:#C9D2E3}
.hg-k .i{width:16px;height:16px;color:#FF5C8A;fill:currentColor;stroke:none}
.hg-people{display:flex;flex-wrap:wrap;gap:8px}
.hg-people:empty{display:none}
.hg-person{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:5px 14px 5px 5px;background:rgb(255 255 255 / .08);color:#EEF1F8;box-shadow:inset 0 0 0 1px rgb(255 255 255 / .18);
  font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(13.5px * var(--m,1)));cursor:pointer;transition:background .2s,box-shadow .2s}
.hg-person span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgb(255 255 255 / .14);font-size:max(9px,calc(11px * var(--m,1)))}
.hg-person:hover{background:rgb(255 255 255 / .14)}
.hg-person[aria-pressed="true"]{background:rgb(255 255 255 / .2);box-shadow:inset 0 0 0 1.5px rgb(255 255 255 / .6)}
.hg-row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.hg-f{display:grid;gap:6px;flex:1 1 210px;min-width:0}
.hg-f span{font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(12.5px * var(--m,1)));color:#AEB7CA}
.hero .hg-f input{background:rgb(255 255 255 / .07);color:#F5F7FC;box-shadow:inset 0 0 0 1px rgb(255 255 255 / .22);border-radius:16px;padding:15px 16px;font-size:max(9px,calc(16px * var(--m,1)));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.hero .hg-f input::placeholder{color:rgb(238 241 248 / .45)}
.hero .hg-f input:focus{outline:2px solid #9D97FF;outline-offset:2px;box-shadow:inset 0 0 0 1px rgb(255 255 255 / .4)}
.hg-pin{flex:0 1 150px}
.hero .hg-pin input{font-family:var(--f-mono);letter-spacing:.32em}
.hg-go{flex:none}
.hg-err{margin:0;color:#FCA5A5;font-weight:600;font-size:max(9px,calc(14px * var(--m,1)))}
.hg-none{display:flex;gap:9px;align-items:flex-start;margin:0;padding:12px 14px;border-radius:16px;background:rgb(255 255 255 / .06);box-shadow:inset 0 0 0 1px rgb(255 255 255 / .14);color:#D5DBE7;font-size:max(9px,calc(14px * var(--m,1)));line-height:1.5;max-width:60ch}
.hg-none[hidden]{display:none}
.hg-none .i{flex:none;width:17px;height:17px;margin-top:2px;color:#9D97FF}
.hg-none b{color:#fff}
.hg-priv{margin:4px 0 0;padding:12px 14px;border-radius:16px;background:rgb(255 255 255 / .04);box-shadow:inset 0 0 0 1px rgb(255 255 255 / .1);max-width:62ch}
.hg-priv p{margin:0;font-size:max(9px,calc(12.5px * var(--m,1)));line-height:1.55;color:rgb(238 241 248 / .64)}
.hg-priv .hg-priv-h{display:flex;align-items:center;gap:7px;margin-bottom:4px;font-family:var(--f-display);font-weight:800;letter-spacing:.12em;text-transform:uppercase;font-size:max(9px,calc(11.5px * var(--m,1)));color:#C9D2E3}
.hg-priv .i{width:14px;height:14px}
.hg-down{display:none}
@media (min-width:641px){                       /* on a laptop the note stays small, so the landing page fits one screen */
  .hg-priv{padding:0;background:none;box-shadow:none}
  .hg-priv .hg-priv-h{display:none}
  .hg-priv p::before{content:"Privacy. ";font-weight:800;color:#C9D2E3}
}
.hg-links{margin:0}
.hg-admin{display:inline-flex;align-items:center;gap:7px;border:0;background:none;padding:6px 0;color:#C3CBDB;font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(13.5px * var(--m,1)));cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.hg-admin .i{width:15px;height:15px}
.hg-admin:hover{color:#fff}
.agate-card .kicker{color:var(--accent)}
.agate-card .kicker .i{width:14px;height:14px}
.agate-card section{display:grid;gap:16px}
.agate-card h2{margin:0;font-size:max(9px,calc(28px * var(--m,1)));font-weight:800;letter-spacing:-.02em}
.agate-card input[readonly]{color:var(--muted);cursor:default}

/* ---------- the person menu ---------- */
.who-wrap{position:relative}
.who{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px 0 5px;border:0;border-radius:999px;background:var(--surface);box-shadow:var(--ex-sm);cursor:pointer;
  font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(13.5px * var(--m,1)));color:var(--fg);transition:box-shadow .3s}
.who:hover{box-shadow:var(--ex)}
.who-i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:max(9px,calc(12px * var(--m,1)));letter-spacing:.02em;color:#fff;background:linear-gradient(135deg,#8B84FF,#6C63FF)}
[data-who="admin"] .who-i{background:linear-gradient(135deg,#FF8FB1,#E2558A)}
.top.on-hero .who{background:rgb(255 255 255 / .08);color:#EEF1F8;box-shadow:inset 0 0 0 1px rgb(255 255 255 / .2)}
.who-pop{position:absolute;right:0;top:calc(100% + 10px);z-index:60;min-width:260px;display:grid;gap:4px;padding:8px;border-radius:20px;background:var(--surface);box-shadow:var(--ex)}
.who-pop button{display:flex;align-items:center;gap:10px;border:0;background:transparent;text-align:left;padding:11px 12px;border-radius:12px;font-family:var(--f-body);font-weight:600;font-size:max(9px,calc(14px * var(--m,1)));color:var(--fg);cursor:pointer}
.who-pop button:hover{box-shadow:var(--in-sm);color:var(--accent)}
.who-pop .i{width:17px;height:17px;color:var(--accent)}
.mnav-who{display:grid;gap:2px;margin-top:6px;padding-top:8px;box-shadow:0 -1px 0 rgb(163 177 198 / .3)}

/* ---------- teacher feedback ---------- */
.fbm-card{width:min(640px,100%)}
.fbm-card section{display:grid;gap:16px}
.stars{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.stars button{width:46px;height:46px;border:0;border-radius:14px;background:var(--surface);box-shadow:var(--ex-sm);display:grid;place-items:center;cursor:pointer;color:var(--placeholder);transition:color .2s,box-shadow .2s,transform .2s}
.stars button .i{width:24px;height:24px}
.stars button:hover{transform:translateY(-1px)}
.stars button.on{color:#F5B301;box-shadow:var(--in-sm)}
.stars button.on .i{fill:currentColor}
.star-say{margin-left:8px;font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(13.5px * var(--m,1)));color:var(--muted)}
.fbm-card .pills{gap:8px}
.fbm-card .pill{min-height:38px;font-size:max(9px,calc(13px * var(--m,1)));padding:0 13px}

/* ---------- class feedback (on the shared screen, always bright) ---------- */
.ticket{position:absolute;inset:0;z-index:76;display:grid;place-items:center;padding:16px;background:rgb(224 229 236 / .84);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:tkin .3s var(--ease)}
[data-theme="night"] .ticket{background:rgb(10 12 18 / .8)}
.tk-card{width:min(1100px,100%);max-height:100%;overflow:auto;border-radius:32px;padding:24px 30px 26px;background:#E8ECF2;color:#2B3440;
  box-shadow:14px 14px 30px rgb(150 165 190 / .55),-12px -12px 26px rgb(255 255 255 / .75)}
.tk-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.tk-k{display:inline-flex;align-items:center;gap:8px;margin:0;font-family:var(--f-display);font-weight:800;font-size:max(9px,calc(13px * var(--m,1)));letter-spacing:.14em;text-transform:uppercase;color:#C85F14}
.tk-k .i{width:17px;height:17px}
.tk-card .pbtn{background:#E8ECF2;color:#2B3440;box-shadow:5px 5px 10px rgb(163 177 198 / .6),-5px -5px 10px rgb(255 255 255 / .7)}
.tk-card h2{margin:6px 0 0;font-family:var(--f-kid);font-weight:700;font-size:max(9px,calc(clamp(1.8rem,3.6vw,3rem) * var(--m,1)));line-height:1.1;letter-spacing:-.01em;color:#2B3440}
.tk-say{display:inline-flex;align-items:center;gap:8px;margin:12px 0 0;padding:8px 16px;border-radius:999px;background:#E2558A;color:#fff;font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(15px * var(--m,1)))}
.tk-say .i{width:17px;height:17px}
.tk-faces{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(10px,1.6vw,22px);margin-top:22px}
.tk-face{position:relative;display:grid;justify-items:center;gap:6px;border:0;border-radius:26px;padding:20px 8px 16px;background:#E8ECF2;cursor:pointer;color:#2B3440;
  box-shadow:9px 9px 16px rgb(163 177 198 / .6),-9px -9px 16px rgb(255 255 255 / .75);transition:transform .2s,box-shadow .2s}
.tk-face:hover{transform:translateY(-3px)}
.tk-face:active{transform:translateY(1px);box-shadow:inset 5px 5px 10px rgb(163 177 198 / .6),inset -5px -5px 10px rgb(255 255 255 / .7)}
.tk-face.pop .tk-svg{animation:tkpop .4s var(--ease)}
.tk-svg svg{width:clamp(54px,8vw,104px);height:auto;display:block;filter:drop-shadow(0 8px 12px rgb(0 0 0 / .14))}
.tk-face b{font-family:var(--f-kid);font-weight:700;font-size:max(9px,calc(clamp(13px,1.5vw,19px) * var(--m,1)))}
.tk-face small{position:absolute;top:10px;left:13px;font-family:var(--f-mono);font-weight:700;font-size:max(9px,calc(12px * var(--m,1)));color:#94A3B8}
.tk-n{font-style:normal;font-family:var(--f-display);font-weight:800;font-size:max(9px,calc(clamp(22px,2.6vw,34px) * var(--m,1)));line-height:1;color:var(--f)}
.tk-best{margin-top:20px}
.tk-best p{margin:0 0 8px;font-family:var(--f-display);font-weight:800;font-size:max(9px,calc(15px * var(--m,1)));color:#4B5563}
.tk-best > div{display:flex;flex-wrap:wrap;gap:8px}
.tk-chip{display:inline-flex;align-items:center;gap:10px;border:0;border-radius:999px;padding:7px 7px 7px 16px;background:#E8ECF2;font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(14px * var(--m,1)));color:#2B3440;cursor:pointer;
  box-shadow:5px 5px 10px rgb(163 177 198 / .55),-5px -5px 10px rgb(255 255 255 / .7)}
.tk-chip em{font-style:normal;min-width:28px;height:28px;padding:0 6px;border-radius:999px;display:grid;place-items:center;background:#DCE2EA;font-size:max(9px,calc(12.5px * var(--m,1)))}
.tk-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:22px}
.tk-total{flex:1;min-width:200px;font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(14px * var(--m,1)));color:#6B7280}
.tk-foot .btn.primary{background:linear-gradient(135deg,#8B84FF,#6C63FF);color:#fff}
@keyframes tkpop{0%{transform:scale(1)}40%{transform:scale(1.14) rotate(-4deg)}100%{transform:scale(1)}}
@keyframes tkin{from{opacity:0}to{opacity:1}}

/* ---------- Rabinder's dashboard ---------- */
.adm-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.adm-head .kicker .i{width:14px;height:14px}
.adm-head h1{margin:6px 0 0;font-size:max(9px,calc(clamp(2rem,3.6vw,2.9rem) * var(--m,1)));font-weight:800;letter-spacing:-.035em;line-height:1.05}
.adm-head p{margin:8px 0 0;color:var(--muted);max-width:60ch}
.adm-tools{display:grid;gap:12px;justify-items:end}
.adm-btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.akpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:28px}
.akpi{border-radius:24px;padding:18px 20px;box-shadow:var(--ex);background:var(--surface);display:grid;gap:2px;min-width:0}
.akpi b{font-family:var(--f-display);font-weight:800;font-size:max(9px,calc(clamp(1.45rem,2.4vw,2.1rem) * var(--m,1)));line-height:1.1;letter-spacing:-.02em;color:var(--accent);overflow-wrap:anywhere}
.akpi span{font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(13.5px * var(--m,1)))}
.akpi small{font-size:max(9px,calc(12.5px * var(--m,1)));color:var(--muted)}
.akpi.good b{color:#2BB673}.akpi.ok b{color:#D9A21B}.akpi.warn b{color:#E07B2E}.akpi.bad b{color:#E5484D}
[data-theme="night"] .akpi b{font-family:var(--f-mono);font-weight:700;letter-spacing:-.01em}
.agrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:26px}
.asec{margin-top:0}
#a-analysis{margin-top:26px}
.asec h2{margin:0 0 14px;font-size:max(9px,calc(17px * var(--m,1)));font-weight:800;display:flex;align-items:center;gap:9px}
.asec h2 .i{width:19px;height:19px;color:var(--accent)}
.asec.wide{grid-column:1 / -1}
.adays{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:5px;align-items:end;height:160px;padding:10px;border-radius:18px;box-shadow:var(--in-sm)}
.aday{height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;min-width:0}
.aday i{display:block;width:100%;max-width:26px;min-height:2px;border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,var(--accent-2),var(--accent))}
.aday small{font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(10px * var(--m,1)));color:var(--muted)}
.arank{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.arank li{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) auto;gap:12px;align-items:center;font-size:max(9px,calc(14px * var(--m,1)))}
.arank li > span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.arank b{font-family:var(--f-display);font-weight:700;font-size:max(9px,calc(13px * var(--m,1)));white-space:nowrap}
.abar{display:block;height:12px;border-radius:999px;box-shadow:var(--in-sm);overflow:hidden;padding:2px}
.abar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--accent-2),var(--accent))}
.adev{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.adev li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:start;padding:12px 14px;border-radius:16px;box-shadow:var(--in-sm);font-size:max(9px,calc(14px * var(--m,1)));line-height:1.45}
.adev small{color:var(--muted);white-space:nowrap}
.asev{display:inline-block;font-family:var(--f-display);font-weight:800;font-size:max(9px,calc(10.5px * var(--m,1)));letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:4px 9px;white-space:nowrap}
.asev.high{background:#FDE2E3;color:#B4232A}.asev.medium{background:#FEF0C7;color:#8A5A00}.asev.low{background:#DCEFFD;color:#0B5A8A}
[data-theme="night"] .asev.high{background:rgb(229 72 77 / .2);color:#FCA5A5}
[data-theme="night"] .asev.medium{background:rgb(245 158 11 / .18);color:#FCD34D}
[data-theme="night"] .asev.low{background:rgb(96 165 250 / .18);color:#93C5FD}
.afaces{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:9px}
.afaces li{display:grid;grid-template-columns:28px 66px minmax(0,1fr) 40px;gap:10px;align-items:center;font-weight:600;font-size:max(9px,calc(13.5px * var(--m,1)))}
.af svg{width:26px;height:26px;display:block}
.afaces b{text-align:right;font-family:var(--f-display)}
.afb,.alog{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.afb li{padding:12px 14px;border-radius:16px;box-shadow:var(--in-sm);font-size:max(9px,calc(14px * var(--m,1)))}
.afb small{float:right;color:var(--muted)}
.afb p{margin:5px 0 0;color:var(--muted)}
.astars{color:#F5B301;letter-spacing:1px}
.astars i{font-style:normal;color:var(--placeholder)}
.alog li{display:grid;gap:2px;padding:10px 14px;border-radius:14px;box-shadow:var(--in-sm);font-size:max(9px,calc(14px * var(--m,1)));min-width:0}
.alog b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.alog small{color:var(--muted)}
.aenrol{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) auto;gap:14px;align-items:end;margin:16px 0 12px}
.apin{display:flex;gap:8px;align-items:center}
.apin input{flex:1;letter-spacing:.22em}
.mono{font-family:var(--f-mono)}
.atable{width:100%;border-collapse:collapse;margin-top:14px;font-size:max(9px,calc(14px * var(--m,1)))}
.atable th{text-align:left;font-family:var(--f-display);font-weight:800;font-size:max(9px,calc(11px * var(--m,1)));letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:6px 10px}
.atable td{padding:12px 10px;box-shadow:inset 0 1px 0 rgb(163 177 198 / .3);vertical-align:middle}
[data-theme="night"] .atable td{box-shadow:inset 0 1px 0 rgb(255 255 255 / .07)}
.atable small{color:var(--muted)}
.atable .num,.num{text-align:right;white-space:nowrap}
.aav{float:left;width:36px;height:36px;margin-right:10px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:max(9px,calc(12px * var(--m,1)));color:#fff;background:linear-gradient(135deg,#8B84FF,#6C63FF)}
.aact{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-top:12px}
.atable .aact{margin:0}
.ainbox{position:relative;margin:10px 0 6px;padding:12px 14px 12px 34px;border-radius:16px;background:var(--well);box-shadow:var(--in-sm);font-size:max(9px,calc(14.5px * var(--m,1)));line-height:1.5}
.ainbox::before{content:"";position:absolute;left:14px;top:18px;width:10px;height:10px;border-radius:50%;background:#F2B84B;box-shadow:0 0 0 4px rgb(242 184 75 / .18)}
.ainbox.on::before{background:#2BB673;box-shadow:0 0 0 4px rgb(43 182 115 / .18),0 0 12px rgb(43 182 115 / .55)}
.ainbox b{font-family:var(--f-display);font-weight:800}
.aunlock{display:flex;gap:10px;align-items:flex-end;margin:10px 0}
.aunlock .fld{flex:1}
.alist{margin:0;padding-left:20px;display:grid;gap:8px;font-size:max(9px,calc(15px * var(--m,1)));line-height:1.5}
.bad{color:#E5484D}
.msg-act{margin-top:10px}
@media (max-width:1060px){
  .akpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .agrid{grid-template-columns:minmax(0,1fr)}
  .adm-tools{justify-items:start}
  .adm-btns{justify-content:flex-start}
}
@media (max-width:640px){
  .hero-gate{margin-top:18px}
  .hg-row{display:grid;grid-template-columns:minmax(0,1fr) 120px}
  .hg-go{grid-column:1 / -1}
  .who-n{display:none}
  .who{padding:0 5px}
  .conn.on{display:none}
  .brand{min-width:0;flex:1 1 auto}
  .brand-t{min-width:0}
  .brand-t b{overflow:hidden;text-overflow:ellipsis}
  .aenrol{grid-template-columns:minmax(0,1fr)}
  .akpis{gap:12px}
  .akpi{padding:14px 16px}
  .atable th:nth-child(3),.atable td:nth-child(3){display:none}
  .tk-faces{gap:6px}
  .tk-face{padding:12px 2px 10px;border-radius:18px}
  .tk-card{padding:18px 16px}
  .adev li{grid-template-columns:auto minmax(0,1fr)}
  .adev small{grid-column:2}
}
@media (max-width:400px){
  .brand-t b{font-size:max(9px,calc(15px * var(--m,1)))}
  .top-r{gap:8px;margin-left:8px}
}
@keyframes hgbob{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}
@media (prefers-reduced-motion:reduce){.hg-down .i{animation:none!important}}