:root{--navy:#223d7d;--blue:#54b4e8;--blue2:#2679c7;--green:#49a942;--gold:#ffd94c;--red:#c93838;--cream:#fffdf0;--ink:#15213c;--muted:#66758e;--line:#d8e1ec}
*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:var(--ink);background:#edf4fb}
body.kids{background:linear-gradient(rgba(34,61,125,.72),rgba(34,61,125,.72)),url('/assets/kids-background.jpg') center/cover fixed}
body.wallbreakers{background:linear-gradient(rgba(34,61,125,.72),rgba(34,61,125,.72)),url('/assets/wallbreakers-background.jpg') center/cover fixed}
.shell{max-width:1180px;margin:auto;padding:22px}.panel{background:rgba(255,255,255,.97);border-radius:24px;padding:24px;box-shadow:0 16px 48px rgba(13,35,78,.18)}
.brand{text-align:center;margin-bottom:18px}.brand img{max-height:145px;max-width:min(92%,700px);object-fit:contain}
h1,h2,h3{color:var(--navy);margin-top:0}.muted{color:var(--muted)}.hidden{display:none!important}
.btn{border:0;border-radius:14px;padding:14px 18px;font-weight:800;font-size:16px;cursor:pointer}.btn.primary{background:var(--blue2);color:#fff}.btn.green{background:var(--green);color:#fff}.btn.secondary{background:#edf2f8;color:var(--navy)}.btn.danger{background:#fde8e8;color:#9d1c1c}.btn:disabled{opacity:.5}
.actions{display:flex;gap:10px;flex-wrap:wrap}.homegrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:760px;margin:auto}.homegrid .btn{min-height:100px;font-size:22px}
input,select,textarea{width:100%;padding:13px;border:1px solid var(--line);border-radius:11px;font-size:16px;background:#fff}label{display:block;font-weight:700;margin:9px 0 5px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.pin{max-width:360px;margin:0 auto}.pinDisplay{text-align:center;font-size:34px;letter-spacing:10px;font-weight:900;padding:16px;background:#f4f7fb;border-radius:14px;margin:10px 0}
.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.keypad button{padding:18px;font-size:23px;border:0;border-radius:12px;background:#eef3f9;color:var(--navy);font-weight:900}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:12px 0}.spacer{flex:1}
.roster{display:grid;gap:9px}.studentRow{background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px 15px;display:flex;align-items:center;gap:12px}
.studentRow .name{font-weight:900;font-size:18px}.studentRow .meta{font-size:13px;color:var(--muted)}.studentRow.checked{background:#eaf8ed;border-color:#8bc994}
.studentRow button.namebtn{all:unset;cursor:pointer;flex:1}.pill{display:inline-block;padding:5px 9px;border-radius:999px;background:#edf2f8;font-weight:800;font-size:12px}.pill.ok{background:#dff5e3;color:#25652e}.pill.warn{background:#fff0cc;color:#7a5300}.pill.bad{background:#fde1e1;color:#9c2020}
.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;background:#fff}th,td{padding:10px;border-bottom:1px solid var(--line);text-align:left}th{background:#eef4fb;color:var(--navy)}
.classGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}.classCard{background:#fff;border:1px solid var(--line);padding:18px;border-radius:16px}.classCard.submitted{opacity:.55}
.scoreHeader,.scoreRow{display:grid;grid-template-columns:minmax(160px,1.6fr) repeat(6,minmax(75px,.7fr));gap:7px;align-items:center}.scoreHeader{font-size:12px;font-weight:900;color:var(--navy);padding:7px}.scoreRow{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;margin:7px 0}.scoreCell{text-align:center}.scoreCell input{width:24px;height:24px}
.warning{background:#fff2cc;border:1px solid #f2cc58;border-radius:12px;padding:12px;color:#614900}.dangerBox{background:#fdeaea;border:1px solid #e39a9a;border-radius:12px;padding:12px;color:#812020}
.adminNav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:15px}.adminNav button.active{background:var(--navy);color:#fff}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px}.card b.big{font-size:30px;color:var(--navy);display:block}
dialog{border:0;border-radius:20px;max-width:900px;width:94%;box-shadow:0 25px 80px rgba(0,0,0,.25)}dialog::backdrop{background:rgba(10,25,55,.55)}
.small{font-size:12px;color:var(--muted)}.sectionTitle{font-size:15px;color:var(--navy);font-weight:900;text-transform:uppercase;letter-spacing:.05em;margin:22px 0 8px;border-bottom:1px solid var(--line);padding-bottom:7px}
@media(max-width:760px){.shell{padding:10px}.panel{padding:15px;border-radius:18px}.homegrid,.grid2,.grid3{grid-template-columns:1fr}.scoreHeader{display:none}.scoreRow{grid-template-columns:1fr 1fr}.scoreRow .nameCell{grid-column:1/-1}.scoreCell{text-align:left}.scoreCell:before{content:attr(data-label);display:block;font-size:11px;font-weight:800;color:var(--muted)}}
@media print{body{background:white!important}.noPrint{display:none!important}.panel{box-shadow:none}.pagebreak{page-break-before:always}}

.homeOps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:920px;margin:20px auto 0}
.homeOps.two{grid-template-columns:repeat(2,minmax(0,1fr));max-width:620px}
.homeAction{border:0;border-radius:20px;min-height:135px;padding:20px 14px;color:#fff;font-weight:900;font-size:22px;cursor:pointer;box-shadow:0 8px 22px rgba(18,42,85,.15)}
.homeAction small{font-size:16px;font-weight:800}.homeAction.green{background:var(--green)}.homeAction.blue{background:var(--blue2)}.homeAction.red{background:#b63b3b}.homeIcon{display:block;font-size:34px;margin-bottom:6px}.adminHomeBtn{font-size:14px;padding:9px 14px}
.arrivalOptions{align-items:center}.arrivalChoice{display:inline-flex;align-items:center;gap:6px;margin:0;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#fff}.arrivalChoice input{width:20px;height:20px;margin:0}
@media(max-width:760px){.homeOps,.homeOps.two{grid-template-columns:1fr}.homeAction{min-height:95px}.arrivalOptions{align-items:stretch}.arrivalChoice{width:100%}}

.quickCheckin{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.pickupChoices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:8px 0 12px}.pickupBubble{border:2px solid var(--line);background:#fff;border-radius:16px;padding:14px 10px;cursor:pointer;text-align:center;min-height:82px}.pickupBubble strong,.pickupBubble span{display:block}.pickupBubble span{font-size:13px;margin-top:4px}.pickupBubble.selected{outline:3px solid var(--blue2);border-color:var(--blue2)}.pickupBubble.other{background:#fffaf0}@media(max-width:760px){.quickCheckin{width:100%;justify-content:stretch}.quickCheckin .btn{flex:1}.pickupChoices{grid-template-columns:1fr}}


/* V1.6.3 — iPad 6th Generation / iOS 17 Safari compatibility */
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  width:100%;
  min-height:100%;
}
body{
  width:100%;
  min-height:100vh;
  min-height:100dvh;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.kids,body.wallbreakers{
  background-attachment:scroll;
}
.shell{
  width:100%;
  padding-top:max(22px,env(safe-area-inset-top));
  padding-right:max(22px,env(safe-area-inset-right));
  padding-bottom:max(22px,env(safe-area-inset-bottom));
  padding-left:max(22px,env(safe-area-inset-left));
}
button,.btn,.homeAction,.pickupBubble,.keypad button{
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
button,.btn,input,select,textarea{font-family:inherit}
.btn,.homeAction,.pickupBubble,.keypad button{min-height:44px}
input,select,textarea{font-size:16px}
.tablewrap{
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
dialog{
  max-height:calc(100vh - 24px);
  max-height:calc(100dvh - 24px);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  padding-bottom:max(1em,env(safe-area-inset-bottom));
}
dialog input,dialog select,dialog textarea{font-size:16px}
.studentRow{min-width:0}
.studentRow .namebtn,.studentRow button.namebtn{min-width:0}
.studentRow .name,.studentRow .meta{overflow-wrap:anywhere}
.toolbar>*{min-width:0}

/* iPad portrait is 768px wide. Treat it as a tablet layout instead of
   forcing the desktop forms/scoring grid into the narrower viewport. */
@media (min-width:761px) and (max-width:900px){
  .shell{
    padding-top:max(14px,env(safe-area-inset-top));
    padding-right:max(14px,env(safe-area-inset-right));
    padding-bottom:max(14px,env(safe-area-inset-bottom));
    padding-left:max(14px,env(safe-area-inset-left));
  }
  .panel{padding:18px;border-radius:20px}
  .grid2,.grid3{grid-template-columns:1fr}
  .homeOps,.homeOps.two{
    grid-template-columns:repeat(2,minmax(0,1fr));
    max-width:760px;
  }
  .scoreHeader{display:none}
  .scoreRow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .scoreRow .nameCell{grid-column:1/-1}
  .scoreCell{text-align:left}
  .scoreCell:before{
    content:attr(data-label);
    display:block;
    font-size:11px;
    font-weight:800;
    color:var(--muted);
  }
  .quickCheckin{width:100%;justify-content:stretch}
  .quickCheckin .btn{flex:1 1 140px}
  .pickupChoices{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  dialog{
    width:calc(100% - 20px);
    margin:10px auto;
  }
  .adminNav{
    overflow-x:auto;
    flex-wrap:nowrap;
    -webkit-overflow-scrolling:touch;
    padding-bottom:4px;
  }
  .adminNav .btn{
    flex:0 0 auto;
    white-space:nowrap;
  }
}
@media (max-width:760px){
  .shell{
    padding-top:max(10px,env(safe-area-inset-top));
    padding-right:max(10px,env(safe-area-inset-right));
    padding-bottom:max(10px,env(safe-area-inset-bottom));
    padding-left:max(10px,env(safe-area-inset-left));
  }
}