*{box-sizing:border-box;margin:0;padding:0}:root{--primary-color:#06c;--secondary-color:#0af;--text-dark:#1a1a1a;--text-light:#666;--bg-light:#f5f8fa;--card-bg:#fff;--border-color:#e1e8ed;--success-color:#00c853;--error-color:#d32f2f;--shadow:0 2px 8px #0000001a;--shadow-lg:0 4px 16px #00000026}body{min-height:100vh;color:var(--text-dark);background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.container{max-width:1200px;margin:0 auto}header{text-align:center;color:#fff;margin-bottom:40px}header h1{text-shadow:0 2px 4px #0003;margin-bottom:8px;font-size:3rem;font-weight:700}.tagline{opacity:.95;font-size:1.2rem;font-weight:300}main{box-shadow:var(--shadow-lg);background:#fff;border-radius:16px;min-height:400px;padding:32px}.loading{text-align:center;padding:60px 20px}.spinner{border:4px solid var(--border-color);border-top:4px solid var(--primary-color);border-radius:50%;width:50px;height:50px;margin:0 auto 20px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading p{color:var(--text-light);font-size:1.1rem}.error{text-align:center;padding:60px 20px}.error-message{color:var(--error-color);margin-bottom:24px;font-size:1.1rem;line-height:1.6}.retry-btn{background:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:12px 32px;font-size:1rem;transition:background .3s}.retry-btn:hover{background:#0052a3}.hidden{display:none}.station-info{border-bottom:2px solid var(--border-color);margin-bottom:32px;padding-bottom:24px}.station-info h2{color:var(--text-dark);margin-bottom:8px;font-size:2rem}.location{color:var(--text-light);font-size:1rem}.card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:12px;margin-bottom:24px;padding:24px;transition:transform .2s,box-shadow .2s}.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card h3{color:var(--text-light);text-transform:uppercase;letter-spacing:.5px;margin-bottom:16px;font-size:1.1rem;font-weight:600}.highlight{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none}.highlight h3{color:#ffffffe6}.highlight-low{color:#fff;background:linear-gradient(135deg,#00b4db 0%,#0083b0 100%);border:none}.highlight-low h3{color:#ffffffe6}.tide-time{margin-bottom:8px;font-size:1.5rem;font-weight:600}.tide-height{margin-bottom:8px;font-size:2.5rem;font-weight:700}.time-until{opacity:.9;font-size:1.1rem;font-weight:500}.tide-chart-section{border-bottom:2px solid var(--border-color);margin-bottom:40px;padding-bottom:32px}.chart-title{color:var(--text-dark);margin-bottom:8px;font-size:2rem;font-weight:700}.tide-chart{box-shadow:var(--shadow);background:#fff;border-radius:12px;padding:20px;overflow-x:auto}.tide-chart svg{width:100%;min-width:600px;height:auto}.tide-columns{grid-template-columns:1fr 1fr;gap:32px;margin-bottom:32px;display:grid}.tide-column{min-width:0}.column-title{color:var(--text-dark);border-bottom:3px solid var(--primary-color);margin-bottom:20px;padding-bottom:12px;font-size:1.8rem;font-weight:700}.section-description{color:var(--text-light);margin-bottom:20px;font-size:.9rem;line-height:1.4}.significant-tides-list{flex-direction:column;gap:16px;display:flex}.significant-tide{background:var(--bg-light);border-left:4px solid var(--primary-color);border-radius:8px;padding:20px;transition:transform .2s,box-shadow .2s}.significant-tide:hover{transform:translate(4px);box-shadow:0 2px 8px #00000014}.significant-tide.highest-year{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-left:4px solid gold}.significant-tide.highest-year .tide-label{color:gold}.significant-tide.lowest-year{color:#fff;background:linear-gradient(135deg,#00b4db 0%,#0083b0 100%);border-left:4px solid gold}.significant-tide.lowest-year .tide-label{color:gold}.tide-label{text-transform:uppercase;letter-spacing:.5px;color:var(--primary-color);margin-bottom:8px;font-size:.85rem;font-weight:600}.significant-tide .tide-time{margin-bottom:4px;font-size:1.2rem;font-weight:600}.significant-tide .tide-height{margin-bottom:4px;font-size:1.8rem;font-weight:700}.significant-tide .time-until{opacity:.9;font-size:.95rem}.forecast{margin-top:32px}.forecast h3{color:var(--text-dark);margin-bottom:20px;font-size:1.5rem;font-weight:600}.forecast-table{background:var(--bg-light);border-radius:8px;overflow:hidden}.forecast-row{border-bottom:1px solid var(--border-color);grid-template-columns:1.5fr 2fr 2fr;align-items:center;gap:16px;padding:16px 20px;transition:background .2s;display:grid}.forecast-row:hover{background:#0066cc0d}.forecast-row:last-child{border-bottom:none}.forecast-date{color:var(--text-dark);font-weight:600}.tide-info{align-items:center;gap:12px;display:flex}.tide-type{min-width:40px;font-size:.9rem;font-weight:600}.high-tide-info .tide-type{color:var(--primary-color)}.low-tide-info .tide-type{color:#00b4db}.tide-info .tide-time{color:var(--text-light);font-size:.95rem}.tide-info .tide-height{margin-left:auto;font-weight:600}.high-tide-info .tide-height{color:var(--primary-color)}.low-tide-info .tide-height{color:#00b4db}footer{text-align:center;color:#fff;opacity:.9;margin-top:40px}footer p{margin:8px 0;font-size:.9rem}footer a{color:#fff;text-decoration:underline}.last-update{opacity:.8;font-size:.85rem}@media (max-width:600px){body{padding:12px}header h1{font-size:2rem}.tagline{font-size:1rem}main{padding:20px}.station-info h2{font-size:1.5rem}.tide-height{font-size:2rem}.forecast-row{grid-template-columns:1fr;gap:12px}.tide-info{flex-wrap:wrap}.significant-tide .tide-height{font-size:1.5rem}.significant-tide .tide-time{font-size:1rem}.tide-columns{grid-template-columns:1fr;gap:24px}.column-title{font-size:1.4rem}}