#pins-counter-mock{--pc-bg:light-dark(#f4f5f1,#151b18);--pc-surface:light-dark(#ffffff,#202923);--pc-text:light-dark(#1c2b20,#eff4ee);--pc-muted:light-dark(#586759,#b6c4b8);--pc-line:light-dark(#dbe2d8,#3c4b3f);--pc-green:light-dark(#deedce,#354e2b);--pc-blue:light-dark(#dce8f2,#304451);--pc-orange:light-dark(#f6e6cc,#4d402c);--pc-child:light-dark(#f3dbe8,#543346);--pc-youth:light-dark(#e5dff6,#413651);--pc-adult:light-dark(#f6e6cc,#4d402c);--pc-jga:light-dark(#f6d5d0,#572f2a);--pc-school:light-dark(#deedce,#354e2b);--pc-firm:light-dark(#ceeae8,#254947);--pc-firm2:light-dark(#dce1f9,#333d63);--pc-firm3:light-dark(#f1e1b5,#514626);--pc-buffet:light-dark(#f6d8b8,#5b3b23);--pc-blocked:light-dark(#e2e4e3,#404641);font:14px Arial,sans-serif;color:var(--pc-text);background:var(--pc-bg);border-radius:14px;overflow:hidden}#pins-counter-mock *{box-sizing:border-box}#pins-counter-mock button,#pins-counter-mock input{font:inherit}#pins-counter-mock button{color:var(--pc-text);border:1px solid var(--pc-line);background:var(--pc-surface);border-radius:7px;padding:10px 13px;min-height:42px}#pins-counter-mock button.pc-main{background:var(--pc-text);color:var(--pc-bg)}#pins-counter-mock .pc-top{padding:18px 22px;background:var(--pc-surface);display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;border-bottom:1px solid var(--pc-line)}#pins-counter-mock .pc-brand{font-size:24px;font-weight:700;letter-spacing:-1px}#pins-counter-mock .pc-small{font-size:12px;color:var(--pc-muted)}#pins-counter-mock .pc-content{padding:20px}#pins-counter-mock .pc-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:18px}#pins-counter-mock .pc-toolbar strong{margin-right:auto}#pins-counter-mock .pc-table{background:var(--pc-surface);border:1px solid var(--pc-line);border-radius:9px;overflow:hidden}#pins-counter-mock .pc-row{display:grid;grid-template-columns:85px repeat(7,minmax(0,1fr));min-height:42px;position:relative}#pins-counter-mock .pc-row>div{padding:10px 4px;border-bottom:1px solid var(--pc-line);border-right:1px solid var(--pc-line);text-align:center;min-width:0}#pins-counter-mock .pc-row>div:first-child{text-align:left;padding-left:14px}#pins-counter-mock .pc-row.pc-pair-end{border-bottom:2px solid var(--pc-line)}#pins-counter-mock .pc-row .pc-booking{margin:3px;padding:7px 9px;text-align:left;border:0;border-radius:5px;min-height:34px;font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#pins-counter-mock .pc-booking.bowling{background:var(--pc-blue)}#pins-counter-mock .pc-booking.child{background:var(--pc-child)}#pins-counter-mock .pc-booking.youth{background:var(--pc-youth)}#pins-counter-mock .pc-booking.adult{background:var(--pc-adult)}#pins-counter-mock .pc-booking.jga{background:var(--pc-jga)}#pins-counter-mock .pc-booking.school{background:var(--pc-school)}#pins-counter-mock .pc-booking.firm{background:var(--pc-firm)}#pins-counter-mock .pc-booking.firm2{background:var(--pc-firm2)}#pins-counter-mock .pc-booking.firm3{background:var(--pc-firm3)}#pins-counter-mock .pc-buffet{display:inline-block;background:var(--pc-buffet);color:var(--pc-text);padding:2px 5px;border-radius:4px;margin-left:6px;font-size:11px}#pins-counter-mock .pc-booking.blocked{background:var(--pc-blocked)}#pins-counter-mock .pc-legend{display:flex;gap:18px;margin:16px 0;flex-wrap:wrap;font-size:12px}#pins-counter-mock .pc-dot{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}#pins-counter-mock .pc-detail{background:var(--pc-surface);padding:18px;border:1px solid var(--pc-line);border-radius:9px;display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap}#pins-counter-mock .pc-login{max-width:350px;margin:25px auto;background:var(--pc-surface);padding:25px;border-radius:12px;border:1px solid var(--pc-line)}#pins-counter-mock .pc-login input{display:block;width:100%;margin:10px 0 14px;padding:14px;border:1px solid var(--pc-line);border-radius:8px;background:var(--pc-bg);color:var(--pc-text);letter-spacing:10px;text-align:center;font-size:22px}#pins-counter-mock .pc-login button{width:100%}#pins-counter-mock [hidden]{display:none!important}@media(max-width:580px){#pins-counter-mock .pc-content{padding:12px}#pins-counter-mock .pc-row{grid-template-columns:62px repeat(7,minmax(0,1fr))}#pins-counter-mock .pc-row>div{font-size:11px;padding:12px 0}#pins-counter-mock .pc-row>div:first-child{padding-left:6px}#pins-counter-mock .pc-row .pc-booking{padding:7px 3px;font-size:11px}#pins-counter-mock .pc-top{padding:14px}}

#pins-counter-mock .pc-availability{padding:18px;background:var(--pc-surface);border:1px solid var(--pc-line);border-radius:9px;margin-bottom:18px}
#pins-counter-mock .pc-window{display:flex;gap:14px;align-items:end;flex-wrap:wrap;margin-bottom:18px}
#pins-counter-mock .pc-window label{display:flex;flex-direction:column;gap:7px;color:var(--pc-muted)}
#pins-counter-mock select{font:inherit;color:var(--pc-text);background:var(--pc-bg);border:1px solid var(--pc-line);border-radius:7px;padding:10px;min-height:42px}
#pins-counter-mock .pc-counts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
#pins-counter-mock .pc-counts strong{font-size:28px;display:block;margin-bottom:4px}
#pins-counter-mock .pc-pairs{padding-top:12px;color:var(--pc-muted)}
#pins-counter-mock .pc-hours{display:grid;grid-template-columns:repeat(auto-fit,minmax(74px,1fr));gap:7px;margin-top:10px}
#pins-counter-mock .pc-hours button{padding:8px 5px;text-align:center}
#pins-counter-mock .pc-hours button[aria-pressed=true]{background:var(--pc-text);color:var(--pc-bg)}
#pins-counter-mock .pc-hours .pc-hour-free{display:block;font-size:12px;margin-top:4px}
#pins-counter-mock .pc-hour-track{height:5px;background:var(--pc-line);border-radius:3px;margin-top:8px;overflow:hidden}
#pins-counter-mock .pc-hour-fill{height:100%;background:var(--pc-muted)}
#pins-counter-mock .pc-hours button[aria-pressed=true] .pc-hour-fill{background:var(--pc-bg)}

#pins-counter-mock{min-height:100vh;border-radius:0}#pins-counter-mock .pc-content{max-width:1500px;margin:auto}#pins-counter-mock .notice{padding:10px 22px;background:var(--pc-orange);color:var(--pc-text);font-size:12px}#pins-counter-mock .timeline-wrap{overflow-x:auto}#pins-counter-mock .pc-row{min-width:1100px}#pins-counter-mock .lane-track{position:relative;grid-column:2/-1;min-height:44px;padding:0;border:0;background:repeating-linear-gradient(to right,transparent 0,transparent calc(var(--unit) - 1px),var(--pc-line) calc(var(--unit) - 1px),var(--pc-line) var(--unit))}#pins-counter-mock .lane-track .pc-booking{position:absolute;top:3px;margin:0;height:36px;min-height:36px}#pins-counter-mock .fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}#pins-counter-mock label{display:flex;flex-direction:column;gap:8px}#pins-counter-mock input{font:inherit;padding:12px;background:var(--pc-bg);color:var(--pc-text);border:1px solid var(--pc-line);border-radius:7px;min-width:0}#pins-counter-mock .form-panel{max-width:760px;padding:24px;background:var(--pc-surface);border:1px solid var(--pc-line);border-radius:12px;margin:20px auto}#pins-counter-mock .error{color:light-dark(#9d2525,#ffb6a2)}#pins-counter-mock .summary{margin:18px 0;color:var(--pc-muted)}#pins-counter-mock .actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}#pins-counter-mock footer{padding:22px;color:var(--pc-muted);font-size:12px}#pins-counter-mock .qr svg{width:220px;height:220px;background:#fff;padding:10px}#detail{font:14px Arial;background:light-dark(#fff,#202923);color:light-dark(#1c2b20,#eff4ee);border:1px solid light-dark(#dbe2d8,#3c4b3f);border-radius:12px;max-width:540px;width:90%;padding:26px}#detail::backdrop{background:#0008}#detail button{font:inherit;padding:12px;border-radius:7px;border:1px solid #aaa;margin:4px}#detail .detail-row{display:flex;justify-content:space-between;gap:14px;padding:14px 0;border-bottom:1px solid #8885}#detail .error{color:light-dark(#9d2525,#ffb6a2)}body{margin:0;color-scheme:light dark}[hidden]{display:none!important}@media(max-width:650px){#pins-counter-mock .fields{grid-template-columns:1fr}#pins-counter-mock .pc-toolbar input{width:100%}}