:root{--bg:#0d1117;--card:#161b22;--line:#262c36;--text:#e6edf3;--muted:#8b949e;--accent:#2f9e8f;--accent-soft:#2f9e8f24;--wind:#d2a24c;--tide:#5b9bd5}@media (prefers-color-scheme:light){:root{--bg:#f6f8fa;--card:#fff;--line:#d8dee4;--text:#1f2328;--muted:#656d76;--accent:#1f7a6d;--accent-soft:#1f7a6d1a;--wind:#a8761f;--tide:#2f6fa8}}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Noto Sans Thai,IBM Plex Sans Thai,system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.6}button{font-family:inherit}.muted{color:var(--muted)}.app{max-width:860px;margin:0 auto;padding:24px 20px 64px}header h1{letter-spacing:-.02em;margin:0;font-size:1.9rem}header p{margin:4px 0 24px}.spots{scrollbar-width:thin;gap:8px;margin-bottom:24px;padding-bottom:6px;display:flex;overflow-x:auto}.spot{border:1px solid var(--line);background:var(--card);color:inherit;cursor:pointer;text-align:left;border-radius:12px;flex-direction:column;flex:none;gap:2px;padding:10px 14px;transition:border-color .15s,background .15s;display:flex}.spot:hover{border-color:var(--accent)}.spot.active{border-color:var(--accent);background:var(--accent-soft)}.spot-name{font-size:.95rem;font-weight:600}.spot-province{color:var(--muted);font-size:.75rem}.spot-head h2{margin:0 0 4px;font-size:1.35rem}.spot-head h2 .muted{font-size:.95rem;font-weight:400}.note{color:var(--muted);margin:0 0 20px;font-size:.9rem;line-height:1.5}.days{gap:8px;margin-bottom:20px;display:flex}.day{border:1px solid var(--line);color:var(--muted);cursor:pointer;background:0 0;border-radius:999px;padding:7px 14px;font-size:.85rem}.day.active{border-color:var(--accent);background:var(--accent-soft);color:var(--text)}.conditions{border:1px solid var(--line);background:var(--card);border-radius:16px;margin-bottom:16px;padding:18px}.verdict{border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:baseline;gap:12px;margin-bottom:16px;padding-bottom:14px;display:flex}.verdict strong{font-size:1.15rem}.stars{letter-spacing:2px;font-size:1.25rem;line-height:1}.star-full{color:var(--accent)}.star-half{color:var(--accent);opacity:.45}.star-empty{color:var(--line)}.stat-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;display:grid}.stat-label{color:var(--muted);margin-bottom:2px;font-size:.78rem}.stat-value{font-variant-numeric:tabular-nums;font-size:1.3rem;font-weight:600}.stat-sub{color:var(--muted);margin-top:2px;font-size:.75rem}.best{background:var(--accent-soft);border-radius:12px;margin:0 0 24px;padding:12px 16px;font-size:.92rem}.panel{margin-bottom:28px}.panel h3{color:var(--muted);margin:0 0 10px;font-size:.95rem;font-weight:600}.chart{width:100%;height:auto;display:block}.chart .axis{fill:var(--muted);font-size:10px}.chart .unit{font-size:9px}.chart .grid{stroke:var(--line);stroke-width:1px}.tides{flex-wrap:wrap;gap:8px 20px;margin:12px 0 0;padding:0;font-size:.85rem;list-style:none;display:flex}.tide-high{color:var(--tide);font-weight:600}.tide-low{color:var(--muted);font-weight:600}footer{border-top:1px solid var(--line);margin-top:40px;padding-top:16px}footer p{margin:0 0 6px;font-size:.8rem;line-height:1.5}.small{font-size:.75rem!important}.error{color:#ff6b6b}@media (width<=520px){.stat-grid{grid-template-columns:repeat(2,1fr)}}