:root{--navy:#071a4d;--navy2:#0d2b68;--blue:#1674d1;--blue2:#0b5db5;--gold:#f7b928;--red:#e9553e;--green:#159657;--yellow:#d79b00;--bg:#f3f6fb;--ink:#182641;--muted:#71809a;--line:#dfe7f2;--white:#fff;--shadow:0 14px 40px rgba(18,44,88,.09)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"Segoe UI","Nirmala UI","Noto Sans Devanagari",Arial,sans-serif;background:var(--bg);color:var(--ink)}button,input,textarea,select{font:inherit}a{color:inherit}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:10px;padding:10px 15px;text-decoration:none;background:#e9eff7;color:#24395d;font-weight:800;cursor:pointer;transition:.18s}.btn:hover{transform:translateY(-1px);filter:brightness(.98)}.btn.primary{background:linear-gradient(135deg,#1475d2,#0b5bb4);color:#fff;box-shadow:0 7px 18px #0d66c226}.btn.save{background:linear-gradient(135deg,#159b5a,#0d7d45);color:#fff}.btn.danger{background:#fff0ee;color:#b33a2d}.btn.ghost{background:transparent;color:inherit;border:1px solid #cbd7e7}.btn.top-light{background:#ffffff14;color:#fff;border:1px solid #ffffff38}.btn.small{padding:7px 10px;font-size:12px}.btn.wide{width:100%}.save-large{padding:12px 18px;font-size:14px}
.toast-wrap{position:fixed;top:16px;right:16px;z-index:999;max-width:520px}.toast{padding:13px 17px;border-radius:12px;margin-bottom:9px;background:#183563;color:#fff;box-shadow:0 10px 30px #001c4430}.toast.success{background:#147c47}.toast.error{background:#ad3328}.toast.warning{background:#a87100}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 20% 10%,#2b8be033,transparent 35%),linear-gradient(135deg,#061744,#116bc1)}.login-card{width:min(440px,94vw);background:#fff;border-radius:26px;padding:38px;box-shadow:0 30px 90px #001d5550}.brand-mini{color:#ed543d;font-size:26px;font-weight:900;display:flex;gap:10px;align-items:center}.login-card h1{margin:18px 0 3px}.login-card p{color:#687693}.login-card label,.form-card label{display:grid;gap:7px;font-weight:800;margin:14px 0}.login-card input,.form-card input,.form-card select,.form-card textarea{width:100%;padding:12px 13px;border:1px solid #cbd7e8;border-radius:10px;background:#fff;outline:none;transition:.18s}.login-card input:focus,.form-card input:focus,.form-card select:focus,.form-card textarea:focus{border-color:#2a7fd6;box-shadow:0 0 0 3px #2a7fd618}
.admin-shell{min-height:100vh}.admin-top{min-height:76px;background:linear-gradient(110deg,var(--navy),var(--navy2));color:#fff;display:flex;justify-content:space-between;align-items:center;padding:10px 25px;gap:15px;box-shadow:0 4px 20px #001f4a25}.brand-block{display:flex;align-items:center;gap:11px;min-width:0}.brand-mark{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--gold),#ffe59a);color:#14255a;font-weight:1000;font-size:21px;box-shadow:0 6px 18px #0002}.admin-top strong{font-size:19px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-top span{font-size:12px;opacity:.8;display:block;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.admin-grid{display:grid;grid-template-columns:245px 1fr;min-height:calc(100vh - 76px)}.sidebar{background:#fff;padding:18px 14px;border-right:1px solid #dfe6f0;box-shadow:4px 0 20px #16365d07}.sidebar-title{font-size:10px;letter-spacing:1.4px;color:#9aa6b9;font-weight:900;padding:7px 12px 9px}.sidebar a{display:flex;align-items:center;gap:10px;padding:12px 13px;margin:4px 0;border-radius:11px;text-decoration:none;color:#30425f;font-weight:800;transition:.18s}.sidebar a:hover{background:#f0f6ff;color:#0b64bd;transform:translateX(2px)}.sidebar a.active{background:linear-gradient(90deg,#e7f2ff,#f5f9ff);color:#0b61b7;box-shadow:inset 3px 0 #1674d1}
.page-wrap{width:100%}.admin-main{padding:27px;max-width:1500px;margin:auto}.welcome-card{display:flex;justify-content:space-between;align-items:center;gap:20px;background:linear-gradient(120deg,#fff,#f6faff);border:1px solid #e0e8f3;border-radius:20px;padding:24px 26px;box-shadow:var(--shadow);margin-bottom:18px}.welcome-card h1,.page-title-row h1{margin:3px 0 5px;font-size:28px}.welcome-card p,.page-title-row p{margin:0;color:var(--muted)}.eyebrow{font-size:10px;letter-spacing:1.5px;color:#3976b5;font-weight:1000}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:25px}.stat-card{background:#fff;padding:18px 20px;border-radius:17px;box-shadow:var(--shadow);display:flex;align-items:center;gap:14px;border:1px solid #e5ebf4}.stat-card b{font-size:30px;display:block}.stat-card div span{color:#6a7891;font-weight:700}.stat-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:21px;font-weight:1000}.stat-icon.blue{background:#e7f2ff;color:#0d67c2}.stat-icon.green{background:#e7f8ef;color:#138049}.stat-icon.yellow{background:#fff5d8;color:#9b6d00}.section-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:10px 0 13px}.section-head h2{margin:0}.section-head p{margin:3px 0 0}.muted{color:var(--muted);font-size:13px}.head-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.table-card{background:#fff;border-radius:17px;overflow:hidden;box-shadow:var(--shadow);border:1px solid #e2e9f3}.table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px;border-bottom:1px solid #e8edf5;background:#fbfcfe}.table-toolbar input{width:min(440px,100%);padding:11px 13px;border:1px solid #d2dce9;border-radius:10px;outline:none}.table-toolbar span{font-size:12px;color:#8490a4}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;min-width:760px}th,td{padding:13px 15px;border-bottom:1px solid #e8edf5;text-align:left}th{background:#f8fafc;color:#5f6d83;font-size:12px;text-transform:uppercase;letter-spacing:.5px}tbody tr:hover{background:#fbfdff}.pos-badge{background:#eaf2ff;color:#0c63b8;padding:5px 9px;border-radius:99px;font-weight:900}.actions{display:flex;gap:6px}.table-person{display:flex;align-items:center;gap:10px}.empty{text-align:center;padding:50px;color:#7a879b}.empty div{font-size:40px}.empty p{margin:5px 0}.photo-ok,.photo-missing{display:inline-flex;padding:5px 9px;border-radius:99px;font-size:11px;font-weight:900}.photo-ok{background:#e8f7ee;color:#14763c}.photo-missing{background:#fff0b9;color:#785800}
.form-shell,.position-shell,.attendance-shell,.import-shell{padding:30px;max-width:1150px;margin:auto}.page-title-row{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:18px}.form-card,.import-card{background:#fff;border-radius:20px;padding:28px;box-shadow:var(--shadow);border:1px solid #e1e8f2}.pro-form{padding:30px}.pro-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px}.field-group{display:grid;gap:7px}.field-group label{margin:0}.required{color:#d84635}.field-help{display:block;color:#71809a;font-size:12px;font-weight:600}.err{display:block;color:#b12c22;font-size:12px}.auto-fetch-panel{display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:14px;background:linear-gradient(90deg,#eef7ff,#f7fbff);border:1px solid #d8e8fa;margin-bottom:22px}.auto-icon{width:42px;height:42px;border-radius:12px;background:#dceeff;color:#0b67bf;display:grid;place-items:center;font-size:20px}.auto-copy{min-width:0;flex:1}.auto-copy strong,.auto-copy span{display:block}.auto-copy span{color:#708098;font-size:12px;margin-top:2px}.name-search-wrap{position:relative}.search-spin{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#8290a5;font-weight:900}.search-spin.busy{animation:spin .8s linear infinite}@keyframes spin{to{transform:translateY(-50%) rotate(360deg)}}.suggestions{display:none;position:absolute;z-index:50;left:0;right:0;top:calc(100% + 6px);background:#fff;border:1px solid #d6e1ef;border-radius:13px;box-shadow:0 16px 35px #17376125;padding:6px;max-height:310px;overflow:auto}.suggestions.show{display:block}.suggestion{width:100%;display:flex;align-items:center;gap:10px;padding:9px;border:0;background:#fff;border-radius:9px;text-align:left;cursor:pointer}.suggestion:hover{background:#f0f6ff}.suggestion>span:nth-child(2){flex:1}.suggestion b,.suggestion small{display:block}.suggestion small{color:#75829a;margin-top:2px}.suggestion em{font-style:normal;color:#0d68c0;font-size:10px;font-weight:900}.s-avatar{width:38px;height:38px;border-radius:9px;background:#eef3f8;display:grid;place-items:center;overflow:hidden;flex:none}.s-avatar img{width:100%;height:100%;object-fit:cover}.photo-upload-box{display:flex;align-items:center;gap:20px;margin:22px 0;padding:18px;border:1px dashed #b8c8dd;border-radius:15px;background:#f8fbff}.photo-preview{width:120px;height:140px;border-radius:13px;border:1px solid #d2ddea;background:#edf2f7;display:grid;place-items:center;overflow:hidden;color:#8794a8;font-weight:900;flex:none}.photo-preview img{width:100%;height:100%;object-fit:cover}.photo-placeholder{display:grid;place-items:center;gap:2px;color:#8190a5}.photo-placeholder span{font-size:30px}.photo-placeholder small{font-weight:600}.photo-upload-copy{min-width:0}.photo-upload-copy strong{display:block;font-size:17px;margin:3px 0}.photo-upload-copy p{margin:5px 0 12px;color:#728099;font-size:13px}.file-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.file-row input[type=file]{width:auto;padding:8px;background:#fff}.file-note{font-size:11px;color:#8793a6}.form-footer{display:flex;justify-content:flex-end;gap:9px;padding-top:8px;border-top:1px solid #edf1f6}.hint{background:#eef7ff;border-left:4px solid #0d67c7;padding:12px;margin-bottom:15px;border-radius:7px}.position-list{display:grid;gap:8px;margin:18px 0}.position-item{display:grid;grid-template-columns:28px 42px 48px 1fr 100px;align-items:center;gap:12px;background:#fff;padding:9px;border-radius:12px;border:1px solid #e0e7f2;cursor:grab}.position-item.dragging{opacity:.45}.drag{font-size:20px;color:#6c7b93}.avatar-sm{width:42px;height:42px;border-radius:9px;overflow:hidden;background:#edf2f8;display:grid;place-items:center;font-size:20px;flex:none}.avatar-sm img{width:100%;height:100%;object-fit:cover}.person b,.person small{display:block}.person small{color:#75819a;margin-top:3px}.position-input{width:90px;padding:8px;border:1px solid #cdd8e8;border-radius:8px}.attendance-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:15px}.counter{font-weight:900;margin-left:auto}.attendance-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.att-row{display:grid;grid-template-columns:40px 44px 1fr auto;gap:10px;align-items:center;background:#fff;padding:9px;border-radius:13px;border-left:5px solid var(--green);box-shadow:0 5px 16px #19395e0a}.att-row.is-absent{border-left-color:var(--yellow);background:#fffaf0}.att-no{font-weight:900}.absent-check{display:none}.status-btn{border:0;border-radius:99px;padding:8px 11px;font-weight:900;cursor:pointer;background:#e8f7ee;color:#13713b}.is-absent .status-btn{background:#fff0b9;color:#795700}
.import-card textarea{min-height:230px;resize:vertical;width:100%;border:1px solid #cbd7e8;border-radius:12px;padding:14px;margin:15px 0;font-family:Consolas,monospace}.or{text-align:center;color:#7b879b;margin:10px}.import-card input[type=file]{margin:10px 0 18px}.workflow{display:flex;align-items:center;margin:10px 0 20px}.step{display:flex;align-items:center;gap:8px;font-weight:900;color:#6e7d95}.step b{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#e9eff7;color:#60708a}.step.active{color:#0d66bf}.step.active b{background:#dceeff;color:#0b66be}.workflow .line{height:2px;background:#d7e0ec;flex:1;margin:0 12px}.pro-card{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin-bottom:16px}.pro-card>form,.pro-card>.photo-rule{grid-column:1/-1}.card-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:21px}.card-icon.blue{background:#e6f2ff}.card-icon.purple{background:#f0e9ff}.pro-card h2{margin:2px 0 3px}.pro-card p{margin:0;color:#6e7d95}.import-actions{display:flex;justify-content:space-between;align-items:center;gap:10px}.import-actions input{margin:0!important}.photo-rule{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0;padding:12px;border-radius:12px;background:#f6f9fd;border:1px solid #e5ebf4}.photo-rule b,.photo-rule span{display:block}.photo-rule span{color:#748198;font-size:12px;margin-top:3px}.upload-choice{padding:14px;border:1px dashed #c2d0e2;border-radius:12px;background:#fbfdff;margin:10px 0}.upload-choice label{display:flex;gap:9px;align-items:center;font-weight:900}.upload-choice label span{background:#e9f3ff;color:#0b66bd;padding:4px 7px;border-radius:6px;font-size:10px}.upload-choice input{margin:10px 0 0!important}.or-pill{text-align:center;font-size:11px;font-weight:900;color:#8995a8}.tip-card{display:flex;gap:10px;align-items:flex-start;padding:14px;border-radius:14px;background:#fff9e5;border:1px solid #f0dfa5;color:#725900}.tip-card span{color:#806f3a}.bulk-photo-card{margin-top:20px}.bulk-photo-card input[type=file]{display:block;width:100%;padding:12px;border:1px dashed #b9c8dc;border-radius:10px;background:#f8fbff}.bulk-photo-card .hint{margin:14px 0}.bulk-photo-card label{display:block;margin:8px 0;font-weight:800}
/* LED DISPLAY */
.led{height:100dvh;width:100vw;overflow:hidden;background:#f8f6f1;display:grid;grid-template-rows:minmax(82px,11.2vh) minmax(42px,6.1vh) 30px minmax(0,1fr) 25px}.led-header{min-width:0;min-height:0;background:linear-gradient(105deg,#06184f,#0b2e72 62%,#071d59);color:#fff;display:grid;grid-template-columns:minmax(105px,128px) minmax(0,1fr) minmax(88px,108px);align-items:center;padding:5px 10px;gap:6px;overflow:hidden;border-bottom:2px solid #ffbd25}.pm-logo{height:100%;min-width:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.pm-logo img{width:auto;height:auto;max-height:66px;max-width:118px;object-fit:contain;display:block}.pm-fallback{width:112px;height:68px;display:grid;grid-template-columns:34px 1fr;grid-template-rows:1fr auto;column-gap:7px;align-items:center;color:#fff;font-weight:900}.pm-fallback>span{grid-row:1/-1;font-size:35px;color:#ffbd25;line-height:1;text-shadow:0 2px 4px #0005}.pm-fallback b{font-size:21px;line-height:.82;letter-spacing:.5px}.pm-fallback small{font-size:7px;line-height:1;color:#fff;opacity:.9;white-space:nowrap}.school-head{min-width:0;text-align:center;overflow:hidden;padding:0 8px}.school-head h1{margin:0;font-family:'Noto Sans Devanagari','Mangal','Nirmala UI',Segoe UI,Arial,sans-serif;font-size:clamp(18px,2vw,30px);font-weight:900;line-height:1.02;letter-spacing:-.5px;white-space:nowrap;overflow:visible;text-overflow:clip;max-width:100%;color:#fff;text-shadow:0 2px 5px #0006}.school-head p{margin:4px 0 3px;font-family:'Noto Sans Devanagari','Mangal','Nirmala UI',Segoe UI,Arial,sans-serif;font-size:clamp(8px,.78vw,12px);font-weight:700;opacity:.94;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tagline{display:inline-block;background:#ffbd25;color:#18275b;padding:3px 14px;border-radius:99px;font-size:clamp(8px,.72vw,11px);font-weight:900;white-space:nowrap}.datebox{min-width:0;height:100%;display:grid;place-content:center;text-align:center;overflow:hidden;color:#fff}.date-icon{font-size:20px;color:#ffbd25;line-height:1;margin-bottom:1px}.datebox b{font-size:clamp(9px,.9vw,14px);line-height:1;white-space:nowrap}.datebox small{font-size:clamp(7px,.62vw,10px);opacity:.9;white-space:nowrap}.display-bar{position:relative;z-index:2;min-width:0;min-height:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;padding:4px 12px;align-items:center;background:#fff;overflow:hidden}.display-bar h2{margin:0;color:#c7462f;background:linear-gradient(90deg,#ffd7cf,#ffe9e4);padding:8px 22px;border-radius:0 20px 20px 0;width:max-content;max-width:100%;font-family:'Noto Sans Devanagari','Mangal','Nirmala UI',Segoe UI,Arial,sans-serif;font-size:clamp(15px,1.5vw,24px);line-height:1;white-space:nowrap;box-shadow:0 2px 8px #c7462f18}.display-quote{min-width:0;text-align:center;color:#214a7c;font-family:'Noto Sans Devanagari','Mangal','Nirmala UI',Segoe UI,Arial,sans-serif;font-size:clamp(11px,1.05vw,18px);font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.15px}.display-controls{display:flex;gap:5px;align-items:center;justify-content:flex-end;white-space:nowrap}.display-controls button{border:0;border-radius:7px;background:#12234e;color:#fff;padding:6px 9px;font-weight:800;font-size:clamp(8px,.72vw,11px);cursor:pointer}.display-controls span{font-weight:900;font-size:clamp(8px,.72vw,11px);padding:6px;white-space:nowrap}.marquee{position:relative;z-index:5;min-width:0;min-height:0;display:flex;align-items:center;background:#fff;border-top:1px solid #e1e6ee;border-bottom:1px solid #d9e0ea;overflow:hidden;font-family:'Noto Sans Devanagari','Mangal','Nirmala UI',Segoe UI,Arial,sans-serif;font-size:clamp(8px,.78vw,12px);height:30px}.marquee>b{position:relative;z-index:20;height:100%;display:flex;align-items:center;background:#df4d37;color:#fff;padding:0 16px;flex:none;box-shadow:3px 0 7px #0002;white-space:nowrap}.ticker{position:relative;z-index:1;min-width:0;height:100%;display:flex;align-items:center;overflow:hidden;white-space:nowrap;flex:1}.ticker span{display:inline-block;position:relative;z-index:1;padding-left:28px;animation:scroll 22s linear infinite;white-space:nowrap;will-change:transform}@keyframes scroll{from{transform:translateX(100%)}to{transform:translateX(-100%)}}.cards-wrap{min-height:0;overflow:hidden;padding:5px 10px 4px}.cards{height:100%;min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:6px}.staff-card{min-width:0;min-height:0;background:#fff;border-radius:9px;overflow:hidden;border:1px solid #d5ddea;box-shadow:0 2px 7px #13285b15;display:grid;grid-template-rows:27px minmax(0,1fr) 18px}.card-top{min-width:0;color:#fff;display:grid;grid-template-columns:35px minmax(0,1fr);align-items:center;padding:0 7px;font-size:clamp(8px,.76vw,12px);background:#0c74c9}.staff-card:nth-child(4n+2) .card-top{background:#1598b0}.staff-card:nth-child(4n+3) .card-top{background:#159447}.staff-card:nth-child(4n+4) .card-top{background:#c66a24}.staff-card:nth-child(3n+1) .card-top{background:#e6533d}.card-top span{background:#ffffff24;border-radius:6px;padding:3px 4px;width:max-content;font-weight:900}.card-top strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-body{min-height:0;display:grid;grid-template-columns:minmax(62px,.72fr) minmax(0,1.28fr);gap:6px;align-items:stretch;padding:5px}.photo{min-height:0;border-radius:7px;background:#f1f4f8;border:1px solid #d8e0eb;display:grid;place-items:center;color:#8995a9;font-weight:900;font-size:clamp(8px,.72vw,11px);overflow:hidden}.photo img{width:100%;height:100%;object-fit:cover}.details{min-width:0;min-height:0;display:grid;grid-template-rows:repeat(5,1fr);gap:1px;align-content:center}.details div{min-width:0;display:grid;grid-template-columns:minmax(55px,.82fr) minmax(0,1.18fr);gap:3px;align-items:center;font-size:clamp(6.5px,.62vw,10px);line-height:1.05}.details b{font-weight:700;color:#58647c;white-space:nowrap}.details span{font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status{display:flex;align-items:center;justify-content:center;font-size:clamp(7px,.63vw,10px);font-weight:900}.status.ok{background:#e8f7ee;color:#14763c}.status.bad{background:#fff0b9;color:#785800}.no-staff{grid-column:1/-1;grid-row:1/-1;display:grid;place-content:center;text-align:center;color:#36527d}.no-staff>div{font-size:42px}.no-staff h2{margin:8px 0 2px}.no-staff p{margin:0;color:#77869f}.led-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#0c63b6;color:#fff;padding:0 12px;font-size:clamp(7px,.68vw,10px);font-weight:700;overflow:hidden;white-space:nowrap}.led-footer>*{overflow:hidden;text-overflow:ellipsis}
@media(max-width:900px){.admin-top{padding:10px 13px}.admin-grid{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;padding:10px;border-right:0;border-bottom:1px solid #dfe6f0}.sidebar-title{grid-column:1/-1}.sidebar a{margin:0;padding:10px}.admin-main{padding:14px}.welcome-card,.page-title-row,.section-head{align-items:flex-start;flex-direction:column}.stats{grid-template-columns:1fr}.pro-grid{grid-template-columns:1fr}.attendance-grid{grid-template-columns:1fr}.form-shell,.position-shell,.attendance-shell,.import-shell{padding:16px}.photo-upload-box{align-items:flex-start}.top-actions{display:none}.admin-top strong{font-size:16px}.workflow{display:none}.pro-card{grid-template-columns:1fr}.card-icon{width:40px;height:40px}.import-actions{align-items:stretch;flex-direction:column}.photo-rule{grid-template-columns:1fr}.led{grid-template-rows:60px 34px 23px minmax(0,1fr) 20px}.led-header{grid-template-columns:60px minmax(0,1fr) 58px;padding:3px 4px;gap:3px}.pm-logo img{max-width:56px;max-height:48px}.school-head{padding:0 2px}.school-head h1{font-size:14px;letter-spacing:-.3px}.school-head p{font-size:6px}.tagline{font-size:5.5px;padding:2px 5px}.date-icon{font-size:10px}.datebox b{font-size:6.5px}.datebox small{font-size:5px}.display-bar{grid-template-columns:auto minmax(0,1fr) auto;gap:4px;padding:2px 5px}.display-bar h2{font-size:8px;padding:4px 8px}.display-quote{font-size:7px}.display-controls{gap:2px}.display-controls button,.display-controls span{font-size:6px;padding:4px}.marquee{height:23px;font-size:6.5px}.marquee>b{padding:0 7px}.cards-wrap{padding:2px 3px}.cards{gap:3px}.card-top{height:20px;grid-template-columns:25px minmax(0,1fr);padding:0 3px;font-size:6.5px}.card-body{grid-template-columns:36% 64%;gap:3px;padding:2px}.details div{font-size:5.5px;grid-template-columns:1fr 1.3fr}.status{font-size:5.5px}.led-footer{padding:0 4px;font-size:5.5px}.led-footer span:first-child{display:none}.no-staff>div{font-size:28px}.no-staff h2{font-size:15px}.no-staff p{font-size:9px}}


/* FINAL RESPONSIVE LED UPDATE
   Desktop/LED remains 4x3. Mobile switches to a readable 2-column layout. */
@media (max-width:700px){
  .led{
    height:auto;
    min-height:100dvh;
    width:100%;
    display:block;
    overflow-x:hidden;
    overflow-y:auto;
    background:#f8f6f1;
  }
  .led-header{
    min-height:96px;
    height:auto;
    display:grid;
    grid-template-columns:54px minmax(0,1fr) 52px;
    align-items:center;
    padding:6px 5px;
    gap:4px;
    overflow:visible;
  }
  .pm-logo{height:84px;overflow:hidden}
  .pm-logo img{max-width:50px;max-height:70px}
  .pm-fallback{width:50px;height:68px;grid-template-columns:1fr;grid-template-rows:auto 1fr;justify-items:center;gap:2px}
  .pm-fallback>span{display:none}
  .pm-fallback b{font-size:15px;line-height:.85;text-align:center}
  .pm-fallback small{display:none}
  .school-head{padding:0 2px;overflow:visible}
  .school-head h1{
    font-size:13px !important;
    line-height:1.12;
    letter-spacing:0;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    max-width:100%;
    display:block;
  }
  .school-head p{
    margin:3px 0 3px;
    font-size:6.5px;
    line-height:1.15;
    white-space:normal;
    overflow:visible;
  }
  .tagline{font-size:6px;padding:3px 6px}
  .datebox{height:82px}
  .date-icon{font-size:11px}
  .datebox b{font-size:7px}
  .datebox small{font-size:5.5px}

  .display-bar{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"title controls" "quote quote";
    gap:4px;
    padding:5px 6px;
    min-height:66px;
    overflow:visible;
  }
  .display-bar h2{grid-area:title;font-size:9px;padding:6px 9px;border-radius:0 14px 14px 0;max-width:100%;overflow:hidden;text-overflow:ellipsis}
  .display-quote{grid-area:quote;font-size:8px;line-height:1.25;white-space:normal;overflow:visible;text-overflow:clip;padding:0 3px}
  .display-controls{grid-area:controls;gap:2px;align-self:center}
  .display-controls button,.display-controls span{font-size:7px;padding:5px 6px}

  .marquee{height:25px;font-size:7px}
  .marquee>b{padding:0 8px}
  .ticker span{padding-left:14px;animation-duration:18s}

  .cards-wrap{
    padding:5px 4px 7px;
    min-height:0;
    overflow:visible;
  }
  .cards{
    height:auto;
    min-height:0;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:none;
    grid-auto-rows:minmax(178px,auto);
    gap:5px;
  }
  .staff-card{
    min-height:178px;
    border-radius:8px;
    grid-template-rows:25px minmax(0,1fr) 19px;
  }
  .card-top{
    height:25px;
    grid-template-columns:27px minmax(0,1fr);
    padding:0 4px;
    font-size:8px;
  }
  .card-top span{padding:3px 4px}
  .card-body{
    grid-template-columns:minmax(58px,.78fr) minmax(0,1.22fr);
    gap:4px;
    padding:4px;
  }
  .photo{font-size:8px;min-width:0}
  .details{gap:2px}
  .details div{
    grid-template-columns:minmax(48px,.85fr) minmax(0,1.15fr);
    gap:2px;
    font-size:7px;
    line-height:1.12;
  }
  .details b,.details span{min-width:0}
  .status{font-size:7px}
  .led-footer{
    min-height:27px;
    height:27px;
    padding:0 6px;
    font-size:6.5px;
  }
  .led-footer span:first-child{display:none}
  .led-footer>*{max-width:48%}
}

@media (max-width:380px){
  .led-header{grid-template-columns:48px minmax(0,1fr) 47px;min-height:92px}
  .school-head h1{font-size:12px !important}
  .school-head p{font-size:6px}
  .tagline{font-size:5.5px;padding:2px 5px}
  .display-bar{min-height:64px}
  .display-controls button,.display-controls span{font-size:6.5px;padding:4px 5px}
  .staff-card{min-height:170px;grid-template-rows:24px minmax(0,1fr) 18px}
  .card-top{height:24px;font-size:7.5px}
  .card-body{grid-template-columns:minmax(53px,.76fr) minmax(0,1.24fr)}
  .details div{font-size:6.5px;grid-template-columns:minmax(45px,.86fr) minmax(0,1.14fr)}
  .status{font-size:6.5px}
}