@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+JP:wght@400;500;600;700;800&display=swap');
:root{--bg:#07131e;--bg2:#0d2030;--mint:#b8f3d0;--sun:#e7ca9b;--ink:#142331;--muted:#a6b9c4}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f4f6f4;color:var(--ink);font-family:'DM Sans','Noto Sans JP',sans-serif;-webkit-font-smoothing:antialiased}a{text-decoration:none;color:inherit}.topbar{height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 max(5vw,24px);position:absolute;z-index:10;top:0;left:0;right:0;color:#fff;border-bottom:1px solid #ffffff27}.brand{font-size:20px;font-weight:800;letter-spacing:.11em}.brand span{color:var(--mint)}.desktop-links{display:flex;gap:32px;font-size:11px;letter-spacing:.15em;font-weight:700}.desktop-links a:hover{color:var(--mint)}.header-date{font-size:11px;letter-spacing:.14em}.hero{min-height:790px;height:100svh;max-height:1050px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 70% 67%,#29455c 0%,#122b3d 28%,#081724 62%,#030c15 100%);color:#fff}.hero:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:42%;background:linear-gradient(0deg,#06131f 2%,transparent 100%);pointer-events:none}.starfield{position:absolute;inset:0;background-image:radial-gradient(1px 1px at 8% 15%,white 98%,transparent),radial-gradient(2px 2px at 17% 47%,#e7f4ff 98%,transparent),radial-gradient(1px 1px at 32% 23%,white 98%,transparent),radial-gradient(2px 2px at 44% 62%,white 98%,transparent),radial-gradient(1px 1px at 65% 20%,white 98%,transparent),radial-gradient(2px 2px at 79% 40%,white 98%,transparent),radial-gradient(1px 1px at 91% 12%,white 98%,transparent),radial-gradient(1px 1px at 95% 75%,white 98%,transparent);background-size:360px 320px;opacity:.68}.meteor{position:absolute;width:270px;height:2px;background:linear-gradient(90deg,transparent,#e6ffff);transform:rotate(-30deg);filter:drop-shadow(0 0 7px #9ed7e8);opacity:.85}.meteor-a{top:26%;right:10%}.meteor-b{top:49%;right:28%;width:110px;opacity:.42}.hero-content{position:relative;z-index:2;max-width:1280px;margin:auto;padding:clamp(185px,23vh,265px) 6vw 160px}.eyebrow,.hero-kicker,.section-num{font-size:11px;letter-spacing:.2em;font-weight:700}.eyebrow{display:inline-flex;align-items:center;gap:12px;padding:11px 15px;border:1px solid #ffffff50;border-radius:100px;color:#d8f7e5}.live-dot{width:7px;height:7px;background:var(--mint);border-radius:50%;box-shadow:0 0 10px var(--mint)}.hero-kicker{color:var(--sun);margin:34px 0 15px}.hero h1{font-size:clamp(52px,7.4vw,108px);font-weight:800;letter-spacing:-.065em;line-height:1.3;margin:0}.hero h1 em{font-style:normal;color:var(--mint)}.hero-sub{color:#c5d4de;line-height:2;font-size:15px;margin:28px 0 34px}.hero-actions{display:flex;gap:12px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:35px;padding:16px 22px;border-radius:4px;font-size:13px;font-weight:700;transition:.2s}.button:hover{transform:translateY(-2px)}.primary{background:var(--mint);color:#082019}.ghost{border:1px solid #ffffff70;color:white}.secondary{background:#112c3b;color:#fff;margin-top:22px}.hero-bottom{position:absolute;z-index:3;bottom:0;left:0;right:0;padding:28px 6vw 34px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #ffffff35;gap:20px}.hero-bottom div{display:flex;flex-direction:column;gap:7px}.hero-bottom small{font-size:10px;letter-spacing:.2em;color:#a5b8c2}.hero-bottom strong{font-size:14px;letter-spacing:.07em}.section{padding:110px max(6vw,24px);max-width:1600px;margin:auto}.section-head{margin-bottom:48px}.section-num{color:#4b887c}.section-head h2{font-size:clamp(35px,4.4vw,60px);letter-spacing:-.055em;margin:12px 0 14px}.accent{color:#5dbaa0}.section-head p{font-size:14px;color:#647481;line-height:1.9}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.stat-card{background:#fff;border:1px solid #e5ebe9;border-radius:7px;padding:36px;min-height:255px}.stat-card .icon{font-size:27px;color:#5dbaa0}.stat-card small,.location-facts small,.settings-grid small{display:block;font-size:10px;letter-spacing:.18em;color:#7e9299;font-weight:700;margin-top:20px}.stat-card h3{font-size:24px;letter-spacing:-.04em;margin:12px 0}.stat-card p{color:#6c7a83;font-size:13px;line-height:1.9}.notice{display:flex;gap:15px;background:#e5f1e9;border-left:3px solid #62ad8f;padding:21px 24px;margin-top:22px;color:#32584b;font-size:13px;line-height:1.8}.dark-section{max-width:none;background:var(--bg);color:#f2f7f7}.dark-section>.section-head,.dark-section>.timeline,.dark-section>.fineprint,.dark-section>.camera-layout,.dark-section>.tip{max-width:1400px;margin-left:auto;margin-right:auto}.dark-section .section-num{color:var(--mint)}.dark-section .section-head p{color:#9ab1bf}.timeline{border-top:1px solid #2c4552}.step{display:grid;grid-template-columns:220px 1fr;border-bottom:1px solid #2c4552;padding:29px 0;gap:20px}.time{font-size:25px;font-weight:700;letter-spacing:-.04em}.time span{display:block;color:#7e9aa9;font-size:10px;letter-spacing:.13em;margin-top:9px}.step-body{border-left:1px solid #2c4552;padding-left:40px}.step-tag{font-size:10px;letter-spacing:.17em;color:#a6d5c0}.step h3{font-size:19px;margin:10px 0}.step p{color:#9fb1bc;font-size:13px;line-height:1.9;max-width:780px;margin:0}.step.highlight{background:#142e37;margin:0 -20px;padding:29px 20px;border-radius:5px}.highlight .time,.highlight .step-tag{color:var(--mint)}.fineprint{font-size:12px;line-height:1.9;color:#809ba9;margin-top:25px}.location-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:32px}.location-copy{background:#fff;border:1px solid #e6ecea;padding:38px}.pill{display:inline-block;background:#e6f4e9;padding:8px 12px;border-radius:3px;color:#397e69;font-size:11px;font-weight:700}.location-copy h3{font-size:37px;line-height:1.3;letter-spacing:-.04em;margin:24px 0}.location-copy h3 span{font-size:13px;letter-spacing:.2em;color:#82969d}.location-copy>p{color:#647781;font-size:14px;line-height:2}.location-facts{border-top:1px solid #e4ebe9;margin-top:30px}.location-facts div{padding:14px 0;border-bottom:1px solid #e4ebe9;display:flex;justify-content:space-between;gap:20px}.location-facts small{margin:0}.location-facts strong{font-size:12px;text-align:right}.map-wrap{position:relative;min-height:500px;border-radius:4px;overflow:hidden;background:#cbd9d7}#map{height:100%;min-height:500px;z-index:1}.map-label{position:absolute;z-index:500;bottom:15px;left:15px;background:#ffffffed;padding:10px;font-size:10px;letter-spacing:.08em}.safety-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:20px}.safety-card{background:#e8eeec;padding:22px}.safety-card b{font-size:14px}.safety-card p{font-size:12px;color:#61737d;line-height:1.8;margin-bottom:0}.camera-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:40px}.settings-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.settings-grid>div{background:#132a38;padding:22px;min-height:130px}.settings-grid small{margin:0;color:#8fb1b8}.settings-grid strong{display:block;font-size:32px;margin-top:25px;color:var(--mint)}.settings-grid i{font-size:13px;font-style:normal;color:#b5c7c9}.camera-notes{padding:10px 0}.camera-notes h3{font-size:21px;margin:0 0 24px}.camera-notes p{display:flex;gap:15px;color:#a6b8c1;font-size:13px;line-height:1.8;margin:0;padding:12px 0;border-bottom:1px solid #26404b}.camera-notes p span{color:var(--mint);font-weight:700}.tip{margin-top:30px!important;background:#203d41;color:#c5e3d7;padding:20px;display:flex;gap:15px;font-size:13px;line-height:1.9}.checklist-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.checklist-group{background:#fff;border:1px solid #e2eae6;padding:30px}.checklist-group h3{font-size:14px;letter-spacing:.08em;margin:0 0 22px}.checklist-group label{display:flex;align-items:center;gap:13px;padding:14px 0;border-bottom:1px solid #edf0ee;font-size:13px;cursor:pointer}.checklist-group label:has(input:checked){color:#91a09b;text-decoration:line-through}.checklist-group input{accent-color:#3c9a7e;width:18px;height:18px}.check-footer{margin-top:20px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}.check-footer span{font-size:13px;font-weight:700}.progress-track{height:7px;background:#dfe8e3;border-radius:10px;flex:1;min-width:150px;overflow:hidden}#progressBar{height:100%;background:#58a98b;width:0;transition:width .2s}#resetChecks{border:0;background:none;color:#4c8576;cursor:pointer;font-size:12px}.closing{background:radial-gradient(ellipse at 50% 0%,#214a51,#07131e 75%);color:white;text-align:center;padding:120px 24px}.closing>span{color:var(--mint);font-size:11px;letter-spacing:.4em}.closing h2{font-size:clamp(37px,5vw,70px);line-height:1.45;letter-spacing:-.06em}.closing p{font-size:11px;letter-spacing:.2em;color:#9bb4bd}.closing a{display:inline-block;border-bottom:1px solid var(--mint);color:var(--mint);font-size:11px;letter-spacing:.1em;margin-top:30px;padding-bottom:7px}footer{background:#04101a;color:#8aa3ad;padding:25px 6vw;font-size:10px;letter-spacing:.1em;display:flex;justify-content:space-between}.mobile-nav{display:none}.leaflet-container{font-family:'DM Sans','Noto Sans JP',sans-serif}@media(max-width:800px){.topbar{height:65px}.desktop-links,.header-date{display:none}.hero{min-height:720px;height:90svh}.hero-content{padding:190px 7vw 160px}.hero h1{font-size:clamp(45px,10vw,75px)}.hero-bottom{grid-template-columns:repeat(2,1fr);padding:20px 7vw;gap:14px}.hero-bottom strong{font-size:12px}.section{padding:76px 22px}.stat-grid,.location-grid,.safety-grid,.camera-layout,.checklist-grid{grid-template-columns:1fr}.stat-card{min-height:0}.step{grid-template-columns:100px 1fr;gap:12px}.time{font-size:18px}.step-body{padding-left:18px}.step h3{font-size:16px}.step p{font-size:12px}.location-copy{padding:25px}.map-wrap,#map{min-height:370px}.settings-grid{grid-template-columns:repeat(2,1fr)}.settings-grid strong{font-size:29px}.mobile-nav{display:flex;position:fixed;z-index:1000;bottom:0;left:0;right:0;background:#071823f5;color:#d4e5e6;justify-content:space-around;padding:10px 8px max(12px,env(safe-area-inset-bottom));border-top:1px solid #2b4852}.mobile-nav a{display:flex;flex-direction:column;align-items:center;font-size:21px;gap:2px}.mobile-nav span{font-size:10px}.closing{padding:90px 20px 120px}footer{padding-bottom:100px;display:block;line-height:2}footer span{display:block}.hero-actions{flex-wrap:wrap}}

/* Mobile-first refinements and weather */
.weather-section{background:#eaf1ef}.weather-panel{background:#fff;border:1px solid #dce8e3;border-radius:14px;padding:clamp(18px,4vw,36px);box-shadow:0 18px 60px #0b26300b}.weather-top{display:flex;justify-content:space-between;gap:18px;align-items:start}.weather-top h3{font-size:clamp(22px,3vw,32px);margin:18px 0 8px}.weather-top p{color:#647781;font-size:13px;line-height:1.8}.weather-refresh{background:#143c3d;color:#e6fff2;border:0;border-radius:9px;padding:12px 17px;min-height:44px;white-space:nowrap;cursor:pointer}.weather-hours{display:grid;grid-template-columns:repeat(7,minmax(135px,1fr));gap:10px;overflow-x:auto;overscroll-behavior-x:contain;padding:12px 0 18px;scroll-snap-type:x proximity}.weather-hour{background:#f2f7f5;border:1px solid #e0ebe5;border-radius:12px;padding:16px;scroll-snap-align:start;font-size:12px;line-height:2;color:#51646c}.weather-hour-time{font-weight:800;color:#173b40;white-space:nowrap}.weather-symbol{font-size:27px;margin:6px 0}.weather-hour strong{color:#0d3035}.weather-number{border-top:1px solid #dbe8e2;padding-top:8px}.weather-foot,.weather-credit{font-size:12px;color:#61777d;line-height:1.7}.weather-credit a{text-decoration:underline}.route-actions{margin-top:14px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.route-actions .button{margin-top:0}.route-actions p{font-size:12px;line-height:1.8;color:#687b83;flex:1;min-width:230px}.map-label{max-width:calc(100% - 30px);line-height:1.5;letter-spacing:0;border-radius:5px}.leaflet-container{touch-action:pan-x pan-y}button,a,input{touch-action:manipulation}html{scroll-padding-top:18px}body{overflow-x:hidden}#map{width:100%}
@media(max-width:800px){.hero{min-height:0;height:auto;max-height:none;padding-bottom:118px}.hero-content{padding:140px 22px 60px}.hero h1{font-size:clamp(40px,10.5vw,64px)}.hero-sub{font-size:13px;line-height:1.9}.hero-bottom{gap:12px;padding:16px 22px 22px}.hero-bottom small{font-size:9px}.hero-bottom strong{font-size:11px;overflow-wrap:anywhere}.section{padding:66px 18px}.section-head{margin-bottom:30px}.section-head h2{font-size:clamp(30px,8vw,42px)}.stat-card{padding:25px}.step{grid-template-columns:85px minmax(0,1fr)}.time{font-size:16px;overflow-wrap:anywhere}.step-body{padding-left:12px;min-width:0}.step.highlight{margin:0 -8px;padding:22px 8px}.location-copy{padding:22px}.location-copy h3{font-size:31px}.location-facts div{align-items:start}.location-facts strong{max-width:60%;overflow-wrap:anywhere}.map-wrap,#map{min-height:360px}.settings-grid>div{padding:16px;min-height:115px}.settings-grid strong{font-size:26px}.checklist-group{padding:22px}.checklist-group label{min-height:48px}.weather-top{align-items:start}.weather-top .pill{font-size:10px}.weather-hours{grid-template-columns:repeat(7,145px);margin-right:-18px;padding-right:18px}.route-actions{display:block}.route-actions .button{width:100%;gap:10px}.mobile-nav{padding-bottom:max(12px,env(safe-area-inset-bottom));gap:4px}.mobile-nav a{flex:1;min-width:0;padding:4px 0;min-height:44px;justify-content:center}.mobile-nav a span{font-size:9px}.closing{padding-bottom:130px}}
@media(max-width:370px){.brand{font-size:17px}.hero h1{font-size:39px}.hero-actions .button{width:100%}.hero-bottom{grid-template-columns:repeat(2,minmax(0,1fr))}.section{padding-left:15px;padding-right:15px}.step{grid-template-columns:76px minmax(0,1fr)}.time{font-size:14px}.step h3{font-size:14px}.step-body{padding-left:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}

/* v3: mobile-first destination cards */
.spot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:24px}.spot-card,.via-panel{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.13);border-radius:20px;padding:22px;min-width:0}.spot-card h3{font-size:1.3rem;margin:16px 0 10px}.spot-card p,.via-panel p{line-height:1.8;color:#b7c4d1}.spot-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.8rem;color:#b7c4d1}.spot-detail{font-size:.88rem;line-height:1.9;margin:16px 0;color:#dce5eb}.spot-link{display:block;padding:12px 0;color:#a7e4da;text-decoration:none;font-size:.9rem;border-top:1px solid rgba(255,255,255,.1)}.via-panel{margin-top:20px}.via-panel h3{margin:0 0 12px}.via-buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}@media(max-width:900px){.spot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.spot-grid{grid-template-columns:1fr;gap:12px}.spot-card,.via-panel{padding:18px;border-radius:16px}.spot-card h3{font-size:1.18rem}.via-buttons{flex-direction:column}.via-buttons .button{width:100%;justify-content:center}.spot-link{min-height:44px;display:flex;align-items:center}}

.spot-tabs{display:flex;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:4px 2px 14px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.spot-tab{flex:0 0 auto;scroll-snap-align:start;border:1px solid #b8cec7;border-radius:999px;background:#fff;color:#234a42;padding:13px 18px;min-height:48px;font:700 13px 'Noto Sans JP',sans-serif;cursor:pointer;white-space:nowrap}.spot-tab.active{background:#112c3b;border-color:#112c3b;color:#b8f3d0}.spot-tab:focus-visible{outline:3px solid #57a78b;outline-offset:3px}.spot-tab-hint{font-size:12px;color:#6c7d85;margin:0 0 20px}.location-copy h3{overflow-wrap:anywhere}@media(max-width:620px){.spot-tabs{margin-right:-22px;padding-right:22px}.spot-tab{font-size:12px;padding:13px 16px}.location-facts div{align-items:flex-start}.location-facts strong{max-width:64%}.map-label{right:12px;left:12px;line-height:1.5}}

/* v5: mobile-first gear selector */
.gear-tabs{display:flex;gap:10px;overflow-x:auto;scrollbar-width:thin;padding:4px 0 14px;scroll-snap-type:x proximity}.gear-tab{flex:0 0 auto;min-height:48px;padding:12px 17px;border-radius:999px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#e5edf2;font:inherit;cursor:pointer;scroll-snap-align:start}.gear-tab.active{background:#b9f3df;color:#112b29;border-color:#b9f3df;font-weight:700}.gear-panel{border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:22px;background:rgba(255,255,255,.04)}.gear-intro h3{font-size:1.25rem;margin:0 0 6px}.gear-intro p{margin:0 0 20px;color:#c1ced8}.gear-notes{margin-top:20px}.gear-notes p{display:flex;gap:12px;line-height:1.8;color:#d9e4e9}.gear-notes span{color:#a8eadb;font-weight:700}@media(max-width:620px){.gear-panel{padding:16px;border-radius:16px}.gear-tab{font-size:.87rem}.gear-panel .settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gear-panel .settings-grid strong{overflow-wrap:anywhere;font-size:clamp(1.1rem,5vw,1.6rem)}}

/* v6: shutter-speed / ISO reference, mobile-first */
.exposure-guide{margin-top:26px;padding:clamp(18px,4vw,30px);border:1px solid #36535d;border-radius:18px;background:#102a37;color:#f0f8f6}.exposure-head h3{font-size:clamp(22px,5vw,30px);margin:12px 0}.exposure-head p,.exposure-foot{color:#c2d3d9;font-size:13px;line-height:1.85}.exposure-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px;border:1px solid #36535d;margin:20px 0}.exposure-table{width:100%;border-collapse:collapse;font-size:13px;min-width:310px}.exposure-table th{text-align:left;background:#1a3b48;color:#c8f4e5;font-size:12px}.exposure-table th,.exposure-table td{padding:13px 12px;border-bottom:1px solid #35505a}.exposure-table td:nth-child(2){white-space:nowrap}.exposure-table tbody tr:last-child td{border-bottom:0}.exposure-recommended{background:#285c50;color:#fff;font-weight:800}.exposure-how{background:#1b4142;border-radius:12px;padding:18px;margin-top:20px;line-height:1.8;font-size:13px}.exposure-how strong{color:#b8f3d0}.exposure-how p{margin:8px 0 0}@media(max-width:620px){.exposure-guide{margin-top:18px;padding:16px;border-radius:14px}.exposure-table{font-size:12px}.exposure-table th,.exposure-table td{padding:12px 8px}.exposure-table td:last-child{min-width:108px}}