main{max-width:1000px;margin:auto;padding:32px 20px 80px}header{padding:20px;display:flex;justify-content:space-between;background:#fff}nav{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}section{margin:24px 0}#account-profile{max-width:520px;display:grid;gap:16px}label{display:grid;gap:8px}input{padding:12px;border:1px solid #cad8e9;border-radius:8px;font:inherit}#account-photo{object-fit:cover;border-radius:50%}.booking-card{border:1px solid #d6e2ef;background:#fff;border-radius:16px;padding:20px;margin:16px 0}.booking-card h3{display:flex;justify-content:space-between;gap:12px}.booking-card .actions{display:flex;gap:8px;flex-wrap:wrap}.booking-card p{line-height:1.7}.booking-card .reference{font-size:24px;letter-spacing:2px}#account-login{max-width:420px}#account-notice{color:#24557a;overflow-wrap:anywhere}#reschedule-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:16px 0}#reschedule-slots button{font-size:13px}#reschedule-slots button[aria-pressed=true]{background:#0755ce;color:white}dialog{width:min(620px,94vw);max-height:90vh;overflow:auto;padding:24px;border:0;border-radius:16px}dialog::backdrop{background:#17374880}dialog form{display:grid;gap:16px}#edit-error,#reschedule-error{color:#b12727}[hidden]{display:none!important}.section-heading{display:flex;justify-content:space-between;align-items:center}#payment-qr img{background:white}#account-content nav .active{background:#e7f0ff;color:#0755ce}
/* King of the Court entry and join sheet */
.kotc-entry{display:flex;align-items:center;gap:14px;width:100%;max-width:520px;margin:0 0 22px;padding:14px 16px;border:0;border-radius:18px;text-align:left;color:#eef3ff;background:radial-gradient(120% 140% at 0 0,#1d3a8a 0,#0b1538 55%,#050a1c 100%);box-shadow:0 10px 28px #0a1e3c33;cursor:pointer}
.kotc-entry:hover{filter:brightness(1.08)}.kotc-entry .kotc-chev{width:22px;height:22px;margin-left:auto;fill:none;stroke:#93a4d1;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;flex:none}
.kotc-crown{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,#ffd75e,#ff9f1c);box-shadow:0 0 18px #ffc83d66}.kotc-crown svg{width:26px;height:26px;fill:#3d2600}
.kotc-entry-t{display:grid;gap:1px;min-width:0}.kotc-entry-t small{font-size:10px;letter-spacing:.2em;color:#b6ff3b;font-weight:700}.kotc-entry-t b{font-size:17px}.kotc-entry-t em{font-style:normal;font-size:12.5px;color:#93a4d1}
.kotc-entry.on .kotc-entry-t em{color:#b6ff3b}.kotc-entry.on .kotc-crown{animation:kotc-glow 2s infinite}@keyframes kotc-glow{50%{box-shadow:0 0 0 6px #ffc83d33,0 0 26px #ffc83d88}}
.kotc-dialog{max-width:480px}.kotc-top{display:flex;align-items:center;gap:12px;margin-bottom:14px}.kotc-top small{font-size:10px;letter-spacing:.2em;color:#6c839d;font-weight:700}.kotc-top h2{margin:0;font-size:21px}
.kotc-me{display:flex;align-items:center;gap:14px;padding:14px;border-radius:16px;background:linear-gradient(135deg,#0b1538,#1d3a8a);color:#eef3ff}.kotc-me img,.kotc-av{flex:none;width:64px;height:64px;border-radius:50%;object-fit:cover;border:3px solid #b6ff3b;box-shadow:0 0 16px #b6ff3b55}
.kotc-av{display:grid;place-items:center;background:#8a5cf6;font-weight:800;font-size:22px}.kotc-me small{font-size:11px;color:#93a4d1}.kotc-me b{display:block;font-size:19px}.kotc-me span{font-size:12px;color:#c5d1f0}
.kotc-back{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding:12px 14px;border-radius:14px;background:#effbe2;border:1px solid #9bd36b;color:#24521a}.kotc-back small{display:block;font-size:11px}.kotc-back em{font-style:normal;font-weight:700;white-space:nowrap}
.kotc-rounds{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}.kotc-rounds li{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;padding:10px 12px;border:1px solid #dae4ef;border-radius:12px;background:#f7faff}.kotc-rounds small{grid-column:2;color:#657e96;font-size:12px}
.kotc-live{grid-row:span 2;display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:999px;background:#e9fbe0;color:#2b7a12;font-size:10px;font-weight:800;letter-spacing:.12em}.kotc-live i{width:7px;height:7px;border-radius:50%;background:#3ccf1e;animation:kotc-blink 1.2s infinite}@keyframes kotc-blink{50%{opacity:.25}}
.kotc-join{display:grid;gap:12px;margin-top:16px}.kotc-join input[name=code]{font:800 26px/1 'DM Sans',monospace;letter-spacing:.35em;text-align:center;text-transform:uppercase}.kotc-join button{min-height:50px;font-size:16px}#kotc-error,.kotc-err{color:#b12727;margin:0;min-height:1em}.kotc-hint{font-size:12px;margin:8px 0 0}
.kotc-empty{text-align:center;padding:8px 4px}.kotc-empty svg{width:54px;height:54px;fill:none;stroke:#93a4d1;stroke-width:1.8;stroke-linecap:round}.kotc-empty h3{margin:8px 0 6px;font-size:18px;color:#193b59}.kotc-empty p{margin:0 0 14px;font-size:13px}.kotc-refresh{width:100%}
.kotc-loading{display:flex;align-items:center;gap:10px;color:#657e96}.kotc-loading span{width:18px;height:18px;border-radius:50%;border:2px solid #cad8e9;border-top-color:#145bc9;animation:kotc-spin .8s linear infinite}@keyframes kotc-spin{to{transform:rotate(360deg)}}
/* Sign out sits in the top-right corner of the profile card (the tab row above holds only the hidden tabs) */
#account-profile{position:relative}
.logout-corner{position:absolute;top:16px;right:16px;display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 12px;border:1px solid #f1c4c4;border-radius:999px;background:#fff5f5;color:#b42323;font-size:13px;font-weight:600;cursor:pointer}
.logout-corner svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.logout-corner:hover{background:#ffe9e9}
.has-customer-nav #account-content>nav{display:none}
#account-profile:has(#account-photo[hidden]){padding-top:68px}
/* Phone + password sign-in and sign-up */
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:#e7eef8;border-radius:12px;padding:4px;margin:14px 0 12px;max-width:440px}
.auth-tabs button{border:0;background:none;border-radius:9px;padding:9px;font:inherit;font-weight:600;color:#5d7189;cursor:pointer}.auth-tabs [aria-selected=true]{background:#fff;color:#14304f;box-shadow:0 1px 3px #0b2a5b1f}
.auth-form{display:grid;gap:12px;max-width:440px}.auth-form label{display:grid;gap:6px;font-weight:600;font-size:14px}
.auth-form input{font:inherit;font-weight:400;border:1px solid #cfdbea;border-radius:10px;padding:11px 12px;width:100%;background:#fff}
.auth-proof{background:#fff7e6;border:1px solid #f4dfb0;border-radius:12px;padding:10px 12px}.auth-proof small{font-weight:400;font-size:12.5px;color:#8a5a00}
.auth-error{max-width:440px;background:#fdecef;color:#b4233a;border-radius:10px;padding:10px 12px;font-size:14px}
.auth-or{display:flex;align-items:center;gap:10px;max-width:440px;margin:18px 0 12px;color:#7a8aa0;font-size:13px}.auth-or::before,.auth-or::after{content:'';flex:1;height:1px;background:#dfe7f1}
#account-login .google-signin,#account-login .line-signin{max-width:440px;box-sizing:border-box}
.auth-note{margin:0;font-size:13.5px;color:#5d7189}
[hidden]{display:none!important}
.line-signin{display:flex;align-items:center;justify-content:center;gap:10px;background:#06c755;border:0;border-radius:6px;color:#fff;width:100%;min-height:48px;padding:12px;margin:0 0 10px;font:600 16px 'Noto Sans Thai',Arial,sans-serif;cursor:pointer}.line-signin:hover{background:#05b34c}.line-signin:focus-visible{outline:3px solid #0b2a5b;outline-offset:2px}.line-signin[hidden]{display:none}
/* Linked accounts */
.link-box{max-width:520px;margin:6px 0 20px}.link-box h2{margin-bottom:10px}
.link-row{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #dfe7f1;border-radius:14px;padding:12px 14px;flex-wrap:wrap}
.link-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#06c755;color:#fff;font:800 11px/1 Arial,sans-serif;letter-spacing:.02em;flex:none}
.link-text{flex:1;min-width:180px;display:flex;flex-direction:column}.link-text small{color:#5d7189;font-size:12.5px;line-height:1.5}
.link-box.on .link-row{border-color:#bfe6d2;background:#f3fbf6}
.link-btn{width:auto!important;min-height:40px!important;margin:0!important;padding:9px 16px!important;font-size:14px!important;border-radius:10px!important}