:root{--ocean:#b3d9ec;--ocean-deep:#9fcbe2;--land:#f3efe6;--land-stroke:#cdbfa6;--ink:#1c2b36;--panel:#ffffff;--accent:#ffd24a;--topbar-h:60px}*{margin:0;padding:0;box-sizing:border-box}body,html{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--ocean);overflow:hidden}#app{display:flex;flex-direction:column;height:100vh}#topbar{min-height:var(--topbar-h);flex:0 0 auto;flex-shrink:0;display:flex;align-items:center;gap:8px 12px;padding:8px 12px;background:var(--ink);color:#fff;z-index:50;box-shadow:0 2px 8px rgba(0,0,0,.25);flex-wrap:wrap;align-content:flex-start;max-width:100%;overflow:visible}.brand{display:flex;align-items:center;gap:9px;font-weight:700;font-size:1.1rem;white-space:nowrap}.brand .logo{width:30px;height:30px;flex:0 0 auto;filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}.brand .brand-text span{color:var(--accent)}.search-wrap{position:relative;width:200px;flex:0 1 200px;min-width:120px;max-width:220px}.sel.search-field{width:100%;min-width:0}#search{width:100%;padding:7px 10px;border:1px solid #3f5666;border-radius:7px;font-size:.82rem;line-height:1.2;background:#2c3e4c;color:#fff;outline:0;transition:box-shadow .15s,background .15s}#search::placeholder{color:#93a6b2}#search:focus{background:#34495a;box-shadow:0 0 0 2px var(--accent)}.suggestions{position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--panel);color:var(--ink);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.25);max-height:320px;overflow-y:auto;display:none;z-index:60}.suggestions.open{display:block}.suggestion{padding:10px 14px;cursor:pointer;font-size:.9rem;display:flex;justify-content:space-between;gap:10px}.suggestion small{color:#8a97a0;font-variant-numeric:tabular-nums}.suggestion.active,.suggestion:hover{background:#eef4f8}.chips{display:flex;align-items:center;gap:8px;flex:1 1 100%;width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;padding:2px 0 4px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.chips:empty{display:none}.chip{display:inline-flex;align-items:center;gap:7px;padding:5px 8px 5px 11px;border-radius:999px;font-size:.8rem;font-weight:600;color:#fff;white-space:nowrap;box-shadow:0 1px 2px rgba(0,0,0,.3)}.chip .chip-area{font-weight:400;opacity:.92;font-variant-numeric:tabular-nums}.chip .chip-remove{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:rgba(0,0,0,.25);cursor:pointer;font-size:.9rem;line-height:1}.chip .chip-remove:hover{background:rgba(0,0,0,.45)}.chip-more{background:#2c3e4c;color:#e6eef3;border:1px solid #3f5666;cursor:pointer}.chip-more:hover{background:#38505f}.chip-more .caret{opacity:.8}.chips-menu{min-width:220px;max-height:320px;overflow-y:auto;padding:4px 0}.chips-menu-row{display:flex;align-items:center;gap:9px;padding:8px 12px;font-size:.85rem;color:var(--ink)}.chips-menu-row:hover{background:#eef4f8}.chips-menu-row .dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto}.chips-menu-row .nm{font-weight:600}.chips-menu-row .ar{margin-left:auto;color:#8a97a0;font-variant-numeric:tabular-nums}.chips-menu-row .chip-remove{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:#e7edf1;color:#5a6b76;cursor:pointer;font-size:.95rem;line-height:1}.chips-menu-row .chip-remove:hover{background:#e6194b;color:#fff}.toolbar{display:flex;flex-direction:column;gap:8px;flex:1 1 100%;width:100%;min-width:0;max-width:100%}.toolbar-primary{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px;width:100%;min-width:0}.toolbar-primary>*{flex:0 0 auto}.toolbar-primary>.menu-wrap{display:flex;align-items:flex-end}#examples-btn.examples-btn{border-color:#6a9eb8;background:#2a4558;box-shadow:inset 0 -2px 0 rgba(255,210,74,.55)}#examples-btn.examples-btn:hover{background:#335568;border-color:#8eb8d0}.sel{display:flex;flex-direction:column;font-size:.6rem;text-transform:uppercase;letter-spacing:.06em;color:#93a6b2;gap:3px}.sel .sel-spacer{visibility:hidden;user-select:none;line-height:1}.sel.tbtn-field .tbtn{width:auto}.sel select{background:#2c3e4c;color:#fff;border:1px solid #3f5666;border-radius:7px;padding:7px 10px;font-size:.82rem;line-height:1.2;cursor:pointer;outline:0;width:auto;max-width:11rem}.sel select:focus{box-shadow:0 0 0 2px var(--accent)}.tbtn{padding:7px 10px;border:1px solid #3f5666;background:#2c3e4c;color:#e6eef3;border-radius:7px;font-size:.82rem;line-height:1.2;font-weight:600;cursor:pointer;transition:background .15s,color .15s,border-color .15s;white-space:nowrap}.tbtn:hover{background:#38505f}.tbtn.active{background:#4d6578;color:#fff;border-color:#6a8fa8;box-shadow:inset 0 -3px 0 var(--accent)}.tbtn.outline{background:0 0}.tbtn.outline:hover{background:#2c3e4c}.menu-wrap{position:relative}.menu{position:absolute;top:calc(100% + 6px);right:0;background:var(--panel);color:var(--ink);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.25);overflow:hidden;display:none;z-index:70;min-width:150px}.menu.open{display:block}.menu div{padding:10px 14px;cursor:pointer;font-size:.85rem}.menu div:hover{background:#eef4f8}@media (min-width:900px){#topbar{display:grid;grid-template-columns:auto minmax(120px,220px) auto;grid-template-areas:"brand search tools";align-items:end;padding:6px 12px;gap:6px 10px}.brand{grid-area:brand;align-self:end}.search-wrap{grid-area:search;width:100%;max-width:none;align-self:end}.search-field .sel-spacer{display:block}.toolbar{grid-area:tools;width:auto;flex:none;justify-self:end}.chips:not(:empty){grid-area:chips;grid-column:1/-1;width:100%}#topbar:has(.chips:not(:empty)){grid-template-areas:"brand search tools" "chips chips chips"}.toolbar-primary{flex-wrap:nowrap;width:auto;justify-content:flex-end;gap:8px}}#map-wrap{position:relative;flex:1 1 auto;min-height:0;overflow:hidden}.map-controls{position:absolute;top:12px;right:12px;z-index:7;display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none}.map-ctl{pointer-events:auto;width:36px;height:36px;border:1px solid rgba(255,255,255,.22);border-radius:8px;background:rgba(28,43,54,.88);color:#e6eef3;font-size:1.2rem;font-weight:700;line-height:1;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.28);transition:background .15s}.map-ctl:hover{background:rgba(44,62,76,.95)}.map-ctl:active{transform:scale(.96)}#map-wrap.comparing .map-controls,html.embed .map-controls{display:none}.raster-layer{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;display:none;transform-origin:0 0}#map{position:relative;z-index:1}#map-wrap.map-style-paper{--ocean:#e8e2d4;--ocean-deep:#ddd6c6;--land:#f7f3ea;--land-stroke:#c4b8a0}#map-wrap.map-style-dark{--ocean:#2a3d4f;--ocean-deep:#243545;--land:#3d5163;--land-stroke:#5a7085}#map-wrap.map-style-midnight{--ocean:#0f1820;--ocean-deep:#0a1218;--land:#2c3a48;--land-stroke:#4a6278}#map-wrap.map-style-dark #map,#map-wrap.map-style-midnight #map{background:radial-gradient(ellipse at 50% 0,var(--ocean) 0,var(--ocean-deep) 100%)}#map-wrap.map-style-dark #map.proj-orthographic,#map-wrap.map-style-midnight #map.proj-orthographic{background:radial-gradient(ellipse at 50% 40%,#243545 0,#0a1218 100%)}#map-wrap.tiles-active .country{fill-opacity:0.22;stroke-width:.6}#map-wrap.tiles-active .graticule{stroke-opacity:0.12}#map-wrap.tiles-active .ocean-sphere{fill-opacity:0.15}.credit #tile-credit:empty{display:none}.proj-credit{display:block;text-align:right}.proj-credit-name{display:block;font-weight:600;color:#2a4555}.proj-credit-blurb{display:block;margin-top:2px;line-height:1.35;color:#4a6578}.proj-orthographic~.credit .proj-credit-name{color:#e8f2f8}.proj-orthographic~.credit .proj-credit-blurb{color:#b8d0e0}#compare-wrap{display:none;position:absolute;inset:0;background:#0a121a;z-index:5}#compare-wrap.show{display:flex;gap:2px}#map-wrap.comparing #hint,#map-wrap.comparing #info,#map-wrap.comparing #map,#map-wrap.comparing .credit{display:none}.cmp-panel{flex:1 1 0;min-width:0;display:flex;flex-direction:column}.cmp-head{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:8px 10px 6px;background:#16242e}.cmp-proj{background:#2c3e4c;color:#fff;border:1px solid #3f5666;border-radius:7px;padding:6px 10px;font-size:.82rem;cursor:pointer;outline:0;max-width:100%}.cmp-blurb{margin:0;max-width:28rem;font-size:.72rem;line-height:1.35;color:#93a6b2;text-align:center}.cmp-svg{flex:1 1 auto;width:100%;min-height:0;display:block}@media (max-width:700px){#compare-wrap.show{flex-direction:column}}#map{width:100%;height:100%;display:block;cursor:grab;background:radial-gradient(ellipse at 50% 0,var(--ocean) 0,var(--ocean-deep) 100%)}#map.panning{cursor:grabbing}#map.proj-orthographic{background:radial-gradient(ellipse at 50% 40%,#20364a 0,#0d1722 100%)}#map.rotating{cursor:grabbing}.ocean-sphere{fill:var(--ocean);stroke:#7fb2cc;stroke-width:.75}.graticule{fill:none;stroke:#ffffff;stroke-opacity:0.45;stroke-width:.5}.proj-orthographic .graticule{stroke-opacity:0.25}.country{fill:var(--land);stroke:var(--land-stroke);stroke-width:.4;cursor:pointer;transition:fill .12s}#map:not(.borders-off) .country{stroke:#9a8b72;stroke-width:.85}#map.borders-off .country{stroke-width:.2;stroke-opacity:0.3}.country:hover{fill:#fffdf6}.ghost{fill:none;stroke-width:1;stroke-dasharray:4 3;pointer-events:none;opacity:.85}.movable{cursor:grab;stroke:#ffffff;stroke-width:1;fill-opacity:0.72}.movable.dragging{cursor:grabbing;fill-opacity:0.85}.movable-label{pointer-events:none;font-size:12px;font-weight:700;fill:#ffffff;paint-order:stroke;stroke:rgba(0,0,0,0.55);stroke-width:3px;text-anchor:middle}.hint{position:absolute;left:16px;bottom:16px;max-width:320px;background:rgba(28,43,54,.9);color:#fff;padding:12px 14px;border-radius:10px;font-size:.82rem;line-height:1.45;box-shadow:0 4px 16px rgba(0,0,0,.3);transition:opacity .4s;z-index:4}.hint.hidden{opacity:0;pointer-events:none}.hint-btn{display:block;margin-top:10px;width:100%;padding:8px 12px;border:1px solid rgba(255,213,74,.55);border-radius:8px;background:rgba(255,213,74,.15);color:var(--accent);font-size:.82rem;font-weight:700;cursor:pointer;text-align:center}.hint-btn:hover{background:rgba(255,213,74,.28)}.toolbar-advanced{display:none;position:fixed;top:var(--topbar-offset,56px);left:12px;right:auto;z-index:90;width:max-content;max-width:calc(100vw - 24px);flex-wrap:wrap;gap:6px;align-items:flex-end;padding:8px 10px;background:#1a2832;border:1px solid rgba(255,255,255,.18);border-radius:10px;box-shadow:0 10px 28px rgba(0,0,0,.45);max-height:min(11rem,32vh);overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}body.show-advanced-tools .toolbar-advanced{display:flex}body.show-advanced-tools .toolbar-advanced:has(.menu.open){overflow:visible;z-index:95}.toolbar-advanced .menu-wrap{position:relative;flex:0 0 auto;overflow:visible}.toolbar-advanced .menu{z-index:100}.toolbar-advanced .tbtn{width:auto;padding:6px 10px;font-size:.76rem;min-height:0}.toolbar-advanced .sel{flex:0 0 auto;font-size:.55rem}.toolbar-advanced .sel select{width:auto;max-width:9rem;padding:6px 10px;font-size:.76rem;min-height:0}.toolbar-advanced-end{display:flex;flex-wrap:wrap;gap:6px;align-items:flex-end;margin-left:auto}body.compare-mode .chips{display:none}body.compare-mode .search-wrap{flex:0 1 180px;max-width:220px}body.compare-mode .toolbar-primary>.sel:not(.tbtn-field){display:none!important}body.compare-mode:not(.show-advanced-tools) .toolbar-advanced{display:none!important}body.compare-mode #compare-btn::after{content:' ✕';font-weight:700;opacity:.85}#examples-menu{min-width:240px}#examples-menu strong{display:block;font-size:.88rem}#examples-menu small{color:#6b7a85;font-size:.75rem}.info{position:absolute;left:16px;bottom:16px;width:290px;max-height:60vh;overflow-y:auto;background:rgba(255,255,255,.96);color:var(--ink);padding:12px 14px;border-radius:10px;font-size:.82rem;box-shadow:0 4px 16px rgba(0,0,0,.3);display:none;z-index:5}.info.show{display:block}.info h4{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:#7a8a95;margin:2px 0 8px}.info-head{display:flex;align-items:center;gap:10px}.info-head h4{margin:2px 0;flex:1 1 auto}.info-toggle{flex:0 0 auto;border:1px solid #d4dde2;background:#f4f7f8;color:#51626c;border-radius:6px;padding:2px 9px;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;cursor:pointer}.info-toggle:hover{background:#e7edf0;color:var(--ink)}.info.collapsed .info-body{display:none}.info.collapsed .info-head h4{margin:2px 0}.info .item{padding:6px 0;border-bottom:1px solid #eef1f3}.info .item:last-child{border-bottom:none}.info .top{display:flex;align-items:baseline;gap:8px}.info .row{display:flex;align-items:baseline;gap:8px;padding:4px 0;border-bottom:1px solid #eef1f3}.info .row:last-child{border-bottom:none}.info .dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto;align-self:center}.info .nm{font-weight:700}.info .meta{margin-left:auto;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.info .note{margin:3px 0 0 19px;font-size:.75rem;color:#7a8a95;line-height:1.35}.info .note.nogap{margin:0 0 6px 0}.info .mult{color:#c0392b;font-weight:700}.info .ratios{margin-top:8px;padding-top:8px;border-top:2px solid #e3e8eb}.credit{position:absolute;right:12px;bottom:10px;font-size:.72rem;color:#3d5566;background:rgba(255,255,255,.55);padding:6px 10px;border-radius:6px;pointer-events:none;z-index:6;display:flex;flex-direction:column;align-items:flex-end;gap:4px;max-width:22rem;text-align:right;line-height:1.35}.credit-byline,.credit-tiles{display:block;font-size:.68rem}.credit a{color:#1e6a99;pointer-events:auto;cursor:pointer;text-decoration:underline;text-underline-offset:2px}.credit a:hover{color:#155a82}.proj-orthographic~.credit{color:#cfe0ec}.proj-orthographic~.credit a{color:#9ecae8}.loader{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:var(--ink);background:var(--ocean);z-index:40}.loader.hidden{display:none}.modal{position:fixed;inset:0;background:rgba(10,18,26,.72);display:none;align-items:center;justify-content:center;z-index:200}.modal.open{display:flex}.modal-card{position:relative;background:#fff;color:var(--ink);border-radius:16px;padding:28px 28px 22px;width:min(520px,92vw);box-shadow:0 20px 60px rgba(0,0,0,.4);text-align:center}.modal-card h2{font-size:1.5rem;margin-bottom:4px}.quiz-badge{display:inline-block;margin-bottom:8px;padding:3px 10px;border-radius:999px;background:#e8f4fc;color:#1e6a99;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.quiz-sub{color:#6b7a85;margin-bottom:18px;font-size:.9rem;line-height:1.45}.modal-close{position:absolute;top:12px;right:14px;border:none;background:0 0;font-size:1.6rem;line-height:1;cursor:pointer;color:#9aa7b0}.modal-close:hover{color:var(--ink)}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:14px}.quiz-opt{padding:22px 12px;border:2px solid #e0e6ea;border-radius:12px;background:#f8fafb;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .12s}.quiz-opt:hover:not(:disabled){border-color:var(--ink);transform:translateY(-2px)}.quiz-opt.correct{border-color:#2f9e44;background:#e7f6ea}.quiz-opt.wrong{border-color:#e6194b;background:#fdeaee}.quiz-opt:disabled{cursor:default}.quiz-result{min-height:26px;margin:16px 0 4px;font-size:.95rem;font-weight:600;line-height:1.45}.quiz-note{display:block;margin-top:6px;font-size:.82rem;font-weight:500;color:#6b7a85}.quiz-foot{display:flex;align-items:center;justify-content:space-between;margin-top:8px}#quiz-score{color:#6b7a85;font-variant-numeric:tabular-nums}.quiz-foot .tbtn{background:var(--ink);color:#fff;border-color:var(--ink)}.quiz-foot .tbtn:hover:not(:disabled){background:#2a3d4a}.quiz-foot .tbtn:disabled{opacity:.45;cursor:not-allowed}.help-card{text-align:left;width:min(560px,92vw);max-height:86vh;overflow-y:auto}.help-card h2{text-align:center}.help-card .quiz-sub{text-align:center;margin-bottom:16px}.help-card h3{font-size:1rem;margin:16px 0 6px}.help-body{font-size:.92rem;color:#41525c;line-height:1.55}.help-body p{margin-bottom:12px}.help-body ol{margin:0;padding-left:20px}.help-body li{margin-bottom:9px}.help-body strong{color:var(--ink)}.help-note{font-size:.84rem;color:#6b7a85;line-height:1.55}.help-note a{color:#1e6a99;text-decoration:underline;text-underline-offset:2px}.help-note a:hover{color:#155a82}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:11px 18px;border-radius:8px;font-size:.88rem;opacity:0;pointer-events:none;transition:all .25s;z-index:300}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}html.embed #compare-btn,html.embed #help-btn,html.embed #hint,html.embed #more-tools-btn,html.embed #quiz-btn,html.embed .map-controls,html.embed .toolbar-advanced{display:none!important}html.embed #topbar{padding:6px 10px;gap:8px}html.embed .search-wrap{flex:1 1 140px;min-width:0}html.embed .credit{font-size:.65rem;max-width:55vw}@media (max-width:899px){.search-field .sel-spacer{display:none}}@media (max-width:1024px){#topbar{padding:8px 10px;gap:8px}.search-wrap{flex:1 1 100%;width:100%;max-width:none}#search{padding:10px 12px;font-size:.8rem;min-height:44px}.toolbar-primary{gap:6px}.toolbar-advanced{max-height:min(13rem,40vh)}.toolbar-primary .sel select{font-size:.78rem;padding:10px 10px;min-height:44px}.toolbar-primary .tbtn{padding:10px 12px;min-height:44px;font-size:.8rem}}@media (max-width:900px){#topbar{align-items:stretch}.brand{font-size:.95rem}.hint{left:10px;right:10px;bottom:10px;max-width:none;font-size:.78rem;padding:10px 12px}.info{left:10px;right:10px;width:auto;max-height:42vh;bottom:auto;top:10px}.info.show~.hint,body:has(.info.show) .hint{display:none}.credit{left:10px;right:10px;bottom:6px;max-width:none;align-items:center;text-align:center;font-size:.65rem}.credit-byline,.credit-tiles,.proj-credit{text-align:center}.map-controls{top:10px;right:10px}#map{touch-action:none}}@media (max-width:600px){.brand-text{display:none}.search-wrap{min-width:0}.toolbar-primary .sel{flex:1 1 100%}.toolbar-primary .sel select{width:100%;max-width:none}.toolbar-primary #compare-btn,.toolbar-primary #examples-btn,.toolbar-primary #more-tools-btn{flex:1 1 calc(33% - 6px)}.toolbar-advanced{left:8px;max-width:calc(100vw - 16px);max-height:min(16rem,50vh)}}@media (max-width:480px){.brand .logo{width:26px;height:26px}.brand-text{display:none}.quiz-options{grid-template-columns:1fr}.modal-card{padding:22px 18px 18px}}