:root{--bg:#f7f9fb;--surface:#fff;--surface-soft:#f1f5f9;--text:#172033;--muted:#64748b;--border:#d8e0ea;--border-strong:#c4ceda;--blue:#1f6feb;--blue-dark:#1557bb;--green-bg:#dff7e6;--green-fg:#176a37;--green-border:#8fd3a4;--yellow-bg:#fff2ba;--yellow-fg:#84610b;--yellow-border:#e2bf4f;--red-bg:#ffd9d7;--red-fg:#9b2421;--red-border:#e88e89;--shadow:0 18px 45px #0f172a14;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:geometricprecision;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:var(--bg)}body{min-width:320px;margin:0}button,input{font:inherit}a{color:inherit}.app-shell{width:min(1400px,100vw - 40px);margin:0 auto;padding:28px 0 42px}.topbar{justify-content:space-between;align-items:center;gap:24px;margin-bottom:18px;display:flex}.title-group{align-items:center;gap:16px;display:flex}.mark{color:#184f93;background:#eaf3ff;border:1px solid #bfdbfe;border-radius:8px;place-items:center;width:52px;height:52px;font-size:14px;font-weight:800;display:grid}h1,h2,p{margin:0}h1{letter-spacing:0;font-size:clamp(28px,4vw,40px);font-weight:780;line-height:1.05}.title-group p,.park-header p{color:var(--muted);margin-top:6px;font-size:14px;line-height:1.45}.toolbar{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.date-tabs,.date-tab,.source-link{border:1px solid var(--border);border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:42px;font-size:14px;font-weight:700;line-height:1;display:inline-flex}.date-tabs{border-color:var(--border-strong);background:var(--surface);gap:0;overflow:hidden}.date-tab{border:0;border-right:1px solid var(--border);min-width:108px;color:var(--text);cursor:pointer;background:0 0;border-radius:0;flex-direction:column;gap:4px;padding:7px 12px;font-weight:700}.date-tab:last-child{border-right:0}.date-tab span{font-size:13px}.date-tab small{color:var(--muted);font-size:12px;font-weight:750}.date-tab:hover{background:var(--surface-soft)}.date-tab.active{background:var(--blue);color:#fff}.date-tab.active:hover{background:var(--blue-dark)}.date-tab.active small{color:#dbeafe}.source-link:hover{border-color:var(--border-strong);background:var(--surface-soft)}.status-strip{grid-template-columns:repeat(4,minmax(130px,1fr)) auto;align-items:stretch;gap:10px;margin-bottom:14px;display:grid}.status-strip>div,.source-link{border:1px solid var(--border);background:var(--surface);border-radius:8px;min-height:62px;padding:12px 14px;box-shadow:0 1px #0f172a08}.meta-label{color:var(--muted);text-transform:uppercase;margin-bottom:6px;font-size:12px;font-weight:750;display:block}.status-strip strong{font-size:17px;font-weight:780}.source-link{text-decoration:none}.legend{flex-wrap:wrap;gap:10px;margin-bottom:14px;display:flex}.legend-item{border:1px solid var(--border);background:var(--surface);min-height:34px;color:var(--muted);border-radius:8px;align-items:center;gap:8px;padding:0 12px;font-size:13px;font-weight:700;display:inline-flex}.legend-dot{border:1px solid;border-radius:3px;width:12px;height:12px}.legend-dot.dropin{background:var(--green-bg);color:var(--green-border)}.legend-dot.open{background:var(--yellow-bg);color:var(--yellow-border)}.legend-dot.reserved{background:var(--red-bg);color:var(--red-border)}.warning-banner{color:#74520b;background:#fff8df;border:1px solid #f2cb74;border-radius:8px;margin-bottom:14px;padding:12px 14px;font-size:14px;font-weight:650}.warning-banner.error{border-color:var(--red-border);color:var(--red-fg);background:#fff1f0}.schedule{border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow);border-radius:8px;overflow-x:auto}.time-axis{grid-template-columns:150px repeat(calc(var(--slot-count) / 2), minmax(116px, 1fr));border-bottom:1px solid var(--border);background:#fbfcfe;min-width:980px;display:grid}.court-axis-label,.hour-cell{border-right:1px solid var(--border);min-height:46px;color:var(--muted);text-transform:uppercase;align-items:center;font-size:12px;font-weight:800;display:flex}.court-axis-label{z-index:3;background:#fbfcfe;padding-left:16px;position:sticky;left:0}.hour-cell{justify-content:center}.hour-cell:last-child{border-right:0}.park-section+.park-section{border-top:1px solid var(--border)}.park-header{background:var(--surface);justify-content:space-between;align-items:center;gap:16px;min-width:980px;padding:18px 18px 14px;display:flex}.park-header h2{letter-spacing:0;font-size:21px;font-weight:780;line-height:1.15}.court-list{min-width:980px;padding:0 14px 16px}.court-row{grid-template-columns:136px 1fr;align-items:stretch;display:grid}.court-row+.court-row{margin-top:8px}.court-label{z-index:2;border:1px solid var(--border);background:#fbfcfe;border-right:0;border-radius:8px 0 0 8px;align-items:center;min-height:44px;padding:0 12px;font-size:14px;font-weight:800;display:flex;position:sticky;left:14px}.slot-grid{grid-template-columns:repeat(var(--slot-count), minmax(58px, 1fr));min-height:44px;display:grid}.slot-cell{min-height:44px;color:var(--text);white-space:nowrap;border:1px solid;border-left:0;justify-content:center;align-items:center;font-size:11px;font-weight:800;line-height:1;display:flex;position:relative;overflow:hidden}.slot-cell:nth-child(odd){border-left:1px solid #0f172a0f}.slot-cell:nth-child(2n){border-right-color:#0f172a33}.slot-cell:last-child{border-radius:0 8px 8px 0}.slot-cell.dropin{border-color:var(--green-border);background:var(--green-bg);color:var(--green-fg)}.slot-cell.open{border-color:var(--yellow-border);background:var(--yellow-bg);color:var(--yellow-fg)}.slot-cell.reserved{border-color:var(--red-border);background:var(--red-bg);color:var(--red-fg)}.loading-state{min-width:980px;min-height:260px;color:var(--muted);justify-content:center;align-items:center;gap:10px;font-size:15px;font-weight:750;display:flex}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=880px){.app-shell{width:min(100vw - 24px,1400px);padding-top:18px}.topbar{flex-direction:column;align-items:flex-start}.toolbar{justify-content:flex-start;width:100%}.status-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.source-link{grid-column:1/-1}}@media (width<=560px){.title-group{align-items:flex-start}.mark{width:44px;height:44px}h1{font-size:28px}.date-tabs{width:100%}.date-tab{flex:1;min-width:0}.status-strip{grid-template-columns:1fr}}
