/* Shared navigation and compact mobile layout. Original typefaces and artwork. */
[data-demo-only][hidden],[data-reg-only][hidden],#ovStudentNoteEditor[hidden]{display:none!important}
.nav#navLinks{min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;gap:3px;padding:3px;overscroll-behavior-x:contain}
#navLinks::-webkit-scrollbar,.tb-track::-webkit-scrollbar{display:none}
#navLinks a{display:inline-flex;align-items:center;gap:6px;flex:none;white-space:nowrap;padding:8px 10px;font-size:13px;font-weight:600}
.nav-icon{display:inline-flex;align-items:center;justify-content:center;flex:none}
.nav-icon svg{width:15px;height:15px}
.tb-track{position:relative;isolation:isolate;display:flex;align-items:center;gap:3px;width:100%;min-width:0;height:64px;overflow:hidden;padding:6px 8px;touch-action:auto}
.tb-track .nav-marker{position:absolute;z-index:0;pointer-events:none;background:#eef0e9;border-radius:13px;box-shadow:inset 0 0 0 1px rgba(63,90,72,.055)}
.tb-track .nav-marker[hidden]{display:none}
.tb-track .tb-tab{position:relative;z-index:1;flex:1 1 0;min-width:0;height:50px;padding:5px 2px;gap:4px;border-radius:13px}
.tb-track .nav-icon svg{width:19px;height:19px}
.tb-track .tb-tab>span:last-child{font-size:10px;white-space:nowrap}
.tb-track .tb-tab:not(.active)>span:last-child{color:#77725f}
.tb-track .tb-tab:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.ov-overview-lower{grid-template-columns:1.2fr 1fr}
.ov-student-notes.stat{background:#edf1e9;padding:20px 22px}
.ov-student-notes .scap{color:#31513b;margin-bottom:5px}
.ov-student-notes .ssub{font-size:11px;margin:0 0 13px}
.ov-recent-students{display:flex;flex-wrap:wrap;gap:7px;max-height:100px;overflow-y:auto;overscroll-behavior:contain}
.ov-note-pupil{display:inline-flex;align-items:center;gap:7px;max-width:100%;border:1px solid #d7dfd1;border-radius:25px;background:#fffefb;padding:4px 10px 4px 4px;cursor:pointer;color:#28442f;font:500 12px var(--sans);text-align:left}
.ov-note-pupil[aria-expanded="true"]{border-color:#35513e;background:#e0e8d9}
.ov-note-pupil>span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ov-note-pupil .md-access-avatar{width:27px;height:27px;font-size:10px;flex:none}
.ov-note-pupil .ov-note-dot{width:5px;height:5px;background:#b09a62;border-radius:50%;flex:none}
.ov-note-inline{margin:0 0 22px;padding:22px 24px;background:#fffefb;border:1px solid #d7dfd1;border-radius:18px;box-shadow:0 8px 28px -22px #38523c}
.ov-note-inline-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:15px}
.ov-note-inline h3{font:600 16px/1.5 var(--sans);margin:0;color:#28442f}
.ov-note-inline-head p{margin:3px 0 0;font:400 12px/1.6 var(--sans);color:var(--muted)}
.ov-note-inline label{display:block;font:500 12px var(--sans);margin-bottom:7px;color:#6b705e}
.ov-note-inline textarea{display:block;width:100%;min-height:116px;resize:vertical;padding:13px 15px;border:1px solid #dfded4;border-radius:12px;background:#fbfaf6;color:var(--ink);font:400 14px/1.7 var(--sans)}
.ov-note-inline textarea:focus{outline:2px solid #b8c7ad;outline-offset:2px}
.ov-note-editor-status{margin-right:auto;font:400 12px/1.6 var(--sans);color:#627154}
.ov-note-inline .ov-note-acts{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:12px}
.ov-note-inline .ov-note-close{border:0;background:transparent;color:#6b705e;width:32px;height:32px;cursor:pointer;font-size:22px;flex:none}
.ov-note-inline .ov-note-acts button{font-size:12px}
/* Folders reveal across the same viewport as the pupil rail, without x-overflow. */
.ma-fold-body,.tk-fold-body{width:var(--library-viewport-width,100%);max-width:none;margin-left:calc((100% - var(--library-viewport-width,100%))/2)}
.ma-fold-inner,.tk-fold-inner{width:100%;max-width:100%;min-width:0}
.ma-fold-inner>.cd-library-controls,.tk-fold-inner>.cd-library-controls{padding-inline:max(20px,calc((var(--library-viewport-width,100vw) - 1100px)/2))}
.cd-card-rail.ma-grid,.cd-card-rail.tk-grid{width:var(--library-viewport-width,100vw);max-width:none;margin-left:calc((100% - var(--library-viewport-width,100vw))/2);padding:12px var(--library-inset,16px) 16px;scroll-padding-inline:var(--library-inset,16px);overscroll-behavior-x:contain}
.cd-card-rail>.ma-card,.cd-card-rail>.tk-card{flex:0 0 300px;width:300px;max-width:calc(var(--library-viewport-width,100vw) - 32px)}
.ma-menu-delete{color:#a35c49}
.cd-card-rail>.ma-card .ma-menu{top:auto;bottom:0;max-height:170px;overflow-y:auto;overscroll-behavior:contain}
.cd-card-rail>.ma-card .ma-access{margin-top:auto;padding-top:8px}
.ma-card.ma-illustrated .ma-divider{margin-bottom:8px}
.cd-searchbar{flex-wrap:wrap;align-items:center}
.cd-search{flex:1;max-width:540px;min-width:180px}
.cd-semantic-btn{display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:9px 13px;border:1px solid #d8dfd0;background:#eef1e8;color:#35503a;border-radius:12px;cursor:pointer;white-space:nowrap;font:600 12px var(--sans)}
.cd-semantic-btn svg{width:16px;height:16px;flex:none}
.cd-semantic-btn:disabled{opacity:.6;cursor:default}
.cd-semantic-status{flex-basis:100%;font:400 12px/1.5 var(--sans);color:#6b705e;min-height:18px}
.cd-semantic-status:empty{display:none}
.bell-panel{overflow-x:hidden;overscroll-behavior:contain;touch-action:pan-y}
.bell-t,.bell-b{overflow-wrap:anywhere;min-width:0}
.bell-t-row{min-width:0}
@media(max-width:900px){.ov-student-notes.stat{grid-column:1/-1}.ov-overview-lower>.ov-card:first-child{grid-column:auto}}
@media(max-width:860px){
  .cd-rail-btn{display:none!important}
  .cd-rail-controls,.cd-library-controls{justify-content:flex-end}
  .bell-panel{box-sizing:border-box;max-width:100%;contain:inline-size}
  .bell-panel .bell-head{flex-wrap:wrap;gap:8px;font-size:16px}
  .bell-head-acts{margin-left:auto;max-width:100%}
  .bell-panel .bell-markall{font-size:11px;white-space:normal;max-width:115px}
}
@media(max-width:600px){
  .topnav{padding-left:12px;padding-right:12px;gap:8px}
  .topnav .brand{min-width:0;flex-shrink:1;gap:8px}
  .topnav .brand-tx{min-width:0}.topnav .brand-tx b{font-size:15px;line-height:1.1}
  .topnav .brand-tx i{font-size:8px}
  .topnav .nav-right{gap:5px;flex:none}
  .topnav .bell,#navLogout{width:34px;height:36px;flex:none}
  .topnav #avatar{width:34px;height:34px}
  .ov-note-inline{padding:17px 16px}.ov-student-notes.stat{padding:18px}
  .ov-overview-lower{grid-template-columns:1fr}
  .cd-search{width:auto;max-width:none;min-width:0}
  .cd-semantic-btn{padding:9px 10px;font-size:11px}
  .cd-search-count{flex-basis:100%}
}

.tb-sheet .nav-icon svg{width:20px;height:20px}
@media(min-width:621px) and (max-width:860px){.tb-back{display:block}}
/* One deep green for solid green cards throughout the cabinet. */
.stat.dark,.py-hero,.les-head,.les-bar,.ov-student-notes.stat{background:var(--ever)}
.ov-student-notes.stat{position:relative;overflow:visible;border-color:var(--ever);color:#f4efe2}
.ov-student-notes.stat::after{display:none}
.ov-student-notes.stat:hover{transform:none}
.ov-student-notes.stat .scap{color:var(--gold);font-size:13px}
.ov-student-notes.stat .ssub{color:#c4cebf}
.ov-note-pupil{border-color:#64715f;background:transparent;color:#f4efe2}
.ov-note-pupil:hover,.ov-note-pupil[aria-expanded="true"]{background:#ffffff12;border-color:var(--gold)}
.ov-note-pupil .md-access-avatar{background:#f3efe3;color:var(--ever)}
.ov-note-inline{position:absolute;top:calc(100% + 8px);right:0;z-index:35;width:360px;max-width:calc(100vw - 32px);margin:0;padding:15px 16px;background:var(--ever);border:1px solid #667361;border-radius:14px;box-shadow:0 12px 30px #172b2433}
.ov-note-inline-head{gap:8px;margin-bottom:10px}
.ov-note-inline h3{font-size:14px;line-height:1.4;color:#f4efe2}
.ov-note-inline-head p{font-size:10px;color:#c4cebf}
.ov-note-inline label{font-size:11px;color:#c4cebf}
.ov-note-inline textarea{min-height:76px;height:82px;max-height:160px;padding:9px 11px;font-size:13px;line-height:1.5}
.ov-note-inline .ov-note-close{width:24px;height:24px;color:#f4efe2}
.ov-note-inline .ov-note-acts{margin-top:10px;gap:8px;justify-content:flex-end}
.ov-note-editor-status{flex-basis:100%;font-size:11px;color:#d0d8c9}
.ov-note-editor-status:empty{display:none}
.ov-note-inline .slot-act{color:#e7ebdf;border-color:#87927d;background:transparent}
.ov-note-inline .btn-add{background:#f4efe2;color:var(--ever);box-shadow:none}
@media(max-width:600px){.ov-note-inline{position:relative;top:auto;right:auto;width:100%;max-width:none;margin:12px 0 0;padding:13px 0 0;border:0;border-top:1px solid #667361;border-radius:0;box-shadow:none}}

/* Group: participants and confirmations; pass: quantity and clear price. */
#grpBlock .grp-list,.cm-student-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),520px));justify-content:center;gap:18px;align-items:stretch}
.grp-card.cm-group,.tf-subrow.cm-pass{display:flex;flex-direction:column;align-items:stretch;gap:0;min-width:0;min-height:0;padding:21px;border:1px solid var(--line2);border-radius:15px;background:var(--panel);box-shadow:0 6px 20px -17px #443e3270}
.grp-card.cm-group{border-top:3px solid var(--gold)}
.cm-group .cm-eyebrow,.cm-pass .cm-eyebrow{display:flex;align-items:center;gap:8px;font:500 10px/1.5 var(--sans);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.cm-group .cm-eyebrow>span:first-child,.cm-pass .cm-eyebrow>span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm-group .grp-badge{font-size:10px;margin:0;text-transform:none;letter-spacing:0}
.cm-group .cm-eyebrow>.grp-ic{width:25px;height:28px;flex:none}
.cm-group-title,.cm-pass-title{font:400 26px/1.2 var(--serif);color:var(--ink);letter-spacing:-.025em;margin:14px 0;min-height:0;overflow-wrap:anywhere}
.cm-seats{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px}
.cm-person{position:relative;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;font:500 11px var(--sans);background:#eaf0e7;border:1px solid var(--line2);color:var(--ever);flex:none}
.cm-person .cm-avatar{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background-size:cover;background-position:center}
.cm-person small{position:absolute;right:-3px;bottom:-3px;display:grid;place-items:center;background:var(--ever);color:var(--panel);border:2px solid var(--panel);border-radius:50%;width:17px;height:17px;font:500 10px/1 var(--sans)}
.cm-pending{background:var(--panel);border:1px dashed var(--gold)}
.cm-pending small{background:#f3eddf;color:#826c3a}
.cm-confirm{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.cm-confirm b{font:400 23px var(--serif);color:var(--ever)}
.cm-confirm>span{font:400 11px var(--sans);color:var(--muted)}
.cm-track{display:flex;gap:5px;margin:9px 0 11px}
.cm-track i{height:4px;flex:1;border-radius:3px;background:var(--ever)}
.cm-track .cm-wait{background:var(--line2)}
.cm-waiting,.cm-description{margin:0 0 16px;font:400 11px/1.6 var(--sans);color:var(--muted);overflow-wrap:anywhere}
.cm-description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cm-group-bottom{margin-top:auto;border-top:1px solid var(--line);padding-top:12px}
.cm-group .grp-money{margin:0 0 12px;font:400 11px/1.5 var(--sans);color:var(--muted)}
.cm-members summary,.cm-edit summary{display:flex;align-items:center;justify-content:space-between;gap:8px;list-style:none;cursor:pointer;border-radius:8px;min-height:40px;padding:10px 12px;background:#eef0e9;color:var(--ever);font:500 12px var(--sans)}
.cm-members summary::-webkit-details-marker,.cm-edit summary::-webkit-details-marker{display:none}
.cm-group .grp-rows{margin:12px 0 0;max-height:280px;overflow-y:auto}
.cm-group .grp-row{display:grid;grid-template-columns:30px minmax(0,1fr) 26px;gap:3px 8px;padding:10px 0}
.cm-group .grp-av{width:28px;height:28px;grid-row:span 2;font-size:10px}
.cm-group .grp-rname{font-size:12px;white-space:normal;overflow-wrap:anywhere}
.cm-group .grp-rst{grid-column:2;font-size:10px}.cm-group .grp-row>.grp-ic{grid-column:3;grid-row:1 / span 2}
.cm-group .grp-acts{margin-top:12px;padding-top:0;border:0;gap:7px;flex-wrap:wrap}
.cm-group .grp-btn{min-height:34px;padding:7px 9px;font-size:11px;flex:1;justify-content:center}
.cm-group .grp-btn.solid{background:var(--ever);color:#f4efe2}
.tf-subrow.cm-pass.off{opacity:1;background:#f5f3ec}
.cm-pass .tf-toggle-btn{gap:6px}.cm-pass .tf-track{width:29px;height:17px}.cm-pass .tf-knob{width:11px;height:11px;top:3px;left:3px}.cm-pass .tf-track.on .tf-knob{transform:translateX(12px)}
.cm-pass .tf-togglbl{font-size:10px;white-space:nowrap;letter-spacing:0;text-transform:none}
.cm-quantity{display:flex;align-items:center;gap:14px;margin:0 0 17px;color:var(--ever)}
.cm-quantity strong{font:400 69px/.95 var(--serif);letter-spacing:-.05em}
.cm-quantity>span{font:400 12px/1.6 var(--sans);color:var(--muted)}
.cm-quantity .tf-subicon{margin-left:auto;width:36px;height:36px;background:transparent;color:#9e8854}
.cm-quantity .tf-subicon svg{width:32px;height:32px}
.cm-perforation{height:1px;background:repeating-linear-gradient(to right,var(--line2) 0 4px,transparent 4px 8px);margin:5px -21px 18px}
.cm-price{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap;color:var(--ever)}
.cm-price strong{font:400 29px/1.3 var(--serif);white-space:nowrap}.cm-price small{font-size:20px}
.cm-price>span{font:400 11px var(--sans);color:var(--muted)}
.cm-saving{font:400 11px/1.6 var(--sans);color:var(--muted);margin:10px 0 23px;min-height:18px}
.cm-pass .cm-edit{margin-top:auto}.cm-edit-fields{padding-top:15px}
.cm-pass .tf-fld{display:flex;flex-direction:column;width:auto;gap:5px;font:400 11px var(--sans);color:var(--muted)}
.cm-pass .tf-input{width:100%;min-width:0;max-width:none;height:39px;font-size:13px}
.cm-edit-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.cm-edit-group{display:flex;align-items:center;gap:8px;font:400 12px var(--sans);color:var(--muted)}
.cm-edit-group input{accent-color:var(--ever)}
.cm-pass .tf-subact{width:100%;display:flex;justify-content:space-between;margin-top:15px;gap:8px}
.cm-pass .tf-save-sm{background:var(--ever);box-shadow:none;flex:1;justify-content:center}
.cm-pass .tf-pending{margin-top:12px;font-size:11px}
.cm-members summary:focus-visible,.cm-edit summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media(max-width:600px){#grpBlock .grp-list,.cm-student-groups{grid-template-columns:minmax(0,1fr)}.cm-members summary,.cm-edit summary{min-height:44px}}



.tk-savebox{background:var(--ever)}
.cm-student-passes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px;align-items:stretch}
.py-card.cm-pass{display:flex;flex-direction:column;min-width:0;gap:0;padding:21px;border:1px solid var(--line2);border-radius:15px;background:var(--panel)}
.cm-pass-buy{margin-top:auto;width:100%;min-height:42px;justify-content:center}
.cm-student-passes .py-badge{position:static;transform:none;font-size:10px}
.ov-note-inline{scroll-margin-bottom:90px}
@media(max-width:600px){.ov-note-inline textarea{font-size:16px;height:90px}}

/* A disclosure expands only its own card. */
.uc-grid,.cd-card-rail.ma-grid,.cd-card-rail.tk-grid{align-items:flex-start}
.cd-card-rail>.ma-card,.cd-card-rail>.tk-card,.uc-grid>.uc-card{height:auto;align-self:flex-start}
.cd-card-rail.tf-sublist,.cd-card-rail.cm-student-passes{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;align-items:flex-start;gap:16px;width:var(--library-viewport-width,100vw);max-width:none;margin-left:calc((100% - var(--library-viewport-width,100vw))/2);padding:12px var(--library-inset,16px) 16px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory;scroll-padding-inline:var(--library-inset,16px);overscroll-behavior-x:contain}
.cd-card-rail>.cm-pass{flex:0 0 300px;width:300px;max-width:calc(var(--library-viewport-width,100vw) - 44px);height:auto;scroll-snap-align:start}
.cm-pass-title{min-height:58px;margin:14px 0 12px;font-size:24px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cm-pass .cm-quantity{margin-bottom:12px}.cm-pass .cm-quantity strong{font-size:56px}
.cm-pass .cm-saving{margin-bottom:14px}
.cm-group-title{font-size:26px;margin:12px 0 14px}
.cm-group .cm-seats{margin-bottom:12px}.cm-group .cm-waiting{margin-bottom:12px}
.cm-group .grp-note{margin:0;padding:0;background:none;border:0;font-size:12px;line-height:1.6}
.gs-card.cm-group .gs-facts{margin:10px 0 14px;display:grid;gap:9px}
.gs-card.cm-group .gs-fact{padding:0;border:0;display:flex;justify-content:space-between;gap:12px;font-size:12px}
.gs-card.cm-group .gs-fv{font-size:12px;text-align:right;min-width:0;overflow-wrap:anywhere}
.gs-card.cm-group .gs-steps{margin:0 0 8px;gap:4px;flex-wrap:wrap;padding:0;border:0}
.gs-card.cm-group .gs-step{font-size:10px}
.cm-group .grp-btn{min-height:40px;font-size:12px}
button.is-off,button:disabled{cursor:default}
.tf-save-sm:disabled,.tf-save:disabled,.uc-note .btn-add:disabled,.ov-note-inline .btn-add:disabled,.uc-save:disabled{opacity:.4;box-shadow:none;filter:grayscale(.25)}
.tk-ai{border:1px solid var(--line2);background:var(--panel);border-radius:14px;margin:14px 0 22px}
.tk-ai summary{display:flex;gap:12px;align-items:center;list-style:none;padding:16px;cursor:pointer;color:var(--ever);font:600 14px var(--sans)}
.tk-ai summary::-webkit-details-marker{display:none}.tk-ai summary small{display:block;font:400 12px var(--sans);margin-top:4px;color:var(--muted)}
.tk-ai-mark{background:var(--ever);color:#eadab2;border-radius:10px;width:38px;height:38px;display:grid;place-items:center;font-size:23px}
.tk-ai-chevron{margin-left:auto}.tk-ai[open] .tk-ai-chevron{transform:rotate(180deg)}
.tk-ai-body{padding:0 16px 16px}.tk-ai-body>label{display:grid;gap:6px;margin:0 0 14px;font:500 12px var(--sans);color:var(--ink)}
.tk-ai-options{display:grid;grid-template-columns:1fr 90px 1fr;gap:12px}.tk-ai-options label{display:grid;gap:6px;min-width:0;font:500 12px var(--sans)}
.tk-ai-muted,.tk-ai-hint{font:400 12px/1.6 var(--sans);color:var(--muted)}
.tk-ai-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.tk-ai-status{flex:1;font:400 12px/1.5 var(--sans);color:var(--ever)}.tk-ai-status.error{color:#9b4337}
@media(max-width:600px){
 .cd-card-rail>.cm-pass{flex-basis:270px;width:270px;padding:16px}
 .cm-pass-title{font-size:21px;min-height:50px;margin:10px 0 8px}
 .cm-pass .cm-quantity{margin-bottom:8px;gap:10px}.cm-pass .cm-quantity strong{font-size:44px}
 .cm-pass .cm-perforation{margin:4px -16px 12px}.cm-pass .cm-price strong{font-size:25px}
 .cm-pass .cm-saving{font-size:10px;margin:7px 0 12px}.cm-pass .cm-price>span{font-size:10px}
 .cm-pass .cm-quantity>span{font-size:11px;line-height:1.45}
 .cm-edit-fields input,.tk-ai input,.tk-ai textarea,.tk-ai select{font-size:16px}
 .tk-ai-options{grid-template-columns:1fr 85px}.tk-ai-options label:last-child{grid-column:1 / -1}
 .tk-ai-status{flex-basis:100%}.cm-group-title{font-size:23px}
}

.cm-pass,.cm-group{flex-wrap:nowrap}

/* One card system in both roles, with a larger group hierarchy. */
#grpBlock .grp-list,.cm-student-groups{grid-template-columns:repeat(auto-fit,minmax(min(100%,390px),560px));gap:22px}
.grp-card.cm-group{padding:26px 28px;border-radius:18px}
.cm-group-title{font-size:31px;line-height:1.2;margin:16px 0 20px}
.cm-group .cm-eyebrow,.cm-group .grp-badge{font-size:12px}
.cm-group .cm-person{width:46px;height:46px;font-size:13px}
.cm-group .cm-confirm b{font-size:29px}.cm-group .cm-confirm>span{font-size:14px}
.cm-group .cm-track{margin:12px 0 14px}.cm-group .cm-track i{height:5px}
.cm-group .cm-waiting,.cm-group .cm-description,.cm-group .grp-money,.cm-group .grp-note{font-size:14px;line-height:1.65}
.cm-group .grp-btn{font-size:14px;min-height:44px;padding:9px 12px}
.gs-card.cm-group .gs-fact,.gs-card.cm-group .gs-fv{font-size:14px}.gs-card.cm-group .gs-step{font-size:12px}
.cd-card-rail.ma-grid,.cd-card-rail.tk-grid{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;max-width:none}
.tk-vbadge.partial{background:#efe6d0;color:#7b6130}
.hw-math-preview{margin:8px 0 12px;padding:11px 14px;background:#f6f4ed;border-radius:9px;line-height:1.7;font:400 14px/1.7 var(--sans);overflow-x:auto;max-width:100%;min-width:0}
.hw-math-preview[hidden]{display:none}
.tk-optrow:has(.hw-math-preview:not([hidden])){flex-wrap:wrap}
.tk-optrow>.hw-math-preview{flex-basis:100%;margin:0 0 6px 32px}
.tk-take-qtext,.tk-rqtext,.tk-preview-option,.tk-ansval,.tk-anscor{min-width:0;overflow-wrap:anywhere}
.katex{font-size:1.12em}.katex-display{max-width:100%;overflow-x:auto;overflow-y:hidden;padding:5px 0}
.tk-ai-photo{margin:0 0 16px;padding:12px;border:1px dashed #c9c7b7;border-radius:11px}
.tk-ai-photo-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.tk-ai-photo-actions button{min-height:40px;font-size:12px}
.tk-ai-photo img{display:block;max-width:100%;max-height:180px;border-radius:8px;margin-bottom:10px;object-fit:contain}
.tk-ai-photo p{font:400 12px/1.6 var(--sans);color:var(--muted);margin:8px 0 0}
.tk-ai-camera{display:none}
@media(pointer:coarse){.tk-ai-camera{display:inline-flex}}
@media(max-width:600px){
 #grpBlock .grp-list,.cm-student-groups{grid-template-columns:minmax(0,1fr)}
 .grp-card.cm-group{padding:22px 20px}.cm-group-title{font-size:27px;margin:14px 0 18px}
 .cm-group .cm-person{width:42px;height:42px}.cm-group .cm-confirm b{font-size:27px}
 .cm-group .grp-btn{flex-basis:calc(50% - 8px)}
}


/* ------------------------------------------------------------------ */
/* Мелкие правки телефонной раскладки                                  */
/* ------------------------------------------------------------------ */

/* Кегль серой подсказки в поле. Сам кегль ввода на телефоне обязан быть
   16px: меньше — и iOS приближает страницу, как только ставишь курсор.
   Но подсказка от этого выходила крупнее подписи над полем и занимала
   поле целиком. Уменьшаем только её. */
@media(max-width:600px){
  input::placeholder,textarea::placeholder{font-size:13px;opacity:1}
  input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{font-size:13px}
}

/* «Снять фото» и соседи: под pointer:coarse кнопка становится flex-
   контейнером, и без align-items текст прижимался к верхнему краю —
   на 12 пикселей выше середины кнопки. display здесь НЕ трогаем: им
   .tk-ai-camera прячется на компьютере, где камеры нет. */
.tk-ai-photo-actions>button,.tk-qattachrow>button{
  align-items:center;justify-content:center;text-align:center}


/* ================================================================== */
/* Правки 23 сентября                                                 */
/* ================================================================== */

/* --- Прокрутка на Android ---
   overflow-x:hidden сразу у html и у body делает body отдельной
   прокручиваемой областью. Chrome на iPhone и ПК это прощает, а браузеры
   на Android (Яндекс, Samsung) — нет: касание уходит в body, которому
   листать нечего, и страница стоит. clip режет то же самое по краю, но
   прокручиваемой области не создаёт. */
@media (max-width:880px){
  html,body{overflow-x:clip}
}
@supports not (overflow-x:clip){
  @media (max-width:880px){ html{overflow-x:visible} body{overflow-x:hidden} }
}

/* --- Задание на весь экран: сверху вырез камеры ---
   Шапка кабинета здесь спрятана, а отступ под часы и вырез держала именно
   она. Без него заголовок задания заезжал под время и батарею. */
@media (max-width:820px){
  body.hw-full .dash-main{padding-top:calc(14px + env(safe-area-inset-top))}
}

/* --- Шапка задания у ученика на телефоне ---
   Длинное название («9 класс, ОГЭ, задание 15 — Углы, треугольники…»)
   сжималось между стрелкой и таймером в столбик шириной в ладонь и
   вырастало на семь строк крупным шрифтом. Теперь стрелка и таймер —
   одной строкой сверху, название под ними во всю ширину, мельче, и не
   длиннее трёх строк (целиком — в подсказке при нажатии). */
@media (max-width:760px){
  .tk-bhead.tk-bhead-take{display:grid;grid-template-columns:auto 1fr auto;
    grid-template-areas:"back . timer" "title title title";align-items:center;gap:12px 10px}
  .tk-bhead-take>.tk-back{grid-area:back}
  .tk-bhead-take>.take-timer{grid-area:timer;align-self:center}
  .tk-bhead-take>div{grid-area:title;min-width:0}
  .tk-bhead-take .tk-bh1{font-size:19px;line-height:1.28;overflow-wrap:anywhere;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .tk-bhead-take .tk-bsub{margin-top:6px}
}

/* --- Вкладки «Активные · На проверке · Архив» на телефоне ---
   Не помещались в ширину и листались вбок: «Архив» уходил за край.
   Делим строку поровну и чуть уменьшаем шрифт. */
@media (max-width:760px){
  .tk-tabrow .tk-tabs,.tk-tabs{width:100%;max-width:100%;overflow-x:visible;box-sizing:border-box}
  .tk-tabs .tk-tab{flex:1 1 auto;justify-content:center;gap:5px;min-width:0;
    padding:10px 6px;font-size:clamp(11.5px,3.4vw,13px)}
  .tk-tabs .tk-tabc{min-width:18px;height:18px;padding:0 4px;font-size:10.5px}
}

/* --- Переписка на телефоне ---
   Тред лежал поверх списка чатов «по его высоте»: при длинном списке
   поле ввода оказывалось в самом низу, под всеми чатами, а при коротком
   переписке не хватало места. Теперь открытый диалог — во весь экран,
   как в мессенджере: сверху «с кем», снизу поле ввода. */
@media (max-width:820px){
  .ch-threadcol{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;height:auto;overscroll-behavior:contain}
  .ch-threadcol .ch-thead{padding-top:calc(11px + env(safe-area-inset-top))}
  .ch-threadcol .ch-scroll{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  body.kbd-open .ch-threadcol{top:var(--vvtop,0px);bottom:var(--kbd);z-index:90}
}

/* --- Задание открывается сдвигом: после въезда transform не держим --- */
.tk-bwrap.tk-enter{animation-fill-mode:backwards}

/* --- Прогресс: длинное название работы ---
   Одна длинная строка распирала сетку шире экрана, и уезжали за край и
   баллы, и соседняя карточка «Разбивка результатов». */
.prog-info{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:920px){ .prog-info{grid-template-columns:minmax(0,1fr)} }
.prog-side-card,.prog-recent-row{min-width:0}
.prog-recent-t{white-space:normal;overflow-wrap:anywhere;line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.prog-score{flex-shrink:0}
@media (max-width:560px){ .prog-recent-t{font-size:13px} }

/* --- Вопросы в задании у репетитора на телефоне ---
   Метки «Верно / Ошибка / проверьте» стояли колонкой справа и отнимали
   у условия треть ширины. На узком экране они встают под условие. */
@media (max-width:560px){
  .tk-rqhead{flex-wrap:wrap}
  .tk-rqtags{order:3;flex-basis:100%;flex-direction:row;justify-content:flex-start;
    align-items:center;padding-left:34px}
  .tk-rqtags:empty{display:none}
}
.tk-rqtags:empty{display:none}

/* --- Программа в условии ---
   Код держит отступы и не переносится по словам; длинная строка
   листается вбок внутри своей рамки, а не растягивает страницу. */
.tk-take-qtext .hw-code,.tk-rqtext .hw-code{margin:10px 0 4px;max-width:100%;overflow-x:auto;
  white-space:pre;tab-size:4;font:13.5px/1.55 ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;
  -webkit-overflow-scrolling:touch}
.tk-mbody .tk-rqtext .hw-code{white-space:pre;word-break:normal}
/* Верхнее меню на ноутбуках (861–1799 px) не помещалось и молча обрезалось:
   «Задания», «Оплаты», «Тарифы» пропадали за краем без прокрутки. Здесь у
   пунктов остаются только значки (подпись — во всплывающей подсказке), а у
   открытого раздела — значок с подписью. */
@media (min-width:861px) and (max-width:1799px){
  #navLinks a:not(.active)>span:not(.nav-icon){display:none}
  #navLinks a{padding:8px 9px}
}
@media (min-width:861px) and (max-width:1279px){
  /* справа оставляем только значки: подпись «Профиль заполнен…», имя и «Выйти» словом не помещаются */
  .prof-chip-tx,.user-tx,#navLogout .exit-tx{display:none}
  #navLogout{width:40px;height:40px;padding:0;display:inline-flex;align-items:center;justify-content:center}
  #navLogout .exit-ic{display:inline-flex}
  .prof-chip{padding:5px}
  .brand-tx i{display:none}
}
@media (min-width:861px) and (max-width:1120px){
  #navLinks a>span:not(.nav-icon){display:none}
  .brand-tx{display:none}
}