:root{
  color-scheme:light dark;
  --h:332; --c:0.1;
  --sea-a:oklch(22% .05 347); --sea-b:oklch(36% .08 327); --sea-c:oklch(58% .08 312);
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Segoe UI Variable Text","Segoe UI",system-ui,Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --bg:oklch(98.5% .004 var(--h)); --bg-2:oklch(96.2% .008 var(--h)); --surface:oklch(100% 0 0);
  --line:oklch(89% .012 var(--h)); --hair:oklch(0% 0 0 / .08);
  --ink:oklch(17% .02 var(--h)); --ink-2:oklch(40% .02 var(--h)); --mut:oklch(55% .02 var(--h));
  --brand:oklch(50% var(--c) var(--h)); --brand-ink:oklch(42% var(--c) var(--h));
  --brand-soft:oklch(95% calc(var(--c)*.3) var(--h)); --on-brand:oklch(99% 0 0);
  --ok:oklch(45% .12 150); --ok-bg:oklch(94% .04 150); --gold:oklch(70% .13 80);
  --focus:oklch(60% .16 250);
  --glass:oklch(100% 0 0 / .62); --glass-strong:oklch(100% 0 0 / .8); --glass-edge:oklch(100% 0 0 / .85);
  --glass-shadow:0 1px 1px oklch(0% 0 0 / .04),0 12px 40px -12px oklch(20% .04 var(--h) / .25);
  --lift:0 2px 6px oklch(0% 0 0 / .05),0 24px 60px -24px oklch(20% .05 var(--h) / .35);
  --r-xl:28px; --r-lg:20px; --r:14px; --r-sm:10px;
  --ease:cubic-bezier(.22,1,.36,1);
  --w:1120px; --text:66ch;
  --map-style:map-light.json;
}

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:oklch(13% .012 var(--h)); --bg-2:oklch(17% .014 var(--h)); --surface:oklch(20% .014 var(--h));
    --line:oklch(30% .014 var(--h)); --hair:oklch(100% 0 0 / .09);
    --ink:oklch(95% .006 var(--h)); --ink-2:oklch(80% .01 var(--h)); --mut:oklch(66% .012 var(--h));
    --brand:oklch(76% calc(var(--c)*.9) var(--h)); --brand-ink:oklch(82% calc(var(--c)*.8) var(--h));
    --brand-soft:oklch(26% calc(var(--c)*.35) var(--h)); --on-brand:oklch(15% .02 var(--h));
    --ok:oklch(80% .1 150); --ok-bg:oklch(28% .05 150); --gold:oklch(80% .13 85); --focus:oklch(72% .13 250);
    --glass:oklch(22% .015 var(--h) / .55); --glass-strong:oklch(22% .015 var(--h) / .8); --glass-edge:oklch(100% 0 0 / .18);
    --glass-shadow:0 1px 1px oklch(0% 0 0 / .3),0 12px 40px -12px oklch(0% 0 0 / .7);
    --lift:0 2px 6px oklch(0% 0 0 / .4),0 24px 60px -24px oklch(0% 0 0 / .8);
    --sea-a:oklch(14% .04 347); --sea-b:oklch(24% .07 329); --sea-c:oklch(40% .08 315);
    --map-style:map-dark.json;
  }
}
:root[data-theme="dark"]{
  --bg:oklch(13% .012 var(--h)); --bg-2:oklch(17% .014 var(--h)); --surface:oklch(20% .014 var(--h));
  --line:oklch(30% .014 var(--h)); --hair:oklch(100% 0 0 / .09);
  --ink:oklch(95% .006 var(--h)); --ink-2:oklch(80% .01 var(--h)); --mut:oklch(66% .012 var(--h));
  --brand:oklch(76% calc(var(--c)*.9) var(--h)); --brand-ink:oklch(82% calc(var(--c)*.8) var(--h));
  --brand-soft:oklch(26% calc(var(--c)*.35) var(--h)); --on-brand:oklch(15% .02 var(--h));
  --ok:oklch(80% .1 150); --ok-bg:oklch(28% .05 150); --gold:oklch(80% .13 85); --focus:oklch(72% .13 250);
  --glass:oklch(22% .015 var(--h) / .55); --glass-strong:oklch(22% .015 var(--h) / .8); --glass-edge:oklch(100% 0 0 / .18);
  --glass-shadow:0 1px 1px oklch(0% 0 0 / .3),0 12px 40px -12px oklch(0% 0 0 / .7);
  --lift:0 2px 6px oklch(0% 0 0 / .4),0 24px 60px -24px oklch(0% 0 0 / .8);
  --sea-a:oklch(14% .04 347); --sea-b:oklch(24% .07 329); --sea-c:oklch(40% .08 315);
  --map-style:map-dark.json;
}

*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:17px/1.55 var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:6px}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img{max-width:100%}
.wrap{max-width:var(--w);margin:0 auto;padding-inline:clamp(16px,4vw,32px)}
h1,h2,h3{font-weight:600;letter-spacing:-.02em;text-wrap:balance;line-height:1.1}
h1{font-size:clamp(2.4rem,1.6rem + 3.4vw,4.4rem);letter-spacing:-.035em;line-height:1.02}
h2{font-size:clamp(1.6rem,1.2rem + 1.4vw,2.4rem);letter-spacing:-.03em}
h3{font-size:1.15rem;letter-spacing:-.012em}
p{text-wrap:pretty}
main p{max-width:var(--text)}
.lede{font-size:clamp(1.15rem,1rem + .6vw,1.45rem);line-height:1.4;color:var(--ink-2);letter-spacing:-.012em;max-width:34em}
.mut,.src{color:var(--mut)}
.src{font-size:.86rem}
.num{font-variant-numeric:tabular-nums}
.ic{width:1.15em;height:1.15em;vertical-align:-.2em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
main{padding-bottom:clamp(40px,6vw,80px)}
main>h2,.block-head{margin-top:clamp(48px,7vw,96px)}
.block-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:clamp(20px,3vw,36px);flex-wrap:wrap}
.block-head h2{margin-top:0}
main>h2{margin-bottom:clamp(16px,2vw,28px)}
.block-head p{color:var(--mut);max-width:42em}
.more{font-weight:500;color:var(--brand-ink);white-space:nowrap}
.more::after{content:" →"}
main>p:not(.lede){margin:0 0 14px}
a.in,main p a,.faq a,.note a,dd a{color:var(--brand-ink);font-weight:500}


.glass{background:var(--glass);-webkit-backdrop-filter:blur(28px) saturate(1.7);backdrop-filter:blur(28px) saturate(1.7);
  box-shadow:inset 0 1px 0 var(--glass-edge),inset 0 0 0 1px oklch(100% 0 0 / .12),var(--glass-shadow)}
@media (prefers-reduced-transparency:reduce){ .glass{background:var(--surface);-webkit-backdrop-filter:none;backdrop-filter:none} }


.bar{position:fixed;top:calc(12px + env(safe-area-inset-top,0px));left:0;right:0;z-index:40;pointer-events:none}
.bar .in{pointer-events:auto;max-width:calc(var(--w) - 24px);margin:0 auto;display:flex;align-items:center;gap:6px;padding:6px 8px 6px 12px;border-radius:999px;width:calc(100% - 24px)}
.logo{display:inline-flex;align-items:center;gap:.5em;font-weight:600;letter-spacing:-.02em;font-size:1.05rem;padding:6px 6px;margin-right:6px}
.logo b{font-weight:600;color:var(--brand)}
.mark{width:28px;height:28px;border-radius:8px;background:var(--brand);color:#fff;display:grid;place-items:center;box-shadow:inset 0 1px 0 oklch(100% 0 0 / .35),0 1px 2px oklch(0% 0 0 / .15);flex:none}
.mark .ic{width:17px;height:17px;stroke-width:2}
.bar nav{display:flex;gap:2px;margin-left:auto;overflow-x:auto;scrollbar-width:none}
.bar nav a,.bar nav button{display:inline-flex;align-items:center;gap:.35em;padding:8px 13px;border-radius:999px;font-size:.95rem;font-weight:500;color:var(--ink-2);white-space:nowrap;transition:background .2s,color .2s,transform .25s var(--ease)}
.bar nav a:hover,.bar nav button:hover{background:oklch(50% .02 var(--h) / .08);color:var(--ink)}
.bar nav .nearme{color:var(--brand-ink);font-weight:600}
.bar nav a:active,.bar nav button:active{transform:scale(.96)}
.bar.over .in{background:oklch(18% .03 var(--h) / .38);box-shadow:inset 0 1px 0 oklch(100% 0 0 / .28),inset 0 0 0 1px oklch(100% 0 0 / .12),0 12px 40px -12px oklch(0% 0 0 / .45)}
.bar.over .logo,.bar.over nav a,.bar.over nav button{color:oklch(100% 0 0 / .85)}
.bar.over .logo b,.bar.over nav .nearme{color:#fff}
.bar.over .mark{background:oklch(100% 0 0 / .18)}
.bar.over nav a:hover,.bar.over nav button:hover{background:oklch(100% 0 0 / .14);color:#fff}
@media (max-width:720px){ .bar .in{padding-left:10px} .logo .txt{display:none} .bar nav a.hide-m{display:none} }


.hero{position:relative;overflow:hidden;color:oklch(98% .005 var(--h));isolation:isolate;
  background:linear-gradient(180deg,var(--sea-a) 0%,var(--sea-b) 55%,var(--sea-c) 100%)}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:-1}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(120% 70% at 50% 100%,oklch(100% 0 0 / .14),transparent 60%)}
.hero .wrap{position:relative}
.hero--home{padding:calc(120px + env(safe-area-inset-top,0px)) 0 96px;min-height:min(74vh,720px);display:flex;align-items:end}
.hero--home h1{max-width:12em;text-shadow:0 2px 24px oklch(0% 0 0 / .18)}
.hero--home .lede{color:oklch(100% 0 0 / .82);margin-top:22px;text-shadow:0 1px 12px oklch(0% 0 0 / .2)}
.hero--band{padding:calc(108px + env(safe-area-inset-top,0px)) 0 52px}
.hero--band h1{font-size:clamp(2rem,1.4rem + 2.6vw,3.6rem)}
.hero .lede{color:oklch(100% 0 0 / .84)}
.hero--band .lede{margin-top:14px;font-size:1.15rem}
.hero .stat{color:oklch(100% 0 0 / .7);font-size:.95rem;margin-top:14px;max-width:44em}
.hero .stat .src{color:oklch(100% 0 0 / .55)}
.crumbs{display:flex;gap:8px;font-size:.9rem;color:var(--mut);flex-wrap:wrap;margin:0 0 18px}
.hero .crumbs{color:oklch(100% 0 0 / .7)}
.hero .crumbs a:hover{color:#fff}
.no-hero main{padding-top:calc(96px + env(safe-area-inset-top,0px))}
.no-hero main h1{font-size:clamp(2rem,1.4rem + 2.6vw,3.4rem);margin-bottom:14px}
.hero-acts{display:flex;gap:10px;margin-top:34px;flex-wrap:wrap;align-items:center}
.cta{display:inline-flex;align-items:center;gap:.5em;padding:14px 22px;border-radius:999px;font-weight:600;font-size:1rem;letter-spacing:-.01em;
  background:oklch(100% 0 0 / .92);color:oklch(22% .06 var(--h));box-shadow:0 1px 2px oklch(0% 0 0 / .15),0 14px 32px -12px oklch(0% 0 0 / .45);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.cta:hover{transform:translateY(-1px)}
.cta:active{transform:scale(.97)}
.cta.ghost{background:oklch(100% 0 0 / .16);color:#fff;box-shadow:inset 0 1px 0 oklch(100% 0 0 / .35),inset 0 0 0 1px oklch(100% 0 0 / .18);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5)}
main .cta{background:var(--brand);color:var(--on-brand);box-shadow:var(--glass-shadow)}
.hero-stats{display:flex;gap:clamp(20px,4vw,48px);margin-top:44px;flex-wrap:wrap;color:oklch(100% 0 0 / .78);font-size:.95rem}
.hero-stats b{display:block;color:#fff;font-size:1.5rem;font-weight:600;letter-spacing:-.03em;line-height:1.1}


.finder{margin-top:-34px;position:relative;z-index:2}
.finder .in{display:grid;grid-template-columns:1fr auto;gap:8px;padding:8px 8px 8px 22px;border-radius:999px;align-items:center;position:relative}
.finder input{font:inherit;font-size:1.05rem;border:0;background:none;color:var(--ink);width:100%;padding:12px 0;outline:none;min-width:0}
.finder input::placeholder{color:var(--mut)}
.finder .go{padding:13px 22px;border-radius:999px;background:var(--brand);color:var(--on-brand);font-weight:600;transition:transform .25s var(--ease)}
.finder .go:active{transform:scale(.97)}
.finder-hint{display:flex;gap:6px 16px;flex-wrap:wrap;margin:14px 22px 0;font-size:.9rem;color:var(--mut)}
.finder-hint a{color:var(--brand-ink);font-weight:500}
.sugg{position:absolute;left:12px;right:12px;top:calc(100% + 8px);border-radius:18px;padding:6px;z-index:5;display:none}
.sugg.on{display:block}
.sugg a{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:12px;font-size:1rem}
.sugg a:hover,.sugg a.k{background:oklch(50% .02 var(--h) / .1)}
.sugg a .n{color:var(--mut);font-size:.9rem}
@media (max-width:560px){ .finder .go{padding:13px 16px} }


.cols,.grid{columns:4 180px;column-gap:40px;list-style:none;padding:0;max-width:none}
.cols li,.grid li{break-inside:avoid;display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--hair);font-size:1rem}
.grid li a{display:contents}
.cols li a{flex:1;transition:color .15s}
.cols li a:hover,.grid li a:hover span:first-child{color:var(--brand-ink)}
.cols .n,.grid .n{color:var(--mut);font-variant-numeric:tabular-nums;font-size:.92rem;white-space:nowrap}
.cols li.big a,.grid li.big span:first-child{font-weight:600}


.features{display:grid;grid-template-columns:1.25fr 1fr;gap:20px;align-items:stretch}
.feat-hero{position:relative;overflow:hidden;border-radius:var(--r-xl);padding:clamp(28px,4vw,44px);color:#fff;min-height:320px;display:flex;flex-direction:column;justify-content:end;
  background:linear-gradient(160deg,var(--sea-b),var(--sea-c) 70%,oklch(75% .08 var(--h)));box-shadow:var(--lift);transition:transform .45s var(--ease)}
.feat-hero:hover{transform:translateY(-3px)}
.feat-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.feat-hero:hover img{transform:scale(1.04)}
.feat-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,oklch(0% 0 0 / .05) 30%,oklch(20% .06 var(--h) / .75))}
.feat-hero h3,.feat-hero p,.feat-hero .tag{position:relative;z-index:1}
.feat-hero h3{font-size:clamp(1.6rem,1.2rem + 1.6vw,2.3rem);letter-spacing:-.03em}
.feat-hero p{color:oklch(100% 0 0 / .85);margin-top:10px;max-width:30em}
.feat-hero .tag{position:absolute;top:22px;left:24px;padding:6px 12px;border-radius:999px;background:oklch(100% 0 0 / .18);font-size:.82rem;font-weight:600;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 oklch(100% 0 0 / .35)}
.feat-list{list-style:none;padding:0;display:flex;flex-direction:column;justify-content:center;max-width:none}
.feat-list li{display:flex;align-items:center;gap:16px;padding:16px 4px;border-bottom:1px solid var(--hair)}
.feat-list li:last-child{border-bottom:0}
.feat-list .g{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand-ink);flex:none}
.feat-list .g .ic{width:20px;height:20px}
.feat-list b{display:block;font-weight:600;letter-spacing:-.01em}
.feat-list b a:hover{color:var(--brand-ink)}
.feat-list small{color:var(--mut);font-size:.9rem}
.feat-list .n{margin-left:auto;color:var(--mut);font-variant-numeric:tabular-nums;font-size:.95rem}
@media (max-width:820px){ .features{grid-template-columns:1fr} .feat-hero{min-height:240px} }


.group{background:var(--surface);border-radius:var(--r-lg);box-shadow:0 0 0 1px var(--hair),0 1px 2px oklch(0% 0 0 / .03);overflow:hidden;list-style:none;padding:0;margin:0 0 8px;max-width:none}
.row,.yard{display:grid;grid-template-columns:1fr auto;gap:12px 24px;padding:20px 22px;border-top:1px solid var(--hair);align-items:start;transition:background .2s}
.row:first-child,.yard:first-child{border-top:0}
.row:hover,.yard:hover{background:var(--bg-2)}
.row h3,.yard h3{font-size:1.15rem}
.row h3 a:hover,.yard h3 a:hover{color:var(--brand-ink)}
.addr{color:var(--ink-2);font-size:.95rem;margin-top:3px;display:flex;gap:.4em;align-items:baseline;flex-wrap:wrap}
.hrs{color:var(--mut);font-size:.9rem;margin-top:2px;display:flex;gap:.4em;align-items:baseline;flex-wrap:wrap}
.tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.tag-b,.badge{display:inline-block;font-size:.78rem;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--brand-soft);color:var(--brand-ink);white-space:nowrap;vertical-align:2px}
.tag-b.ok,.badge.ok{background:var(--ok-bg);color:var(--ok)}
.tag-b.gold,.badge.gold{background:oklch(95% .05 85);color:oklch(45% .12 75)}
:root[data-theme="dark"] .tag-b.gold,:root[data-theme="dark"] .badge.gold{background:oklch(30% .06 80);color:var(--gold)}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .tag-b.gold,:root:not([data-theme="light"]) .badge.gold{background:oklch(30% .06 80);color:var(--gold)} }
.pill{display:inline-block;font-size:.8rem;color:var(--mut);border:1px solid var(--line);border-radius:999px;padding:1px 9px;margin-left:8px;vertical-align:2px;font-weight:500}
.acts,.row .acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:end;align-self:center}
.act,.yard .row a{display:inline-flex;align-items:center;gap:.4em;padding:9px 14px;border-radius:999px;font-size:.92rem;font-weight:600;color:var(--brand-ink);background:var(--bg-2);transition:background .2s,transform .25s var(--ease);font-variant-numeric:tabular-nums}
.act:hover{background:var(--brand-soft)}
.act:active{transform:scale(.96)}
.act.pri{background:var(--brand);color:var(--on-brand)}
.act.pri:hover{filter:brightness(1.06);background:var(--brand)}
.yard{display:block;background:var(--surface);border-radius:var(--r-lg);box-shadow:0 0 0 1px var(--hair);margin:10px 0;border-top:0}
.yard .row{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px;padding:0;border:0}
.yard:hover{background:var(--surface)}
.group-note{color:var(--mut);font-size:.9rem;margin:12px 0 0}
@media (max-width:640px){ .row{grid-template-columns:1fr;padding:18px 16px} .row .acts{justify-content:start} }


.facts{display:flex;gap:clamp(24px,5vw,64px);flex-wrap:wrap;padding:8px 0 36px}
.facts div{font-size:.95rem;color:var(--mut)}
.facts b{display:block;font-size:1.7rem;font-weight:600;letter-spacing:-.03em;color:var(--ink);line-height:1.1;margin-bottom:2px}
.brief{max-width:var(--text);font-size:1.05rem;line-height:1.6;color:var(--ink-2);margin:0 0 32px}
.note,.callout{padding:20px 24px;border-radius:var(--r-lg);background:var(--brand-soft);font-size:1.02rem;line-height:1.55;margin:28px 0;max-width:var(--text)}
.note b,.callout b{font-weight:600}
.stat{max-width:64ch;font-size:.98rem;color:var(--ink-2)}
.data{border-collapse:collapse;width:100%;margin:16px 0;font-size:.94rem}
.data th,.data td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--hair)}
.data th{color:var(--mut);font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}
.data td.num,.data th.num{text-align:right;font-variant-numeric:tabular-nums}
textarea{width:100%;min-height:96px;font:13px/1.45 var(--mono);padding:10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink)}
.mapbtn{font:600 .98rem/1 var(--font);cursor:pointer;border-radius:999px;padding:12px 20px;color:var(--brand-ink);background:var(--surface);border:1px solid var(--line)}


.map{position:relative;border-radius:var(--r-xl);overflow:hidden;aspect-ratio:1120/520;margin:0 0 28px;background:var(--bg-2);box-shadow:0 0 0 1px var(--hair),var(--lift);isolation:isolate;max-width:none}
.map .ml{position:absolute;inset:0}
.map-chip{position:absolute;top:14px;left:14px;z-index:3;padding:8px 14px;border-radius:999px;font-size:.88rem;font-weight:600;color:var(--ink);display:flex;gap:8px;align-items:center;pointer-events:none}
.map-chip .n{color:var(--mut);font-weight:500}
.map .maplibregl-ctrl-top-right{top:14px;right:14px}
.map .maplibregl-ctrl-group{background:var(--glass);-webkit-backdrop-filter:blur(28px) saturate(1.7);backdrop-filter:blur(28px) saturate(1.7);border-radius:14px;box-shadow:inset 0 1px 0 var(--glass-edge),inset 0 0 0 1px oklch(100% 0 0 / .12),var(--glass-shadow);overflow:hidden}
.map .maplibregl-ctrl-group button{width:38px;height:38px;border-top:1px solid var(--hair);background:none}
.map .maplibregl-ctrl-group button:first-child{border-top:0}
.map .maplibregl-ctrl-group button+button{border-top:1px solid var(--hair)}
.map .maplibregl-ctrl-group button:hover{background:oklch(50% .02 var(--h) / .1)}
:root[data-theme="dark"] .map .maplibregl-ctrl button .maplibregl-ctrl-icon{filter:invert(1)}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .map .maplibregl-ctrl button .maplibregl-ctrl-icon{filter:invert(1)} }
.map .maplibregl-ctrl-attrib{background:var(--glass);color:var(--mut);font-size:.72rem;border-radius:999px;padding:3px 8px;margin:0 12px 10px 0;font-family:var(--font)}
.map .maplibregl-ctrl-attrib a{color:var(--mut)}

.row:target{background:var(--brand-soft);border-radius:12px;
  box-shadow:0 0 0 2px var(--brand) inset;animation:found 2.4s var(--ease) 1}
@keyframes found{0%{background:var(--brand-soft)}70%{background:var(--brand-soft)}
  100%{background:transparent;box-shadow:none}}
@media (prefers-reduced-motion:reduce){.row:target{animation:none}}
.pin{width:24px;height:24px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 1px 2px oklch(0% 0 0 / .2),0 6px 14px -4px oklch(0% 0 0 / .35),inset 0 0 0 1px oklch(0% 0 0 / .05);cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.pin::after{content:"";width:11px;height:11px;border-radius:50%;background:var(--brand)}


.rk{display:inline-flex;align-items:center;justify-content:center;min-width:1.75em;height:1.75em;padding:0 .35em;margin-right:.55em;border-radius:999px;background:var(--brand-soft);color:var(--brand-ink);font-size:.78rem;font-weight:700;font-variant-numeric:tabular-nums;vertical-align:.12em}
.zipnav{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:.92rem;color:var(--mut);margin:-6px 0 18px;max-width:none;line-height:1.7}
.zipnav a{color:var(--brand-ink);font-weight:600;font-variant-numeric:tabular-nums}
.zip-h{font-size:1.05rem;margin:30px 0 12px;display:flex;gap:10px;align-items:baseline;scroll-margin-top:80px}
.zip-h .n{color:var(--mut);font-weight:500;font-size:.9rem;font-variant-numeric:tabular-nums}

.row{scroll-margin-top:96px}
.pin.gold{width:28px;height:28px;
  box-shadow:0 1px 2px oklch(0% 0 0 / .25),0 6px 16px -4px oklch(70% .13 80 / .5),
    inset 0 0 0 1px oklch(0% 0 0 / .05),0 0 0 3px oklch(70% .13 80 / .22)}
.pin.gold::after{width:14px;height:14px;background:var(--gold)}
.pin.gold:hover{transform:scale(1.12)}
.pin.gold.open{transform:scale(1.2);background:var(--gold);box-shadow:0 2px 4px oklch(0% 0 0 / .25),0 0 0 7px oklch(70% .13 80 / .3)}
.pin.gold.open::after{background:#fff;transform:none}
.pin:hover{transform:scale(1.15)}
.pin.open{transform:scale(1.25);background:var(--brand);box-shadow:0 2px 4px oklch(0% 0 0 / .25),0 0 0 6px oklch(50% var(--c) var(--h) / .22)}
.pin.open::after{background:#fff;transform:scale(.7)}
.map .maplibregl-popup{max-width:280px!important}
.map .maplibregl-popup-content{background:var(--glass-strong);-webkit-backdrop-filter:blur(28px) saturate(1.7);backdrop-filter:blur(28px) saturate(1.7);color:var(--ink);border-radius:16px;padding:14px 16px;box-shadow:inset 0 1px 0 var(--glass-edge),var(--glass-shadow);font-family:var(--font)}
.map .maplibregl-popup-anchor-bottom .maplibregl-popup-tip{border-top-color:var(--glass-strong)}
.map .maplibregl-popup-anchor-top .maplibregl-popup-tip{border-bottom-color:var(--glass-strong)}
.map .maplibregl-popup-anchor-left .maplibregl-popup-tip{border-right-color:var(--glass-strong)}
.map .maplibregl-popup-anchor-right .maplibregl-popup-tip{border-left-color:var(--glass-strong)}
.map .maplibregl-popup-close-button{color:var(--mut);font-size:1.2rem;padding:4px 8px}
.pop b{display:block;font-weight:600;letter-spacing:-.01em;line-height:1.25;padding-right:14px}
.pop small{display:block;color:var(--mut);font-size:.82rem;margin:3px 0 10px}
.pop .acts{justify-content:start}
.pop .act{padding:7px 12px;font-size:.85rem}
@media (max-width:640px){ .map{aspect-ratio:4/3} }


.guides{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 28px;list-style:none;padding:0;max-width:none}
.guides li,.guides article{display:flex;flex-direction:column;gap:10px}
.guides .cover{aspect-ratio:16/10;border-radius:var(--r-lg);position:relative;overflow:hidden;display:grid;place-items:end start;padding:16px;background:linear-gradient(150deg,var(--sea-b),var(--sea-c));box-shadow:0 0 0 1px var(--hair)}
.guides .cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.guides li:hover .cover img,.guides article:hover .cover img{transform:scale(1.04)}
.guides .cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,oklch(0% 0 0 / .35))}
.guides .cover i{position:relative;z-index:1;font-style:normal;font-size:.8rem;font-weight:600;color:#fff;padding:6px 12px;border-radius:999px;background:oklch(100% 0 0 / .18);-webkit-backdrop-filter:blur(14px) saturate(1.5);backdrop-filter:blur(14px) saturate(1.5);box-shadow:inset 0 1px 0 oklch(100% 0 0 / .4)}
.guides h2,.guides h3{font-size:1.2rem;line-height:1.25;letter-spacing:-.015em}
.guides h2 a:hover,.guides h3 a:hover{color:var(--brand-ink)}
.guides p{color:var(--ink-2);font-size:.97rem;line-height:1.5}
.guides small{color:var(--mut);font-size:.85rem}
.guides .lead{grid-column:span 2}
.guides .lead .cover{aspect-ratio:16/8}
.guides .lead h2,.guides .lead h3{font-size:1.6rem;letter-spacing:-.025em}
@media (max-width:820px){ .guides{grid-template-columns:1fr 1fr} }
@media (max-width:540px){ .guides{grid-template-columns:1fr} .guides .lead{grid-column:auto} }
.article{display:grid;grid-template-columns:minmax(0,var(--text)) 240px;gap:64px;justify-content:start;padding-top:clamp(24px,4vw,48px)}
.article .body p{font-size:1.12rem;line-height:1.7;margin:0 0 22px;color:var(--ink);max-width:none}
.article .body h2{font-size:1.6rem;margin:44px 0 14px}

.article .body .shot{margin:26px 0;padding:0}
.article .body .shot img{width:100%;height:auto;aspect-ratio:8/5;object-fit:cover;
  border-radius:var(--r-lg);box-shadow:0 1px 2px oklch(0% 0 0 / .08),0 10px 24px -12px oklch(0% 0 0 / .22)}
.article .body ul,.article .body ol{padding-left:1.2em;font-size:1.08rem;line-height:1.65;margin-bottom:22px}
.article .body li{margin-bottom:6px}
.toc{position:sticky;top:96px;align-self:start;font-size:.92rem;padding:18px 20px;border-radius:var(--r-lg)}
.toc b{display:block;margin-bottom:8px;color:var(--mut);font-weight:600;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase}
.toc a{display:block;padding:6px 0 6px 12px;color:var(--ink-2);border-left:2px solid transparent;margin-left:-12px}
.toc a.on{color:var(--ink);border-color:var(--brand)}
@media (max-width:900px){ .article{grid-template-columns:1fr} .toc{position:static;order:-1} }
.byline{display:flex;gap:14px;align-items:center;font-size:.92rem;margin-top:18px;flex-wrap:wrap;color:oklch(100% 0 0 / .7)}
.byline .dot::before{content:"·";margin-right:14px}
.feed,ul.news{list-style:none;padding:0;max-width:820px}
.feed .day{padding:32px 0 8px;font-size:.85rem;font-weight:600;color:var(--mut);letter-spacing:.03em;text-transform:uppercase}
.feed li.item,ul.news li{display:grid;grid-template-columns:1fr auto;gap:8px 24px;padding:16px 0;border-bottom:1px solid var(--hair);align-items:baseline}
.feed li.item a,ul.news li a{font-size:1.1rem;font-weight:500;letter-spacing:-.012em;line-height:1.35}
.feed li.item a:hover,ul.news li a:hover{color:var(--brand-ink)}
.feed .src,ul.news .src{color:var(--mut);font-size:.88rem;white-space:nowrap}
.feed li.item p{grid-column:1 / -1;color:var(--ink-2);font-size:.97rem;line-height:1.5}
@media (max-width:540px){ .feed li.item,ul.news li{grid-template-columns:1fr} }
.faq{max-width:760px;list-style:none;padding:0}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:20px 0;font-size:1.12rem;font-weight:500;letter-spacing:-.012em;line-height:1.35}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:400;color:var(--mut);font-size:1.4rem;line-height:1;transition:transform .3s var(--ease);flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--ink-2);padding:0 0 22px;max-width:60ch;line-height:1.6}
.faq .faq-q{margin:0;padding:18px 0;border-bottom:1px solid var(--hair);max-width:none}
.faq .faq-q b{font-weight:500;font-size:1.12rem;letter-spacing:-.012em}
.faq .faq-a{color:var(--ink-2);display:block;margin-top:6px;max-width:60ch;line-height:1.6}
dl.faq dt{font-weight:500;font-size:1.12rem;padding:18px 0 4px;letter-spacing:-.012em}
dl.faq dd{margin:0;color:var(--ink-2);max-width:60ch;padding-bottom:18px;border-bottom:1px solid var(--hair);line-height:1.6}


footer.site{margin-top:clamp(40px,6vw,96px);padding:48px 0 calc(40px + env(safe-area-inset-bottom,0px));color:var(--mut);font-size:.9rem;border-top:1px solid var(--hair)}
footer.site .wrap{display:grid;gap:12px}
footer.site p{max-width:none}
footer.site a{color:var(--ink-2)}
footer.site a:hover{color:var(--ink)}
footer.site .links{display:flex;gap:6px 18px;flex-wrap:wrap}
@media (prefers-reduced-motion:reduce){ *{transition:none!important;animation:none!important;scroll-behavior:auto} }/*sp*/

.sponsor-wrap{margin-top:clamp(18px,3vw,28px)}
.sponsor-top{display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:20px;color:var(--on-brand);background:var(--brand);background:linear-gradient(135deg,var(--brand),var(--brand-ink));box-shadow:var(--glass-shadow)}
.sponsor-top .logo{width:48px;height:48px;border-radius:14px;background:color-mix(in oklch,var(--on-brand) 16%,transparent);display:grid;place-items:center;flex:none;overflow:hidden}
.sponsor-top .logo .ic{width:24px;height:24px}
.sponsor-top .logo img{width:100%;height:100%;object-fit:cover}
.sponsor-top .txt{flex:1;min-width:0;display:grid;gap:3px}
.sponsor-top .tag{justify-self:start;font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border-radius:999px;background:color-mix(in oklch,var(--on-brand) 18%,transparent)}
.sponsor-top .ttl{font-size:1.14rem;line-height:1.25;letter-spacing:-.01em}
.sponsor-top .sub{font-size:.9rem;opacity:.86}
.sponsor-top .nums{display:flex;gap:6px 16px;flex-wrap:wrap;font-size:.84rem;opacity:.92;margin-top:2px}
.sponsor-top .nums b{font-size:1rem}
.sponsor-top .go{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:.4em;padding:11px 18px;border-radius:999px;background:var(--on-brand);color:var(--brand-ink);font-weight:700;text-decoration:none;transition:transform .25s var(--ease)}
.sponsor-top .go:hover{transform:translateY(-1px);color:var(--brand-ink)}
@media (max-width:640px){.sponsor-top{flex-wrap:wrap;padding:14px 16px}.sponsor-top .txt{flex-basis:calc(100% - 64px)}.sponsor-top .go{width:100%}}/*/sp*/
