/* fermadraugiem.lv — «Atrodi savu vietu», the Latvia map that js/map.js builds in any [data-fd-map] (lane W5).
   Used on the home page and on /karte/ (W6, data-fd-map="full"). Tokens from site.css; no inline styles (CSSOM only). */
.fdm{--k:#f3bb82;--z:#f4d873;--v:#a5d47f;--l:#c7aee3;--s:#eaa99c;--sea:#bfe0f2;--abroad:#efeadb;
  container-type:inline-size;position:relative;max-width:1120px;margin:22px auto 0;color:var(--fd-ink,#3d2a12);font-family:var(--fd-font)}

/* ---- search */
.fdm-search{position:relative;z-index:6;max-width:760px;margin:0 auto}
.fdm-field{display:flex;align-items:center;gap:8px;padding:6px 6px 6px 14px;border-radius:999px;background:#fffdf6;border:3px solid var(--fd-woodline,#5a3412);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.9),0 4px 0 rgba(90,52,18,.35),0 12px 26px rgba(60,30,0,.14)}
.fdm-field:focus-within{box-shadow:inset 0 2px 0 #fff,0 4px 0 rgba(90,52,18,.35),0 0 0 4px var(--fd-gold,#ffd23b)}
.fdm-field__ico{flex:none;width:24px;height:24px;color:var(--fd-wood-dark,#8a5a2b)}
.fdm-input{flex:1;min-width:0;height:46px;padding:0 4px;border:0;background:transparent;font:inherit;font-size:18px;font-weight:700;color:var(--fd-ink,#3d2a12);outline:none}
.fdm-input::placeholder{color:#7d5f40;font-weight:600;opacity:1}
.fdm-input::-webkit-search-cancel-button{cursor:pointer}
.fdm-go{flex:none;min-height:46px;padding:0 20px;border-radius:999px;cursor:pointer;font:inherit;font-size:16px;font-weight:900;color:#fff;
  background:linear-gradient(#4f9e2a,#2f7a18);border:2px solid #245510;box-shadow:inset 0 2px 0 rgba(255,255,255,.35),0 3px 0 #245510;text-shadow:0 1px 0 rgba(0,0,0,.25)}
.fdm-go:active{transform:translateY(2px);box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 1px 0 #245510}
.fdm-list{position:absolute;left:10px;right:10px;top:calc(100% - 26px);max-height:min(56vh,430px);overflow:auto;margin:0;padding:6px;list-style:none;
  border-radius:18px;background:#fffdf6;border:3px solid var(--fd-woodline,#5a3412);box-shadow:0 18px 40px rgba(60,30,0,.28)}
.fdm-list li{display:flex;align-items:center;gap:12px;min-height:50px;padding:6px 10px;border-radius:12px;cursor:pointer}
.fdm-list li:hover{background:#fbefd5}
.fdm-list li[aria-selected="true"]{background:#ffe7a8;box-shadow:inset 0 0 0 2px #d99a2b}
.fdm-o__t{display:flex;flex-direction:column;min-width:0}
.fdm-o__t b{font-size:16.5px;line-height:1.25}
.fdm-o__t small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13.5px;color:var(--fd-ink-soft,#6b4a2b)}
.fdm-hint{min-height:1.4em;margin:8px 0 0;text-align:center;font-size:14.5px;font-weight:700;color:var(--fd-ink-soft,#6b4a2b)}
.fdm-hint:empty{margin:0;min-height:0}

/* kind icons: a coloured coin per kind of place */
.fdm-i{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.fdm-k{flex:none;box-sizing:content-box;width:20px;height:20px;padding:6px;border-radius:50%;color:#fff;background:#8a5a2b;box-shadow:inset 0 -2px 0 rgba(0,0,0,.18)}
.fdm-k--L,.fdm-k--R{background:#2f86c9}
.fdm-k--F{background:#2e7d1e}
.fdm-k--K{background:#7d6a3a}
.fdm-k--B{background:#5f7a3a}
.fdm-k--I{background:#2a8f86}
.fdm-k--T,.fdm-k--N{background:#9b3b2f}
.fdm-k--P{background:#b3261e}
.fdm-k--C,.fdm-k--D{background:#c46a12}
.fdm-k--H,.fdm-k--Z{background:#8a5a2b}
.fdm-k--X{background:#c0392b}

/* ideas */
.fdm-ideas{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 8px;margin:12px auto 0;max-width:820px;font-size:14px}
.fdm-ideas>span{font-weight:800;color:var(--fd-ink-soft,#6b4a2b)}
.fdm-ideas button{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:.2em .85em;border-radius:999px;cursor:pointer;font:inherit;font-weight:800;
  color:var(--fd-ink,#3d2a12);background:#fffaf0;border:2px solid rgba(138,90,43,.5);box-shadow:0 2px 0 rgba(138,90,43,.35)}
.fdm-ideas button:hover{background:#fff;border-color:#8a5a2b}
.fdm-ideas .fdm-dice{color:#3d2a12;background:linear-gradient(#ffd36a,#f5a43a);border-color:#9c4a00;box-shadow:0 2px 0 #8a4100}
.fdm-dice .fdm-i{width:18px;height:18px}

/* ---- stage */
.fdm-body{display:grid;gap:14px;margin-top:16px}
.fdm-stage{position:relative;overflow:hidden;aspect-ratio:4/3.3;border-radius:24px;background:
  radial-gradient(circle at 80% 20%,rgba(255,255,255,.5),transparent 45%),var(--abroad);
  border:4px solid var(--fd-woodline,#5a3412);box-shadow:inset 0 0 0 3px rgba(255,255,255,.55),0 6px 0 rgba(90,52,18,.35),0 18px 34px rgba(60,30,0,.16);
  user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.fdm-svg{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab}
.fdm-svg:active{cursor:grabbing}
.fdm-svg path{vector-effect:non-scaling-stroke}
.fdm-shadow,.fdm-sel,.fdm-bd,.fdm-water,.fdm-ol,.fdm-plab,.fdm-llab{pointer-events:none}
.fdm-sea{fill:var(--sea);stroke:#9ccbe6;stroke-width:1.5}
.fdm-shadow__p{fill:rgba(60,35,10,.2);transform:translate(4px,6px)}
.fdm-under{fill:#b3d8ee}   /* under the pagasti: the slivers between them are mostly the Daugava's bed */
.fdm-p{stroke:rgba(255,255,255,.55);stroke-width:.6;cursor:pointer;transition:filter .15s ease}
.fdm-p--K{fill:var(--k)}.fdm-p--Z{fill:var(--z)}.fdm-p--V{fill:var(--v)}.fdm-p--L{fill:var(--l)}.fdm-p--S{fill:var(--s)}
.fdm-p:hover{filter:brightness(1.08) saturate(1.15)}
.is-near .fdm-p{stroke:rgba(90,52,18,.35);stroke-width:1}
.fdm-sel__p{fill:rgba(255,255,255,.28);stroke:#ffcf33;stroke-width:4;stroke-linejoin:round}
.fdm-bd__w{fill:none;stroke:#fff;stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.fdm-bd__d{fill:none;stroke:#5a3412;stroke-width:1.6;stroke-dasharray:5 4;stroke-linecap:round}
.fdm-river{fill:none;stroke:#3f8fd2;stroke-linecap:round;stroke-linejoin:round}
.fdm-river--xl{stroke-width:3.2}.fdm-river--l{stroke-width:2.2}.fdm-river--m{stroke-width:1.5}
.fdm-lake{fill:#5aa9e6;stroke:#2f7fbf;stroke-width:1}
.fdm-ol__p{fill:none;stroke:#5a3412;stroke-width:2.6;stroke-linejoin:round}
.fdm-plab text{fill:#3d2a12;font-family:var(--fd-font);font-weight:800;text-anchor:middle;dominant-baseline:central;paint-order:stroke;stroke:#fff8e6;stroke-width:.25em;stroke-linejoin:round}
.fdm-plab{opacity:0;transition:opacity .25s ease}
.is-near .fdm-plab{opacity:1}
.fdm-ll{font-family:var(--fd-font);font-weight:900;letter-spacing:.06em;text-transform:uppercase;text-anchor:middle;dominant-baseline:central;
  paint-order:stroke;stroke:rgba(255,255,255,.92);stroke-width:.2em;stroke-linejoin:round}
.fdm-ll--sea{font-size:.72em;font-style:italic;font-weight:800;text-transform:none;letter-spacing:.04em;fill:#245a85;stroke:rgba(215,236,248,.9)}
.fdm-ll--nb{font-size:.62em;font-weight:800;letter-spacing:.14em;fill:#6f6146;stroke:rgba(239,234,219,.9)}
.fdm-ll--K{fill:#8a4a14}.fdm-ll--Z{fill:#6e5a08}.fdm-ll--V{fill:#2f6414}.fdm-ll--L{fill:#5a3487}.fdm-ll--S{fill:#843a2c}
.fdm-llab{transition:opacity .25s ease}
.is-near .fdm-llab{opacity:0}
.fdm-loading{position:absolute;inset:0;display:grid;place-items:center;margin:0;font-weight:800;color:var(--fd-ink-soft,#6b4a2b)}
.is-ready .fdm-loading{display:none}

/* overlay: the pin and the nature around it */
.fdm-over{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.fdm-pin{position:absolute;width:0;height:0}
.fdm-pin img{position:absolute;left:-38px;bottom:-3px;width:76px;max-width:none;height:auto;filter:drop-shadow(0 6px 4px rgba(60,30,0,.35))}
.fdm-pin__ring{position:absolute;left:-26px;top:-11px;width:52px;height:22px;border-radius:50%;background:rgba(255,207,51,.55);border:3px solid #ffcf33}
.fdm-pin__sign{position:absolute;left:50%;bottom:104px;transform:translateX(-50%);width:max-content;max-width:230px;padding:.35em .8em;border-radius:12px;text-align:center;
  font-size:14px;font-weight:900;line-height:1.25;color:#3d2a12;background:linear-gradient(#fff8e2,#f8e2b0);border:3px solid #5a3412;box-shadow:0 4px 0 rgba(90,52,18,.4)}
.fdm-pin__sign::after{content:"";position:absolute;left:50%;bottom:-11px;width:14px;height:14px;margin-left:-7px;transform:rotate(45deg);background:#f8e2b0;
  border-right:3px solid #5a3412;border-bottom:3px solid #5a3412}
.fdm-pin__plus{position:absolute;left:30px;bottom:34px;padding:.1em .5em;border-radius:999px;font-size:13px;font-weight:900;color:#5a3412;background:#ffd23b;border:2px solid #5a3412}
.fdm-pin.is-drop img{animation:fdm-drop .7s cubic-bezier(.3,1.5,.5,1) both}
.fdm-pin.is-drop .fdm-pin__sign{animation:fdm-pop .45s .55s cubic-bezier(.3,1.6,.5,1) both}
.fdm-pin.is-drop .fdm-pin__ring{animation:fdm-ring 1.8s .6s ease-out infinite}
.fdm-pin.is-drop .fdm-pin__plus{animation:fdm-plus 1.6s .8s ease-out both}
.fdm-nat{position:absolute;transform:translate(-50%,-50%);border-radius:50%;box-shadow:0 0 0 3px rgba(255,253,246,.95),0 3px 6px rgba(60,30,0,.3);animation:fdm-fade .4s .9s both}
.fdm-nat .fdm-k{display:block;width:16px;height:16px;padding:5px}

/* controls on the map */
.fdm-zoom{position:absolute;right:10px;top:10px;display:flex;flex-direction:column;gap:6px}
.fdm-zoom button,.fdm-card__x{display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:12px;cursor:pointer;color:#5a3412;
  background:#fffdf6;border:2px solid #5a3412;box-shadow:0 3px 0 rgba(90,52,18,.45)}
.fdm-zoom button:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(90,52,18,.45)}
.fdm-legend{position:absolute;left:10px;bottom:10px;display:flex;flex-wrap:wrap;gap:5px;max-width:calc(100% - 76px)}
.fdm-legend button{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:.15em .7em .15em .45em;border-radius:999px;cursor:pointer;font:inherit;font-size:13.5px;font-weight:800;
  color:#3d2a12;background:rgba(255,253,246,.95);border:2px solid rgba(90,52,18,.6)}
.fdm-legend button:hover{border-color:#5a3412;background:#fff}
.fdm-sw{flex:none;display:inline-block;width:14px;height:14px;border-radius:5px;border:2px solid rgba(90,52,18,.7)}
.fdm-sw--K{background:var(--k)}.fdm-sw--Z{background:var(--z)}.fdm-sw--V{background:var(--v)}.fdm-sw--L{background:var(--l)}.fdm-sw--S{background:var(--s)}
.fdm-tip{position:absolute;z-index:3;transform:translate(-50%,calc(-100% - 14px));margin:0;padding:.3em .7em;border-radius:10px;pointer-events:none;white-space:nowrap;
  font-size:13.5px;font-weight:800;color:#fff;background:rgba(43,29,12,.92)}
.fdm-tip[hidden]{display:none}

/* ---- the place card */
.fdm-card{position:relative;padding:18px 18px 16px;border-radius:22px;background:linear-gradient(#fffdf6,#fbeed0);border:3px solid var(--fd-woodline,#5a3412);
  box-shadow:0 5px 0 rgba(90,52,18,.35),0 16px 30px rgba(60,30,0,.14);animation:fdm-pop .35s ease-out both}
.fdm-card[hidden]{display:none}
.fdm-card__x{position:absolute;right:10px;top:10px;width:40px;height:40px}
.fdm-card__lands{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding-right:46px}
.fdm-card__lands small{font-size:12.5px;font-weight:700;color:var(--fd-ink-soft,#6b4a2b)}
.fdm-land{display:inline-flex;align-items:center;gap:6px;padding:.25em .75em .25em .45em;border-radius:999px;font-size:13.5px;font-weight:900;letter-spacing:.03em;
  color:#3d2a12;background:#fff;border:2px solid rgba(90,52,18,.6)}
.fdm-land--K{background:#fde3c6}.fdm-land--Z{background:#fcefb8}.fdm-land--V{background:#dcf0cb}.fdm-land--L{background:#e8dcf6}.fdm-land--S{background:#f8d8d1}
.fdm-card__h{display:flex;align-items:center;gap:10px;margin:12px 0 2px;font-size:22px;line-height:1.2}
.fdm-card__h span{min-width:0;overflow-wrap:anywhere}
.fdm-card__kind{margin:0;font-size:14.5px;color:var(--fd-ink-soft,#6b4a2b)}
.fdm-card__claim{margin:12px 0 0;padding:10px 12px;border-radius:14px;font-size:14.5px;line-height:1.45;background:#fff6d6;border:2px dashed #d39a2a}
.fdm-card__claim b{display:block;font-size:16px;color:#8a3d00}
.fdm-card__sub{margin:14px 0 6px;font-size:13px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#6b4a2b}
.fdm-near{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.fdm-near li{display:flex;align-items:center;gap:10px}
.fdm-near li>span{display:flex;flex-direction:column;min-width:0}
.fdm-near b{font-size:15px;line-height:1.25}
.fdm-near small{font-size:13px;color:var(--fd-ink-soft,#6b4a2b)}
.fdm-near .fdm-k{width:16px;height:16px;padding:6px}
.fdm-near__wait{font-size:14px;color:var(--fd-ink-soft,#6b4a2b)}
.fdm-card__xp{display:flex;align-items:center;gap:6px;margin:12px 0 0;font-size:14px;font-weight:900;color:#8a5a00}
.fdm-card__xp .fdm-i{width:18px;height:18px;color:#e0a800}
.fdm-card__row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.fdm-btn{flex:1 1 130px;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:.3em .9em;border-radius:999px;cursor:pointer;
  font:inherit;font-size:15px;font-weight:900;color:#3d2a12;background:#fffdf6;border:2px solid #5a3412;box-shadow:0 3px 0 rgba(90,52,18,.45)}
.fdm-btn .fdm-i{width:18px;height:18px}
.fdm-btn--alt{color:#3d2a12;background:linear-gradient(#ffd36a,#f5a43a);border-color:#9c4a00;box-shadow:0 3px 0 #8a4100}
.fdm-btn:active{transform:translateY(2px)}

/* ---- the traveller's notebook */
.fdm-book{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 14px;margin:16px auto 0;padding:10px 14px;max-width:820px;border-radius:18px;
  background:rgba(255,253,246,.8);border:2px dashed rgba(138,90,43,.55)}
.fdm-book__t{display:inline-flex;align-items:center;gap:6px;font-size:14.5px}
.fdm-book__t .fdm-i{width:18px;height:18px;color:#e0a800}
.fdm-stamps{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:0;padding:0;list-style:none}
.fdm-stamp{display:inline-flex;align-items:center;gap:5px;padding:.2em .65em .2em .4em;border-radius:999px;font-size:13px;font-weight:800;color:#6b5a48;
  background:#f3ece0;border:2px solid #d9cbb5;filter:grayscale(1);opacity:.85}
.fdm-stamp b{font-size:12px;color:#8a3d00}
.fdm-stamp.is-on{color:#3d2a12;background:#fff;border-color:#5a3412;filter:none;opacity:1}
.fdm-stamp.is-pop{animation:fdm-stamp .55s cubic-bezier(.3,1.6,.5,1)}
.fdm-book__n{font-size:13.5px;font-weight:800;color:var(--fd-ink-soft,#6b4a2b)}
.is-all .fdm-book{border-style:solid;border-color:#d39a2a;background:#fff6d6}

/* focus */
.fdm button:focus-visible{outline:3px solid var(--fd-ink,#3d2a12);outline-offset:2px}
.fdm .fdm-input:focus-visible{outline:none}   /* the whole field shows focus (gold ring) */
.fdm-svg:focus-visible{outline:3px solid var(--fd-ink,#3d2a12);outline-offset:-4px}

/* ---- wide: the card beside the map */
@container (min-width:760px){
  .fdm-stage{aspect-ratio:16/10}
  .has-card .fdm-body{grid-template-columns:minmax(0,1fr) 300px}
  .has-card .fdm-stage{aspect-ratio:auto;min-height:440px}
  .has-card .fdm-card{align-self:start}
  .fdm-pin img{left:-44px;width:88px}
  .fdm-pin__sign{bottom:122px;font-size:15px}
}
.fdm--full .fdm-stage{aspect-ratio:4/3.6}
@container (min-width:760px){
  .fdm--full .fdm-stage{aspect-ratio:16/10.5}
  .fdm--full.has-card .fdm-stage{min-height:min(72vh,640px)}
}
@container (max-width:520px){
  .fdm-legend{display:none}          /* the notebook under the map names the five lands with the same colours */
}
@container (max-width:900px){
  .has-card .fdm-legend{display:none}
}
@container (max-width:440px){
  .fdm-go{padding:0 14px}
  .fdm-input{font-size:17px}
  .fdm-zoom button{width:40px;height:40px}
  .fdm-pin__sign{max-width:170px;font-size:13px}
}
/* phones on their side: keep the map within the screen */
@media (orientation:landscape) and (max-height:500px){
  .fdm-stage,.fdm--full .fdm-stage,.has-card .fdm-stage{aspect-ratio:auto;height:min(80vh,330px);min-height:0}
  .has-card .fdm-card{max-height:min(80vh,330px);overflow:auto;overscroll-behavior:contain}
  .fdm-pin img{left:-30px;width:60px}
  .fdm-pin__sign{bottom:84px;font-size:12.5px;max-width:200px}
  .fdm-pin__plus{left:22px;bottom:26px}
}

@keyframes fdm-drop{0%{transform:translateY(-120px) scale(.8);opacity:0}60%{opacity:1}100%{transform:none}}
@keyframes fdm-pop{0%{transform:translateX(-50%) scale(.6);opacity:0}100%{opacity:1}}
@keyframes fdm-ring{0%{transform:scale(.6);opacity:1}100%{transform:scale(2.1);opacity:0}}
@keyframes fdm-plus{0%{transform:translateY(8px);opacity:0}25%{transform:none;opacity:1}75%{opacity:1}100%{transform:translateY(-26px);opacity:0}}
@keyframes fdm-stamp{0%{transform:scale(1.6) rotate(-8deg)}100%{transform:none}}
.fdm-card,.fdm-nat{animation-name:fdm-fade}
@keyframes fdm-fade{0%{opacity:0;translate:0 6px}100%{opacity:1;translate:0 0}}
@media (prefers-reduced-motion:reduce){
  .fdm *,.fdm{animation:none!important;transition:none!important}
}
