:root{--color-bg:#f3f6f1;--color-bg-elevated:#fff;--color-surface:#e7efe4;--color-ink:#15241c;--color-ink-muted:#4a6356;--color-brand:#1a3d2e;--color-brand-soft:#2a5a43;--color-accent:#b8e038;--color-accent-ink:#1a3d2e;--color-danger:#b42318;--color-danger-soft:#fef3f2;--color-border:#1a3d2e1f;--color-shadow:#15241c14;--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--font-display:"Outfit", system-ui, sans-serif;--font-body:"DM Sans", system-ui, sans-serif;--nav-height:68px;--safe-bottom:env(safe-area-inset-bottom,0px);--safe-top:env(safe-area-inset-top,0px);--max-width:480px}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{min-height:100dvh;font-family:var(--font-body);color:var(--color-ink);background:radial-gradient(ellipse 120% 80% at 10% -20%, #b8e03838, transparent 50%), radial-gradient(ellipse 90% 60% at 100% 0%, #2a5a4324, transparent 45%), linear-gradient(180deg, #eef4eb 0%, var(--color-bg) 40%, #e8efe5 100%);background-attachment:fixed;margin:0;line-height:1.45}#root{min-height:100dvh}button,input,select{font:inherit}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}h1,h2,h3{font-family:var(--font-display);letter-spacing:-.02em;margin:0}p{margin:0}.app-shell{width:min(100%, var(--max-width));min-height:100dvh;padding-top:var(--safe-top);padding-bottom:calc(var(--nav-height) + var(--safe-bottom) + 12px);flex-direction:column;margin:0 auto;display:flex}.app-main{flex:1;padding:20px 20px 28px;animation:.35s both fadeRise}@keyframes fadeRise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.page-header{margin-bottom:20px}.page-header h1{color:var(--color-brand);font-size:1.75rem}.page-header p{color:var(--color-ink-muted);margin-top:6px;font-size:.95rem}.btn{cursor:pointer;border:none;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:14px 22px;font-weight:600;transition:transform .15s,background .15s,opacity .15s;display:inline-flex}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn-primary{background:var(--color-brand);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-brand-soft)}.btn-accent{background:var(--color-accent);color:var(--color-accent-ink)}.btn-accent:hover:not(:disabled){filter:brightness(1.05)}.btn-ghost{color:var(--color-brand);border:1.5px solid var(--color-border);background:0 0}.btn-danger{background:var(--color-danger-soft);color:var(--color-danger)}.btn-block{width:100%}.field{flex-direction:column;gap:6px;margin-bottom:14px;display:flex}.field label{color:var(--color-ink-muted);font-size:.85rem;font-weight:600}.field input,.field select{border:1.5px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg-elevated);color:var(--color-ink);outline:none;padding:12px 14px;transition:border-color .15s,box-shadow .15s}.field input:focus,.field select:focus{border-color:var(--color-brand-soft);box-shadow:0 0 0 3px #2a5a4326}.empty-state{text-align:center;color:var(--color-ink-muted);padding:48px 20px}.empty-state h2{color:var(--color-brand);margin-bottom:8px}.empty-state p{margin-bottom:20px}.success-banner{border-radius:var(--radius-md);background:linear-gradient(135deg,#b8e03859,#2a5a431f);border:1px solid #b8e03880;margin-bottom:18px;padding:14px 16px;animation:.4s both fadeRise}.success-banner strong{color:var(--color-brand);margin-bottom:2px;display:block}.section-label{letter-spacing:.06em;text-transform:uppercase;color:var(--color-ink-muted);margin:0 0 10px;font-size:.8rem;font-weight:700}.bottom-nav{width:min(100%, var(--max-width));height:calc(var(--nav-height) + var(--safe-bottom));padding:8px 12px var(--safe-bottom);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--color-border);z-index:40;background:#ffffffeb;grid-template-columns:repeat(3,1fr);gap:4px;display:grid;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.bottom-nav a{color:var(--color-ink-muted);border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:4px;font-size:.72rem;font-weight:600;transition:background .15s,color .15s;display:flex}.bottom-nav a svg{width:22px;height:22px}.bottom-nav a.active{color:var(--color-brand);background:var(--color-surface)}.home-hero{min-height:calc(100dvh - var(--nav-height) - var(--safe-top) - var(--safe-bottom) - 40px);flex-direction:column;justify-content:flex-end;padding-bottom:8px;display:flex;position:relative}.home-hero:before{content:"";z-index:0;background:linear-gradient(160deg,#1a3d2eeb,#2a5a43bf),repeating-linear-gradient(-18deg,#0000,#0000 18px,#b8e0380f 18px 19px);border-radius:0 0 40% 40%/0 0 18% 18%;height:58%;animation:8s ease-in-out infinite alternate heroGlow;position:absolute;inset:-20px -20px auto}@keyframes heroGlow{0%{filter:saturate()}to{filter:saturate(1.15)brightness(1.05)}}.home-brand{z-index:1;color:#fff;padding:48px 8px 36px;position:relative}.home-brand .eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--color-accent);margin-bottom:14px;font-size:.75rem;font-weight:700;display:inline-block}.home-brand h1{margin-bottom:14px;font-size:clamp(2.8rem,12vw,3.6rem);font-weight:800;line-height:.95}.home-brand p{opacity:.9;max-width:28ch;font-size:1.05rem}.home-actions{z-index:1;flex-direction:column;gap:12px;margin-top:auto;padding-top:24px;display:flex;position:relative}.home-admin-link{color:var(--color-ink-muted);text-underline-offset:3px;align-self:center;margin-top:4px;font-size:.85rem;font-weight:600;text-decoration:underline}.home-admin-link:hover{color:var(--color-brand)}.court-list{flex-direction:column;gap:12px;display:flex}.court-card{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:0 8px 24px var(--color-shadow);padding:16px 16px 16px 18px;transition:transform .18s,box-shadow .18s;display:block;position:relative;overflow:hidden}.court-card:before{content:"";background:var(--color-accent);width:5px;position:absolute;top:0;bottom:0;left:0}.court-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px #15241c1f}.court-card:active{transform:scale(.99)}.court-card h2{color:var(--color-brand);margin-bottom:4px;font-size:1.15rem}.court-card .meta{color:var(--color-ink-muted);margin-bottom:12px;font-size:.9rem}.court-tags{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.tag{background:var(--color-surface);color:var(--color-brand);border-radius:999px;padding:4px 10px;font-size:.75rem;font-weight:600}.court-price{color:var(--color-brand);margin-left:auto;font-size:.95rem;font-weight:700}.date-scroller{scrollbar-width:none;gap:8px;margin-bottom:20px;padding-bottom:6px;display:flex;overflow-x:auto}.date-scroller::-webkit-scrollbar{display:none}.date-chip{border:1.5px solid var(--color-border);background:var(--color-bg-elevated);border-radius:var(--radius-md);text-align:center;cursor:pointer;flex:none;width:64px;padding:10px 6px;transition:background .15s,border-color .15s,transform .15s}.date-chip .weekday{color:var(--color-ink-muted);text-transform:uppercase;font-size:.7rem;font-weight:600;display:block}.date-chip .day{font-family:var(--font-display);color:var(--color-brand);margin-top:2px;font-size:1.25rem;font-weight:700;display:block}.date-chip.selected{background:var(--color-brand);border-color:var(--color-brand);transform:translateY(-2px)}.date-chip.selected .weekday,.date-chip.selected .day{color:#fff}.slot-grid{grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:22px;display:grid}.slot-btn{border:1.5px solid var(--color-border);background:var(--color-bg-elevated);border-radius:var(--radius-sm);color:var(--color-brand);cursor:pointer;padding:12px 8px;font-size:.9rem;font-weight:600;transition:background .15s,border-color .15s,transform .12s}.slot-btn:hover:not(:disabled){border-color:var(--color-brand-soft)}.slot-btn.selected{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-accent-ink);transform:scale(1.04)}.slot-btn:disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}.step-block{margin-bottom:22px}.court-select{flex-direction:column;gap:8px;display:flex}.court-option{text-align:left;border:1.5px solid var(--color-border);background:var(--color-bg-elevated);border-radius:var(--radius-sm);cursor:pointer;padding:12px 14px;transition:border-color .15s,background .15s}.court-option.selected{border-color:var(--color-brand);background:var(--color-surface)}.court-option strong{color:var(--color-brand);display:block}.court-option span{color:var(--color-ink-muted);font-size:.85rem}.summary-line{background:var(--color-surface);border-radius:var(--radius-sm);color:var(--color-ink-muted);margin-bottom:16px;padding:12px 14px;font-size:.9rem}.summary-line strong{color:var(--color-brand)}.booking-list{flex-direction:column;gap:12px;display:flex}.booking-card{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:0 6px 18px var(--color-shadow);padding:16px}.booking-card h3{color:var(--color-brand);margin-bottom:6px;font-size:1.05rem}.booking-card .detail{color:var(--color-ink-muted);margin-bottom:2px;font-size:.9rem}.booking-card .actions{margin-top:12px}.booking-group{margin-bottom:28px}.booking-group h2{color:var(--color-brand);margin-bottom:12px;font-size:1rem}.past .booking-card{opacity:.72}.install-banner{left:50%;bottom:calc(var(--nav-height) + var(--safe-bottom) + 16px);box-sizing:border-box;width:min(100% - 24px, var(--max-width));background:var(--color-brand);color:#fff;border-radius:var(--radius-md);z-index:60;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;max-width:calc(100vw - 24px);padding:14px 16px;animation:.4s both fadeRise;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 12px 32px #15241c47}.install-banner p{text-align:left;flex:160px;min-width:0;margin:0;font-size:.88rem;line-height:1.35}.install-banner strong{margin-bottom:2px;font-size:.95rem;display:block}.install-banner-actions{flex:none;justify-content:center;align-items:center;gap:8px;margin-left:auto;display:flex}.install-banner .btn{flex-shrink:0;padding:10px 14px;font-size:.85rem}.install-banner .dismiss{color:#ffffffb3;cursor:pointer;background:0 0;border:none;flex-shrink:0;padding:6px 8px;font-size:1.35rem;line-height:1}@media (width<=420px){.install-banner{text-align:center;bottom:calc(var(--nav-height) + var(--safe-bottom) + 12px);flex-direction:column;align-items:stretch;padding:14px}.install-banner p{text-align:center;flex:none;width:100%}.install-banner-actions{justify-content:center;width:100%;margin-left:0}.install-banner .btn{flex:1}}.admin-shell{width:min(100%,720px);min-height:100dvh;padding-top:var(--safe-top);padding-bottom:calc(24px + var(--safe-bottom));flex-direction:column;margin:0 auto;display:flex}.admin-login-shell{justify-content:center;padding:24px 20px}.admin-topbar{border-bottom:1px solid var(--color-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:30;background:#ffffffe0;flex-wrap:wrap;align-items:center;gap:12px 16px;padding:14px 20px;display:flex;position:sticky;top:0}.admin-brand{align-items:baseline;gap:8px;margin-right:auto;display:flex}.admin-brand-mark{font-family:var(--font-display);color:var(--color-brand);letter-spacing:-.02em;font-size:1.1rem;font-weight:800}.admin-brand-role{letter-spacing:.08em;text-transform:uppercase;color:var(--color-ink-muted);background:var(--color-surface);border-radius:999px;padding:3px 8px;font-size:.7rem;font-weight:700}.admin-nav{gap:4px;display:flex}.admin-nav a{color:var(--color-ink-muted);border-radius:999px;padding:8px 14px;font-size:.88rem;font-weight:600;transition:background .15s,color .15s}.admin-nav a.active{background:var(--color-brand);color:#fff}.admin-logout{padding:8px 14px;font-size:.85rem}.admin-main{flex:1;padding:20px 20px 28px;animation:.35s both fadeRise}.admin-login{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:min(100%,400px);box-shadow:0 16px 40px var(--color-shadow);margin:0 auto;padding:28px 24px}.admin-login-eyebrow{letter-spacing:.12em;text-transform:uppercase;color:var(--color-brand-soft);margin-bottom:8px;font-size:.75rem;font-weight:700}.admin-login-form{margin-top:8px}.admin-error{color:var(--color-danger);margin:-6px 0 14px;font-size:.9rem}.admin-hint{color:var(--color-ink-muted);text-align:center;margin-top:18px;font-size:.85rem}.admin-hint code{background:var(--color-surface);color:var(--color-brand);border-radius:6px;padding:2px 8px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-weight:600}.admin-back-link{text-align:center;color:var(--color-ink-muted);text-underline-offset:3px;margin-top:16px;font-size:.85rem;font-weight:600;text-decoration:underline;display:block}.admin-back-link:hover{color:var(--color-brand)}.admin-schedule{flex-direction:column;gap:14px;display:flex}.admin-court-day{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:0 6px 18px var(--color-shadow);padding:14px 16px}.admin-court-day-header{justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px;display:flex}.admin-court-day-header h2{color:var(--color-brand);font-size:1.05rem}.admin-court-day-header span{color:var(--color-ink-muted);white-space:nowrap;font-size:.8rem}.admin-court-empty{color:var(--color-ink-muted);padding:4px 0 2px;font-size:.9rem}.admin-slot-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.admin-slot-row{background:var(--color-surface);border-radius:var(--radius-sm);grid-template-columns:88px 1fr auto;align-items:center;gap:10px;padding:10px 12px;display:grid}.admin-slot-time{font-family:var(--font-display);color:var(--color-brand);font-size:.9rem;font-weight:700}.admin-slot-info{flex-direction:column;gap:2px;min-width:0;display:flex}.admin-slot-info strong{color:var(--color-ink);font-size:.92rem}.admin-slot-info span{color:var(--color-ink-muted);text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;overflow:hidden}.admin-slot-cancel{padding:8px 12px;font-size:.8rem}.admin-toolbar{margin-bottom:18px}.admin-search{margin-bottom:12px}.admin-filter{flex-wrap:wrap;gap:8px;display:flex}.admin-filter-chip{border:1.5px solid var(--color-border);background:var(--color-bg-elevated);color:var(--color-ink-muted);cursor:pointer;border-radius:999px;padding:8px 14px;font-size:.85rem;font-weight:600;transition:background .15s,border-color .15s,color .15s}.admin-filter-chip.selected{background:var(--color-brand);border-color:var(--color-brand);color:#fff}.admin-booking-meta{justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px;display:flex}.admin-booking-meta h3{margin-bottom:0}.admin-booking-tags{flex-wrap:wrap;justify-content:flex-end;gap:6px;display:flex}.admin-booking-actions{flex-wrap:wrap;gap:8px;display:flex}.admin-booking-actions .btn{padding:10px 16px;font-size:.85rem}.admin-slot-info .payment-chip{white-space:nowrap;text-overflow:unset;align-self:flex-start;margin-top:4px;overflow:visible}@media (width<=520px){.admin-slot-row{grid-template-columns:1fr auto;grid-template-areas:"time cancel""info cancel"}.admin-slot-time{grid-area:time}.admin-slot-info{grid-area:info}.admin-slot-cancel{grid-area:cancel;align-self:center}.admin-topbar{padding:12px 16px}.admin-logout{width:100%}}.booking-card-top{justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:6px;display:flex}.booking-card-top h3{margin-bottom:0}.payment-chip{letter-spacing:.02em;white-space:nowrap;border-radius:999px;flex-shrink:0;align-items:center;padding:4px 10px;font-size:.72rem;font-weight:700;display:inline-flex}.payment-chip.awaiting{color:#9a5b00;background:#fff4e5}.payment-chip.review{color:#1f4b99;background:#eef4ff}.payment-chip.paid{color:var(--color-brand);background:#b8e03859}.amount-due{margin-top:6px}.amount-due strong{color:var(--color-brand)}.payment-panel{border-top:1px solid var(--color-border);margin-top:14px;padding-top:12px}.payment-instructions{background:var(--color-surface);border-radius:var(--radius-sm);color:var(--color-ink-muted);margin-bottom:12px;padding:12px 14px;font-size:.9rem}.payment-instructions p{margin-bottom:4px}.payment-instructions p:last-child{margin-bottom:0}.payment-account{font-family:var(--font-display);letter-spacing:.02em;font-size:1.1rem;font-weight:700;color:var(--color-brand)!important}.payment-reject{background:var(--color-danger-soft);color:var(--color-danger);border-radius:var(--radius-sm);margin-bottom:12px;padding:10px 12px;font-size:.88rem}.payment-upload-btn{cursor:pointer;position:relative}.payment-upload-btn input{opacity:0;cursor:pointer;position:absolute;inset:0}.payment-upload-error{color:var(--color-danger);margin-top:8px;font-size:.85rem}.payment-proof{margin-top:12px}.payment-proof-thumb{border-radius:var(--radius-sm);cursor:pointer;width:120px;height:120px;box-shadow:0 4px 14px var(--color-shadow);background:0 0;border:none;padding:0;display:block;overflow:hidden}.payment-proof-thumb img{object-fit:cover;width:100%;height:100%}.proof-lightbox{z-index:100;background:#15241cd1;justify-content:center;align-items:center;padding:24px;animation:.2s both fadeRise;display:flex;position:fixed;inset:0}.proof-lightbox img{border-radius:var(--radius-md);max-width:min(100%,720px);max-height:calc(100dvh - 96px);box-shadow:0 20px 48px #00000059}.proof-lightbox-close{top:calc(12px + var(--safe-top));color:var(--color-brand);cursor:pointer;background:#ffffffeb;border:none;border-radius:999px;padding:10px 16px;font-weight:700;position:absolute;right:16px}