*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#0f172a}body{background:#f6f7fb}#app{width:100%;height:100vh;height:100dvh;display:grid;grid-template-columns:minmax(230px,290px) minmax(0,1fr);overflow:hidden}aside{min-width:0;background:#fff;border-right:1px solid #e5e7eb;padding:14px;overflow:auto}.brand{font-weight:800;font-size:22px;margin-bottom:14px}aside input{width:100%;padding:9px 10px;border:1px solid #cbd5e1;border-radius:8px}nav button{width:100%;text-align:left;border:0;background:transparent;padding:9px 10px;border-radius:8px;cursor:pointer}nav button.active{background:#eef2ff;font-weight:700}main{min-width:0;min-height:0;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;overflow:hidden}header{background:#fff;border-bottom:1px solid #e5e7eb;padding:9px 12px;display:flex;justify-content:space-between;gap:10px;align-items:center;min-width:0}h1{font-size:19px;margin:0 0 5px}.controls{display:flex;gap:7px;align-items:center;justify-content:flex-end;flex-wrap:wrap;min-width:0}button,input{font:inherit}.controls button,#about,.modalBtn{border:1px solid #0ea5e9;color:#0ea5e9;background:#fff;padding:6px 10px;border-radius:8px;cursor:pointer;font-weight:600}.controls button:hover,#about:hover,.modalBtn:hover{background:#0ea5e9;color:#fff}.controls input[type="text"],#countrySearch{padding:6px 8px;border:1px solid #cbd5e1;border-radius:8px}.controls input[type="range"]{max-width:220px}#mapWrap{position:relative;min-width:0;min-height:0;width:100%;height:100%;overflow:hidden;background:#eef2ff}#map{position:absolute;inset:0;width:100%;height:100%;display:block;max-width:100%;max-height:100%;touch-action:none}.country{stroke:#111827;stroke-width:.5}.country.selected{stroke:#ef4444;stroke-width:2.2;stroke-linejoin:round}.dim{opacity:.25}#tip{position:fixed;display:none;z-index:30;background:#111827;color:#fff;border-radius:6px;padding:6px 8px;pointer-events:none;width:min(292px,calc(100vw - 16px));max-width:calc(100vw - 16px);box-shadow:0 6px 20px rgba(0,0,0,.2)}.spark{display:block;margin-top:6px;max-width:100%;height:auto}#legend{background:#fff;border-top:1px solid #e5e7eb;padding:6px 8px;display:flex;justify-content:center;gap:2px;overflow-x:auto;overflow-y:hidden;height:36px;min-height:36px;max-height:36px;box-sizing:border-box}.bin{min-width:44px;text-align:center;font-size:9px}.swatch{height:12px;border:1px solid rgba(0,0,0,.15)}.bin.hover{outline:1px solid #111827}#chips{min-height:0;max-height:48px;overflow:auto;padding:4px 10px;background:#fbfdff;border-top:1px solid #e5e7eb}.chip{display:inline-block;padding:3px 8px;margin:2px;border-radius:999px;background:#eef2ff;border:1px solid #c7d2fe;font-size:12px}footer{min-height:0}#modal{display:none;position:fixed;inset:0;background:rgba(15,23,42,.48);z-index:50;align-items:center;justify-content:center;padding:12px}.modalCard{width:min(1200px,96vw);max-height:92vh;overflow:auto;background:#fff;padding:16px;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.3);position:relative}.modalHead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;flex-wrap:wrap}.modalHead h2{margin:0;font-size:18px}.modalActions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.chartWrap{display:grid;gap:16px;max-height:72vh;overflow:auto;padding:6px 2px 10px}.chartBox{position:relative;width:100%;height:220px;min-height:220px}.chartBox.rank{height:260px;min-height:260px}.chartBox canvas{display:block!important;width:100%!important;height:100%!important;max-width:100%}#close{font-size:18px;line-height:1;padding:6px 10px}
@media(max-width:900px){#app{grid-template-columns:220px minmax(0,1fr)}header{align-items:flex-start;flex-direction:column}.controls{justify-content:flex-start}.controls input[type="range"]{max-width:160px}}
@media(max-width:700px){html,body{overflow:auto}#app{height:auto;min-height:100dvh;display:flex;flex-direction:column}main{order:1;width:100%;height:100dvh;min-height:620px;grid-template-rows:auto minmax(320px,1fr) auto auto}aside{order:2;width:100%;max-height:none;border-right:0;border-top:1px solid #e5e7eb}header{padding:8px}.controls{gap:5px}.controls button,#about{padding:6px 8px;font-size:13px}#countrySearch{max-width:180px}.chartBox{height:200px;min-height:200px}.chartBox.rank{height:240px;min-height:240px}.modalCard{width:98vw;max-height:94vh;padding:12px}}

/* v4 – részletes, képernyőn belül tartott tooltip-idősor */
#tip{width:min(350px,calc(100vw - 16px));max-width:calc(100vw - 16px);padding:8px 9px 7px;border-radius:8px;font-size:11px;line-height:1.25;overflow:hidden}
.tip-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:3px}.tip-head strong{font-size:12px;font-weight:700}.tip-head span{font-size:9px;color:#94a3b8;letter-spacing:.04em}.tip-value{display:flex;align-items:baseline;justify-content:space-between;gap:10px;color:#cbd5e1;font-size:9px}.tip-value strong{font-size:11px;color:#fff;font-weight:700}.spark{display:block;width:100%;height:auto;max-height:158px;margin-top:5px;overflow:visible}.spark-grid{stroke:#334155;stroke-width:.65;stroke-dasharray:2 3}.spark-axis{stroke:#64748b;stroke-width:.7}.spark-label{fill:#fff;font-size:7.5px;font-weight:500;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.spark-line{fill:none;stroke:#60a5fa;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}.spark-active-line{stroke:#f87171;stroke-width:.8;stroke-dasharray:3 2}.spark-active-dot{fill:#f87171;stroke:#fff;stroke-width:1}
@media(max-width:600px){#tip{width:min(310px,calc(100vw - 12px));max-width:calc(100vw - 12px);padding:7px}.spark-label{font-size:7.5px}}

/* v5 – kategóriacsoportok a bal oldali katalógusban */
.nav-group{margin:10px 0 14px}.nav-category{padding:5px 10px 4px;font-size:10px;line-height:1.2;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#64748b;border-bottom:1px solid #e2e8f0;margin-bottom:3px}.nav-group button{display:block}
/* Collapsible category navigation */
.nav-group{margin:6px 0;border-bottom:1px solid #e2e8f0}
.nav-category{width:100%;display:flex!important;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px!important;margin:0!important;border:0!important;border-radius:6px!important;background:transparent!important;color:#475569!important;font-size:10px!important;line-height:1.2!important;font-weight:800!important;letter-spacing:.08em;text-transform:uppercase;text-align:left;cursor:pointer;box-shadow:none!important}
.nav-category:hover{background:#f1f5f9!important;color:#0f172a!important}
.nav-arrow{font-size:18px;line-height:1;transition:transform .18s ease;transform:rotate(0deg)}
.nav-group.open .nav-arrow{transform:rotate(90deg)}
.nav-items{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease}
.nav-items>*{overflow:hidden}
.nav-group.open .nav-items{grid-template-rows:1fr}
.nav-group.collapsed .nav-items{display:none}
.nav-items button{width:100%;text-align:left}

/* v8 – valódi laptop/viewport magasságkezelés */
main{height:100%;min-height:0;overflow:hidden}
#mapWrap{height:auto;min-height:0;overflow:hidden}
@media (min-width:701px) and (max-height:900px){
  header{padding-top:6px;padding-bottom:6px}
  h1{font-size:17px;margin-bottom:3px}
  .controls{gap:5px}
  .controls button,#about{padding:5px 8px;font-size:12px}
  .controls input[type="text"],#countrySearch{padding:5px 7px;font-size:12px}
  #legend{padding:4px 7px;height:32px;min-height:32px;max-height:32px}
  #chips{max-height:36px;padding-top:2px;padding-bottom:2px}
}
@media (min-width:701px) and (max-height:760px){
  header{padding-top:4px;padding-bottom:4px}
  h1{font-size:16px;margin-bottom:2px}
  .controls button,#about{padding:4px 7px;font-size:11px}
  .controls input[type="text"],#countrySearch{padding:4px 6px;font-size:11px}
  .controls input[type="range"]{max-width:150px}
  #legend{padding:3px 6px;height:26px;min-height:26px;max-height:26px}
  .bin{font-size:8px}
  .swatch{height:10px}
  #chips{max-height:30px}
}

/* 2026-10-02 tooltip/hover chart finomhangolás */
#tip.raster-tip{width:auto;min-width:150px;max-width:210px;padding:7px 9px}
.spark-axis-title{fill:#cbd5e1;font-size:7.5px;font-weight:600;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}

#htmlDiagramPanel{min-height:220px;max-height:42vh;overflow:hidden}#htmlDiagramFrame{background:#fff}

.diagram-bar{background:#fff;border-top:1px solid #dbe4ea;padding:7px 10px;text-align:center;flex:0 0 auto}
#openDiagram{border:1px solid #0ea5e9;color:#0ea5e9;background:#fff;padding:7px 14px;border-radius:9px;cursor:pointer;font-weight:700}
#openDiagram:hover{background:#0ea5e9;color:#fff}
.diagram-modal{display:none;position:fixed;inset:0;z-index:70;background:rgba(15,23,42,.55);align-items:center;justify-content:center;padding:14px}
.diagram-modal.open{display:flex}
.diagram-modal-card{width:min(1180px,96vw);height:min(820px,92vh);background:#fff;border-radius:15px;box-shadow:0 22px 70px rgba(0,0,0,.32);overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr)}
.diagram-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-bottom:1px solid #e5e7eb}
.diagram-modal-head h2{margin:0;font-size:18px}
#closeDiagram{border:1px solid #0ea5e9;color:#0ea5e9;background:#fff;padding:6px 10px;border-radius:8px;cursor:pointer;font-weight:650}
#closeDiagram:hover{background:#0ea5e9;color:#fff}
#htmlDiagramFrame{display:block;width:100%;height:100%;border:0;background:#fff}
@media(max-width:700px){.diagram-bar{padding:6px 8px}.diagram-modal{padding:6px}.diagram-modal-card{width:100%;height:94vh;border-radius:10px}}

main{grid-template-rows:auto minmax(0,1fr) auto auto auto}
.diagram-bar{min-height:42px;align-items:center;justify-content:center}
.diagram-bar[style*="display: block"]{display:flex!important}

@media(max-width:700px){
 body.atlas-mobile-ready #app>aside{position:fixed!important;top:0!important;left:0!important;bottom:0!important;width:min(86vw,330px)!important;height:100dvh!important;max-height:none!important;z-index:2001!important;overflow-y:auto!important;transform:translateX(-105%)!important;visibility:hidden!important;pointer-events:none!important;transition:transform .2s ease,visibility 0s linear .2s!important;border-top:0!important}
 body.atlas-mobile-ready.atlas-mobile-open #app>aside{transform:translateX(0)!important;visibility:visible!important;pointer-events:auto!important;transition:transform .2s ease!important}
 body.atlas-mobile-ready #app>aside .atlas-logo{display:none!important}
 #atlasMobileFab{display:flex!important;position:fixed!important;right:14px!important;bottom:16px!important;width:52px!important;height:52px!important;z-index:2147483646!important;border:0!important;border-radius:50%!important;background:linear-gradient(135deg,#2563eb,#06b6d4)!important;box-shadow:0 5px 18px rgba(15,23,42,.35)!important;padding:0!important;margin:0!important;align-items:center!important;justify-content:center!important;flex-direction:column!important;gap:5px!important}
 #atlasMobileFab span{display:block!important;width:23px!important;height:2px!important;background:#fff!important;border-radius:3px!important}
 #atlasMobileBackdrop{position:fixed!important;inset:0!important;z-index:2000!important;background:rgba(15,23,42,.3)!important}
 #atlasMobileLogo{display:block!important;position:fixed!important;right:12px!important;left:auto!important;top:10px!important;width:34px!important;height:auto!important;z-index:2147483645!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.15))!important}
}

/* 2026-10-08: finomított bal oldali térképkatalógus */
#nav .nav-category{font-size:11.33px!important;} /* 10px + 1pt */
#nav .nav-items button{font-size:12.67px!important;} /* 14px - 1pt */
#nav .nav-items button:hover{background:#eaf4ff!important;color:#075b91!important;text-decoration:underline!important;text-underline-offset:3px;cursor:pointer;}
#nav .nav-category:hover{text-decoration:underline!important;text-underline-offset:3px;}
#nav .nav-items button:focus-visible,#nav .nav-category:focus-visible{outline:2px solid #0ea5e9!important;outline-offset:-2px;}

/* Mobil: kompakt térképnézet, olvasható jelmagyarázat és bezárható tooltip */
@media(max-width:700px){
 html,body{min-height:100%;overflow-x:hidden!important}
 #app{height:100dvh!important;min-height:0!important;overflow:hidden!important}
 #app>main{height:100dvh!important;min-height:0!important;overflow:hidden!important;grid-template-rows:auto minmax(0,1fr) auto auto auto!important}
 #mapWrap{min-height:0!important;height:100%!important;overflow:hidden!important}
 #legend{justify-content:flex-start!important;overflow-x:auto!important;overflow-y:hidden!important;height:auto!important;min-height:54px!important;max-height:64px!important;gap:4px!important;scrollbar-width:thin}
 #legend .bin{flex:0 0 75px!important;min-width:75px!important;font-size:10px!important;white-space:normal!important;line-height:1.2!important}
 #legend .swatch{height:15px!important}
 #tip:not(.raster-tip){pointer-events:auto!important;padding-top:29px!important;max-height:min(68dvh,430px)!important;overflow:auto!important}
 #tip .atlas-tip-close{position:absolute;right:5px;top:4px;display:grid;place-items:center;width:26px;height:25px;border:1px solid #64748b;border-radius:6px;background:#273449;color:white;font-size:20px;line-height:1;cursor:pointer;z-index:5}
 #mapWrap iframe{max-width:100%;}
}

/* Almenük: a kategória nyitásakor minden szint látható marad.
   A korábbi 0fr/1fr grid elvágta a beágyazott almenüket. */
#nav .nav-group.open > .nav-items{display:flex!important;flex-direction:column!important;grid-template-rows:none!important;overflow:visible!important;height:auto!important;max-height:none!important}
#nav .nav-group.open > .nav-items > *{overflow:visible!important;min-height:auto!important}
#nav .nav-group.open .atlas-subsection{display:block!important;overflow:visible!important}
#nav .nav-group.open .atlas-subitems:not([hidden]){display:flex!important;flex-direction:column!important}
#nav .nav-group.open .atlas-subitems[hidden]{display:none!important}
#nav .nav-group.collapsed > .nav-items{display:none!important}