@charset "UTF-8";
/* I LOVE NEPAL - original theme
   palette: night-sky navy / himalaya snow / marigold / crimson / prayer-flag five */
:root{
  --navy:#16233A; --navy2:#1E3A5C; --snow:#F3F6F9; --paper:#FBF9F4;
  --marigold:#E8A33D; --crimson:#B3253C; --gold:#C9A227; --ink:#22303F;
  --f-blue:#2E7FA8; --f-white:#F3F6F9; --f-red:#B3253C; --f-green:#2F6B4F; --f-yellow:#E8A33D;
  --cat-u:#E8A33D; --cat-t:#B3253C; --cat-b:#7A4EA3; --cat-n:#2F6B4F; --cat-l:#2E7FA8;
  --cat-k:#C05A2E; --cat-v:#5B8C3E; --cat-w:#8A6D3B; --cat-c:#A3437A; --cat-g:#4E8F86; --cat-a:#D0433B;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Noto Sans JP','Noto Sans SC','Noto Sans KR','Noto Sans Devanagari','Noto Sans Bengali','Noto Sans Thai','Noto Sans',sans-serif;color:var(--ink);background:var(--paper);line-height:1.75}
img{max-width:100%}
a{color:var(--crimson)}
.disp{font-family:'Yatra One','Noto Sans JP',cursive;font-weight:400;letter-spacing:.02em}

/* prayer flag strip */
.flags{display:flex;height:8px}
.flags span{flex:1}
.flags span:nth-child(5n+1){background:var(--f-blue)}
.flags span:nth-child(5n+2){background:var(--f-white)}
.flags span:nth-child(5n+3){background:var(--f-red)}
.flags span:nth-child(5n+4){background:var(--f-green)}
.flags span:nth-child(5n+5){background:var(--f-yellow)}

header.site{background:var(--navy);color:var(--snow);position:sticky;top:0;z-index:50;box-shadow:0 2px 12px rgba(0,0,0,.25)}
.bar{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:1rem;padding:.55rem 1rem}
.logo{display:flex;align-items:baseline;gap:.5rem;text-decoration:none;color:var(--snow)}
.logo .disp{font-size:1.5rem;color:var(--marigold)}
.logo small{opacity:.75;font-size:.72rem}
nav.tabs{margin-left:auto;display:flex;flex-wrap:wrap;gap:.15rem}
nav.tabs button{background:none;border:0;color:var(--snow);opacity:.78;padding:.45rem .6rem;font-size:.82rem;cursor:pointer;border-bottom:2px solid transparent;font-family:inherit}
nav.tabs button:hover{opacity:1}
nav.tabs button.on{opacity:1;border-color:var(--marigold);color:var(--marigold)}
.langbox select{background:var(--navy2);color:var(--snow);border:1px solid rgba(255,255,255,.25);border-radius:6px;padding:.35rem .5rem;font-size:.85rem}

/* hero map */
.hero{background:linear-gradient(180deg,var(--navy) 0%,var(--navy2) 78%,var(--paper) 78.2%);padding:1.6rem 1rem 0;text-align:center}
.hero h1{color:var(--snow);font-size:clamp(1.4rem,3.4vw,2.3rem)}
.hero h1 em{color:var(--marigold);font-style:normal}
.hero p.tag{color:rgba(243,246,249,.8);margin:.3rem 0 1rem;font-size:.95rem}
.mapwrap{max-width:1120px;margin:0 auto;position:relative;z-index:5}
.mapwrap svg{width:100%;height:auto;display:block;filter:drop-shadow(0 10px 30px rgba(0,0,0,.35))}
.dot{cursor:pointer;transition:transform .18s cubic-bezier(.34,1.56,.64,1);transform-box:fill-box;transform-origin:center}
.dot:hover,.dot:focus{transform:scale(2.1)}
.dot:focus{outline:none;stroke:var(--marigold);stroke-width:1.5}
#tip{position:absolute;pointer-events:none;background:var(--navy);color:var(--snow);border:1px solid var(--gold);border-radius:8px;padding:.45rem .7rem;font-size:.85rem;opacity:0;transition:opacity .15s,transform .18s;transform:translate(-50%,-8px);white-space:nowrap;z-index:5;box-shadow:0 6px 18px rgba(0,0,0,.4)}
#tip.show{opacity:1;transform:translate(-50%,-16px)}
#tip .tc{font-size:.7rem;opacity:.85}
#tip .tico{margin-right:.3rem}
.legend{display:flex;flex-wrap:wrap;gap:.4rem .9rem;justify-content:center;padding:.8rem 0 .4rem;font-size:.76rem;color:#5a6b7d}
.legend i{display:inline-block;width:.7em;height:.7em;border-radius:50%;margin-right:.32em}

/* filter + grid */
.panel{max-width:1180px;margin:0 auto;padding:1rem}
.fbar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:.4rem 0 1rem}
.fbar input,.fbar select{padding:.5rem .7rem;border:1px solid #cfd8e0;border-radius:8px;font-size:.9rem;background:#fff;font-family:inherit}
.fbar input{flex:1;min-width:180px}
.count{font-size:.85rem;color:#5a6b7d;margin-left:auto}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.9rem}
.card{background:#fff;border:1px solid #e4e9ee;border-radius:12px;padding:.9rem 1rem;cursor:pointer;transition:transform .15s,box-shadow .15s;position:relative;overflow:hidden}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(22,35,58,.12)}
.card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--cc,var(--gold))}
.card h3{font-size:1rem;margin-bottom:.15rem}
.card .sub{font-size:.74rem;color:#7b8a99;display:flex;gap:.6rem;flex-wrap:wrap}
.card p{font-size:.83rem;margin-top:.4rem;color:#45525f}
.badge{display:inline-block;font-size:.68rem;padding:.1rem .5rem;border-radius:99px;color:#fff;background:var(--cc,var(--gold))}

/* modal */
#modal{position:fixed;inset:0;background:rgba(12,18,30,.62);display:none;align-items:center;justify-content:center;z-index:100;padding:1rem}
#modal.show{display:flex}
.mbox{background:#fff;border-radius:16px;max-width:520px;width:100%;padding:1.4rem 1.5rem;position:relative;border-top:6px solid var(--cc,var(--gold));max-height:88vh;overflow:auto}
.mbox h2{font-size:1.3rem;margin:.2rem 0 .1rem}
.mbox .en{color:#7b8a99;font-size:.85rem}
.mbox dl{display:grid;grid-template-columns:auto 1fr;gap:.2rem .8rem;font-size:.85rem;margin:.8rem 0}
.mbox dt{color:#7b8a99}
.mbox p{font-size:.92rem}
.mclose{position:absolute;top:.7rem;right:.9rem;background:none;border:0;font-size:1.4rem;cursor:pointer;color:#7b8a99}

/* content sections */
section.tabsec{display:none;max-width:980px;margin:0 auto;padding:2.2rem 1rem 3rem}
section.tabsec.on{display:block}
section.tabsec h2{font-size:1.6rem;color:var(--navy);border-bottom:3px solid var(--marigold);display:inline-block;padding-bottom:.2rem;margin-bottom:1rem}
.art{background:#fff;border:1px solid #e4e9ee;border-radius:12px;padding:1.3rem 1.5rem;margin:1rem 0}
.art h3{color:var(--crimson);margin-bottom:.4rem;font-size:1.1rem}
.art p{margin:.5rem 0}
.note{background:#FFF6E5;border:1px dashed var(--marigold);border-radius:10px;padding:.7rem 1rem;font-size:.82rem;color:#8a6d3b;margin:1rem 0}

footer{background:var(--navy);color:rgba(243,246,249,.75);text-align:center;padding:1.6rem 1rem;font-size:.85rem;margin-top:2rem}
footer .disp{color:var(--marigold)}

@media(max-width:760px){
  .bar{flex-wrap:wrap}
  nav.tabs{order:3;width:100%;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
  nav.tabs button{white-space:nowrap}
  .langbox{margin-left:auto}
}
@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
}

/* article & booking */
.martc{font-size:.9rem;margin-top:.6rem;border-top:1px solid #e4e9ee;padding-top:.6rem}
.martc p{margin:.5rem 0}
.art-badge{font-size:.8rem}
.bookbtn{display:inline-block;margin-top:.9rem;background:var(--crimson);color:#fff;text-decoration:none;padding:.55rem 1.1rem;border-radius:99px;font-size:.9rem;font-weight:700}
.bookbtn:hover{background:#96182f}
:root{--cat-d:#D07030;--cat-x:#1F8A8A}
.mbox{max-width:640px}

/* trek route mode */
.rline{stroke-dasharray:7 5;animation:dash 30s linear infinite}
.rline.sel{stroke-dasharray:none;filter:drop-shadow(0 0 4px rgba(255,255,255,.5))}
@keyframes dash{to{stroke-dashoffset:-600}}
.rt.dim{opacity:.22}
.rt:hover .rline{stroke-width:4}
.rcards{display:flex;flex-wrap:wrap;gap:.5rem;margin:.8rem 0 1.2rem}
.rcard{border:2px solid var(--rc);background:#fff;border-radius:10px;padding:.5rem .8rem;cursor:pointer;text-align:left;font-family:inherit;transition:transform .12s}
.rcard b{display:block;color:var(--navy);font-size:.9rem}
.rcard span{font-size:.72rem;color:#7b8a99}
.rcard.on{background:var(--rc);}
.rcard.on b,.rcard.on span{color:#fff}
.rcard:hover{transform:translateY(-2px)}
.rhead{border-left:6px solid var(--rc);padding-left:.9rem;margin:1rem 0 .6rem}
.rhead h3{font-size:1.3rem;color:var(--navy)}
.rmeta{display:flex;flex-wrap:wrap;gap:.4rem 1rem;font-size:.82rem;color:#5a6b7d;margin-top:.3rem}
#routedetail h4{margin:1.1rem 0 .4rem;color:var(--crimson);font-size:1rem}
.profile{width:100%;height:auto;background:#fff;border:1px solid #e4e9ee;border-radius:10px}
.pel{font-size:11px;fill:#5a6b7d}
.pnm{font-size:10px;fill:#22303F}
.stagetbl{width:100%;border-collapse:collapse;background:#fff;border:1px solid #e4e9ee;border-radius:10px;overflow:hidden;font-size:.86rem}
.stagetbl th{background:var(--navy);color:#fff;padding:.45rem .6rem;text-align:left;font-weight:400}
.stagetbl td{padding:.45rem .6rem;border-top:1px solid #eef2f5}
.stagetbl tr:nth-child(even) td{background:#f8fafb}
.raccess{background:#fff;border:1px solid #e4e9ee;border-radius:10px;padding:.9rem 1.1rem;font-size:.9rem}
body.trekmode .hero{background:linear-gradient(180deg,#0F1B2E 0%,#1E3A5C 78%,var(--paper) 78.2%)}
@media(prefers-reduced-motion:reduce){.rline{animation:none}}

/* ===== multi-page ===== */
/* nav uses <a> tags */
nav.tabs a{background:none;border:0;color:var(--snow);opacity:.78;padding:.45rem .6rem;font-size:.82rem;cursor:pointer;border-bottom:2px solid transparent;font-family:inherit;text-decoration:none;white-space:nowrap;display:inline-block}
nav.tabs a:hover{opacity:1}
nav.tabs a.on{opacity:1;border-color:var(--marigold);color:var(--marigold)}
/* article pages always visible */
main.tabsec{display:block}
main.tabsec.on{display:block}
/* trek hero darker */
.trekpage .hero{background:linear-gradient(180deg,#0F1B2E 0%,#1E3A5C 78%,var(--paper) 78.2%)}

/* ===== hero background artwork (optional, added when images exist) ===== */
.hero{position:relative;overflow:hidden}
.hero>*{position:relative;z-index:2}
.hero::before{content:"";position:absolute;inset:0;z-index:0;
  background-image:url("/assets/img/hero-bg.jpg");
  background-size:cover;background-position:center top;
  opacity:0;transition:opacity .6s}
/* image present -> fade in; if 404 the file just wont paint (opacity stays via .has) */
.hero.has-bg::before{opacity:.85}
/* dark scrim so the map dots stay legible over artwork */
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 80% at 50% 62%, rgba(15,22,38,.35) 0%, rgba(15,22,38,.18) 55%, rgba(15,22,38,.06) 100%)}
.hero.has-bg .mapwrap svg{filter:drop-shadow(0 10px 34px rgba(0,0,0,.55))}
@media(max-width:760px){.hero::before{background-position:center top;opacity:0}.hero.has-bg::before{opacity:.7}}

/* hero side panels (wide screens only) */
.hero .side{display:none!important;/* flat-bg has built-in side motifs; remove this line to re-enable painterly panels */position:absolute;top:0;bottom:0;width:200px;z-index:1;pointer-events:none;background-size:cover;background-position:center;opacity:.9}
.hero .side.l{left:0;background-image:url("/assets/img/hero-side-L.jpg");-webkit-mask-image:linear-gradient(90deg,#000 55%,transparent);mask-image:linear-gradient(90deg,#000 55%,transparent)}
.hero .side.r{right:0;background-image:url("/assets/img/hero-side-R.jpg");-webkit-mask-image:linear-gradient(270deg,#000 55%,transparent);mask-image:linear-gradient(270deg,#000 55%,transparent)}
@media(max-width:1100px){.hero .side{display:none}}

/* ===== spot detail page ===== */
.spot-page{max-width:820px;margin:0 auto;padding:1.2rem 1rem 3rem}
.crumb{font-size:.82rem;color:#7b8a99;margin-bottom:1rem}
.crumb a{color:var(--crimson);text-decoration:none}
.crumb span{color:#45525f}
.spot-head{display:flex;align-items:center;gap:.8rem;border-left:6px solid var(--cc,var(--gold));padding-left:1rem;margin-bottom:1rem}
.spot-ico{font-size:2.2rem}
.spot-head h1{font-size:1.7rem;color:var(--navy);line-height:1.2}
.spot-en{color:#7b8a99;font-size:.9rem}
.spot-meta{display:flex;gap:1.5rem;flex-wrap:wrap;background:#fff;border:1px solid #e4e9ee;border-radius:12px;padding:.9rem 1.2rem;margin:1rem 0}
.spot-meta div{display:flex;flex-direction:column;gap:.15rem}
.spot-meta dt{font-size:.72rem;color:#7b8a99}
.spot-meta dd{font-size:.95rem;font-weight:700;color:var(--navy)}
.spot-meta .badge{color:#fff;padding:.15rem .6rem;border-radius:99px;font-size:.8rem;font-weight:400}
.spot-lead{font-size:1.05rem;line-height:1.9;margin:1rem 0}
.spot-article{font-size:1rem;line-height:1.95}
.spot-article p{margin:.9rem 0}
.spot-article h3{color:var(--crimson);margin:1.4rem 0 .5rem;font-size:1.15rem}
.aff-slot{margin:1.2rem 0}
.spot-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin:1.8rem 0 1rem}
.mapbtn,.backbtn{display:inline-block;padding:.6rem 1.2rem;border-radius:99px;text-decoration:none;font-size:.9rem;font-weight:700}
.mapbtn{background:var(--navy);color:#fff}
.backbtn{background:#eef2f5;color:var(--navy)}
.nearby{margin-top:2.5rem;border-top:1px solid #e4e9ee;padding-top:1.5rem}
.nearby h2{font-size:1.2rem;color:var(--navy);margin-bottom:1rem}
.nearby-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.7rem}
.nearby-card{background:#fff;border:1px solid #e4e9ee;border-radius:10px;padding:.7rem .9rem;text-decoration:none;transition:transform .12s,box-shadow .12s;display:flex;flex-direction:column;gap:.2rem}
.nearby-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(22,35,58,.1)}
.nearby-card .ni{font-size:1.3rem}
.nearby-card b{color:var(--navy);font-size:.92rem;line-height:1.3}
.nearby-card small{color:#7b8a99;font-size:.72rem}

/* ===== long-form articles ===== */
.article-page{max-width:780px;margin:0 auto;padding:1.2rem 1rem 3rem}
.longform h1{font-size:1.75rem;color:var(--navy);line-height:1.35;margin:.6rem 0 1rem}
.longform .lead{font-size:1.05rem;line-height:1.95;color:#45525f;border-left:4px solid var(--marigold);padding-left:1rem;margin:1rem 0 1.5rem}
.longform h2{font-size:1.25rem;color:var(--crimson);margin:2rem 0 .7rem;border-bottom:2px solid #f0e4d0;padding-bottom:.3rem}
.longform p{font-size:1rem;line-height:2;margin:.9rem 0}
.afig{margin:1.4rem 0}
.afig img{width:100%;border-radius:12px;display:block}
.afig figcaption{font-size:.78rem;color:#7b8a99;margin-top:.4rem;text-align:center}
.aff-inline{margin:1.2rem 0}
.aff-inline .bookbtn{width:100%;text-align:center}
.related{margin-top:3rem;border-top:2px solid #e4e9ee;padding-top:1.5rem}
.related h2{font-size:1.2rem;color:var(--navy);margin-bottom:1rem}
.rel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.8rem}
.rel-card{background:#fff;border:1px solid #e4e9ee;border-radius:10px;padding:.8rem 1rem;text-decoration:none;transition:transform .12s,box-shadow .12s;display:flex;flex-direction:column;gap:.25rem}
.rel-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(22,35,58,.1)}
.rel-card b{color:var(--navy);font-size:.95rem}
.rel-card small{color:#7b8a99;font-size:.78rem}

/* ===== region groups on map ===== */
.rg{cursor:pointer}
.rg-c{fill:rgba(201,162,39,.14);stroke:var(--gold);stroke-width:1;transition:fill .15s}
.rg:hover .rg-c{fill:rgba(201,162,39,.35)}
.rg-t{font-size:9px;fill:#F3F6F9;paint-order:stroke;stroke:rgba(15,22,38,.85);stroke-width:2.5px;font-weight:700}
.rg-n{font-size:8px;fill:#F3F6F9;opacity:.9}
#rpanel{position:absolute;background:#fff;border:1px solid var(--gold);border-radius:12px;padding:.7rem .9rem;width:250px;z-index:6;box-shadow:0 12px 30px rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .15s;text-align:left}
#rpanel.show{opacity:1;pointer-events:auto}
#rpanel b{color:var(--navy);font-size:.95rem}
.rp-list{display:flex;flex-direction:column;gap:.15rem;margin:.45rem 0}
.rp-list a{color:var(--ink);text-decoration:none;font-size:.82rem;padding:.15rem .3rem;border-radius:6px}
.rp-list a:hover{background:#f4f7f9;color:var(--crimson)}
.rp-filter{background:var(--navy);color:#fff;border:0;border-radius:8px;padding:.4rem .6rem;font-size:.78rem;cursor:pointer;width:100%;font-family:inherit}
.regchip{background:var(--marigold);color:#fff;border:0;border-radius:99px;padding:.15rem .6rem;font-size:.78rem;cursor:pointer;font-family:inherit}
@media(max-width:760px){.rg-t{font-size:11px}}

/* ===== right sidebar layout (article & spot pages) ===== */
@media(min-width:1020px){
  main.with-side{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:2.2rem;max-width:1120px}
  main.with-side>.maincol{grid-column:1;min-width:0}
  main.with-side>.sideb{grid-column:2;grid-row:1}
}
.sideb{align-self:start;position:sticky;top:110px}
.sideb h2{font-size:1rem;color:var(--navy);margin-bottom:.6rem;border-bottom:2px solid var(--marigold);display:inline-block;padding-bottom:.15rem}
.sideb .rel-card,.sideb .nearby-card{margin-bottom:.5rem;display:flex}
.sideb .nearby-grid{display:flex;flex-direction:column;gap:.5rem}

/* ===== mobile polish ===== */
@media(max-width:760px){
  #rpanel{width:225px}
  .hero{padding-top:1rem}
  .hero h1{font-size:1.35rem}
  .spot-head h1{font-size:1.35rem}
  .longform h1{font-size:1.35rem}
  .legend{font-size:.7rem;gap:.3rem .6rem}
  .stagetbl{font-size:.78rem}
  .stagetbl th,.stagetbl td{padding:.35rem .4rem}
  .spot-meta{gap:.8rem;padding:.7rem .9rem}
  .article-page,.spot-page{padding:0.8rem .8rem 2.2rem}
}
/* region panel must paint above legend (overrides .hero>* z-index) */
.hero .mapwrap{z-index:6}

/* ===== supplied spot articles (273) ===== */
.spot-article__dek{font-size:1.02rem;line-height:1.95;color:#45525f;border-left:4px solid var(--marigold);padding-left:1rem;margin:1rem 0 1.4rem}
.spot-article__section{margin:1.2rem 0}
.spot-article__section h2{font-size:1.18rem;color:var(--crimson);margin:1.6rem 0 .6rem;border-bottom:2px solid #f0e4d0;padding-bottom:.3rem}
.spot-article__section p{font-size:.98rem;line-height:2;margin:.8rem 0}
.spot-article__sources{margin:1.8rem 0 0;background:#f7f9fb;border:1px solid #e4e9ee;border-radius:10px;padding:.9rem 1.1rem}
.spot-article__sources h2,.spot-article__sources b{font-size:.9rem;color:var(--navy)}
.spot-article__sources ul{margin:.4rem 0 0 1.1rem}
.spot-article__sources li{font-size:.85rem;line-height:1.8;overflow-wrap:anywhere;word-break:break-word}
.spot-article__sources a{color:var(--crimson)}
.spot-article__sources a::after{content:" ↗";font-size:.75em}
.spot-article__verified{font-size:.78rem;color:#7b8a99;margin-top:.6rem}

/* ===== map miniatures & zoom ===== */
.mini{cursor:pointer}
.mini image{transition:transform .12s}
.mini:hover image,.mini:focus image{transform:translateY(-3px);filter:drop-shadow(0 0 6px rgba(201,162,39,.85))}
.mini:focus{outline:none}
.mini:focus rect{stroke:var(--gold);stroke-width:1.5;stroke-dasharray:3 2}
.zbtn{cursor:pointer}
.zbtn rect{fill:rgba(22,35,58,.85);stroke:var(--gold);stroke-width:1}
.zbtn text{fill:#F3F6F9;font-size:17px;text-anchor:middle;font-weight:700;user-select:none}
.zbtn:hover rect{fill:rgba(46,74,110,.95)}
#map{touch-action:pan-y pinch-zoom}

/* ===== news list ===== */
.news-item{display:flex;gap:1rem;background:#fff;border:1px solid #e4e9ee;border-radius:12px;padding:1rem 1.2rem;margin:.8rem 0}
.news-thumb{width:120px;height:84px;object-fit:cover;border-radius:8px;flex:none}
.news-body{min-width:0}
.news-meta{font-size:.74rem;color:#7b8a99;display:flex;gap:.8rem;margin-bottom:.2rem}
.news-src{color:var(--crimson);font-weight:700}
.news-title{display:block;font-weight:700;color:var(--navy);text-decoration:none;font-size:1.02rem;line-height:1.5}
.news-title:hover{color:var(--crimson)}
.news-sum{font-size:.9rem;line-height:1.85;margin:.4rem 0;color:#45525f}
.news-more{font-size:.8rem;color:var(--crimson)}
@media(max-width:760px){.news-item{flex-direction:column}.news-thumb{width:100%;height:150px}}

/* ===== glossary tooltips ===== */
.gloss{border-bottom:1px dotted var(--crimson);cursor:help;color:inherit}
.gloss:hover,.gloss:focus{background:rgba(232,163,61,.16);outline:none;border-radius:3px}
#glosspop{position:absolute;z-index:120;background:#16233A;color:#F3F6F9;border:1px solid var(--gold);
  border-radius:10px;padding:.6rem .8rem;font-size:.83rem;line-height:1.7;opacity:0;pointer-events:none;
  transition:opacity .14s;box-shadow:0 10px 28px rgba(0,0,0,.35)}
#glosspop.show{opacity:1;pointer-events:auto}
#glosspop b{display:block;color:var(--marigold);font-size:.9rem;margin-bottom:.15rem}
#glosspop::after{content:"";position:absolute;left:50%;margin-left:-6px;border:6px solid transparent;
  border-top-color:var(--gold);bottom:-12px}
#glosspop.below::after{bottom:auto;top:-12px;border-top-color:transparent;border-bottom-color:var(--gold)}
@media(max-width:760px){.gloss{border-bottom-width:1.5px}}

/* ===== spot hero visual (WebP editorial graphic) ===== */
.spot-visual{margin:1.1rem 0 1.4rem}
.spot-visual__image{width:100%;height:auto;aspect-ratio:16/9;display:block;border-radius:12px;border:1px solid #e4e9ee}
.spot-visual__caption{font-size:.76rem;color:#7b8a99;margin-top:.4rem;text-align:right}

/* ===== image guard (右クリック/長押し保存の抑止) ===== */
.spot-visual__image, .afig img, .news-thumb, .mini image, .spot-article img{
  -webkit-touch-callout:none;   /* iOS長押しの保存メニュー */
  -webkit-user-drag:none;
  user-select:none;
}