body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{background:#fff8fb}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}:root{color:#273044;background:#fff8fb}*{box-sizing:border-box}button{font:inherit}.date-app{min-height:100vh;display:grid;grid-template-columns:minmax(280px,360px) 1fr;background:linear-gradient(140deg,#ffdce2d1,#daecffb8 42%,#e0f4e2b8),#fff8fb}.district-panel{min-height:100vh;padding:32px 22px;display:flex;flex-direction:column;gap:28px;background:#ffffffad;border-right:1px solid rgba(143,124,138,.14);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.brand-block{display:grid;gap:12px}.brand-meta{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.eyebrow{color:#846b8a;font-size:.76rem;font-weight:800;letter-spacing:0;text-transform:uppercase}h1,h2,h3,p{margin:0}h1{max-width:12ch;font-size:clamp(2rem,4vw,3.25rem);line-height:1.03;color:#28304d}.brand-block p{color:#696072;line-height:1.55}.district-list{display:grid;gap:10px;overflow:auto;padding-right:4px}.district-button{width:100%;border:1px solid transparent;border-radius:8px;padding:14px 15px;display:grid;gap:5px;color:#37405a;background:#ffffffad;text-align:left;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}.district-button:hover{transform:translateY(-1px);border-color:#c58ea96b;box-shadow:0 10px 28px #9070891f}.district-button.active{background:#fff0f5;border-color:#edb9cb;box-shadow:0 12px 34px #d997b23d}.district-button span{font-weight:800}.district-button small{color:#7c7285;line-height:1.35}.recommendation-view{padding:44px;display:grid;align-content:start;gap:28px}.hero{min-height:300px;padding:36px;display:grid;grid-template-columns:1fr minmax(260px,360px);align-items:end;gap:28px;color:#25304d;border-radius:8px;overflow:hidden;background:linear-gradient(90deg,#ffffffe0,#ffffff80),url(https://images.unsplash.com/photo-1538485399081-7191377e8241?auto=format&fit=crop&w=1600&q=80);background-position:center;background-size:cover;box-shadow:0 24px 70px #5f546c29}.hero h2{margin-top:8px;font-size:clamp(3rem,7vw,6rem);line-height:.95}.hero p{margin-top:16px;max-width:48rem;color:#5e6475;font-size:1.2rem;font-weight:700}.live-stack{display:grid;gap:12px}.live-card{border:1px solid rgba(255,255,255,.72);border-radius:8px;padding:18px;display:grid;gap:7px;background:#ffffffc7;box-shadow:0 18px 48px #5d4e6724}.live-card span,.spot-footer span{color:#766c82;font-size:.78rem;font-weight:800}.live-card strong{font-size:1.06rem;line-height:1.35}.live-card small{color:#766c82}.weather{background:#e8f4ffd1}.spot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.spot-card{min-height:290px;border:1px solid rgba(126,109,128,.12);border-radius:8px;padding:22px;display:grid;grid-template-rows:auto 1fr auto;gap:18px;background:#ffffffb8;box-shadow:0 18px 55px #5c4d681f}.spot-card:nth-child(2){background:#f3fbeac7}.spot-card:nth-child(3){background:#efeeffc7}.rank{width:54px;height:54px;display:grid;place-items:center;border-radius:50%;color:#8a5369;background:#ffe0ea;font-weight:900}.tag{display:inline-flex;width:fit-content;border-radius:999px;padding:7px 10px;color:#6b6377;background:#ffffffb8;font-size:.82rem;font-weight:800}.spot-card h3{margin-top:16px;color:#27304c;font-size:1.55rem;line-height:1.15}.spot-card p{margin-top:12px;color:#686176;line-height:1.6}.spot-footer{border-top:1px solid rgba(120,104,127,.13);padding-top:16px;display:flex;align-items:center;justify-content:space-between;gap:12px}.spot-footer strong{color:#53698f}@media (max-width: 1050px){.date-app{grid-template-columns:1fr}.district-panel{min-height:auto;border-right:0;border-bottom:1px solid rgba(143,124,138,.14)}h1{max-width:100%}.district-list{grid-template-columns:repeat(2,minmax(0,1fr));max-height:380px}.recommendation-view{padding:28px}.hero,.spot-grid{grid-template-columns:1fr}}@media (max-width: 640px){.district-panel,.recommendation-view{padding:20px}.district-list{grid-template-columns:1fr;max-height:330px}.hero{min-height:420px;padding:24px;align-items:end}.hero h2{font-size:3.2rem}.spot-card{min-height:250px}}