/* Passports — full-tab globe coloured by what one passport lets you do. */
:root{
  --bg:#080d1c; --panel:rgba(16,26,52,.86); --panel2:rgba(22,34,64,.94);
  --line:rgba(190,210,255,.13); --txt:#eaf0ff; --muted:#93a6cc; --accent:#e8b44c;
  --free:#2fb45f; --voa:#8ecb47; --eta:#f0cb33; --evisa:#ef9a35;
  --visa:#e4705e; --banned:#8d1f33; --undef:#5d6580; --home:#7fb0ff;
}
*{box-sizing:border-box}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
html,body{margin:0;height:100%}
body{
  background:radial-gradient(1200px 820px at 72% -12%,#16305e 0%,#0c1730 44%,#050914 100%);
  color:var(--txt); font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  overflow:hidden; user-select:none;
}
.hidden{display:none !important}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:rgba(150,175,225,.26);border-radius:6px}
::-webkit-scrollbar-track{background:transparent}

/* ---------------------------------------------------------------- header */
#topbar{position:fixed;top:0;left:0;right:0;height:54px;z-index:30;display:flex;align-items:center;
  justify-content:space-between;padding:0 16px;
  background:linear-gradient(180deg,rgba(6,11,24,.93),rgba(6,11,24,0))}
.brand{display:flex;align-items:center;gap:11px}
.logo{width:38px;height:38px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
.brand-name{font-weight:700;font-size:17px;letter-spacing:.3px;display:block;line-height:1.1}
.brand-sub{font-size:11px;color:var(--muted)}
.tools{position:relative;display:flex;align-items:center;gap:8px}
#searchWrap{position:relative}
#search{width:190px;height:38px;padding:0 12px;border-radius:10px;font-size:13px;background:var(--panel);
  color:var(--txt);border:1px solid var(--line);outline:none;transition:width .15s}
#search::placeholder{color:var(--muted)}
#search:focus{border-color:var(--accent);width:222px}
#searchResults{position:absolute;top:44px;right:0;width:266px;max-height:330px;overflow:auto;padding:5px;z-index:50;
  background:var(--panel2);border:1px solid var(--line);border-radius:11px;backdrop-filter:blur(10px);
  box-shadow:0 14px 40px rgba(0,0,0,.55)}
.sr-item{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:7px;font-size:13px;cursor:pointer}
.sr-item:hover,.sr-item.sel{background:rgba(255,255,255,.10)}
.sr-flag{font-size:15px;flex:none}
.sr-dot{width:9px;height:9px;border-radius:50%;flex:none;margin-left:auto}
.sr-none{padding:9px 10px;color:var(--muted);font-size:12.5px}
#menuBtn{width:40px;height:40px;flex:none;border-radius:10px;cursor:pointer;font-size:18px;line-height:1;
  background:var(--panel);color:var(--txt);border:1px solid var(--line)}
#menuBtn:hover{background:rgba(38,56,98,.9)}
#menu{position:absolute;top:48px;right:0;width:242px;padding:6px;border-radius:13px;z-index:50;
  background:var(--panel2);border:1px solid var(--line);backdrop-filter:blur(10px);
  box-shadow:0 16px 44px rgba(0,0,0,.6);display:flex;flex-direction:column;gap:2px}
.mi{display:flex;align-items:center;gap:10px;width:100%;padding:9px 11px;border:none;border-radius:8px;
  background:transparent;color:var(--txt);font:inherit;font-size:13px;cursor:pointer;text-align:left}
.mi:hover{background:rgba(255,255,255,.09)}
.mi.on .mi-tx{color:var(--accent)}
.mi-ic{width:18px;text-align:center;font-size:14px;flex:none}
.mi-tx{flex:1}
.mi-state{font-size:11px;color:var(--muted);font-weight:600}
.mi-sep{height:1px;background:var(--line);margin:4px 6px}
#toast{position:fixed;left:50%;bottom:190px;transform:translateX(-50%);z-index:60;padding:10px 16px;
  border-radius:10px;font-size:13px;font-weight:600;background:rgba(16,26,52,.97);color:var(--txt);
  border:1px solid var(--line);box-shadow:0 10px 30px rgba(0,0,0,.55)}

/* ------------------------------------------------------------------- map */
#globeViz{position:fixed;inset:54px 0 148px 0}
#flatViz{position:fixed;inset:54px 0 148px 0;z-index:1;cursor:grab}
.flat-ocean{fill:rgba(18,32,62,.5)}
.flat-cell{pointer-events:none}
.flat-hit{fill:transparent;pointer-events:all;stroke:rgba(6,10,22,.6);stroke-width:.7;cursor:pointer}
.flat-hit:hover{stroke:#fff;stroke-width:1.5}
.flat-hit.sel{stroke:#fff;stroke-width:2.3}
.flat-dot{cursor:pointer;stroke:rgba(6,10,22,.75);stroke-width:.8}
.flat-dot:hover{stroke:#fff;stroke-width:1.6}

/* --------------------------------------------------------------- tooltip */
#tooltip{position:fixed;z-index:40;pointer-events:none;transform:translate(14px,14px);min-width:180px;
  max-width:270px;padding:9px 11px;border-radius:11px;background:rgba(10,18,38,.96);
  border:1px solid var(--line);box-shadow:0 10px 30px rgba(0,0,0,.55)}
.tt-head{display:flex;align-items:center;gap:8px;margin-bottom:5px}
.tt-flag{font-size:16px}
.tt-name{font-weight:650;font-size:13.5px}
.tt-cat{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:600}
.tt-dot{width:10px;height:10px;border-radius:3px;flex:none}
.tt-stay{font-size:12px;color:var(--muted);margin-top:3px}
.tt-nd{font-size:12.5px;color:var(--muted)}

/* --------------------------------------------------------- left: passport */
#ppBox{position:relative;position:fixed;left:14px;top:64px;width:302px;max-height:calc(100vh - 226px);overflow:auto;
  z-index:20;padding:13px 13px 11px;border-radius:15px;background:var(--panel);
  border:1px solid var(--line);backdrop-filter:blur(11px);box-shadow:0 14px 40px rgba(0,0,0,.5)}
.mode-tabs{display:flex;gap:3px;padding:2px;border-radius:10px;background:rgba(255,255,255,.06);
  margin-bottom:11px}
.mt{flex:1;padding:6px 4px;border-radius:8px;border:none;cursor:pointer;font:inherit;font-size:11.6px;
  background:transparent;color:var(--muted);white-space:nowrap}
.mt.on{background:rgba(232,180,76,.18);color:var(--accent);font-weight:650}
#ppBox.collapsed .mode-tabs{display:none}
.pp-collapse{display:none;position:absolute;top:9px;right:10px;width:28px;height:28px;border-radius:8px;
  cursor:pointer;font-size:13px;line-height:1;background:rgba(255,255,255,.09);color:var(--txt);border:none;z-index:2}
.pp-collapse:hover{background:rgba(255,255,255,.18)}
#ppBox.collapsed .legend,#ppBox.collapsed .stay-block,#ppBox.collapsed #openTable,
#ppBox.collapsed .gb-note,#ppBox.collapsed .pp-blurb,#ppBox.collapsed .pp-bar{display:none}
#ppBox.collapsed #ppCollapse{transform:rotate(-90deg)}
.gb-cap{font-size:10.5px;letter-spacing:.10em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.gb-cap2{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0 0 7px}
.gb-cap2 small{text-transform:none;letter-spacing:0;opacity:.75}
.pp-pick{position:relative}
.pp-btn{display:flex;align-items:center;gap:9px;width:100%;padding:10px 11px;border-radius:11px;cursor:pointer;
  background:rgba(30,46,86,.9);color:var(--txt);border:1px solid var(--line);font:inherit;text-align:left}
.pp-btn:hover{border-color:var(--accent)}
.pp-flag{font-size:20px;flex:none}
.pp-name{flex:1;font-weight:680;font-size:15px}
.pp-caret{color:var(--muted);font-size:11px}
#ppList{position:absolute;top:50px;left:0;right:0;z-index:60;padding:6px;border-radius:12px;
  background:var(--panel2);border:1px solid var(--line);backdrop-filter:blur(12px);
  box-shadow:0 18px 46px rgba(0,0,0,.62)}
#ppSearch{width:100%;height:34px;padding:0 10px;margin-bottom:5px;border-radius:8px;font-size:13px;
  background:rgba(8,14,30,.8);color:var(--txt);border:1px solid var(--line);outline:none}
#ppSearch:focus{border-color:var(--accent)}
#ppOptions{max-height:296px;overflow:auto}
.pp-opt{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:7px;font-size:13px;cursor:pointer}
.pp-opt:hover,.pp-opt.sel{background:rgba(255,255,255,.10)}
.pp-opt .o-rank{margin-left:auto;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.pp-opt .o-special{margin-left:auto;font-size:10px;color:var(--accent)}

.pp-head{display:flex;align-items:center;gap:12px;margin:12px 0 8px}
.pp-rank{flex:none;text-align:center;min-width:52px;padding:5px 7px;border-radius:10px;
  background:rgba(232,180,76,.13);border:1px solid rgba(232,180,76,.32)}
.pp-rank span{display:block;font-size:20px;font-weight:750;color:var(--accent);line-height:1.05;
  font-variant-numeric:tabular-nums}
.pp-rank small{font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pp-score b{font-size:25px;font-weight:750;line-height:1;display:block;font-variant-numeric:tabular-nums}
.pp-score span{font-size:11.5px;color:var(--muted);line-height:1.3;display:block;margin-top:2px}
.pp-bar{display:flex;height:9px;border-radius:5px;overflow:hidden;margin-bottom:11px;
  background:rgba(255,255,255,.05)}
.pp-bar i{display:block;height:100%}
.pp-basis{font-size:10.9px;color:var(--muted);line-height:1.42;margin:-5px 0 10px}
.pp-basis b{color:#c3d2ee;font-weight:640}
#ppBox.collapsed .pp-basis{display:none}
.pp-blurb{font-size:12.4px;line-height:1.52;color:#cfdcf6;margin:0 0 11px;padding:9px 10px;border-radius:9px;
  background:rgba(255,255,255,.045);border-left:2px solid var(--accent)}
.pp-blurb .quirk{display:block;margin-top:6px;color:var(--accent);font-size:11.8px}
.pp-blurb.is-warn{border-left-color:var(--visa);background:rgba(228,112,94,.09)}
.pp-blurb .warn{display:block;color:#f0b6a9}
.pp-blurb .warn + *{display:block;margin-top:7px}

.legend{display:flex;flex-direction:column;gap:3px;margin-bottom:12px}
.lg{display:flex;align-items:center;gap:9px;padding:5px 7px;border-radius:8px;cursor:pointer;border:1px solid transparent}
.lg:hover{background:rgba(255,255,255,.07)}
.lg.off{opacity:.36}
.lg.solo{border-color:var(--accent);background:rgba(232,180,76,.10)}
.lg-sw{width:13px;height:13px;border-radius:4px;flex:none}
.lg-tx{flex:1;font-size:12.6px}
.lg-n{font-size:12.6px;font-weight:680;font-variant-numeric:tabular-nums;color:#dbe6fb}

.stay-block{margin-bottom:11px}
.stay-rows{display:flex;flex-direction:column;gap:3px}
.st{display:flex;align-items:center;gap:8px;padding:4px 7px;border-radius:7px;cursor:pointer;font-size:12.3px}
.st:hover{background:rgba(255,255,255,.07)}
.st.on{background:rgba(232,180,76,.14)}
.st-k{width:72px;flex:none;color:var(--muted)}
.st-bar{flex:1;height:7px;border-radius:4px;background:rgba(255,255,255,.06);overflow:hidden}
.st-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--free),var(--voa))}
.st-n{width:26px;text-align:right;font-weight:660;font-variant-numeric:tabular-nums}

.wide-btn{width:100%;padding:9px 12px;border-radius:10px;cursor:pointer;font:inherit;font-size:12.8px;
  font-weight:650;background:rgba(232,180,76,.14);color:var(--accent);border:1px solid rgba(232,180,76,.34)}
.wide-btn:hover{background:rgba(232,180,76,.24)}
.gb-note{font-size:10.8px;color:var(--muted);margin-top:8px;line-height:1.45}

/* ------------------------------------------------------ right: destination */
#detailCard{position:fixed;right:14px;top:64px;width:322px;max-height:calc(100vh - 226px);overflow:auto;
  z-index:20;padding:14px;border-radius:15px;background:var(--panel);border:1px solid var(--line);
  backdrop-filter:blur(11px);box-shadow:0 14px 40px rgba(0,0,0,.5)}
.card-close{position:absolute;top:9px;right:10px;width:26px;height:26px;border-radius:7px;cursor:pointer;
  font-size:17px;line-height:1;background:rgba(255,255,255,.08);color:var(--txt);border:none}
.card-close:hover{background:rgba(255,255,255,.17)}
.detail-head{display:flex;align-items:center;gap:11px;margin-bottom:11px;padding-right:26px}
.detail-flag{font-size:29px;flex:none}
.detail-name{font-weight:700;font-size:17px;line-height:1.15}
.detail-sub{font-size:11.5px;color:var(--muted);margin-top:1px}
.detail-chip{display:flex;align-items:center;gap:9px;padding:10px 12px;border-radius:11px;font-weight:690;
  font-size:14.5px;margin-bottom:9px}
.detail-chip .dc-dot{width:13px;height:13px;border-radius:4px;flex:none;background:currentColor}
.detail-stay{font-size:13px;color:#d7e2f8;margin-bottom:10px;padding:9px 11px;border-radius:10px;
  background:rgba(255,255,255,.05)}
.detail-stay b{font-size:16px;color:var(--txt)}
.detail-stay .inf{color:var(--muted);font-size:11.2px;display:block;margin-top:3px}
.detail-bloc{font-size:12px;padding:8px 10px;border-radius:9px;margin-bottom:10px;
  background:rgba(127,176,255,.10);border:1px solid rgba(127,176,255,.24);color:#cfe0ff}
.detail-notes{display:flex;flex-direction:column;gap:7px}
.detail-notes .nh{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.detail-notes p{margin:0;font-size:12.4px;line-height:1.5;color:#cdd9f2;padding-left:12px;position:relative}
.detail-notes p:before{content:'·';position:absolute;left:3px;color:var(--accent);font-weight:700}
.detail-recip{margin-top:10px;font-size:11.6px;color:var(--muted)}
.detail-reverse{margin-top:11px;padding-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.detail-reverse b{color:var(--txt)}
.detail-reverse .rv-link{color:var(--accent);cursor:pointer;text-decoration:underline dotted}

/* --------------------------------------------------------- bottom: ranking */
#rankbar{position:fixed;left:0;right:0;bottom:0;height:154px;z-index:22;padding:9px 14px 10px;
  background:linear-gradient(0deg,rgba(6,11,24,.97) 55%,rgba(6,11,24,0));}
.rb-head{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.rb-title{font-weight:680;font-size:13.5px}
.rb-toggle{display:flex;gap:3px;padding:2px;border-radius:9px;background:rgba(255,255,255,.06)}
.rb-t{padding:5px 10px;border-radius:7px;border:none;cursor:pointer;font:inherit;font-size:11.5px;
  background:transparent;color:var(--muted)}
.rb-t.on{background:rgba(232,180,76,.18);color:var(--accent);font-weight:650}
.rb-hint{font-size:11px;color:var(--muted);margin-left:auto}
.rank-strip{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;padding-bottom:8px;height:106px}
.rk{flex:none;width:152px;height:96px;padding:7px 10px;border-radius:11px;cursor:pointer;
  background:rgba(20,32,62,.8);border:1px solid var(--line);
  display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.rk:hover{border-color:rgba(232,180,76,.5);background:rgba(28,44,82,.9)}
.rk.on{border-color:var(--accent);background:rgba(232,180,76,.13)}
.rk-top{flex:none;display:flex;align-items:center;gap:6px;line-height:1.1;min-width:0}
.rk-rank{font-size:11px;color:var(--muted);font-weight:680;font-variant-numeric:tabular-nums;flex:none}
.rk-flag{font-size:15px;flex:none}
.rk-name{flex:none;min-width:0;font-size:12.2px;font-weight:640;line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk-n{flex:none;font-size:19px;font-weight:740;line-height:1.05;font-variant-numeric:tabular-nums}
.rk-bar{flex:none;height:5px;border-radius:3px;background:rgba(255,255,255,.07);overflow:hidden}
.rk-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--free),var(--voa),var(--eta))}

/* ------------------------------------------------------------- overlays */
.overlay{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;
  padding:22px;background:rgba(4,8,18,.72);backdrop-filter:blur(4px)}
.ov-box{position:relative;width:min(660px,100%);max-height:88vh;overflow:auto;padding:24px 26px;
  border-radius:17px;background:var(--panel2);border:1px solid var(--line);box-shadow:0 24px 70px rgba(0,0,0,.65)}
.ov-wide{width:min(1080px,100%)}
.ov-narrow{width:min(470px,100%)}
.ov-close{position:absolute;top:12px;right:14px;width:30px;height:30px;border-radius:8px;cursor:pointer;
  font-size:19px;line-height:1;background:rgba(255,255,255,.08);color:var(--txt);border:none}
.ov-close:hover{background:rgba(255,255,255,.18)}
.ov-box h2{margin:0 0 12px;font-size:20px}
.ov-box h3{margin:20px 0 8px;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.ov-box p{margin:0 0 11px;font-size:13.4px;line-height:1.62;color:#d3ddf4}
.ov-box .src{font-size:12.2px;color:var(--muted)}
.ov-box code{background:rgba(255,255,255,.08);padding:1px 5px;border-radius:4px;font-size:11.5px}
.about-cats{display:flex;flex-direction:column;gap:7px;margin:14px 0 4px}
.ac{display:flex;gap:10px;align-items:flex-start;font-size:12.8px}
.ac-sw{width:14px;height:14px;border-radius:4px;flex:none;margin-top:2px}
.ac b{display:block;font-size:13px}
.ac span{color:var(--muted);line-height:1.45}
.about-cav{margin:0;padding-left:19px;font-size:12.8px;line-height:1.62;color:#d3ddf4}
.about-cav li{margin-bottom:5px}
.about-faq .fq{margin-bottom:11px}
.about-faq b{display:block;font-size:13px;margin-bottom:2px}
.about-faq span{font-size:12.6px;color:var(--muted);line-height:1.55}
.tut{margin:0 0 18px;padding-left:20px;font-size:13.6px;line-height:1.78}
.tut b{color:var(--accent)}

/* ----------------------------------------------------------------- tables */
.tbl-tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:11px}
.tbl-tools input,.tbl-tools select{height:34px;padding:0 10px;border-radius:8px;font:inherit;font-size:12.6px;
  background:rgba(8,14,30,.8);color:var(--txt);border:1px solid var(--line);outline:none}
.tbl-tools input{flex:1;min-width:150px}
.tbl-tools input:focus,.tbl-tools select:focus{border-color:var(--accent)}
.tbl-csv{height:34px;padding:0 13px;border-radius:8px;cursor:pointer;font:inherit;font-size:12.4px;font-weight:640;
  background:rgba(232,180,76,.14);color:var(--accent);border:1px solid rgba(232,180,76,.34)}
.tbl-csv:hover{background:rgba(232,180,76,.24)}
.tbl-wrap{max-height:60vh;overflow:auto;border-radius:11px;border:1px solid var(--line)}
table{width:100%;border-collapse:collapse;font-size:12.6px}
thead th{position:sticky;top:0;z-index:2;text-align:left;padding:9px 11px;
  background:#13203e;border-bottom:1px solid var(--line);font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);white-space:nowrap}
tbody td{padding:8px 11px;border-bottom:1px solid rgba(190,210,255,.07);vertical-align:top;line-height:1.45}
tbody tr:hover{background:rgba(255,255,255,.045)}
tbody tr{cursor:pointer}
td.t-what{white-space:nowrap;font-weight:620}
td.t-days{white-space:nowrap;font-variant-numeric:tabular-nums}
td.t-notes{color:var(--muted);font-size:11.8px;max-width:400px}
table.no-notes th:nth-child(5),table.no-notes td:nth-child(5){display:none}
.t-dot{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:7px;vertical-align:-1px}
.t-flag{margin-right:7px}
.cmp-pick{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.cmp-pick select{flex:1;height:38px;padding:0 11px;border-radius:9px;font:inherit;font-size:13.5px;
  background:rgba(8,14,30,.8);color:var(--txt);border:1px solid var(--line);outline:none}
.cmp-vs{color:var(--muted);font-size:12px;font-weight:650}
.cmp-summary{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:13px}
.cs{flex:1;min-width:150px;padding:11px 13px;border-radius:11px;background:rgba(255,255,255,.05);
  border:1px solid var(--line)}
.cs b{display:block;font-size:22px;font-weight:740;font-variant-numeric:tabular-nums}
.cs span{font-size:11.5px;color:var(--muted);line-height:1.35;display:block;margin-top:2px}

/* A short window would otherwise leave the globe a sliver. */
@media (max-height:620px){
  #globeViz,#flatViz{inset:54px 0 128px 0}
  #rankbar{height:128px}
  .rank-strip{height:84px}
  .rk{height:76px;padding:6px 9px}
  .rk-n{font-size:16px}
  .rb-head{margin-bottom:6px}
}

/* ---------------------------------------------------------------- narrow */
@media (max-width:1120px){
  #ppBox{width:270px}
  #detailCard{width:290px}
}
@media (max-width:860px){
  #globeViz,#flatViz{inset:54px 0 124px 0}
  #ppBox{left:8px;right:8px;width:auto;max-height:46vh;top:60px;padding-right:44px}
  #ppBox.collapsed{max-height:none}
  .pp-collapse{display:block}
  #detailCard{left:8px;right:8px;width:auto;top:auto;bottom:132px;max-height:52vh}
  .brand-sub{display:none}
  .logo{width:32px;height:32px}
  #search{width:118px}
  #search:focus{width:140px}
  .rb-hint{display:none}
  #rankbar{height:126px;padding:8px 10px}
  .rb-title{font-size:11.5px;white-space:nowrap}
  .rb-t{font-size:10.8px;padding:4px 8px}
  .rank-strip{height:80px}
  .rk{width:132px;height:72px;padding:6px 8px}
  .rk-n{font-size:16px}
  .pp-score b{font-size:21px}
}