/* NC AIA LEAP - staff screens. BUILT FILE: made from the Apps Script project's StaffPage.html.
   Change StaffPage.html, then rebuild, so both copies stay the same. */
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:#F6F4F1;color:#2B2B2D;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-size:15px;}
button,input,select,textarea{font-family:inherit;font-size:15px;color:#2B2B2D;}
button{cursor:pointer;}
a{color:#336672;}
.wrap{max-width:680px;margin:0 auto;padding:0 12px 120px;}
.top{position:sticky;top:0;z-index:5;background:#3A3A3C;color:#fff;padding:12px 14px 10px;}
.top .row{max-width:680px;margin:0 auto;display:flex;align-items:center;gap:10px;}
.top h1{margin:0;font-size:21px;font-weight:800;letter-spacing:-0.2px;flex:1 1 auto;}
.who{font-size:12px;color:#D9D6D0;text-align:right;}
.tabs{max-width:680px;margin:10px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;background:#2B2B2D;border-radius:12px;padding:4px;}
.tabs button{height:40px;border:0;border-radius:9px;background:transparent;color:#D9D6D0;font-weight:700;}
.tabs button.on{background:#fff;color:#2B2B2D;}
html.in-tr .top{padding-top:8px;}
.seg{display:grid;gap:4px;background:#E8E4DE;padding:4px;border-radius:12px;}
.seg button{height:42px;border:0;border-radius:9px;background:transparent;color:#5C5C60;font-weight:700;font-size:14px;}
.seg button.on{background:#fff;color:#2B2B2D;}
.card{background:#fff;border:1px solid #E6E2DC;border-radius:14px;padding:12px;}
.stack{display:flex;flex-direction:column;gap:12px;margin-top:12px;}
.muted{color:#5C5C60;font-size:13px;}
.small{font-size:12px;}
.label{font-size:13px;font-weight:700;margin-bottom:4px;display:block;}
.sect{font-size:12px;font-weight:800;letter-spacing:0.6px;color:#5C5C60;margin:6px 2px 0;}
.inp{width:100%;height:44px;border:1px solid #CFC9C1;border-radius:10px;padding:0 12px;background:#fff;}
textarea.inp{height:auto;padding:10px 12px;resize:vertical;line-height:1.4;}
select.inp{padding:0 8px;}
.inp:focus,.tf input:focus{outline:2px solid #2D7D9A;outline-offset:1px;}
.btn{height:46px;border:0;border-radius:12px;background:#336672;color:#fff;font-weight:700;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;}
.btn.ghost{background:#fff;color:#336672;border:1.5px solid #336672;}
.btn.quiet{background:#fff;color:#3A3A3C;border:1.5px solid #CFC9C1;}
.btn.small{height:38px;font-size:13px;border-radius:10px;padding:0 12px;}
.btn.danger{background:#fff;color:#9A2218;border:1.5px solid #E2B4AF;}
.btn[disabled]{opacity:0.7;cursor:default;}
.chip{height:38px;padding:0 14px;border-radius:19px;border:1.5px solid #CFC9C1;background:#fff;color:#3A3A3C;font-weight:700;font-size:14px;}
.chip.on{background:#336672;border-color:#336672;color:#fff;}
.tag{display:inline-block;font-size:11px;font-weight:800;padding:3px 7px;border-radius:6px;}
.g-SOAR{background:#66CCE3;color:#10343D;}
.g-SPARK{background:#F5D62B;color:#3D3300;}
.med{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:11px;background:#FCE4E2;color:#9A2218;font-weight:800;font-size:14px;}
@keyframes spin{to{transform:rotate(360deg);}}
.spin{display:inline-block;width:16px;height:16px;border-radius:50%;border:2.5px solid rgba(255,255,255,0.35);border-top-color:#fff;animation:spin 0.8s linear infinite;}
.spin.dk{border-color:rgba(51,102,114,0.25);border-top-color:#336672;}
.loading{display:flex;align-items:center;justify-content:center;gap:10px;padding:40px 0;color:#5C5C60;font-weight:600;}
.err{background:#FCE4E2;color:#7A1B13;border-radius:12px;padding:10px 12px;font-size:14px;font-weight:600;margin-top:12px;}
.ok{background:#E3F5EA;color:#0E5E2F;border-radius:12px;padding:10px 12px;font-size:14px;font-weight:600;margin-top:12px;}
.kid{display:flex;flex-direction:column;gap:10px;}
.kid .head{display:flex;align-items:center;gap:10px;}
.kid .nm{flex:1 1 auto;min-width:0;}
.kid .nm b{font-size:16px;}
.marks{display:flex;gap:4px;flex:0 0 auto;}
.mk{width:44px;height:44px;border-radius:10px;border:1.5px solid #D8D3CC;background:#fff;color:#5C5C60;font-weight:800;font-size:15px;}
.mk.P.on{background:#18A850;border-color:#128A41;color:#fff;}
.mk.L.on{background:#F5D62B;border-color:#C9AE10;color:#2B2B2D;}
.mk.E.on{background:#66CCE3;border-color:#3FA9C4;color:#10343D;}
.mk.A.on{background:#C8281C;border-color:#A3241A;color:#fff;}
.detail{display:flex;flex-direction:column;gap:8px;border-top:1px solid #EFECE7;padding-top:10px;}
.reasons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;}
.reasons button{height:40px;border-radius:10px;border:1.5px solid #CFC9C1;background:#fff;font-weight:700;font-size:13px;}
.reasons button.on{background:#336672;border-color:#336672;color:#fff;}
.check{display:flex;align-items:center;gap:10px;min-height:36px;font-size:14px;cursor:pointer;}
.check input{width:20px;height:20px;accent-color:#336672;}
.tf{position:relative;}
.tf .box{display:flex;border:1px solid #CFC9C1;border-radius:10px;overflow:hidden;background:#fff;}
.tf input{flex:1 1 auto;min-width:0;height:42px;border:0;padding:0 10px;}
.tf .tog{width:44px;border:0;border-left:1px solid #E6E2DC;background:#F6F4F1;}
.tf .list{display:none;margin-top:4px;border:1px solid #CFC9C1;border-radius:10px;background:#fff;max-height:198px;overflow-y:auto;}
.tf.open .list{display:block;}
.tf .list button{display:block;width:100%;min-height:44px;border:0;border-bottom:1px solid #F1EEEA;background:#fff;text-align:left;padding:0 12px;}
.tf .list button.on{background:#E7F1F3;font-weight:700;}
.bar{position:fixed;left:0;right:0;bottom:0;z-index:6;background:#fff;border-top:1px solid #E6E2DC;padding:10px 12px 14px;}
.bar .row{max-width:680px;margin:0 auto;display:flex;align-items:center;gap:10px;}
.bar .msg{flex:1 1 auto;font-size:13px;font-weight:700;color:#5C5C60;}
.bar .msg.dirty{color:#7A5D00;}
.bar .msg.good{color:#0E5E2F;}
.rrow{width:100%;min-height:62px;border:0;border-bottom:1px solid #EFECE7;background:#fff;display:flex;align-items:center;gap:10px;padding:10px 12px;text-align:left;}
.rrow.off{background:#F6F4F1;}
.rrow .nm{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;}
.list0{background:#fff;border:1px solid #E6E2DC;border-radius:14px;overflow:hidden;}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;}
.stats div{border-radius:10px;padding:6px 8px;display:flex;flex-direction:column;}
.stats b{font-size:18px;}
.stats span{font-size:11px;font-weight:700;}
.s1{background:#E3F5EA;color:#0E5E2F;}.s2{background:#FBF3C8;color:#5E4E00;}.s3{background:#FCE4E2;color:#9A2218;}.s4{background:#F1EEEA;color:#3A3A3C;}
.mednote{background:#FCE4E2;color:#7A1B13;border-radius:10px;padding:8px 10px;font-size:13px;line-height:1.4;}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.erow{width:100%;border:0;border-bottom:1px solid #EFECE7;background:#fff;display:flex;align-items:center;gap:12px;padding:10px 12px;text-align:left;min-height:60px;}
.dt{width:50px;flex:0 0 auto;border-radius:10px;background:#F1EEEA;color:#3A3A3C;display:flex;flex-direction:column;align-items:center;padding:5px 0;}
.dt.ev{background:#EF4133;color:#fff;}
.dt b{font-size:19px;line-height:1.1;}
.dt span{font-size:11px;font-weight:700;}
.shade{position:fixed;inset:0;z-index:20;background:rgba(30,30,32,0.45);display:flex;align-items:flex-end;justify-content:center;}
.sheet{background:#fff;width:100%;max-width:680px;border-radius:20px 20px 0 0;padding:16px 16px 24px;max-height:92vh;overflow-y:auto;display:flex;flex-direction:column;gap:12px;}
.sheet h2{margin:0;font-size:19px;flex:1 1 auto;}
.x{width:44px;height:44px;border:0;border-radius:22px;background:#F1EEEA;font-size:20px;line-height:1;}
.preview{background:#fff;border:1px solid #E6E2DC;border-radius:16px;padding:14px;display:flex;gap:14px;}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}