:root{--bg:#16191d;--panel:#21262c;--panel-edge:#333b44;--text:#f2f5f7;--text-dim:#9aa5b1;--grass:#2f7d4f;--grass-dark:#276a43;--line:#ffffffb8;--us:#f2a33c;--us-ink:#3a2504;--alert:#d94141;--alert-dim:#a82f2f;--alert-text:#ff9b9b;--them:#4a9be8;--them-ink:#05233f;--token:3rem;--tap-min:2.75rem;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;-webkit-text-size-adjust:100%;font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;margin:0}.app{flex-direction:column;gap:.5rem;height:100dvh;padding:.5rem;display:flex}.app__top{flex:none;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;display:grid}.app__top-right{justify-content:flex-end;display:flex}.app__body{flex:auto;justify-content:center;gap:.5rem;min-height:0;display:flex}.app__field{flex:0 auto;align-items:stretch;min-width:0;display:flex}.app__side{flex-direction:column;flex:auto;gap:.5rem;min-width:11rem;max-width:26rem;min-height:0;display:flex}.app__side-foot{flex:none;justify-content:flex-end;gap:.5rem;display:flex}.scorebar{gap:.5rem;display:flex}.score{font-variant-numeric:tabular-nums;border-radius:999px;align-items:center;gap:.4rem;padding:.2rem .35rem;display:flex}.score__btn{width:var(--tap-min);height:var(--tap-min);color:inherit;font:inherit;cursor:pointer;background:#0000002e;border:none;border-radius:50%;font-size:1.3rem;font-weight:700;line-height:1}.score__btn:hover:not(:disabled){background:#00000052}.score__btn:disabled{opacity:.3;cursor:default}.score__btn--minus{opacity:.75;width:2.25rem;height:2.25rem;font-size:1rem}.score--us{background:var(--us);color:var(--us-ink)}.score--them{background:var(--them);color:var(--them-ink)}.score__label{text-transform:uppercase;letter-spacing:.06em;opacity:.8;font-size:.8rem;font-weight:600}.score__value{font-size:1.6rem;font-weight:700;line-height:1}.field{aspect-ratio:52.5/68;background:var(--grass);border-radius:.5rem;height:100%;position:relative;overflow:hidden}.pitch{width:100%;height:100%;display:block}.pitch__grass{fill:var(--grass)}.pitch__line{fill:none;stroke:var(--line);stroke-width:4px}.pitch__spot{fill:var(--line)}.pitch__goal{fill:#ffffff59;stroke:var(--line);stroke-width:5px}.field__slots{position:absolute;inset:0}.slot{justify-content:center;align-items:center;display:flex;position:absolute;transform:translate(-50%,-50%)}.slot__circle{width:var(--token);height:var(--token);background:#ffffff38;border:2px dashed #ffffffd9;border-radius:50%;transition:background .12s,transform .12s}.slot--over .slot__circle{background:#fff9;border-style:solid;transform:scale(1.15)}.slot--over.slot--filled:after{content:"";border:2px solid #fff;border-radius:50%;position:absolute;inset:-.35rem}.token{cursor:grab;touch-action:manipulation;flex-direction:column;align-items:center;gap:.15rem;width:4.25rem;display:flex}.token--dragging{opacity:.25}.token--overlay{cursor:grabbing;filter:drop-shadow(0 6px 10px #0000008c);transform:scale(1.1)}.token__circle{width:var(--token);height:var(--token);min-width:var(--tap-min);min-height:var(--tap-min);background:var(--us);color:var(--us-ink);font-variant-numeric:tabular-nums;border:2px solid #00000059;border-radius:50%;justify-content:center;align-items:center;font-size:1.15rem;font-weight:700;display:flex}.token__name{text-align:center;color:#fff;text-shadow:0 1px 2px #000000d9;overflow-wrap:anywhere;font-size:.75rem;font-weight:600;line-height:1.1}.panel{background:var(--panel);border:1px solid var(--panel-edge);border-radius:.5rem;min-height:0;padding:.5rem;transition:background .12s,border-color .12s;overflow-y:auto}.panel--over{background:#2c333b;border-color:#ffffffbf}.tray{flex:55%}.subs{flex:45%}.panel__players{flex-wrap:wrap;place-content:flex-start center;gap:.5rem;display:flex}.panel__title{text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin:0 0 .4rem;font-size:.75rem;font-weight:700}.panel__empty{text-align:center;color:var(--text-dim);margin:0;padding:.75rem 0;font-size:.85rem}.btn{min-height:var(--tap-min);border:1px solid var(--panel-edge);background:var(--panel);color:var(--text);font:inherit;cursor:pointer;border-radius:.4rem;padding:0 .9rem;font-weight:600}.btn:hover:not(:disabled){border-color:#fff6}.btn:disabled{opacity:.4;cursor:default}.btn--primary{background:var(--us);border-color:var(--us);color:var(--us-ink)}.btn--ghost{background:0 0;border-color:#0000}.btn--round{min-width:var(--tap-min);border-radius:50%;padding:0;font-size:1.15rem;line-height:1}.input{min-height:var(--tap-min);border:1px solid var(--panel-edge);background:var(--bg);color:var(--text);font:inherit;border-radius:.4rem;padding:0 .6rem}.input:focus-visible{outline:2px solid var(--us);outline-offset:1px}.input--number{text-align:center;font-variant-numeric:tabular-nums;width:3.5rem}.input--formation{text-align:center;font-variant-numeric:tabular-nums;letter-spacing:.08em;width:6rem}.input--name{flex:auto;min-width:0}.modal{border:1px solid var(--panel-edge);background:var(--panel);width:min(34rem,100vw - 2rem);max-height:calc(100dvh - 3rem);color:var(--text);border-radius:.6rem;padding:0;overflow:hidden}.modal::backdrop{background:#0009}.modal__head,.modal__foot{align-items:center;gap:.5rem;padding:.75rem 1rem;display:flex}.modal__head{border-bottom:1px solid var(--panel-edge);justify-content:space-between}.modal__foot{border-top:1px solid var(--panel-edge);justify-content:flex-end}.modal__title{margin:0;font-size:1.1rem}.modal__body{max-height:calc(100dvh - 10rem);padding:1rem;overflow-y:auto}.field-row{align-items:center;gap:.75rem;display:flex}.field-row__label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);font-size:.8rem;font-weight:700}.settings__group{border-bottom:1px solid var(--panel-edge);flex-direction:column;gap:.5rem;padding:.85rem 0;display:flex}.settings__group:last-child{border-bottom:none}.stepper{align-items:center;gap:.75rem;display:flex}.stepper__value{text-align:center;font-variant-numeric:tabular-nums;min-width:2ch;font-size:1.3rem;font-weight:700}.hint{color:var(--text-dim);margin:0;font-size:.8rem}.hint--error{color:#ff8f8f}.hint--warn{color:var(--us)}.score-field{align-items:center;gap:.4rem;display:flex}.score-field__label{color:var(--text-dim);font-size:.85rem}.roster{flex-direction:column;gap:.4rem;margin:.75rem 0 0;padding:0;list-style:none;display:flex}.roster__row{gap:.5rem;display:flex}.tabs{border-bottom:1px solid var(--panel-edge);gap:.25rem;display:flex}.tab{min-height:var(--tap-min);color:var(--text-dim);font:inherit;cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;padding:0 .9rem;font-weight:600}.tab--active{color:var(--text);border-bottom-color:var(--us)}.controls{align-items:center;gap:.5rem;display:flex}.clock{text-align:right;font-variant-numeric:tabular-nums;min-width:4.5ch;font-size:1.4rem;font-weight:700}.clock--setup{color:var(--text-dim)}.clock--paused{color:var(--us);animation:1.4s ease-in-out infinite clock-pulse}.clock--ended{color:var(--text-dim);text-decoration:line-through}@keyframes clock-pulse{50%{opacity:.35}}@media (prefers-reduced-motion:reduce){.clock--paused{animation:none}}.clock__note{color:var(--text-dim);font-size:.85rem;font-weight:600}.sub{flex-direction:column;align-items:center;gap:.1rem;display:flex}.sub__timers{font-variant-numeric:tabular-nums;gap:.35rem;font-size:.7rem;line-height:1;display:flex}.sub__now{color:var(--us);font-weight:700}.sub__total{color:var(--text-dim)}.table-wrap{overflow-x:auto}.table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.table th,.table td{text-align:left;border-bottom:1px solid var(--panel-edge);white-space:nowrap;padding:.45rem .5rem}.table th{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);font-size:.7rem}.table__num{text-align:right}.btn--danger{color:#ffe9e9;background:#7e2c2c;border-color:#a03a3a}:where(button,input,[tabindex]):focus-visible{outline:3px solid var(--us);outline-offset:2px;border-radius:.3rem}.app--ended .field{filter:saturate(.45)brightness(.82)}.app--ended .token,.token--locked{cursor:default}.app--ended .panel{opacity:.85}@media (width<=56rem),(orientation:portrait){.app__body{flex-direction:column;align-items:center}.app__field{flex:auto;justify-content:center;min-height:0}.app__side{flex-direction:row;flex:none;align-items:stretch;width:100%;max-width:none;max-height:40dvh}.app__side-foot{flex-direction:column;justify-content:flex-start}}@media (width<=34rem){.app__top{grid-template-columns:1fr;justify-items:center;gap:.35rem}.app__top-left{display:none}.app__top-right{justify-content:center}}.update{z-index:10;border:1px solid var(--panel-edge);background:var(--panel);border-radius:.5rem;align-items:center;gap:.5rem;padding:.5rem .6rem;display:flex;position:fixed;bottom:.75rem;left:.75rem;box-shadow:0 6px 16px #00000080}.update__text{font-size:.85rem;font-weight:600}.readout{background:var(--bg);border:1px solid var(--panel-edge);border-radius:.4rem;justify-content:space-between;align-items:baseline;gap:.75rem;margin:.25rem 0 0;padding:.5rem .6rem;display:flex}.readout__label{color:var(--text-dim);font-size:.85rem}.readout__value{font-variant-numeric:tabular-nums;color:var(--us);font-size:1.4rem;font-weight:700}.table__row--bench td{color:var(--us)}.token--overdue .token__circle{background:var(--alert);color:#fff;border-color:#00000073;animation:2.6s ease-in-out infinite overdue-pulse}.sub__timers--overdue .sub__now{color:var(--alert-text)}@keyframes overdue-pulse{50%{background:var(--alert-dim);box-shadow:0 0 0 4px #d9414147}}@media (prefers-reduced-motion:reduce){.token--overdue .token__circle{animation:none;box-shadow:0 0 0 3px #d9414180}}.squad__count{color:var(--text-dim);margin:0 0 .25rem;font-size:.9rem}.squad__count strong{color:var(--text);font-size:1.1rem}.squad__away{color:var(--text-dim)}.squad__actions{margin-top:.75rem}.roster__toggle{color:var(--text-dim);flex:none;font-size:1rem}.roster__toggle:hover:not(:disabled){color:var(--alert-text);border-color:#0000}.roster__row--away .input{opacity:.4;text-decoration:line-through}.roster__toggle--undo{color:var(--us)}.readout__value--small{font-size:1.1rem}