/* cat-css - Learning areas and the category pages: grade-band chips, per-area accents. */

/* Learning areas keeps its pink accent, drawn the same way as the active-page marker so the
   two never read as a stray bracket hanging in the sidebar gutter. */
.side button[data-go=cats]:not([aria-current=page]):before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:99px;background:#ec4899}
.chp{display:inline-block;padding:1px 7px;border-radius:11px;font-size:11px;font-weight:700;color:#fff}
.cg-EE{background:#15803d}.cg-ME{background:#2563eb}.cg-AE{background:#d97706}.cg-BE{background:#b91c1c}
input.bad{border-color:var(--er)!important;background:var(--erb)!important}
.cxh{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 12px}.cxh b{font-size:16px;flex:1;min-width:200px}
.cxbar{display:flex;height:22px;border-radius:6px;overflow:hidden;border:1px solid var(--bd);margin:4px 0}.cxbar div{color:#fff;font-size:11px;font-weight:700;text-align:center;line-height:22px}
.cxsel td{background:var(--okb)}
.cvs{overflow-x:auto;display:grid;gap:12px;justify-items:start}
.rs.catp{height:296mm;min-height:0;display:flex;flex-direction:column;overflow:hidden;position:relative;padding:14mm 10mm 12mm;font-family:Arial,Helvetica,sans-serif;border:1px solid #cfd8d3;flex:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.rs.catp:before,.rs.catp:after{content:"";position:absolute;left:0;right:0;background:linear-gradient(90deg,#14181c 0 33%,#bb1a1a 33% 66%,#0a7d3b 66%)}.rs.catp:before{top:0;height:3mm}.rs.catp:after{bottom:0;height:2.5mm}
.catp .ct-h{display:flex;align-items:center;gap:9px;border-bottom:3px solid #0f5132;border-image:linear-gradient(90deg,#14181c,#bb1a1a,#0a7d3b) 1;padding-bottom:6px}
.catp .ct-h img{max-width:52px;max-height:52px;object-fit:contain}.catp .ht{flex:1;text-align:center}
.catp .s1{font-size:15px;font-weight:800;color:#0f5132;text-transform:uppercase;letter-spacing:.5px}
.catp .s2{font-size:11.5px;font-weight:700;text-transform:uppercase;margin-top:2px}.catp .s3{font-size:9.5px;font-style:italic;margin-top:2px}
.catp .ct-m{display:grid;grid-template-columns:repeat(4,1fr);gap:1px 8px;margin:6px 0;font-size:11px}
.catp .ct-m b{display:block;font-size:9.5px;letter-spacing:.06em;color:#555;text-transform:uppercase}
.catp .ct-m span{border-bottom:1px dotted #999;display:block;padding:0 2px;min-height:15px}
.rs .ct-t{width:100%;border-collapse:collapse;margin:0}
.rs .ct-t th,.rs .ct-t td{border:1px solid #444;padding:4.5px 4px;font-size:10px;color:#000;text-align:left}
.rs .ct-t th{background:#d9e8df;text-align:center;font-size:8.5px;line-height:1.2;text-transform:uppercase}
.rs .ct-t td.c{text-align:center}
.catp .ct-g{display:flex;gap:30px;margin-top:auto;padding-top:10px}.catp .ct-g>div{flex:1;text-align:center}
.catp .sn{font-size:11px;font-weight:700;color:#0a6b3a;min-height:14px}.catp .sbx{height:34px;border-bottom:1px solid #666;display:flex;align-items:flex-end;justify-content:center}
.catp .sbx img{max-height:32px;max-width:90%}.catp .scap{font-size:9px;color:#555;margin-top:2px}
.catp .ct-f{display:flex;justify-content:space-between;font-size:8px;font-weight:700;color:#0a6b3a;margin-top:auto;padding-top:8px}
@media print{.rs.catp{border:0;width:210mm}}
.dlg.cvd{background:#d1d5db;padding:10px;width:min(850px,100%)}.cvb{display:flex;gap:8px;justify-content:flex-end;position:sticky;top:0;z-index:3;margin:0 0 10px}.cvs{justify-items:center}
.card .chp{color:#fff}
.cxc{position:relative;padding:0;overflow:hidden}.cxc>*:not(.cxtop){margin-left:18px;margin-right:18px}.cxc>.tw{margin-bottom:6px}
.cxc:before{content:"";display:block;height:5px;background:linear-gradient(90deg,#14181c 0 33%,#bb1a1a 33% 66%,#0a7d3b 66%)}
.cxtop{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:14px 18px 4px}
.cxt{font-size:17px;font-weight:700;color:#0f5132}:root[data-theme=dark] .cxt{color:var(--ac)}
.cxm{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.cxm span{background:var(--okb);color:var(--ok);border-radius:99px;padding:2px 10px;font-size:12px;font-weight:600}
.cxx{all:unset;cursor:pointer;width:30px;height:30px;border-radius:50%;text-align:center;line-height:30px;color:var(--mu);font-size:15px}.cxx:hover{background:var(--erb);color:var(--er)}.cxx:focus-visible{outline:3px solid var(--ac)}
.cxtb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 0 12px;margin-bottom:12px;border-bottom:1px solid var(--bd)}.cxsp{flex:1}
.cxstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.cxs{border:1px solid var(--bd);border-left:4px solid var(--ac);border-radius:10px;padding:10px 14px;background:var(--sf)}
.cxs i{display:block;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mu)}
.cxs b{display:block;font-size:26px;line-height:1.2;margin:2px 0}.cxs b small{font-size:14px;color:var(--mu);font-weight:600}
.cxs em{font-style:normal;color:var(--mu);font-size:12.5px}.cxs em .chp{margin-right:4px}
.cxbar{margin-top:10px}.cxlg{display:flex;flex-wrap:wrap;gap:14px;font-size:12px;color:var(--mu);margin:4px 0 14px}.cxlg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px}
.cxc table th{background:#d9e8df;color:#0f5132;position:sticky;top:0}:root[data-theme=dark] .cxc table th{background:#12301f;color:var(--ok)}
.cxc tbody tr:nth-child(even) td{background:rgba(15,138,126,.05)}.cxc td input{padding:5px 8px}.cxc td input.tx{min-width:170px}
.cxc .crumb:last-child{margin:10px 18px 16px}
.cxsum{display:flex;flex-wrap:wrap;border:1px solid var(--bd);border-radius:6px;background:var(--sf)}
.cxsum>div{flex:1 1 170px;padding:7px 12px;border-right:1px solid var(--bd);min-width:0}.cxsum>div:last-child{border-right:0}
.cxsum i{display:block;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--mu)}
.cxsum b{display:block;font-size:15px;line-height:1.3}.cxsum em{display:block;font-style:normal;font-size:11.5px;color:var(--mu)}
.cxbar{height:14px;border-radius:4px}.cxbar div{font-size:10px;line-height:14px}.cxlg{font-size:11px;margin:5px 0 12px}
:root[data-theme=dark]{--bg:#131315;--sf:#1d1d21;--tx:#f0efe9;--mu:#a09d94;--bd:#33333a;--pri:#ffc94a;--pt:#17140a;--ac:#d4a017;--ok:#7fd9a6;--okb:#12301f;--wn:#f2c15a;--wnb:#33280d;--er:#ff9d9d;--erb:#3a1818;--in:#9cc3f5;--inb:#162841;color-scheme:dark}
:root[data-theme=light]{color-scheme:light}
.thm{all:unset;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;border:1px solid var(--bd);background:var(--sf);color:var(--tx)}
.thm:hover{background:var(--bg)}.thm:focus-visible{outline:3px solid var(--ac);outline-offset:2px}
#login>.thm{position:fixed;top:14px;right:14px;z-index:41}
.qacard{--pu1:#f0b400;--pu3:#8a5c00;--pu-ink:#3d2f00;--pu-soft:#fdf6e0;--pu-line:#f0e6c8;margin-bottom:16px}
:root[data-theme=dark] .qacard{--pu1:#9a8dff;--pu3:#b9b0ff;--pu-ink:#e2deff;--pu-soft:#221f3d;--pu-line:#3a3566}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .qacard{--pu1:#9a8dff;--pu3:#b9b0ff;--pu-ink:#e2deff;--pu-soft:#221f3d;--pu-line:#3a3566}}
.qh{margin:0 0 10px;font-size:15px}
.qa{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.qa button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:14px 10px;text-align:center;font-size:13px;font-weight:700;color:var(--pu-ink);background:var(--pu-soft);border:1px solid var(--pu-line);border-left:4px solid var(--pu1);border-radius:14px;transition:transform .18s,box-shadow .18s,background .18s}
.qa button span{font-size:22px;line-height:1.2}
.qa button:hover{background:linear-gradient(135deg,#ffc21f,#ffd45c);color:#1c1f24;border-color:transparent;transform:translateY(-3px);box-shadow:0 10px 20px rgba(240,180,0,.28)}
.qa button:focus-visible{outline:3px solid var(--pu1);outline-offset:2px}
.lsearch{margin-top:14px;padding-top:12px;border-top:1px dashed var(--pu-line)}
.lsearch label{display:block;font-size:12.5px;font-weight:700;color:var(--pu3);margin-bottom:6px}
.lsearch input{width:100%;padding:10px 14px;border:1px solid var(--pu-line);border-radius:10px;font-size:14px;background:var(--sf)}
.lsearch input:focus{outline:0;border-color:var(--pu1);box-shadow:0 0 0 3px rgba(123,108,240,.2)}
html{-webkit-text-size-adjust:100%}.tw{-webkit-overflow-scrolling:touch}img{max-width:100%}
@media (max-width:800px){.top{padding:8px 12px}.top .sch{flex:1}h1{font-size:18px}.side{position:sticky;top:0;z-index:20}}
@media (max-width:640px){
 .cxtop{padding:12px 14px 4px}.cxc>*:not(.cxtop){margin-left:14px;margin-right:14px}.cxtb .btn{flex:1 1 auto}.cxsp{display:none}
 .cxsum>div{flex-basis:100%;border-right:0;border-bottom:1px solid var(--bd)}.cxsum>div:last-child{border-bottom:0}
 .cxh .btn,.cxh select{flex:1 1 auto;width:auto}.qa{grid-template-columns:repeat(2,1fr)}
 .dlg{padding:14px}.dlg.cvd{padding:8px}.cxc td input.tx{min-width:150px}
 input,select,textarea{font-size:16px}}
@media (pointer:coarse){.btn,.thm{min-height:40px}.btn.sm{min-height:36px}.qa button{min-height:64px}}
.cxc .tw table{min-width:700px}.cxc td input[type=number]{width:76px;min-width:76px;max-width:none}