:root{--navy:#101e41;--navy2:#1b2f64;--blue:#2d67ed;--blue2:#184cbc;--coral:#f05268;--text:#152448;--muted:#607398;--line:#dbe5f5;--bg:#f2f5fd;--white:#fff}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}html{color-scheme:light}body{font:15px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);overscroll-behavior:none}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #86b3ff;outline-offset:2px}#shell{height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr) auto;max-width:760px;margin:auto;background:#f6f8ff;box-shadow:0 0 34px #10224b11}.topbar{height:64px;background:var(--navy);color:#fff;padding:8px 17px;display:flex;align-items:center;justify-content:space-between;gap:10px}.brand{display:flex;align-items:center;gap:9px;font-weight:900;letter-spacing:-.045em;font-size:22px}.brand small{display:block;font-size:9px;letter-spacing:.02em;font-weight:750;color:#dce9ff;margin-top:-2px}.ballmark{width:39px;height:39px;flex:none;border-radius:50%;display:grid;place-items:center;background:#effff1;box-shadow:0 0 0 2px #ffffff24,0 2px 9px #0003}.session-chip{font-size:9px;font-weight:850;letter-spacing:.07em;color:#d7e8ff;text-align:right;max-width:110px}.main{padding:clamp(10px,2.2dvh,20px) 16px 8px;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:11px}.main>*{flex-shrink:0}.dock{height:clamp(55px,8dvh,68px);display:flex;align-items:center;justify-content:space-around;gap:6px;padding:5px 10px max(5px,env(safe-area-inset-bottom));background:var(--navy);color:white}.dock button{border:0;background:transparent;color:#d6e1fa;display:grid;place-items:center;gap:2px;min-width:66px;font-size:10px;font-weight:750}.dock button strong{font-size:19px;line-height:1}.dock button.active{color:#fff}.dock button.active strong{color:#fc6e82}.dock .end{background:#2a62e0;color:#fff;border-radius:10px;padding:8px 16px;font-size:12px;min-width:90px}.eyebrow{color:var(--blue);letter-spacing:.13em;text-transform:uppercase;font-size:10px;font-weight:900;margin:0}.title{margin:0;font-size:clamp(22px,5.7vw,34px);line-height:1.09;letter-spacing:-.04em}.lead{color:var(--muted);font-size:12px;margin:0}.head{display:grid;gap:5px;flex-shrink:0}.notice{padding:9px 10px;border-radius:10px;border:1px solid #cddaf8;background:#edf3ff;font-size:10px;color:#39548d;line-height:1.3}.alert{background:#fff2f3;border-color:#ffc4ca;color:#8c3646}.card{border:1px solid var(--line);background:#fff;border-radius:17px;padding:15px;box-shadow:0 5px 18px #1427560c}.card h3{font-size:16px;letter-spacing:-.03em;margin:0 0 5px}.card p{margin:0;color:var(--muted);font-size:12px}.grow{flex:1;min-height:0}.login-box{display:flex;flex-direction:column;gap:10px}.field{display:flex;flex-direction:column;gap:5px;min-width:0}.field>span{font-size:11px;font-weight:850;color:#35466d}.input{width:100%;border:1px solid #cbd9f1;border-radius:11px;height:43px;background:#fff;color:var(--text);padding:0 11px;outline-offset:1px}.input:focus{border-color:var(--blue)}.row{display:flex;align-items:center;gap:8px}.row.between{justify-content:space-between}.row>*{min-width:0}.btn{border:1px solid var(--blue);background:var(--blue);color:#fff;font-weight:850;border-radius:11px;min-height:42px;padding:10px 14px;line-height:1.2}.btn.light{background:#fff;color:#2254c4;border-color:#c7d6f2}.btn.coral{background:var(--coral);border-color:var(--coral)}.btn.fill{width:100%}.btn.small{min-height:34px;padding:7px 11px;font-size:12px}.muted{color:var(--muted)}.tiny{font-size:10px;color:var(--muted)}.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;justify-items:center;align-content:start}.tile{width:min(100%,132px);aspect-ratio:1;border:3px solid #fff;border-radius:18px;box-shadow:0 2px 8px #0e235c35;color:#fff;padding:8px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:7px;text-align:center;font-weight:900;font-size:13px;line-height:1.12}.tile .symbol{font-size:30px;line-height:1}.tile.blue{background:linear-gradient(140deg,#3c80ff,#1a4ec7)}.tile.coral{background:linear-gradient(130deg,#ff7581,#e9435a)}.tile.navy{background:linear-gradient(130deg,#263e80,#111d43)}.tile.sky{background:linear-gradient(130deg,#5baddf,#266cb6)}.tile.ghost{background:linear-gradient(130deg,#8d9ebd,#586a8b)}.tile:disabled{opacity:.55}.small-tiles .tile{width:min(100%,128px)}.format-tiles .tile{font-size:12px;max-width:132px}.status{display:flex;gap:7px;flex-wrap:wrap;align-items:center}.pill{background:#ebf1ff;border:1px solid #dbe5fc;color:#284e9d;border-radius:30px;padding:5px 9px;font-size:10px;font-weight:850}.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.segmented{display:grid;grid-template-columns:1fr 1fr;gap:8px}.segmented button{border:2px solid #cbd9ef;background:white;color:var(--text);border-radius:12px;padding:9px 5px;font-size:11px;min-height:51px;font-weight:850}.segmented button.active{background:#e9f0ff;border-color:#2865ef;color:#154bbd}.segmented button .mini{display:block;color:#637696;font-size:9px;line-height:1.2;font-weight:550;margin-top:3px}.numberpick{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:12px;padding:7px 10px;background:white}.numberpick button{border:0;background:#e8efff;color:#1d50be;border-radius:9px;font-size:21px;font-weight:800;width:40px;height:36px}.numberpick strong{font-size:24px}.numberpick span{font-size:10px;color:var(--muted)}.roster-card{display:flex;flex-direction:column;gap:10px}.steps{display:flex;gap:5px;justify-content:center}.dot{height:6px;width:22px;border-radius:20px;background:#d3ddef}.dot.active{background:var(--blue)}.scorecard{display:grid;gap:11px}.score-side{border:1px solid #e0e8f7;border-radius:12px;padding:10px;background:#f8faff;min-width:0}.score-side strong{display:block;font-size:12px;overflow-wrap:anywhere}.score-side small{display:block;color:#63718d;font-size:10px;margin-top:2px}.score-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.score-fields input{width:100%;height:53px;text-align:center;font-size:24px;font-weight:850;background:#fff;border:2px solid #c9d8f4;border-radius:11px;color:#1e3973}.score-fields input:focus{border-color:var(--blue)}.score-fields span{font-size:10px;font-weight:850;color:#41577f;text-align:center}.name-line{display:flex;align-items:center;justify-content:space-between;gap:8px}.code{font-size:28px;letter-spacing:.16em;font-weight:900;color:#1d50bb}.result-winner{background:#edf5ff;border:1px solid #c7d9fa;padding:9px 11px;border-radius:10px;font-weight:800;font-size:12px}.empty{border:1px dashed #c6d7f6;border-radius:12px;padding:14px;font-size:12px;color:var(--muted);background:#f9fbff}.micro{font-size:10px;color:#49618e;line-height:1.35}.toast{position:fixed;left:50%;bottom:78px;transform:translateX(-50%) translateY(30px);opacity:0;pointer-events:none;z-index:50;background:#192c58;color:#fff;padding:10px 16px;border-radius:10px;font-size:12px;font-weight:700;max-width:90vw;transition:opacity .2s,transform .2s}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.divider{height:1px;background:var(--line)}.stack{display:grid;gap:9px;min-height:0}.full{min-height:0;flex:1;display:flex;flex-direction:column;gap:10px}.footer-actions{margin-top:auto;display:flex;gap:9px;align-items:center}.footer-actions .btn{flex:1}.no-wrap{white-space:nowrap}#print-area{display:none}
@media(min-width:650px){#shell{max-width:860px}.topbar{height:74px}.main{padding:28px 38px 18px;gap:16px}.tile{width:148px}.tiles{justify-content:center;column-gap:24px;row-gap:18px}.format-tiles .tile{width:148px;max-width:none}.card{padding:21px}.title{font-size:33px}.lead{font-size:14px}.login-box{max-width:500px;margin:0 auto;width:100%}.dock{height:63px}.full{max-width:590px;width:100%;margin:0 auto}.footer-actions{margin-top:auto}}
@media(max-height:670px){.topbar{height:54px}.main{padding:8px 12px 5px;gap:7px}.dock{height:52px;padding-top:2px}.brand{font-size:19px}.brand small{font-size:8px}.ballmark{width:32px;height:32px}.ballmark svg{width:26px;height:26px}.title{font-size:22px}.lead{font-size:11px}.card{padding:10px}.tile{width:min(100%,111px);border-radius:15px;font-size:12px}.tile .symbol{font-size:24px}.tiles{gap:8px}.small-tiles .tile{width:105px}.input{height:37px}.btn{min-height:35px;padding:7px 11px}.field{gap:3px}.split{gap:7px}.status .pill{padding:3px 6px}.notice{padding:7px}.score-fields input{height:43px}.score-side{padding:7px}.scorecard{gap:7px}.roster-card{gap:6px}}
@media(max-height:560px){.tile{width:min(100%,99px)}.small-tiles .tile{width:97px}.tile .symbol{font-size:21px}.head{gap:3px}.main{gap:5px}.card{padding:9px}.footer-actions{gap:6px}.input{height:34px}.numberpick button{height:30px}.segmented button{min-height:43px;padding:5px}}
@media print{html,body,#shell{height:auto!important;overflow:visible!important;max-width:100%!important;box-shadow:none!important}.topbar,.main,.dock,.toast{display:none!important}#print-area{display:block!important;padding:16px;font:12px Arial,sans-serif}#print-area table{width:100%;border-collapse:collapse}#print-area td,#print-area th{border:1px solid #bbb;padding:5px;text-align:left}}
/* Narrow-phone footer sizing: never force a page wider than the viewport. */
#shell{width:100%;min-width:0}
.dock button{min-width:48px}
.dock .end{min-width:74px;padding:8px 6px}
@media(max-height:670px){.main{gap:5px;padding-top:6px}}
@media(max-height:600px){.scorecard{gap:4px}.score-side{padding:6px}.main{padding-top:5px}}