@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap";html,body,#root{box-sizing:border-box;width:100%;min-height:100vh;margin:0;padding:0}:root{--bg-primary:#f0f4f8;--bg-sidebar:#fff;--text-primary:#1e293b;--text-secondary:#64748b;--text-muted:#94a3b8;--primary-color:#0284c7;--primary-light:#e0f2fe;--primary-dark:#0369a1;--color-offshore:#10b981;--color-offshore-light:#ecfdf5;--color-onshore:#ef4444;--color-onshore-light:#fef2f2;--color-cross:#f59e0b;--color-cross-light:#fffbeb;--color-glassy:#06b6d4;--color-glassy-light:#ecfeff;--star-gold:#f59e0b;--border-color:#e2e8f0;--radius-lg:18px;--radius-md:12px;--radius-sm:8px;--shadow-sm:0 1px 3px #0000000d;--shadow-md:0 10px 15px -3px #0f172a0d, 0 4px 6px -4px #0f172a0d;--shadow-lg:0 20px 25px -5px #0f172a14, 0 8px 10px -6px #0f172a14;--transition:all .25s cubic-bezier(.4, 0, .2, 1)}@media (prefers-color-scheme:dark){:root{--bg-primary:#090f1d;--bg-sidebar:#0f172a;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--border-color:#1e293b;--primary-light:#075985;--color-offshore-light:#10b98114;--color-onshore-light:#ef444414;--color-cross-light:#f59e0b14;--color-glassy-light:#06b6d414}}*{box-sizing:border-box;margin:0;padding:0;font-family:Plus Jakarta Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}body{background-color:var(--bg-primary);color:var(--text-primary);min-height:100vh;line-height:1.5;overflow-x:hidden}.app-container{flex-direction:column;max-width:1440px;min-height:100vh;margin:0 auto;padding:0 24px;display:flex}.app-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;margin-bottom:24px;padding:24px 0;display:flex}.header-logo-group{align-items:center;gap:16px;display:flex}.back-home-logo-link{transition:var(--transition);align-items:center;gap:12px;text-decoration:none;display:flex}.back-home-logo-link:hover{opacity:.8;transform:translateY(-1px)}.laconchita-logo-pill{border:1px solid var(--border-color);background-color:var(--bg-sidebar);width:34px;height:34px;color:var(--primary-color);box-shadow:var(--shadow-sm);border-radius:50%;place-items:center;display:grid}@media (prefers-color-scheme:dark){.laconchita-logo-pill{background-color:#ffffff0d;border-color:#ffffff1a}}.laconchita-logo-text{flex-direction:column;display:flex}.brand-title{color:var(--text-primary);letter-spacing:-.2px;font-size:14.5px;font-weight:700;line-height:1.1}.brand-sub{color:var(--text-secondary);text-transform:uppercase;letter-spacing:1.8px;margin-top:1px;font-size:8px;font-weight:700}.logo-divider{background-color:var(--border-color);width:1px;height:28px}.socal-surf-logo-brand{align-items:center;gap:10px;display:flex}.wave-icon{color:var(--primary-color)}.socal-logo-text{flex-direction:column;display:flex}.socal-logo-text h2{color:var(--text-primary);letter-spacing:-.3px;font-size:16px;font-weight:800;line-height:1.1}.socal-logo-badge{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-top:1px;font-size:9px;font-weight:700}.header-meta{align-items:center;gap:16px;display:flex}.live-pill{color:#ef4444;letter-spacing:.5px;background-color:#fef2f2;border-radius:20px;padding:4px 10px;font-size:11px;font-weight:700;animation:2s infinite pulse-red}.data-source{color:var(--text-secondary);font-size:12px;font-weight:500}.main-content{flex-grow:1;padding-bottom:48px}.dashboard-grid{grid-template-columns:340px 1fr;align-items:start;gap:28px;display:grid}.left-sidebar{flex-direction:column;gap:24px;display:flex}.spot-selector-container{background-color:var(--bg-sidebar);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);padding:20px}.spot-selector-header{color:var(--primary-color);align-items:center;gap:10px;margin-bottom:18px;display:flex}.spot-selector-icon{stroke-width:2.5px}.spot-selector-header h3{color:var(--text-primary);font-size:16px;font-weight:700}.county-groups{flex-direction:column;gap:18px;display:flex}.county-group{flex-direction:column;gap:8px;display:flex}.county-title{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);border-bottom:1px dashed var(--border-color);padding-bottom:2px;font-size:11px;font-weight:700}.spot-chips{flex-wrap:wrap;gap:8px;display:flex}.spot-chip{background-color:var(--bg-primary);color:var(--text-secondary);cursor:pointer;transition:var(--transition);border:1px solid #0000;border-radius:30px;align-items:center;gap:6px;padding:8px 12px;font-size:13px;font-weight:600;display:inline-flex}.spot-chip:hover{background-color:var(--primary-light);color:var(--primary-dark)}.spot-chip.active{background-color:var(--primary-color);color:#fff;border-color:var(--primary-dark);box-shadow:0 4px 10px #0284c733}.spot-chip-indicator{align-items:center;display:flex}.dot{background-color:#fff;border-radius:50%;width:6px;height:6px;animation:1.5s infinite pulse-white;display:inline-block}.spot-profile-card{background-color:var(--bg-sidebar);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);flex-direction:column;display:flex;overflow:hidden}.profile-banner{color:#fff;background:linear-gradient(135deg,#0284c7,#075985);padding:24px 20px;position:relative}@media (prefers-color-scheme:dark){.profile-banner{background:linear-gradient(135deg,#0369a1,#0c4a6e)}}.coordinates-badge{color:#fff;background-color:#fff3;border-radius:20px;padding:3px 8px;font-size:10px;font-weight:700;position:absolute;top:16px;right:20px}.profile-title{letter-spacing:-.5px;margin-top:10px;font-size:20px;font-weight:800;line-height:1.2}.profile-county{opacity:.85;font-size:13px;font-weight:500}.profile-body{flex-direction:column;gap:16px;padding:20px;display:flex}.profile-desc{color:var(--text-secondary);font-size:13.5px;line-height:1.5}.optimal-stats{border-top:1px solid var(--border-color);padding-top:16px}.optimal-title{text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin-bottom:10px;font-size:12px;font-weight:700}.optimal-grid{flex-direction:column;gap:10px;display:flex}.optimal-item{justify-content:space-between;align-items:center;display:flex}.opt-label{color:var(--text-secondary);font-size:13px;font-weight:500}.opt-chips-list{gap:4px;display:flex}.opt-chip{border-radius:4px;padding:3px 8px;font-size:11px;font-weight:700}.opt-chip.swell{background-color:var(--primary-light);color:var(--primary-dark)}.opt-chip.wind{background-color:var(--color-offshore-light);color:var(--color-offshore)}.forecast-main{min-width:0}.highlight-banner-card{border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);background:linear-gradient(135deg,#f0fdfa,#ccfbf1);border:1px solid #99f6e4;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:20px;display:flex}@media (prefers-color-scheme:dark){.highlight-banner-card{background:linear-gradient(135deg,#10b98114,#14b8a60a);border-color:#10b98133}}.highlight-content{flex-grow:1}.highlight-tag{color:var(--color-offshore);letter-spacing:1px;margin-bottom:4px;font-size:11px;font-weight:800}.highlight-heading{color:var(--text-primary);margin-bottom:4px;font-size:16px;font-weight:700}.highlight-text{color:var(--text-secondary);font-size:13px}.highlight-rating-badge{background-color:var(--bg-sidebar);border:1px solid var(--border-color);border-radius:var(--radius-md);min-width:140px;box-shadow:var(--shadow-sm);flex-direction:column;justify-content:center;align-items:center;padding:12px 18px;display:flex}.mini-rating{gap:2px;margin-bottom:4px;display:flex}.mini-star{color:var(--text-muted);font-size:16px}.mini-star.filled{color:var(--star-gold)}.highlight-rating-text{color:var(--text-primary);font-size:12px;font-weight:700}.day-selector-container{background-color:var(--bg-sidebar);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);margin-bottom:24px;padding:8px}.day-tabs-scroll{scrollbar-width:none;-ms-overflow-style:none;gap:6px;display:flex;overflow-x:auto}.day-tabs-scroll::-webkit-scrollbar{display:none}.day-tab{border-radius:var(--radius-md);cursor:pointer;min-width:90px;transition:var(--transition);background-color:#0000;border:1px solid #0000;flex-direction:column;flex:1;align-items:center;gap:2px;padding:10px 8px;display:flex}.day-tab:hover{background-color:var(--bg-primary)}.day-tab.active{background-color:var(--primary-light);border-color:#0284c726}.tab-weekday{text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);font-size:11px;font-weight:700}.day-tab.active .tab-weekday{color:var(--primary-color)}.tab-date{color:var(--text-primary);font-size:14px;font-weight:700}.tab-wave-range{color:var(--text-secondary);background-color:var(--bg-primary);border-radius:20px;margin-top:4px;padding:2px 6px;font-size:12px;font-weight:600}.day-tab.active .tab-wave-range{color:var(--primary-dark);background-color:#fff}.tab-rating-dots{gap:1px;height:8px;margin-top:4px;display:flex}.dot-gold{color:var(--star-gold);font-size:9px;line-height:1}.forecast-controls{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.selected-day-title{color:var(--text-primary);letter-spacing:-.3px;font-size:18px;font-weight:800}.toggle-summary-btn{background-color:var(--bg-sidebar);border:1px solid var(--border-color);color:var(--text-primary);cursor:pointer;box-shadow:var(--shadow-sm);transition:var(--transition);border-radius:30px;padding:8px 14px;font-size:12.5px;font-weight:600}.toggle-summary-btn:hover{background-color:var(--bg-primary);border-color:var(--text-muted)}.time-blocks-grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.forecast-card{background-color:var(--bg-sidebar);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);transition:var(--transition);flex-direction:column;padding:22px;display:flex}.forecast-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}.forecast-card.offshore-card{border-top:5px solid var(--color-offshore)}.forecast-card.light-card{border-top:5px solid var(--color-glassy)}.forecast-card.cross-shore-card{border-top:5px solid var(--color-cross)}.forecast-card.onshore-card{border-top:5px solid var(--color-onshore)}.card-header{justify-content:space-between;align-items:flex-start;margin-bottom:14px;display:flex}.time-info{flex-direction:column;display:flex}.time-label{color:var(--text-primary);font-size:16px;font-weight:800}.time-exact{color:var(--text-secondary);font-size:11px;font-weight:600}.stars-container{gap:1px;display:flex}.star{color:var(--text-muted);font-size:14px}.star.filled{color:var(--star-gold)}.wave-height-hero{align-items:baseline;margin-bottom:20px;display:flex}.height-number{letter-spacing:-1.5px;color:var(--text-primary);font-size:40px;font-weight:800;line-height:1}.height-unit{color:var(--text-secondary);margin-left:4px;font-size:14px;font-weight:800}.wave-sub-info{color:var(--text-secondary);margin-left:auto;font-size:12px;font-weight:600}.details-grid{border-top:1px solid var(--border-color);flex-direction:column;gap:14px;margin-bottom:16px;padding-top:16px;display:flex}.detail-item{flex-direction:column;gap:6px;display:flex;position:relative}.detail-title{text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);font-size:11px;font-weight:700}.direction-display{align-items:center;gap:10px;display:flex}.direction-arrow{color:var(--text-secondary);background-color:var(--bg-primary);width:30px;height:30px;transition:var(--transition);border-radius:50%;justify-content:center;align-items:center;padding:6px;display:flex}.direction-values{flex-direction:column;display:flex}.detail-value{color:var(--text-primary);font-size:14px;font-weight:700}.detail-sub{color:var(--text-secondary);font-size:11px;font-weight:500}.wind-badge{text-transform:uppercase;letter-spacing:.5px;border-radius:20px;padding:2px 8px;font-size:10px;font-weight:800;position:absolute;top:0;right:0}.wind-badge.offshore{background-color:var(--color-offshore-light);color:var(--color-offshore)}.wind-badge.light{background-color:var(--color-glassy-light);color:var(--color-glassy)}.wind-badge.cross-shore{background-color:var(--color-cross-light);color:var(--color-cross)}.wind-badge.onshore{background-color:var(--color-onshore-light);color:var(--color-onshore)}.atmosphere-display{align-items:center;gap:12px;display:flex}.weather-emoji{background-color:var(--bg-primary);border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:22px;display:flex}.atmosphere-values{flex-direction:column;display:flex}.card-explanation{background-color:var(--bg-primary);border-radius:var(--radius-sm);color:var(--text-secondary);border-left:3px solid var(--border-color);margin-top:auto;padding:10px 12px;font-size:12.5px;line-height:1.4}.offshore-card .card-explanation{background-color:var(--color-offshore-light);border-left-color:var(--color-offshore)}.light-card .card-explanation{background-color:var(--color-glassy-light);border-left-color:var(--color-glassy)}.cross-shore-card .card-explanation{background-color:var(--color-cross-light);border-left-color:var(--color-cross)}.onshore-card .card-explanation{background-color:var(--color-onshore-light);border-left-color:var(--color-onshore)}.weekly-summary-card{background-color:var(--bg-sidebar);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);padding:24px}.summary-title{color:var(--text-primary);font-size:18px;font-weight:800}.summary-subtitle{color:var(--text-secondary);margin-bottom:20px;font-size:13px}.table-responsive{-webkit-overflow-scrolling:touch;width:100%;overflow-x:auto}.weekly-summary-table{border-collapse:collapse;text-align:left;width:100%}.weekly-summary-table th,.weekly-summary-table td{border-bottom:1px solid var(--border-color);padding:14px 16px}.weekly-summary-table th{text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);font-size:11px;font-weight:700}.weekly-summary-table tbody tr{cursor:pointer;transition:var(--transition)}.weekly-summary-table tbody tr:hover{background-color:var(--bg-primary)}.weekly-summary-table tr.highlighted{background-color:var(--primary-light)}.small-date{color:var(--text-secondary);font-size:11px;font-weight:500}.range-column{font-weight:700}.wave-pill{background-color:var(--bg-primary);color:var(--text-primary);border-radius:30px;padding:4px 10px;font-size:13px}.weekly-summary-table tr.highlighted .wave-pill{color:var(--primary-dark);background-color:#fff}.wind-dot{border-radius:50%;width:8px;height:8px;margin-right:6px;display:inline-block}.wind-dot.offshore{background-color:var(--color-offshore)}.wind-dot.light{background-color:var(--color-glassy)}.wind-dot.cross-shore{background-color:var(--color-cross)}.wind-dot.onshore{background-color:var(--color-onshore)}.stars-column{gap:1px;display:flex}.star-mini{color:var(--text-muted);font-size:11px}.star-mini.filled{color:var(--star-gold)}.cond-badge{border-radius:4px;padding:3px 8px;font-size:11px;font-weight:700}.cond-badge.rating-5,.cond-badge.rating-4{background-color:var(--color-offshore-light);color:var(--color-offshore)}.cond-badge.rating-3{background-color:var(--color-glassy-light);color:var(--color-glassy)}.cond-badge.rating-2{background-color:var(--color-cross-light);color:var(--color-cross)}.cond-badge.rating-1{background-color:var(--color-onshore-light);color:var(--color-onshore)}.loading-container{flex-direction:column;gap:24px;display:flex}.skeleton-hero-banner{background:linear-gradient(90deg, var(--border-color) 25%, var(--bg-primary) 50%, var(--border-color) 75%);border-radius:var(--radius-lg);background-size:200% 100%;height:110px;animation:1.5s infinite loading-pulse}.skeleton-tabs-row{gap:10px;display:flex}.skeleton-tab{background:linear-gradient(90deg, var(--border-color) 25%, var(--bg-primary) 50%, var(--border-color) 75%);border-radius:var(--radius-md);background-size:200% 100%;flex:1;height:60px;animation:1.5s infinite loading-pulse}.skeleton-cards-grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.skeleton-card{background:linear-gradient(90deg, var(--border-color) 25%, var(--bg-primary) 50%, var(--border-color) 75%);border-radius:var(--radius-lg);background-size:200% 100%;height:280px;animation:1.5s infinite loading-pulse}@keyframes loading-pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.error-card{background-color:var(--bg-sidebar);border:1px solid var(--border-color);border-radius:var(--radius-lg);text-align:center;box-shadow:var(--shadow-sm);flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:40px;display:flex}.error-icon{color:#ef4444}.error-card h3{color:var(--text-primary);font-size:18px;font-weight:800}.error-card p{color:var(--text-secondary);max-width:400px;font-size:14px}.retry-btn{background-color:var(--primary-color);color:#fff;cursor:pointer;transition:var(--transition);border:none;border-radius:30px;margin-top:8px;padding:10px 20px;font-size:13.5px;font-weight:600;box-shadow:0 4px 10px #0284c733}.retry-btn:hover{background-color:var(--primary-dark)}.animate-fade-in{animation:.4s ease-out forwards fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-red{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.97)}}@keyframes pulse-white{0%,to{opacity:1}50%{opacity:.4}}@media (width<=1024px){.dashboard-grid{grid-template-columns:1fr;gap:24px}}@media (width<=768px){.time-blocks-grid,.skeleton-cards-grid{grid-template-columns:1fr;gap:16px}.highlight-banner-card{flex-direction:column;align-items:stretch}.highlight-rating-badge{width:100%}}@media (width<=480px){.app-container{padding:0 16px}.app-header{flex-direction:column;align-items:flex-start;gap:12px;padding:16px 0}.header-meta{justify-content:space-between;width:100%}.spot-selector-container{padding:16px}.spot-chips{gap:6px}.spot-chip{padding:6px 10px;font-size:12px}}