@font-face{font-family:Gloock;src:url(/assets/fonts/gloock.woff2) format("woff2");font-display:swap}
@font-face{font-family:Hanken;src:url(/assets/fonts/hanken.woff2) format("woff2");font-weight:400 600;font-display:swap}
@font-face{font-family:'Gloock fb';src:local('Times New Roman');size-adjust:112.4%;ascent-override:86.8%;descent-override:20.0%;line-gap-override:0.0%}@font-face{font-family:'Hanken fb';src:local('Arial');size-adjust:101.5%;ascent-override:98.5%;descent-override:29.8%;line-gap-override:0.0%}
:root{--bg:#120D0C;--bg2:#1C1311;--lit:#3B110E;--ink:#EDE8DF;--mute:#B5ABA0;--line:#4A3934;--red:#B3261E;--red-tx:#FF6F61;
--disp:Gloock,'Gloock fb',Georgia,serif;--sans:Hanken,'Hanken fb',Arial,sans-serif}
*{box-sizing:border-box}html{background:var(--bg);color:var(--ink);-webkit-text-size-adjust:100%}
body{margin:0;font:400 17px/1.6 var(--sans);position:relative}h1,h2{text-wrap:balance}
body:after{content:"";position:absolute;inset:0;background:url(/assets/img/grain-160.webp);opacity:.05;pointer-events:none;mix-blend-mode:screen;z-index:20}
a{color:inherit}img{display:block;max-width:100%;height:auto}
.wrap{max-width:1280px;margin:0 auto;padding:0 40px}
.skip{position:absolute;left:-999px;min-height:44px;display:flex;align-items:center}.skip:focus{left:12px;top:12px;background:var(--ink);color:var(--bg);padding:8px 12px;z-index:9}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
h1,h2,h3{font-family:var(--disp);font-weight:400;margin:0;letter-spacing:-.005em}
.top{display:flex;align-items:center;justify-content:space-between;height:76px;position:relative;z-index:2}
.mark{display:flex;align-items:center;gap:10px;font:400 23px/1 var(--disp);text-decoration:none;min-height:44px}
.mark i{width:10px;height:10px;border-radius:50%;background:var(--red);box-shadow:0 0 0 3px var(--bg),0 0 0 4px var(--red)}
.top nav{display:flex;gap:6px;align-items:center}.top nav a{font-size:15px;font-weight:500;text-decoration:none;color:var(--mute);padding:12px;min-height:44px;position:relative;z-index:2}
.top nav a:hover{color:var(--ink);text-decoration:underline;text-decoration-color:var(--red-tx);text-underline-offset:6px}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--red-tx);margin:0 0 18px}
.hero{position:relative;max-width:1280px;margin:0 auto;aspect-ratio:1280/636;padding:84px 0 40px;overflow-x:clip}
.hero .copy{position:relative;margin-left:40px;width:min(500px,calc(44% - 40px));container-type:inline-size}
.hero h1{font-size:clamp(56px,14.5cqi,92px);line-height:1.0;margin:0 0 24px}
.lede{font-size:19px;line-height:1.55;color:var(--mute);margin:0 0 32px;max-width:min(30em,var(--measure,52ch))}
.ctas{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center}
.btn{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;background:var(--red);color:var(--ink);font-weight:600;font-size:16px;text-decoration:none;border-radius:2px}
.btn:hover{background:#C42D23}
.link{gap:.3em;font-weight:600;text-decoration:underline;text-decoration-color:var(--red-tx);text-underline-offset:5px;min-height:44px;display:inline-flex;align-items:center}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;border-top:1.4px solid var(--ink);margin:0 auto;padding:18px 0 64px}
.stats dt{font:400 40px/1 var(--disp);margin-bottom:8px}.stats dd{margin:0;font-size:13px;line-height:1.4;color:var(--mute)}
.mob{display:none}
section h2{font-size:48px;line-height:1.05}
.sec-head{display:grid;grid-template-columns:1.45fr 1fr;gap:40px;align-items:end;margin-bottom:36px}
.sec-head p{margin:0;color:var(--mute);max-width:min(34em,var(--measure,52ch))}
.num{font:400 15px/1 var(--sans);font-weight:600;letter-spacing:.14em;color:var(--red-tx);display:block;margin-bottom:14px}
.prov{padding:40px 0 88px}
.plist{list-style:none;margin:0;padding:0;columns:2;column-gap:56px}
.plist li{break-inside:avoid;border-bottom:1px solid var(--line)}
.plist a{display:flex;align-items:baseline;gap:16px;padding:14px 0;text-decoration:none;min-height:44px}
.plist .n{font:400 27px/1.15 var(--disp)}
.plist .c{margin-left:auto;font:400 27px/1 var(--disp);color:var(--red-tx);font-variant-numeric:tabular-nums}
.plist .u{font-size:13px;color:var(--mute);width:4.2em}
.plist a:hover .n{text-decoration:underline;text-decoration-color:var(--red-tx);text-underline-offset:6px;text-decoration-thickness:1.5px}
.ships{margin:44px 0 0;display:grid;grid-template-columns:auto 1fr;gap:4px 32px;align-items:baseline}.ships h3{font-size:24px}.ships p{margin:0;color:var(--mute);font-size:15px}
.ships ul{grid-column:1/-1;list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(28ch,1fr));gap:0 32px}
.ships a{display:inline-flex;align-items:center;min-height:44px;font-weight:500;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:5px}.ships a:hover{text-decoration-color:var(--red-tx)}
.lit{background:var(--lit);padding:88px 0 96px;overflow:hidden}
.lit .sec-head p{color:#D8C9BE}
.line{position:relative;padding-top:34px}
.line:before{content:"";position:absolute;left:-40px;right:-40px;top:22px;border-top:1.4px solid var(--ink)}
.cards{list-style:none;margin:0;padding:0;display:grid}
@media (min-width:901px){.cards{grid-template-columns:repeat(3,minmax(0,300px));justify-content:space-between;gap:60px 24px}
.cards li:nth-child(3n+1){grid-column:1}.cards li:nth-child(3n+2){grid-column:2;margin-top:22px}.cards li:nth-child(3n){grid-column:3}.cards li:nth-child(n+4){grid-row:2}
.cards:after{content:"";grid-area:2/1/3/-1;align-self:start;margin:-12px -40px 0;border-top:1.4px solid var(--ink)}}
.cards li{position:relative;border:1.4px solid var(--ink);padding:22px 16px 18px;background:var(--lit)}
.cards li:before{content:"";position:absolute;left:50%;top:-30px;width:12px;height:50px;margin-left:-6px;background:url(/assets/svg/clip.svg) center/12px 50px no-repeat}
.cards .k{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--red-tx);margin:0 0 10px}
.cards h3{font-size:22px;line-height:1.12;margin:0 0 6px}.cards h3 a{text-decoration:none}.cards h3 a:hover{text-decoration:underline}
.cards .pl{font-size:14px;color:#D8C9BE;margin:0 0 12px}.cards .w{font-size:14px;line-height:1.5;margin:0}
.lit .more{margin-top:40px}
.stories{padding:96px 0}
.st{display:grid;grid-template-columns:360px 1fr 1fr;gap:56px;align-items:start}
.st article{border-top:1.4px solid var(--ink);padding-top:22px}
.st h3{font-size:32px;margin:0 0 12px}.st p{color:var(--mute);margin:0 0 20px}
.foot{padding-top:24px}
.bench{width:100%;max-width:1280px;margin:0 auto}
.fbar{display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:40px;padding:28px 40px 48px;max-width:1280px;margin:0 auto;color:var(--mute);font-size:14px}
.fbar .mark{color:var(--ink)}.fbar p{margin:0;max-width:min(44em,var(--measure,52ch))}.fbar nav{display:flex;flex-direction:column;align-items:flex-start}.fbar nav a{color:var(--ink);text-decoration:none;min-height:44px;display:flex;align-items:center}
.fbar nav a:hover{text-decoration:underline}
@media (max-width:1180px) and (min-width:901px){.hero h1{font-size:clamp(56px,14.5cqi,80px)}.hero .copy{position:static;width:auto;margin:0 40px;max-width:640px}
.st{grid-template-columns:1fr 1fr}.st figure{display:none}}
@media (max-width:900px){
body{font-size:16px}.wrap{padding:0 20px}
.top{height:auto;flex-direction:column;align-items:flex-start;padding:16px 20px 0}
.mark{font-size:21px}.top nav{margin-left:-12px}.top nav a{font-size:14px}
.hero{aspect-ratio:auto;padding:0}.hero .wall{display:none}.mob{display:block;width:100%}
.hero .copy{position:static;width:auto;margin:0 20px}
.hero .copy{margin-top:8px}.hero h1{font-size:44px;line-height:1.03;margin-bottom:16px}.lede{font-size:17px;margin-bottom:24px}
.btn{width:100%;justify-content:center}
.shelf-m{margin-top:20px}
.stats{grid-template-columns:1fr 1fr;gap:18px 20px;padding-bottom:48px}.stats dt{font-size:32px}
section h2{font-size:36px}.sec-head{grid-template-columns:1fr;gap:14px;margin-bottom:24px}
.prov{padding:24px 0 64px}.plist{columns:1}.plist .n,.plist .c{font-size:23px}
.lit{padding:64px 0 72px}
.cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 20px;gap:14px;margin:0 -20px;padding:30px 20px 4px}
.line{padding-top:0}.line:before{top:52px;left:-20px;right:-20px}
.cards li{flex:0 0 min(300px,84vw);scroll-snap-align:start}.cards li:nth-child(even){margin-top:14px}
.stories{padding:64px 0}.st{grid-template-columns:1fr;gap:36px}.st figure{margin:0 auto;width:240px}
.fbar{grid-template-columns:1fr;gap:18px;padding:24px 20px 40px}.ships{grid-template-columns:1fr}}
/* ---- v3 A: shared components for every route (appended after the home rules) ---- */
:root{--edge:#8A7A71;--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:72px;--s9:96px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.top nav a[aria-current]{color:var(--ink);text-decoration:underline;text-decoration-color:var(--red-tx);text-underline-offset:6px}
.mbtn,.mprov{display:none}
/* shelf captions (home wall, desktop only) */
.wallbox{position:absolute;right:0;top:28px;margin-top:-8.76%;width:100%}
.wallbox:before{content:"";position:absolute;left:92.66%;top:calc(15.58% - 12px);bottom:80%;border-left:1.4px solid var(--ink);margin-left:-.7px}
.wallbox .wall{position:static;display:block;width:100%;height:auto}
.caps{list-style:none;margin:0;padding:0}
.caps li{position:absolute;transform:translateX(-50%);font-size:12px;line-height:16px;color:var(--mute);white-space:nowrap;letter-spacing:.02em}
/* buttons and controls */
.btn.ghost{background:transparent;border:1.4px solid var(--ink);color:var(--ink);font:inherit;font-weight:600;font-size:16px;cursor:pointer}
.btn.ghost:hover{background:var(--ink);color:var(--bg)}
.btn:active{background:#8F1E18}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--edge);border-radius:2px;background:transparent;color:var(--ink);font:500 15px/1 var(--sans);text-decoration:none;white-space:nowrap;cursor:pointer}
.chip b,.rbar b{font-weight:600;color:var(--red-tx);font-variant-numeric:tabular-nums}
.chip:hover{border-color:var(--ink);background:var(--bg2)}
.chip[aria-current]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.chip[aria-current] b,.chip[aria-current] .rn{color:var(--red)}
.rn{font:600 12px/1 var(--sans);color:var(--red-tx);letter-spacing:.06em}
/* page hero */
.ph{max-width:1280px;margin:0 auto;padding:16px 40px 48px;display:grid;grid-template-columns:1fr 560px;gap:40px;align-items:center}
.ph.single{grid-template-columns:1fr;padding-bottom:40px}
.crumb{font-size:14px;color:var(--mute);margin:0 0 18px}.crumb a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--edge);text-underline-offset:4px;display:inline-block;padding:12px 0;margin:-12px 0}
.crumb a:hover{text-decoration-color:var(--red-tx)}.crumb span{color:var(--edge);margin:0 6px}
.ph h1{font-size:64px;line-height:1.02;margin:0 0 20px}.ph h1.long{font-size:56px}
.ph .lede{margin:0;max-width:min(32em,var(--measure))}
.ph figure{margin:0}.band{display:none}
/* region chips, sticky */
.rbar{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:1px solid var(--line)}
.rbar ul{list-style:none;margin:0 auto;padding:8px 40px 12px;max-width:1280px;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.rbar ul::-webkit-scrollbar{display:none}
.rbar .co{width:16px;height:16px;border:1px solid currentColor;border-radius:50%;display:inline-grid;place-items:center;font:600 12px/1 var(--sans);color:var(--red-tx)}
.chip[aria-current] .co{color:var(--red)}
/* filter toggles */
.fwrap{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:1px solid var(--line)}
/* regions */
.region{display:grid;grid-template-columns:3fr 9fr;gap:40px;padding:48px 0 8px;scroll-margin-top:96px}
.region>h2{position:sticky;top:88px;align-self:start;font-size:32px;line-height:1.1;border-top:1.4px solid var(--ink);padding-top:16px;display:flex;flex-direction:column;gap:10px}
.region>h2 .rn{font-size:13px;letter-spacing:.14em}
.region>h2 .cc{font:500 14px/1 var(--sans);color:var(--mute)}
/* listing cards */
.shops{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-content:start}
.shops.three{grid-template-columns:repeat(3,1fr)}
.shop{background:var(--bg2);border:1px solid var(--line);border-radius:2px;padding:20px 20px 16px;display:flex;flex-direction:column;min-width:0}
.shop[hidden]{display:none}
.shop header{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.kind{margin:0;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--red-tx)}
.unconf{font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--mute);border:1px solid var(--edge);border-radius:2px;padding:3px 7px;line-height:1}
.shop h3{flex-basis:100%;font-size:24px;line-height:1.15;margin:6px 0 0;overflow-wrap:anywhere}
.shop h3 a{text-decoration:none;display:inline-block;padding:10px 0;margin:-10px 0}
.shop h3 a:hover{text-decoration:underline;text-decoration-color:var(--red-tx);text-underline-offset:5px;text-decoration-thickness:1.5px}
.nw{white-space:nowrap}.ext{width:10px;height:10px;margin-left:6px;vertical-align:.1em;fill:none;stroke:var(--mute);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.where{flex-basis:100%;margin:2px 0 0;font-size:14px;color:var(--mute)}
.chem{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0}
.chem span{font-size:12px;font-weight:600;letter-spacing:.04em;border:1px solid var(--edge);border-radius:2px;padding:4px 7px;line-height:1}
.chem .out{border-style:dashed;color:var(--mute)}
.shop dl{margin:14px 0 0;font-size:14px;line-height:1.5}
.shop dl div{display:grid;grid-template-columns:56px 1fr;gap:12px;padding:6px 0;border-top:1px solid var(--line)}
.shop dt{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);padding-top:2px}
.shop dd{margin:0;overflow-wrap:anywhere}
.note{margin:10px 0 0;font-size:14px;line-height:1.5;color:#D8C9BE;border-left:2px solid var(--edge);padding-left:10px}
.chk{margin:auto 0 0;padding-top:14px;font-size:12px;color:var(--mute);font-variant-numeric:tabular-nums}
/* ships block (inner pages) */
.shipsb{margin:80px 0 0;border-top:1.4px solid var(--ink);padding-top:24px}#ships{scroll-margin-top:120px}#ships:focus{outline:none}
.shipsb h2{font-size:36px;line-height:1.1;margin:0 0 8px}.shipsb>p{margin:0 0 20px;color:var(--mute)}
.shipsb ul{list-style:none;margin:0 0 20px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(28ch,1fr));gap:0 32px}
.shipsb li a{display:grid;gap:2px;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none;min-height:44px}
.shipsb li b{font:400 20px/1.2 var(--disp)}.shipsb li span{font-size:14px;color:var(--mute)}
.shipsb li a:hover b{text-decoration:underline;text-decoration-color:var(--red-tx);text-underline-offset:5px}
main.wrap{padding-bottom:96px}
/* empty, error, loading, no-js */
.empty{border:1px dashed var(--edge);border-radius:2px;background:var(--bg2);padding:28px;margin:24px 0}
.empty[hidden]{display:none}
.dn{border:0;background:none;padding:24px 0 0;margin:0;max-width:52ch}.dn .e-h{color:var(--ink)}.dn:not([hidden])+.shops{display:none}.dn:not([hidden])~.shipsb{margin-top:64px}
.e-h{font:400 28px/1.15 var(--disp);margin:0 0 12px}.empty p{margin:0 0 16px;color:var(--mute);max-width:min(40em,var(--measure))}.empty p a{color:var(--ink)}
.e-sh{margin:20px 0 0!important}.e-act{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;margin:0!important}
.err{border-left:3px solid var(--red);background:var(--bg2);padding:14px 18px;margin:16px 0 0;font-size:15px}
.err[hidden]{display:none}.err p{margin:0}.err b{color:var(--ink)}
.count{font-size:14px;color:var(--mute);margin:16px 0 0;font-variant-numeric:tabular-nums}
.loadbar{height:2px;background:var(--line);margin-top:10px;overflow:hidden;max-width:240px}
.loadbar i{display:block;height:100%;width:30%;background:var(--red-tx);animation:lb 1.1s ease-in-out infinite alternate}
@keyframes lb{from{transform:translateX(0)}to{transform:translateX(233%)}}
.nojs{display:none;font-size:15px;color:var(--mute);border-left:3px solid var(--edge);padding:6px 0 6px 14px;margin:20px 0 0}
.no-js .nojs{display:block}.no-js .dfilters,.no-js .filters{display:none}
/* directory */
.ph.dhead{padding-bottom:0}.dhead h1{font-size:72px}
.dchips{display:grid;grid-template-columns:150px 1fr;gap:12px 24px;margin:36px 0 0;align-items:start}
.dchips p{margin:0;font-size:14px;font-weight:600;padding-top:12px}
.dchips ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.dbar{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:1px solid var(--line);margin-top:28px}
.dfilters{max-width:1280px;margin:0 auto;padding:14px 40px 12px;display:grid;grid-template-columns:1.3fr 1fr auto minmax(0,12em);gap:16px;align-items:end}
.dfilters label{display:grid;gap:6px;font-size:13px;font-weight:600;color:var(--mute)}
.dfilters input,.dfilters select{height:48px;width:100%;background:var(--bg2);border:1px solid var(--edge);border-radius:2px;color:var(--ink);font:400 16px var(--sans);padding:0 14px;color-scheme:dark}
.dfilters input::placeholder{color:var(--mute);opacity:1}
.dfilters input:hover,.dfilters select:hover{border-color:var(--ink)}
.dfilters :disabled{opacity:.55;cursor:progress}
.dfilters .count{margin:0;padding-bottom:14px;text-wrap:wrap;overflow-wrap:anywhere}
h2.count{font:400 14px/1.6 var(--sans);letter-spacing:normal;text-wrap:nowrap}
.d-main .shops{grid-template-columns:repeat(3,1fr);padding-top:24px}
/* stories, submit, 404 */
.soon{border:1px dashed var(--edge);border-radius:2px;background:var(--bg2);padding:40px;display:grid;grid-template-columns:1fr auto;gap:12px 40px;align-items:center}
.soon h2{font-size:40px;margin:0}.soon p{margin:0;color:var(--mute)}.soon .btn{grid-column:2;grid-row:1/3}
.qs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:q}
.qs li{border:1px solid var(--line);border-radius:2px;background:var(--bg2);padding:16px 18px 20px;position:relative;font-size:16px;line-height:1.5}
.qs .num{font-size:13px;margin:0 0 12px}
.q-cta{margin:40px 0 0;display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center}.q-cta span{color:var(--mute);font-size:15px}
.nf{min-height:0}.nf .ctas{margin-top:28px}
/* footer, all pages */
.fbar{grid-template-columns:1.1fr 1.3fr .7fr .9fr}
.fdata p{margin:8px 0 0;font-size:13px;line-height:1.45;color:var(--mute);max-width:22em}
.fbar h2{font:600 13px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:12px 0 8px}
.fbar ul{list-style:none;margin:0;padding:0}.fbar ul.two{columns:2;column-gap:24px}
.fbar li a{color:var(--ink);text-decoration:none;min-height:44px;display:flex;align-items:center;font-size:14px}
.fbar li a:hover{text-decoration:underline;text-decoration-color:var(--red-tx);text-underline-offset:5px}
.fbar .fnote p{margin:14px 0 0}
.foot .directory-feedback{max-width:1280px;margin:0 auto;padding:0 40px 16px;font-size:13px}.fcopy{max-width:1280px;margin:0 auto;padding:16px 40px 32px;border-top:1px solid var(--line);font-size:13px;color:var(--mute)}
@media (max-width:1180px) and (min-width:901px){
.hero{display:flex;flex-direction:column;padding:24px 0 8px;aspect-ratio:auto}.hero .copy{order:-1}.wallbox{position:relative;top:0;margin-top:8px}.wallbox:before{top:0}
.ph{grid-template-columns:1fr 420px}.ph h1{font-size:52px}.ph h1.long{font-size:48px}
.region{grid-template-columns:1fr;gap:20px}.region>h2{position:static;flex-direction:row;align-items:baseline;gap:14px}
.d-main .shops{grid-template-columns:1fr 1fr}.qs{grid-template-columns:repeat(2,1fr)}.d-main #ships{scroll-margin-top:360px}
.fbar{grid-template-columns:1fr 1fr}}
@media (max-width:900px){
.top{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:10px 20px 0;min-height:64px}
.js .mbtn{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 4px 0 14px;margin-right:-4px;background:none;border:0;color:var(--ink);font:600 15px var(--sans);cursor:pointer}
.mbtn i{display:grid;gap:4px;width:18px}.mbtn i:before,.mbtn i:after{content:"";height:1.4px;background:currentColor}
.mbtn[aria-expanded=true] i{gap:0}.mbtn[aria-expanded=true] i:before{transform:translateY(.7px) rotate(45deg)}.mbtn[aria-expanded=true] i:after{transform:translateY(-.7px) rotate(-45deg)}
.top nav{flex-basis:100%;margin-left:-12px;flex-wrap:wrap}
.js .top nav{display:none}
.js .top.open{background:var(--bg2);border-bottom:1px solid var(--line);padding-bottom:20px;margin:0}
.js .top.open nav{display:block;margin:12px 0 0}
.js .top.open nav>a{display:flex;align-items:center;min-height:56px;padding:0;font:400 28px/1.1 var(--disp);color:var(--ink);border-top:1px solid var(--line);text-decoration:none}
.js .top.open nav>a[aria-current]{text-decoration:underline;text-decoration-color:var(--red-tx);text-underline-offset:6px}
.js .top.open .mprov{display:block;border-top:1px solid var(--line);padding-top:14px}
.mprov .mph{font:600 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:0 0 4px}
.mprov ul{list-style:none;margin:0;padding:0;columns:2;column-gap:16px}.mprov li{break-inside:avoid}.js .top .mprov a{display:block;padding:12px 0;min-height:44px;font-size:15px;line-height:20px;text-decoration:none;color:var(--ink)}
.mprov b{color:var(--red-tx);font-weight:600;margin-left:6px}
.wallbox{display:none}
.ph{grid-template-columns:1fr;padding:8px 20px 28px;gap:0}.ph figure{display:none}
.ph h1,.ph h1.long,.dhead h1{font-size:40px;line-height:1.05;margin-bottom:14px}
.crumb{margin-bottom:12px}
.band{display:block;margin:0;background:var(--bg);border-bottom:1px solid var(--line);pointer-events:none;overflow:hidden;height:160px}
.band img{width:390px;max-width:none;height:160px;margin:0 auto}
.rbar ul{padding:8px 20px 10px;-webkit-mask:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
.region{grid-template-columns:1fr;gap:16px;padding-top:36px;scroll-margin-top:88px}#ships{scroll-margin-top:96px}
.region>h2{position:static;font-size:28px;flex-direction:row;align-items:baseline;gap:12px;flex-wrap:wrap}
.shops,.shops.three,.d-main .shops{grid-template-columns:1fr}
.shop{padding:18px 16px 14px}.shop h3{font-size:22px}
.shipsb{margin-top:56px}.shipsb h2{font-size:28px}
.dchips{grid-template-columns:1fr;gap:8px;margin-top:24px}.dchips p{padding-top:8px}
.dchips ul{flex-wrap:nowrap;overflow-x:auto;margin:0 -20px;padding:0 20px 4px;scrollbar-width:none;-webkit-mask:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
.dbar{position:static;margin-top:12px}
.dfilters{grid-template-columns:1fr 1fr;padding:16px 20px 12px;gap:12px}
.dfilters label:first-child,.dfilters label:nth-child(2),.dtype{grid-column:1/-1}.dfilters .count{grid-column:1/-1;padding:4px 0 0}
.band+.wrap{padding-top:24px}.soon{grid-template-columns:1fr;padding:28px 20px}.soon h2{font-size:32px}.soon .btn{grid-column:auto;grid-row:auto;margin-top:12px}
.qs{grid-template-columns:1fr;gap:12px}
.fbar{grid-template-columns:1fr 1fr;gap:8px 20px}.fbar .fnote{grid-column:1/-1}.fbar .fprov{grid-column:1/-1}
.fcopy{padding:16px 20px 28px}.foot .directory-feedback{padding:0 20px 16px}
main.wrap{padding-bottom:64px}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.loadbar i{width:100%;opacity:.5}}

/* UX round 2 (2026-10-20): labelled chip rows + segmented filters */
.flab{display:block;margin:0 0 8px;font:500 12px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.rbar .flab{max-width:1280px;margin:0 auto;padding:12px 40px 0;box-sizing:border-box}
.fset{padding:28px 0 4px}
.fset.sticky{max-width:1280px;margin:0 auto;padding:12px 40px}
.seg{display:inline-flex;max-width:100%;border:1px solid var(--edge);border-radius:2px;vertical-align:top}
.seg button{flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;margin:0;border:0;border-left:1px solid var(--edge);border-radius:0;background:transparent;color:var(--ink);font:500 15px/1 var(--sans);white-space:nowrap;cursor:pointer}
.seg button:first-child{border-left:0}
.seg button:hover{background:var(--bg2)}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--bg)}
.seg button:focus-visible{outline:2px solid var(--ink);outline-offset:3px;position:relative;z-index:1}
.seg button:disabled{opacity:.55;cursor:progress}
.dtype{display:grid;gap:6px;font-size:13px;font-weight:600;color:var(--mute)}
.dtype .seg button{min-height:46px;font-size:15px;padding:0 14px}
@media (max-width:1180px){.dfilters{grid-template-columns:1fr 1fr}.dfilters label:first-child,.dtype{grid-column:1/-1}.dtype .seg{display:flex}}
@media (max-width:900px){.fset{padding-top:20px}.fset.sticky{padding:10px 20px}.rbar .flab{padding:10px 20px 0}}
@media (max-width:560px){.seg{display:grid;grid-template-columns:1fr 1fr;width:100%}
.seg button{border-left:1px solid var(--edge);padding:0 10px}
.seg button:nth-child(odd){border-left:0}.seg button:nth-child(n+3){border-top:1px solid var(--edge)}
.dtype .seg{display:grid}}
/* UX round 4: line length. Prose and intro text never run past 68 characters, at any width.
   In Hanken 1ch (the "0") is 1.26 average characters wide, so 68 characters is about 52ch with word-wrap slack (measured: 68ch would allow about 86) */
:root{--measure:52ch}
p,li,dd,figcaption,blockquote{max-width:var(--measure)}
/* UX round 4: card label/value rows stack when the card is under 380px wide */
.shop{container-type:inline-size}
@container (max-width:379.98px){.shop dl div{display:block}.shop dt{padding:0 0 2px}}
.top nav a:focus-visible{outline-offset:4px}

.e-h,h2.count,#dmsg{overflow-wrap:anywhere}
/* province region map (inline SVG + HTML markers, v3 A) */
.mapw{position:relative}
.omap{display:block;width:100%;height:100%}
.omap .land{fill:none;stroke:var(--ink);stroke-width:1.4px;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.omap .rule{fill:none;stroke:var(--ink);stroke-width:.8px;vector-effect:non-scaling-stroke;opacity:.85}
.omap .ld{stroke:var(--ink);stroke-width:.8px;vector-effect:non-scaling-stroke}
.omap .dots circle{fill:var(--ink)}
.omap .ra{fill:transparent;transition:fill .12s}
.omap .wl{font-family:var(--sans);font-weight:500;fill:var(--mute);letter-spacing:.2em;text-anchor:middle}
.omap a.rs{cursor:pointer}.omap .dots,.omap .ld,.omap .rule,.omap .land{pointer-events:none}
/* markers (UX round 4): one 28px ring, 1.4px ink, #FF6F61 numeral, --bg inside so leaders end under it; 46px invisible target */
.mk{position:absolute;width:46px;height:46px;margin:-23px 0 0 -23px;display:grid;place-items:center;border-radius:50%;text-decoration:none;cursor:pointer}
.mk .mc{width:28px;height:28px;box-sizing:border-box;border:1.4px solid var(--ink);border-radius:50%;background:var(--bg);color:var(--red-tx);font:600 14px/1 var(--sans);display:grid;place-items:center;font-variant-numeric:tabular-nums;transition:background .12s}
.mapw:has([data-r="0"]:is(:hover,:active)) [data-r="0"] .ra{fill:#2A1B18}.mapw:has([data-r="0"]:is(:hover,:active)) .mk[data-r="0"] .mc{background:var(--ink);color:var(--red)}
.mapw:has([data-r="1"]:is(:hover,:active)) [data-r="1"] .ra{fill:#2A1B18}.mapw:has([data-r="1"]:is(:hover,:active)) .mk[data-r="1"] .mc{background:var(--ink);color:var(--red)}
.mapw:has([data-r="2"]:is(:hover,:active)) [data-r="2"] .ra{fill:#2A1B18}.mapw:has([data-r="2"]:is(:hover,:active)) .mk[data-r="2"] .mc{background:var(--ink);color:var(--red)}
.mapw:has([data-r="3"]:is(:hover,:active)) [data-r="3"] .ra{fill:#2A1B18}.mapw:has([data-r="3"]:is(:hover,:active)) .mk[data-r="3"] .mc{background:var(--ink);color:var(--red)}
.mapw:has([data-r="4"]:is(:hover,:active)) [data-r="4"] .ra{fill:#2A1B18}.mapw:has([data-r="4"]:is(:hover,:active)) .mk[data-r="4"] .mc{background:var(--ink);color:var(--red)}
.mapw:has([data-r="5"]:is(:hover,:active)) [data-r="5"] .ra{fill:#2A1B18}.mapw:has([data-r="5"]:is(:hover,:active)) .mk[data-r="5"] .mc{background:var(--ink);color:var(--red)}

.ph .pmap{margin:0;align-self:center}.ph .pmap .mapw{width:min(100%,calc(min(560px,72vh) * var(--ar)));margin-left:auto}
.mband{display:none}
@media (max-width:900px){.mband{display:block;margin:0;padding:12px 0;height:160px;border-bottom:1px solid var(--line);pointer-events:none;overflow:hidden}
.mband .mapw{height:136px;width:calc(136px * var(--ar));max-width:100%;margin:0 auto}
/* band markers are the only tappable thing in the band: 46px target, global focus ring (round) */
.mband .mk{pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent}}
@media (max-width:900px){.fwrap{position:static}}
.directory-browse{padding-block:16px;border-bottom:1px solid var(--line)}
.directory-browse summary,.interview-questions summary{cursor:pointer;min-height:44px;padding-block:10px;font-weight:600;text-decoration:underline;text-underline-offset:4px}
.directory-browse .dchips{margin-top:20px}
.directory-note{font-size:14px;color:var(--mute);margin-top:16px}
.directory-feedback{max-width:none;padding:20px 0;border-top:1px solid var(--line)}
.directory-feedback a{display:inline-flex;align-items:center;min-height:44px;margin-right:8px;text-underline-offset:4px}
.submission-start{padding:0 0 36px;max-width:60ch}
.submission-start h2{font-size:clamp(26px,3vw,38px);margin-bottom:16px}
.submission-start .btn{margin-top:20px}
.submission-start .meta{font-size:14px;color:var(--mute);margin-top:12px}
.interview-questions{border-top:1px solid var(--line);padding-top:12px}
.interview-questions>.qs{margin-top:24px}
