/* MyClassKit · side menu (desktop and tablet). Phones keep the top bar. */
.tgh-side-top,.tgh-side .tgh-ni{display:none}
@media (min-width:821px){
  :root{--tgh-rail:68px;--tgh-open:232px}
  .panel.ready,.demo-shell{grid-template-rows:1fr!important;grid-template-columns:var(--tgh-rail) minmax(0,1fr)!important}
  html[data-tgh-side="open"] .panel.ready,html[data-tgh-side="open"] .demo-shell{grid-template-columns:var(--tgh-open) minmax(0,1fr)!important}
  .panel>:not(.tgh-side),.demo-shell>:not(.tgh-side){grid-column:2;grid-row:1;min-width:0}
  .tgh-side{grid-column:1;grid-row:1;position:relative;z-index:70;display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:4px!important;
    width:var(--tgh-rail);height:100%;padding:14px 10px!important;overflow:hidden;
    background:var(--n-card,#fbf8f1)!important;border:0!important;border-right:1px solid var(--tgh-line)!important;box-shadow:none!important;backdrop-filter:none!important;
    transition:width .2s ease,box-shadow .2s ease}
  html[data-tgh-side="open"] .tgh-side{width:var(--tgh-open)}
  html[data-tgh-side="rail"] .tgh-side.tgh-hover{width:var(--tgh-open);box-shadow:none!important}
  /* top: toggle at the top left, logo beside it */
  .tgh-side-top{display:flex;align-items:center;gap:8px;min-height:44px;margin:0 0 14px;padding-bottom:14px;border-bottom:1px solid var(--tgh-line)}
  .tgh-side-toggle{flex:0 0 auto;display:grid!important;place-items:center;width:28px!important;height:28px!important;min-height:0!important;padding:0!important;border:0!important;border-radius:8px!important;background:transparent!important;color:var(--tgh-mute)!important;cursor:pointer}
  .tgh-side-toggle:hover,.tgh-side-toggle[aria-pressed="true"]{color:var(--tgh-ink)!important;background:rgba(255,253,248,calc(0.47 * var(--wash-k,1)))!important}
  .tgh-side-toggle .tgh-ni{display:block;width:18px;height:18px}
  .tgh-side-logo{display:flex;align-items:center;gap:10px;min-width:0;text-decoration:none}
  .tgh-side-mark{flex:0 0 auto;width:20px;height:20px;background:url("/theme/logo-mark.svg") center/contain no-repeat}
  .tgh-side-word{flex:0 0 auto;width:112px;height:26px;background:url("/theme/teachtally-logo-on-light.svg") left center/contain no-repeat}
  html[data-tgh-side="rail"] .tgh-side:not(.tgh-hover) .tgh-side-top{flex-direction:column;gap:12px}
  html[data-tgh-side="rail"] .tgh-side:not(.tgh-hover) .tgh-side-word{display:none}
  html[data-tgh-side="open"] .tgh-side .tgh-side-mark,.tgh-side.tgh-hover .tgh-side-mark{display:none}
  /* the old brand text is replaced by the logo */
  .tgh-side>.bar-left>.brand,.tgh-side>.brand{display:none!important}
  .tgh-side>.bar-left{display:contents}
  /* items */
  .tgh-side nav,.tgh-side .demo-nav,.tgh-side .actions{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:2px!important;margin:0!important;width:auto!important;overflow:visible!important}
  /* main links at the top; account and demo tools at the bottom, after a thin line */
  .tgh-side nav,.tgh-side .demo-nav{flex:1 1 auto!important;min-height:0}
  .tgh-side #downloadBackup,.tgh-side .actions{position:relative;margin-top:auto!important;padding-top:12px!important}
  .tgh-side .actions{height:auto}
  .tgh-side #downloadBackup{height:52px!important}
  .tgh-side #downloadBackup::before,.tgh-side .actions::before{content:"";position:absolute;left:4px;right:4px;top:0;border-top:1px solid var(--tgh-line)}
  .tgh-side .network{order:99;border:0!important;background:transparent!important}
  .tgh-side .tgh-side-item{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;width:100%!important;min-height:40px!important;height:40px;padding:0 12px!important;
    border:0!important;border-radius:12px!important;background:transparent!important;color:var(--tgh-mute)!important;font-size:14px!important;font-weight:500!important;line-height:1!important;text-align:left;white-space:nowrap;text-decoration:none!important;box-shadow:none!important;cursor:pointer}
  .tgh-side .tgh-side-item:hover{background:rgba(255,253,248,calc(0.4 * var(--wash-k,1)))!important;color:var(--tgh-ink)!important}
  .tgh-side .tgh-side-item[aria-current="page"]{background:var(--tgh-ink)!important;color:var(--n-ink,#161514)!important}
  .tgh-side .tgh-ni{display:block;flex:0 0 auto;width:20px;height:20px}
  .tgh-side .tgh-theme-btn svg{width:20px;height:20px}
  .tgh-side .tgh-nl,.tgh-side .tgh-theme-btn span{overflow:hidden;text-overflow:ellipsis;transition:opacity .15s ease}
  html[data-tgh-side="rail"] .tgh-side:not(.tgh-hover) .tgh-nl,html[data-tgh-side="rail"] .tgh-side:not(.tgh-hover) .tgh-theme-btn span{opacity:0;width:0}
  .tgh-side nav,.tgh-side .demo-nav{justify-content:flex-start!important}
  html body .tgh-side .actions a.primary{background:transparent!important;border:0!important;color:var(--t-green,#1f8a5a)!important}
  html body .tgh-side .actions a.primary:hover{background:rgba(31,138,90,0.115)!important}
  /* connection status: a dot in the rail, text when open */
  .tgh-side .network{display:flex!important;align-items:center;gap:10px;min-height:28px;padding:0 12px;color:var(--tgh-mute)!important;font-size:12px!important;white-space:nowrap}
  .tgh-side .network::before{content:"";flex:0 0 auto;width:8px;height:8px;margin:0 6px;border-radius:50%;background:#1f8a5a}
  .tgh-side .network[data-offline="true"]::before{background:#f2b31d}
  html[data-tgh-side="rail"] .tgh-side:not(.tgh-hover) .network{font-size:0!important}
  .tgh-side [hidden]{display:none!important}
}

/* each menu item has its own colour: the icon always, the background on hover and when active */
@media (min-width:821px){
  .tgh-side .tgh-side-item{--c:#5a534b}
  .tgh-side [data-tgh-k="grades"]{--c:#2f62d9}
  .tgh-side [data-tgh-k="schedule"]{--c:#1f8a5a}
  .tgh-side [data-tgh-k="timer"]{--c:#f2b31d}
  .tgh-side [data-tgh-k="access"]{--c:#6b4fd8}
  .tgh-side [data-tgh-k="student"]{--c:#d43f86}
  .tgh-side [data-tgh-k="games"]{--c:#1f6f66}
  .tgh-side [data-tgh-k="owner"]{--c:#2f62d9}
  .tgh-side [data-tgh-k="backup"]{--c:#2f62d9}
  .tgh-side [data-tgh-k="install"]{--c:#2f62d9}
  .tgh-side [data-tgh-k="name"]{--c:#e1502a}
  .tgh-side [data-tgh-k="signout"]{--c:#d8383b}
  .tgh-side [data-tgh-k="tour"]{--c:#6b4fd8}
  .tgh-side [data-tgh-k="reset"]{--c:#f2b31d}
  .tgh-side [data-tgh-k="signin"]{--c:#1f8a5a}
  .tgh-side .tgh-theme-btn{--c:#f2b31d}
  .tgh-side .tgh-side-item .tgh-ni,.tgh-side .tgh-theme-btn svg{color:var(--c)}
  .tgh-side .tgh-side-item:hover{background:color-mix(in srgb,var(--c) 13%,transparent)!important;color:var(--tgh-ink)!important}
  .tgh-side .tgh-side-item[aria-current="page"]{background:color-mix(in srgb,var(--c) 18%,transparent)!important;color:var(--n-ink,#161514)!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 40%,transparent)!important}
  html body .tgh-side .actions a.primary{color:var(--tgh-soft)!important}
  html body .tgh-side .actions a.primary:hover{background:color-mix(in srgb,var(--c) 13%,transparent)!important}
}

/* FLAT POSTER DESIGN (v81): cream rail, ink outline, black active pill */
@media (min-width:821px){
  .tgh-side{background:var(--f-bg,#efe9dd)!important;border-right:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important}
  html[data-tgh-side="rail"] .tgh-side.tgh-hover{box-shadow:6px 0 0 rgba(var(--ink-rgb,22,21,20),0.08)!important}
  .tgh-side-top,.tgh-side #downloadBackup::before,.tgh-side .actions::before{border-color:rgba(var(--ink-rgb,22,21,20),0.18)!important}
  .tgh-side .tgh-side-item{color:var(--n-soft,#3b3733)!important;font-weight:620!important;border:2px solid transparent!important}
  .tgh-side .tgh-side-item:hover{background:color-mix(in srgb,var(--c) 16%,var(--n-card,#fbf8f1))!important;color:var(--n-ink,#161514)!important}
  .tgh-side .tgh-side-item[aria-current="page"]{background:var(--n-ink,#161514)!important;color:var(--n-onink,#fbf8f1)!important;border-color:var(--n-edge,#161514)!important;box-shadow:3px 3px 0 var(--c)!important}
  .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni{color:color-mix(in srgb,var(--c) 70%,#fff)!important}
  .tgh-side-toggle:hover,.tgh-side-toggle[aria-pressed="true"]{background:#f2b31d!important;color:#161514!important}
  .tgh-side .tgh-theme-btn{border:2px solid transparent!important;background:transparent!important;font-weight:620!important;color:var(--n-soft,#3b3733)!important}
  .tgh-side .tgh-theme-btn:hover{background:color-mix(in srgb,var(--c) 16%,var(--n-card,#fbf8f1))!important}
  .tgh-side .network::before{background:#1f8a5a!important;box-shadow:0 0 0 2px var(--n-shadow,#161514)}
}
/* v82: icon colours readable on cream and on dark */
@media (min-width:821px){
  .tgh-side .tgh-side-item .tgh-ni,.tgh-side .tgh-theme-btn svg{color:color-mix(in srgb,var(--c) 74%,#161514)!important}
  .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni{color:color-mix(in srgb,var(--c) 55%,#fff)!important}
  html[data-tgh-theme="dark"] .tgh-side{background:#141311!important;border-right-color:#cfc7b9!important}
  html[data-tgh-theme="dark"] .tgh-side .tgh-side-item{color:#d6cfc3!important}
  html[data-tgh-theme="dark"] .tgh-side .tgh-side-item .tgh-ni,html[data-tgh-theme="dark"] .tgh-side .tgh-theme-btn svg{color:color-mix(in srgb,var(--c) 55%,#fff)!important}
  html[data-tgh-theme="dark"] .tgh-side .tgh-side-item:hover,html[data-tgh-theme="dark"] .tgh-side .tgh-theme-btn:hover{background:color-mix(in srgb,var(--c) 20%,#1e1c19)!important;color:#efe9dd!important}
  html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"]{background:#efe9dd!important;color:#141311!important;border-color:#efe9dd!important}
  html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni{color:color-mix(in srgb,var(--c) 80%,#000)!important}
  html[data-tgh-theme="dark"] .tgh-side .tgh-theme-btn{color:#d6cfc3!important}
}
/* v83: active item in the blue identity */
@media (min-width:821px){
  .tgh-side .tgh-side-item[aria-current="page"],html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"]{background:var(--b,#2f62d9)!important;border-color:var(--b,#2f62d9)!important;color:var(--b-on,#fbf8f1)!important;box-shadow:3px 3px 0 var(--n-shadow,#161514)!important}
  .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni{color:var(--b-on,#fbf8f1)!important}
  .tgh-side-toggle:hover,.tgh-side-toggle[aria-pressed="true"]{background:var(--b-tint,#dfe7fb)!important}
}
/* v84: one quiet icon colour */
@media (min-width:821px){
  .tgh-side .tgh-side-item .tgh-ni,.tgh-side .tgh-theme-btn svg,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item .tgh-ni,html[data-tgh-theme="dark"] .tgh-side .tgh-theme-btn svg{color:currentColor!important;opacity:.8}
  .tgh-side .tgh-side-item:hover,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item:hover,html[data-tgh-theme="dark"] .tgh-side .tgh-theme-btn:hover,.tgh-side .tgh-theme-btn:hover{background:var(--b-tint,#ebe4d6)!important}
  .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni{opacity:1}
  .tgh-side .tgh-side-item[aria-current="page"],html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"]{box-shadow:none!important;color:var(--b-on,#fbf8f1)!important}
  .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni{color:var(--b-on,#fbf8f1)!important}
}
/* v85 sidebar: each item its own pastel colour; selected = tile in that colour; hover = light tint */
@media (min-width:821px){
  .tgh-side .tgh-side-item{--c:#8d857a}
  .tgh-side [data-tgh-k="grades"]{--c:#2f62d9}.tgh-side [data-tgh-k="schedule"]{--c:#36a874}.tgh-side [data-tgh-k="timer"]{--c:#f5c244}
  .tgh-side [data-tgh-k="access"]{--c:#8b7bd8}.tgh-side [data-tgh-k="games"]{--c:#ee6a45}.tgh-side [data-tgh-k="scan"]{--c:#2fa5a0}.tgh-side [data-tgh-k="student"]{--c:#e47aa2}
  .tgh-side [data-tgh-k="owner"]{--c:#2fa5a0}.tgh-side [data-tgh-k="backup"]{--c:#2f62d9}.tgh-side [data-tgh-k="install"]{--c:#2f62d9}
  .tgh-side [data-tgh-k="name"]{--c:#f6a26b}.tgh-side [data-tgh-k="signout"]{--c:#ee6a45}.tgh-side [data-tgh-k="tour"]{--c:#8b7bd8}
  .tgh-side [data-tgh-k="reset"]{--c:#f5c244}.tgh-side [data-tgh-k="signin"]{--c:#36a874}.tgh-side .tgh-theme-btn{--c:#f5c244}
  .tgh-side .tgh-side-item,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item{color:var(--n-ink,#161514)!important;border:1.5px solid transparent!important}
  .tgh-side .tgh-side-item .tgh-ni,.tgh-side .tgh-theme-btn svg,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item .tgh-ni,html[data-tgh-theme="dark"] .tgh-side .tgh-theme-btn svg{color:color-mix(in srgb,var(--c) 82%,#161514)!important;opacity:1!important}
  html[data-tgh-theme="dark"] .tgh-side .tgh-side-item .tgh-ni,html[data-tgh-theme="dark"] .tgh-side .tgh-theme-btn svg{color:var(--c)!important}
  .tgh-side .tgh-side-item:hover,.tgh-side .tgh-theme-btn:hover{background:color-mix(in srgb,var(--c) 14%,transparent)!important;color:var(--n-ink,#161514)!important}
  .tgh-side .tgh-side-item[aria-current="page"],.tgh-side .tgh-side-item[aria-current="page"]:hover,
  html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"],html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"]:hover{background:color-mix(in srgb,var(--c) 30%,var(--n-card,#fbf8f1))!important;border-color:color-mix(in srgb,var(--c) 55%,transparent)!important;color:var(--n-ink,#161514)!important;box-shadow:none!important}
  .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni{color:color-mix(in srgb,var(--c) 70%,#161514)!important}
  html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni{color:var(--c)!important}
  .tgh-side,html[data-tgh-theme="dark"] .tgh-side{border-right:1.5px solid var(--f-edge,rgba(22,21,20,.14))!important}
}
@media (min-width:821px){
html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"],html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"]:hover{background:var(--c)!important;border-color:var(--c)!important;color:#161514!important}
html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] *{color:#161514!important}
html[data-tgh-theme="dark"] .tgh-side .tgh-side-item:hover{background:rgba(239,233,221,.07)!important}
}
/* v87 sidebar: dark selected tile = full colour, white text (black on the soft sun/peach) */
@media (min-width:821px){
html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"],html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"]:hover,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] *,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni{color:#fff!important}
html[data-tgh-theme="dark"] .tgh-side [data-tgh-k="timer"][aria-current="page"],html[data-tgh-theme="dark"] .tgh-side [data-tgh-k="timer"][aria-current="page"] *,html[data-tgh-theme="dark"] .tgh-side [data-tgh-k="name"][aria-current="page"] *,html[data-tgh-theme="dark"] .tgh-side [data-tgh-k="reset"][aria-current="page"] *{color:#161514!important}
html[data-tgh-theme="dark"] .tgh-side [data-tgh-k="grades"][aria-current="page"]{background:#2f62d9!important;border-color:#2f62d9!important}
}