@charset "UTF-8";
:root{color-scheme:light;--ink:#203d42;--muted:#5c7074;--teal:#123f46;--line:#dce4e2;--blue:#175eae;--red:#b64242;font-family:system-ui,-apple-system,"Segoe UI","Malgun Gothic",sans-serif;color:var(--ink);background:#f6f8f5;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #df8c25;outline-offset:4px}a{color:inherit;text-decoration:none}button{color:inherit}button:disabled{cursor:default}[hidden]{display:none!important}.skip{position:absolute;left:12px;top:-80px;background:white;padding:14px;z-index:20}.skip:focus{top:10px}.header,main,footer{max-width:1080px;margin:auto}.header{height:88px;display:flex;align-items:center;justify-content:space-between;position:relative;padding:0 28px}.brand{display:flex;align-items:center;gap:10px;font-size:23px;font-weight:800;letter-spacing:-1px}.menu-button{border:1px solid var(--line);border-radius:24px;background:transparent;padding:10px 17px;min-height:44px;font-size:15px}.menu-button span{margin-left:7px}#menu{position:absolute;right:28px;top:73px;background:white;border:1px solid var(--line);padding:10px;border-radius:14px;box-shadow:0 12px 32px #123f4620;z-index:5;min-width:240px}#menu a,#menu button{display:block;width:100%;padding:14px;text-align:left;border:0;background:none;border-radius:8px}#menu a:hover,#menu button:hover{background:#edf3f1}main{padding:0 28px}.hero{min-height:330px;background:#e8efeb;border-radius:22px;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;position:relative}.hero-copy{padding:38px 40px;z-index:1}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1.5px;margin:0 0 12px;color:#47706c}h1{font-size:42px;line-height:1.3;letter-spacing:-2px;margin:0 0 16px}p{line-height:1.65}.hero-copy>p:not(.eyebrow){font-size:14px;color:var(--muted);margin:0 0 24px}.hero-tag{font-size:11px;border:1px solid #a9c2b8;border-radius:20px;padding:7px 11px;color:#426b62}.seascape{position:relative;overflow:hidden;background:linear-gradient(#e8efeb 48%,#9bbcb7 48%,#77a49f 70%,#477d7c);margin-left:-45px}.sun{width:65px;height:65px;border-radius:50%;background:#f4d596;position:absolute;top:55px;right:86px}.horizon{position:absolute;top:48%;height:1px;background:#edf4e9;width:100%}.pier{position:absolute;background:#466561;width:78%;height:17px;top:66%;right:-10px;transform:rotate(-5deg);box-shadow:0 12px 0 #77918a}.lighthouse{position:absolute;right:84px;top:calc(66% - 85px);width:26px;height:75px;background:linear-gradient(#f2eee0 0 28%,#b7674e 28% 47%,#f2eee0 47%);transform:perspective(160px) rotateX(14deg);border-top:9px solid #344e4b}.lighthouse:before{content:"";position:absolute;width:34px;height:5px;background:#344e4b;top:-12px;left:-4px}.ripple{position:absolute;height:16px;width:120px;border-top:2px solid #d2e2d880;border-radius:50%;bottom:48px;left:40px}.r2{bottom:25px;left:150px;width:170px}.sea-caption{position:absolute;right:24px;bottom:22px;font-size:9px;letter-spacing:3px;color:#e4efea}.finder{margin:24px 0}.entry-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.entry-buttons button{background:#fff;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;gap:12px;min-height:72px;padding:16px;font-weight:700;font-size:15px;transition:background .15s}.entry-buttons button span:first-child{font-size:25px;font-weight:400;color:#497e74}.entry-buttons button span:last-child{margin-left:auto;color:#71857d}.entry-buttons button:hover,.entry-buttons button[aria-pressed=true]{background:#e5efea;border-color:#7b9e90}#filter-panel{padding:16px 4px 0}#filter-label{margin:0 0 10px;font-size:14px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chips button{background:white;border:1px solid var(--line);padding:10px 18px;border-radius:24px;min-height:44px}.chips button[aria-pressed=true]{background:var(--teal);color:white;border-color:var(--teal)}.demo-notice{display:flex;align-items:center;gap:12px;font-size:12px;padding:14px 17px;background:#f0eee5;border-radius:10px;color:#696149}.demo-notice p{margin:0}.pill{flex-shrink:0;border:1px solid #c9bfa4;padding:3px 8px;border-radius:5px;font-size:10px;font-weight:700}.section-heading{display:flex;align-items:end;justify-content:space-between;margin:34px 0 18px}.section-heading .eyebrow{margin-bottom:5px;font-size:11px}h2{font-size:24px;letter-spacing:-1px;margin:0}.section-heading>p{font-size:12px;color:var(--muted);margin:0}.cards{display:grid;grid-template-columns:1fr 1fr;gap:20px}.recommendation{background:white;border:1px solid var(--line);border-radius:18px;overflow:hidden}.card-top{padding:24px;display:flex;justify-content:space-between;align-items:center;background:#f0f5f0;min-height:130px}.octopus .card-top{background:#f2efe8}.location{font-size:11px;color:#577168;letter-spacing:.6px;margin:0 0 6px}h3{margin:0;font-size:24px;letter-spacing:-1px}h3 span{font-weight:500;margin-left:4px}.card-note{font-size:11px;color:#64776d;margin:8px 0 0}.species-art{width:96px;height:80px;fill:none;stroke:#557c6d;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.octopus .species-art{stroke:#9c765e}.scores{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:22px 24px 12px}.score{padding:14px;background:#f0f6fe;border-radius:10px;color:var(--blue)}.risk{background:#fcf1ef;color:var(--red)}.score>span{font-size:12px;font-weight:700}.score>span small{font-size:9px;opacity:.8;font-weight:400}.score p{margin:4px 0 8px;line-height:1.2}.score strong{font-size:35px;font-weight:750;letter-spacing:-1px}.score p span{font-size:11px}.score>small{display:block;font-size:9px;margin-top:6px}meter{appearance:none;width:100%;height:4px;display:block;border:0;border-radius:4px;background:#d7e5f7}meter::-webkit-meter-bar{background:#d7e5f7;border:0;height:4px}meter::-webkit-meter-optimum-value{background:var(--blue)}meter::-moz-meter-bar{background:var(--blue)}.risk meter,.risk meter::-webkit-meter-bar{background:#f2d7d4}.risk meter::-webkit-meter-optimum-value{background:var(--red)}.risk meter::-moz-meter-bar{background:var(--red)}dl{margin:0;padding:0 24px 10px}dl>div{display:grid;grid-template-columns:80px 1fr;align-items:center;gap:8px;min-height:45px;border-bottom:1px solid #edf0ec;font-size:12px}dl>div:last-child{border:0}dt{color:var(--muted)}dd{margin:0;font-weight:600;line-height:1.65}.depths{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.depths>span{border-radius:4px;padding:2px 6px;background:#f2f4f2;color:#75817c;font-weight:400;font-size:11px}.depths .selected{background:#245e54;color:white}.depths small{font-size:10px;font-weight:400;margin-left:4px;color:var(--muted)}.card-foot{margin:0;padding:12px 24px;font-size:10px;background:#fafbf8;color:#737d72;border-top:1px solid #edf0ec}.install-banner{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:30px 0;background:var(--teal);border-radius:16px;padding:28px;color:white}.install-banner .eyebrow{color:#b4cec4;font-size:10px;margin-bottom:8px}.install-banner h2{font-size:20px}.install-banner p:last-child{font-size:12px;color:#c0d4ce;margin:8px 0 0}.install-banner button{background:#dbe9d7;border:0;border-radius:8px;padding:14px 18px;color:#163f3b;font-size:12px;font-weight:700;min-height:48px;white-space:nowrap}.install-banner button span{margin-left:15px}.about{max-width:700px;margin:0 0 30px}.about h2{font-size:13px;letter-spacing:0}.about p{font-size:11px;color:var(--muted);margin:8px 0}footer{padding:24px 28px 35px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}footer .brand{font-size:16px}footer>span:last-child{font-size:10px;color:#798781;text-align:right;line-height:1.8}dialog{border:1px solid var(--line);border-radius:20px;padding:32px;max-width:470px;width:calc(100% - 32px);max-height:85dvh;color:var(--ink);box-shadow:0 24px 100px #0003}dialog::backdrop{background:#0d292b88}dialog h2{font-size:22px;padding-right:15px}dialog h3{font-size:15px;margin-top:20px}dialog p{font-size:13px;color:var(--muted)}.close{position:absolute;top:8px;right:8px;width:44px;height:44px;border:0;background:none;font-size:28px}.primary{background:var(--teal);color:white;border:0;border-radius:8px;padding:14px;width:100%;margin-top:15px}
@media(max-width:650px){.header{height:72px;padding:0 20px}.brand{font-size:21px}main{padding:0 16px}.hero{min-height:305px;grid-template-columns:1.2fr .8fr}.hero-copy{padding:28px 22px}.hero h1{font-size:32px}.hero-copy>p:not(.eyebrow){font-size:12px}.hero .eyebrow{font-size:10px}.hero-tag{font-size:9px;padding:6px 8px;white-space:nowrap}.seascape{margin-left:-65px}.sun{right:25px;top:45px;width:45px;height:45px}.lighthouse{right:28px}.sea-caption{right:12px;font-size:7px}.entry-buttons{gap:8px}.entry-buttons button{flex-direction:column;gap:6px;padding:13px 4px;font-size:12px;min-height:90px;letter-spacing:-.5px}.entry-buttons button span:last-child{display:none}.entry-buttons button span:first-child{font-size:24px}.demo-notice{padding:12px;align-items:flex-start;gap:8px;font-size:11px}.pill{margin-top:2px}.section-heading{margin-top:28px}h2{font-size:21px}.cards{grid-template-columns:1fr;gap:18px}.card-top{padding:22px}.scores{margin:20px 22px 10px}.score{padding:15px}dl{padding:0 22px 12px}dl>div{font-size:13px;min-height:47px}.install-banner{flex-direction:column;align-items:stretch;padding:24px}.install-banner button{text-align:left}.install-banner button span{float:right}footer{margin:0 16px;padding:22px 4px 30px}.about p{font-size:12px}#menu{right:16px;top:63px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media(max-width:650px){.hero{display:block;min-height:305px}.hero-copy{position:relative;max-width:100%;padding:28px 22px}.hero h1{font-size:30px;word-break:keep-all}.seascape{position:absolute;right:0;top:0;bottom:0;width:30%;margin:0;opacity:.5}.hero-copy>p:not(.eyebrow){max-width:245px}.hero-tag{background:#e8efebcc}.sea-caption{display:none}}
.pending-spot{padding:24px;background:#fff;border:1px dashed #a9bcb4;border-radius:18px}.pending-spot h3{font-size:22px;word-break:keep-all}.pending-spot>p:not(.location):not(.card-note){font-size:14px;color:#47706c}
.recommendation{position:relative}.detail-link{display:flex;justify-content:space-between;padding:16px 24px;min-height:48px;font-size:13px;font-weight:700;color:#245e54}.detail-link:after{content:"";position:absolute;inset:0;border-radius:18px}.recommendation:has(.detail-link:hover){border-color:#769c83}.recommendation:has(.detail-link:focus-visible){outline:3px solid #df8c25;outline-offset:3px}

.catch-report { border: 1px solid #d4e3df; border-left: 4px solid #367e69; border-radius: 16px; padding: 22px; margin-bottom: 24px; background: #f3f9f5; }
.catch-report h3 { margin: .5rem 0; }
.catch-report p { line-height: 1.7; }
.catch-report small { color: #526763; }
body { padding-bottom: calc(82px + env(safe-area-inset-bottom)); }
.bottom-nav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 10; display: flex; justify-content: center; background: #fffffff5; border-top: 1px solid var(--line); padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); box-shadow: 0 -4px 20px #123f4609; }
.bottom-nav a { display: flex; flex: 1; max-width: 150px; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 52px; font-size: 12px; color: #5c7074; border-radius: 10px; }
.bottom-nav a span { font-size: 24px; line-height: 1; }
.bottom-nav a[aria-current] { background: #e6f0eb; color: #123f46; font-weight: 800; }

body[data-view=forecast] .hero, body[data-view=forecast] .install-banner { display: none; }
.favorite-toggle { position: absolute; top: 8px; right: 8px; z-index: 2; width: 44px; height: 44px; border: 1px solid #bacdc3; background: white; border-radius: 50%; font-size: 24px; color: #245e54; }
.card-top { padding-top: 52px; }
#personal-view { padding: 24px 0; min-height: 65vh; }
#personal-view h1 { font-size: 30px; }
.local-note { background: #eef1e7; padding: 16px; border-radius: 12px; font-size: 13px; }
.personal-list { display: grid; gap: 16px; margin-top: 20px; }
.saved-item, .empty-state, .record-form { position: relative; padding: 24px; border: 1px solid var(--line); background: white; border-radius: 18px; }
.saved-item h2 { padding-right: 32px; font-size: 21px; }
.text-link { display: inline-block; color: #175eae; padding: 12px 0; font-weight: 700; }
.record-form { max-width: 620px; margin: 24px auto; display: grid; gap: 18px; }
.record-form label { display: grid; gap: 8px; font-size: 14px; font-weight: 700; }
.record-form input, .record-form select, .record-form textarea { width: 100%; min-width: 0; padding: 12px; border: 1px solid #a9bcb4; border-radius: 8px; font: inherit; font-weight: 400; background: white; color: var(--ink); }
.my-stats { display: flex; gap: 16px; margin: 24px 0; }
.my-stats a { flex: 1; background: #e8efeb; padding: 20px; border-radius: 12px; }
.my-stats strong { display: block; font-size: 30px; }
.record-photo { width: 100%; max-height: 320px; object-fit: contain; border-radius: 12px; margin-bottom: 16px; }
.record-memo { white-space: pre-wrap; overflow-wrap: anywhere; }
.delete-record { min-height: 44px; padding: 10px 14px; border: 1px solid #cfaeaa; background: #fff; color: #963a3a; border-radius: 8px; }
#form-error { color: #963a3a; }

body[data-view=home] #result-count, body:not([data-view=home]) .home-more { display: none; }

.environment-scroll { overflow-x:auto; max-width:100%; }
.environment-scroll table { border-collapse:collapse; min-width:700px; font-size:13px; width:100%; }
.environment-scroll th, .environment-scroll td { padding:12px; text-align:left; border-bottom:1px solid #dce4e2; }
.environment-scroll caption { text-align:left; padding:12px 0; }

.card-outlook{padding:18px 24px;border-top:1px solid var(--line)}
.outing-summary{display:flex;align-items:center;gap:24px;padding:18px 0}.outing-label{font-size:14px;font-weight:700}.outing-score{margin:6px 0;color:var(--blue);white-space:nowrap}.outing-score strong{font-size:56px;line-height:1}.outing-score span{font-size:14px;margin-left:6px;color:var(--muted)}.outing-summary small,.outing-time>span{font-size:11px;color:var(--muted)}.outing-time strong{display:block;font-size:18px;margin-top:8px}.outing-time p{font-size:12px;line-height:1.7}.outing-note{font-size:11px;line-height:1.6;color:var(--muted)}.outing-metrics{display:flex;flex-wrap:wrap;gap:18px;padding:15px;background:#f0f6f5;border-radius:10px;font-size:13px}.compact-details{margin:16px 0}.compact-details>summary{cursor:pointer;font-weight:650;min-height:44px;display:list-item;padding:12px 0}.compact-details>summary:focus-visible{outline:3px solid #df8c25}.card-outlook .outing-summary{padding:0;gap:16px}.card-outlook .outing-score strong{font-size:44px}@media(max-width:380px){.outing-summary{gap:14px}.outing-time strong{font-size:15px}.card-outlook{padding:16px}.outing-score strong{font-size:46px}}

.port-card .card-top{min-height:0;padding:18px 22px 12px}.port-card h3{font-size:23px}.port-species{font-size:12px;margin:8px 0 0;color:var(--muted)}.port-card .card-outlook{padding:14px 22px 8px}.port-card .outing-note{display:none}.port-card .detail-link{padding:12px 22px}.species-options{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.species-options a{padding:10px 16px;border:1px solid var(--line);border-radius:24px;font-size:14px;background:white}.species-options a[aria-current=page]{background:var(--teal);color:white}.hero{min-height:0}.hero-copy{padding:22px 26px}.hero h1{font-size:28px;margin-bottom:0}.hero-copy>p:not(.eyebrow),.hero-tag{display:none}.hero .seascape{opacity:.4}.home-more{display:none}.port-score-note{font-size:12px;color:var(--muted);margin-bottom:18px}
