*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}:root{--ink: #eef2ee;--muted: #b7c0b8;--faint: #6d776f;--bg: #080b09;--panel: #0e1310;--raise: #141a15;--line: #1f2620;--acc: #3be07a;--acc-deep: #1f9d4e;--acc-glow: rgba(59, 224, 122, .28);--warn: #f5b544;--err: #ff6b6b;--sans: "Onest", "Noto Sans Thai", system-ui, sans-serif;color-scheme:dark}html,body{height:100%;background:var(--bg);color:var(--ink);font-family:var(--sans);overflow:hidden}body{-webkit-user-select:none;user-select:none}#app{height:100%}.pd-screen{height:100%;display:grid;grid-template-rows:1fr auto;background:radial-gradient(120vh 70vh at 100% 0%,rgba(59,224,122,.07),transparent 60%),radial-gradient(90vh 60vh at 0% 100%,rgba(59,224,122,.04),transparent 60%),var(--bg)}main{min-height:0;padding:5vh 6vh 3vh}.pd-main{font-weight:700;font-size:3.2vh;line-height:1.3;letter-spacing:-.01em}.pd-sub{color:var(--muted);font-size:2.4vh;font-weight:500}.pd-big{font-size:4.2vh}.pd-brand{display:flex;align-items:center;gap:1.8vh}.pd-logo{width:7vh;height:7vh;border-radius:1.8vh;object-fit:cover;background:var(--raise);flex:none}.pd-logo-ph{display:grid;place-items:center;font-weight:800;font-size:2.8vh;color:var(--acc);border:.2vh solid var(--line)}.pd-club{font-weight:800;font-size:3.2vh;letter-spacing:-.01em;text-wrap:balance}.pd-idle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.2vh;text-align:center}.pd-idle .pd-brand{flex-direction:column;gap:2.4vh;margin-bottom:3vh}.pd-idle .pd-logo{width:16vh;height:16vh;border-radius:4vh}.pd-idle .pd-logo-ph{font-size:6vh}.pd-idle .pd-club{font-size:4.4vh}.pd-idle-hi{font-weight:800;font-size:7vh;letter-spacing:-.02em}.pd-idle-clock{margin-top:4vh;font-family:JetBrains Mono,monospace;font-weight:800;font-size:7vh;color:var(--acc);font-variant-numeric:tabular-nums}.pd-show{display:grid;grid-template-columns:1.15fr 1fr;gap:4vh;align-items:stretch}.pd-bill{display:flex;flex-direction:column;min-height:0}.pd-eyebrow{font-size:2vh;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.pd-eyebrow span{color:var(--faint);margin-left:.8vh}.pd-court{font-size:7vh;font-weight:800;letter-spacing:-.02em;line-height:1.05;margin:1.2vh 0 1.6vh;text-wrap:balance}.pd-when{font-size:2.8vh;color:var(--ink);display:flex;flex-wrap:wrap;gap:.4vh 1.6vh;align-items:baseline}.pd-when b{font-family:JetBrains Mono,monospace;font-size:3vh;color:var(--acc);font-variant-numeric:tabular-nums}.pd-who{margin-top:1vh;font-size:2.6vh;color:var(--muted)}.pd-coach{display:inline-block;margin-left:1.6vh;padding:.3vh 1.4vh;border-radius:999px;font-size:2.1vh;font-weight:700;color:var(--acc);background:#3be07a1a;border:.15vh solid rgba(59,224,122,.3)}.pd-who:has(.pd-coach){display:flex;align-items:center;flex-wrap:wrap;gap:1vh 0}.pd-items{list-style:none;margin-top:3vh;border-top:.2vh solid var(--line);overflow:hidden}.pd-items li{display:flex;justify-content:space-between;gap:2vh;padding:1.4vh 0;border-bottom:.15vh solid var(--line);font-size:2.6vh}.pd-items li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}.pd-items li b{font-weight:700;font-variant-numeric:tabular-nums}.pd-total{margin-top:auto;padding-top:2.4vh;display:flex;align-items:flex-end;justify-content:space-between;gap:2vh}.pd-total span{font-size:3vh;font-weight:700}.pd-total small{font-family:var(--sans);font-size:2vh;color:var(--muted);font-weight:500}.pd-total b{font-size:10vh;font-weight:800;letter-spacing:-.03em;line-height:.95;color:var(--acc);font-variant-numeric:tabular-nums}.pd-pay{border-radius:3vh;background:var(--panel);border:.2vh solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.2vh;padding:4vh;text-align:center;min-height:0}.pd-method-ic svg{width:14vh;height:14vh;fill:none;stroke:var(--acc);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:2vh}.pd-pay-qr{background:#fff;color:#0b1a10;border-color:#fff;gap:.8vh;padding:3vh 4vh}.pd-pay-qr .pd-sub{color:#4b5a4f}.pd-qr-brand{font-weight:800;font-size:2.2vh;letter-spacing:.06em;text-transform:uppercase;color:#0e3d6e}.pd-qr{width:min(46vh,100%);aspect-ratio:1}.pd-qr svg{width:100%;height:100%;display:block}.pd-qr-amt{font-size:5.6vh;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.pd-qr-to{font-size:2.2vh;color:#4b5a4f;font-weight:600}.pd-pay-static{justify-content:space-between;gap:1.6vh;padding:2.4vh 3vh 2.6vh;overflow:hidden}.pd-qr-img{flex:1 1 auto;min-height:0;width:100%;object-fit:contain;border-radius:1.4vh}.pd-qr-enter{flex:none;width:100%;display:flex;align-items:center;justify-content:space-between;gap:2vh;padding:1.6vh 2.4vh;border-radius:1.8vh;background:#0e3d6e;color:#fff}.pd-qr-enter span{font-size:2.3vh;font-weight:700}.pd-qr-enter b{font-size:5vh;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.pd-sum{display:grid;grid-template-columns:1fr 1fr;gap:2vh;margin-top:3.4vh}.pd-sum div{padding:1.8vh 2.2vh;border-radius:2vh;background:var(--panel);border:.2vh solid var(--line)}.pd-sum dt{font-size:1.9vh;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.pd-sum dd{margin-top:.6vh;font-size:4vh;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.pd-prog{height:1.2vh;margin-top:2.4vh;border-radius:999px;background:var(--raise);overflow:hidden}.pd-prog i{display:block;height:100%;border-radius:inherit;background:var(--acc);transition:width .5s ease}.pd-players{border-radius:3vh;background:var(--panel);border:.2vh solid var(--line);display:flex;flex-direction:column;padding:3.4vh 3.4vh 2.4vh;min-height:0}.pd-players-hd{display:flex;align-items:baseline;justify-content:space-between;gap:2vh;margin-bottom:1.6vh}.pd-players-hd span{font-size:2vh;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.pd-players-hd small{font-size:2.2vh;font-weight:700;color:var(--acc)}.pd-pl-list{list-style:none;display:flex;flex-direction:column;gap:1.4vh;min-height:0;overflow:hidden}.pd-pl{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:2vh;padding:1.8vh 2vh;border-radius:2vh;background:var(--raise);border:.2vh solid var(--line)}.pd-pl-av{width:6vh;height:6vh;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:2.2vh;color:var(--muted);background:var(--bg);border:.2vh solid var(--line)}.pd-pl-av svg{width:3.2vh;height:3.2vh;fill:none;stroke:#062010;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.pd-pl-name{min-width:0;font-size:3vh;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pd-pl-amt{font-size:3.6vh;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.pd-pl-st{min-width:9vh;text-align:center;padding:.7vh 1.4vh;border-radius:999px;font-size:1.9vh;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--warn);background:#f5b5441f;border:.15vh solid rgba(245,181,68,.3)}.pd-pl.is-paid{background:#3be07a0f;border-color:#3be07a47}.pd-pl.is-paid .pd-pl-av{background:var(--acc);border-color:var(--acc)}.pd-pl.is-paid .pd-pl-amt{color:var(--muted)}.pd-pl.is-paid .pd-pl-st{color:var(--acc);background:#3be07a1f;border-color:#3be07a59}.pd-pl-list.is-dense{gap:.9vh}.pd-pl-list.is-dense .pd-pl{padding:1.1vh 1.8vh}.pd-pl-list.is-dense .pd-pl-av{width:4.6vh;height:4.6vh}.pd-pl-list.is-dense .pd-pl-name{font-size:2.5vh}.pd-pl-list.is-dense .pd-pl-amt{font-size:3vh}.pd-paid{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.8vh}.pd-check svg{width:20vh;height:20vh;margin-bottom:2vh}.pd-check-c{fill:none;stroke:var(--acc);stroke-width:2.5;stroke-dasharray:151;stroke-dashoffset:151;animation:pd-draw .6s ease-out forwards}.pd-check-p{fill:none;stroke:var(--acc);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40;animation:pd-draw .35s .5s ease-out forwards}.pd-paid-t{font-size:6vh;font-weight:700}.pd-paid-amt{margin:2.4vh 0 3vh;font-size:9vh;font-weight:800;color:var(--acc);letter-spacing:-.03em;font-variant-numeric:tabular-nums}@keyframes pd-draw{to{stroke-dashoffset:0}}.pd-setup{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4vh;text-align:center}.pd-setup .pd-brand{margin-bottom:4vh}.pd-warn{color:var(--warn)}.pd-counters{display:grid;grid-template-columns:repeat(3,14vh);gap:2.4vh;margin-top:3vh}.pd-counters button{height:14vh;border-radius:2vh;border:.2vh solid var(--line);background:var(--raise);color:var(--ink);font:800 6vh var(--sans);cursor:pointer}.pd-counters button:focus-visible{outline:.4vh solid var(--acc);outline-offset:.3vh}.pd-counters button.on{background:var(--acc);color:#062010;border-color:var(--acc)}.pd-foot{display:flex;align-items:center;justify-content:space-between;gap:2vh;padding:1.6vh 3vh;border-top:.2vh solid color-mix(in srgb,var(--ink) 8%,transparent)}.pd-conn{display:inline-flex;align-items:center;gap:.8vh;padding:.5vh 1.4vh;border-radius:999px;font-size:1.6vh;font-weight:700;color:var(--muted);background:var(--raise);border:.15vh solid var(--line)}.pd-conn i{width:1.1vh;height:1.1vh;min-width:7px;min-height:7px;border-radius:50%;background:var(--muted)}.pd-conn small{font-size:1.4vh;font-weight:600;opacity:.8}.pd-conn.is-on{color:var(--acc);border-color:#3be07a4d}.pd-conn.is-on i{background:var(--acc);animation:pd-pulse 1.6s ease-out infinite}.pd-conn.is-warn{color:var(--warn);border-color:#f5b54459}.pd-conn.is-warn i{background:var(--warn)}.pd-conn.is-err{color:#ff8b8b;border-color:#ff6b6b59}.pd-conn.is-err i{background:var(--err)}.pd-counter{font-size:1.6vh;font-weight:700;color:var(--faint);letter-spacing:.06em;text-transform:uppercase;padding:1vh}@keyframes pd-pulse{0%{box-shadow:0 0 #3be07a8c}70%{box-shadow:0 0 0 .9vh #3be07a00}to{box-shadow:0 0 #3be07a00}}@media(orientation:portrait){.pd-show{grid-template-columns:1fr;grid-template-rows:auto 1fr}.pd-court{font-size:5vh}.pd-total b{font-size:7vh}.pd-counters{grid-template-columns:repeat(3,12vh)}}@media(prefers-reduced-motion:reduce){.pd-check-c,.pd-check-p{animation:none;stroke-dashoffset:0}.pd-conn.is-on i{animation:none}}
