/* World Map and Cohort 4 Web (places.js) */
.maptb,.webtb{display:flex;gap:4px;align-items:center;padding:2px 4px 4px;flex-wrap:wrap}
.tsep{width:1px;align-self:stretch;border-left:1px solid var(--shadow);border-right:1px solid var(--hilite);margin:0 3px}
.mapmain{display:flex;gap:4px;padding:0 4px 4px;height:430px}
.maplist{flex:0 0 200px;overflow:auto;background:#fff;padding:2px}
.mlr{display:block;width:100%;text-align:left;background:none;border:0;padding:4px 6px;font:inherit;font-size:14px;cursor:pointer}
.mlr span{display:block;color:#555;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mlr:hover,.mlr:focus{background:var(--navy);color:#fff;outline:none}
.mlr:hover span,.mlr:focus span{color:#dfe6ff}
.mapview{flex:1;position:relative;overflow:hidden;border-top:2px solid var(--shadow);border-left:2px solid var(--shadow);border-right:2px solid var(--hilite);border-bottom:2px solid var(--hilite);background:#1f5a9e;cursor:grab;touch-action:none}
.mapview.grabbing{cursor:grabbing}
.mapview svg{display:block;width:100%;height:100%}
.mapview .ocean{fill:#1f5a9e}
.mapview .land{fill:#c8d89a;stroke:#5c7a33;stroke-width:1;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.pin{cursor:pointer}
.pin circle{fill:#FF5F45;stroke:#fff}
.pin:hover circle,.pin:focus circle{fill:#FF9A3D;outline:none}
.pin text{fill:#fff;font-weight:700;text-anchor:middle;font-family:Tahoma,Verdana,sans-serif;pointer-events:none}
.mapinfo{position:absolute;left:8px;top:8px;width:270px;max-height:calc(100% - 16px);display:flex;flex-direction:column;background:var(--face);z-index:2;cursor:default}
.mih{display:flex;align-items:center;gap:6px;padding:4px 6px;background:linear-gradient(90deg,var(--navy),var(--navy2));color:#fff}
.mih b{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mib{overflow:auto;padding:4px}
.mip{display:flex;gap:8px;padding:5px 2px;border-bottom:1px solid #d6d6d6;font-size:14px}
.mip:last-child{border-bottom:0}
.mipt{min-width:0}
.mipt .muted{font-size:12.5px}
.mipb{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}
.plav{display:inline-block;max-width:none;border-radius:0;flex:0 0 auto;object-fit:cover;border:1px solid #808080;background:#fff}
.plini{display:inline-block;text-align:center;background:#008080;color:#fff;font-weight:700}
@media (max-width:760px){
  .mapmain{flex-direction:column-reverse;height:auto}
  .mapview{height:320px;flex:0 0 auto}
  .maplist{flex:0 0 auto;max-height:220px}
  .mapinfo{width:auto;right:8px}
}
.w.sized .mapmain,.w.max .mapmain{flex:1;height:auto;min-height:0}

.webaddr{margin:0 4px 4px}
.webmain{display:flex;gap:4px;padding:0 4px 4px;height:460px}
.webfav{flex:0 0 190px;overflow:auto;background:#fff}
.wfh{font-weight:700;font-size:13.5px;padding:4px 6px;border-bottom:1px solid #d6d6d6}
.wfi{display:flex;gap:6px;align-items:flex-start;width:100%;text-align:left;background:none;border:0;padding:4px 6px;font:inherit;font-size:14px;cursor:pointer}
.wfi svg{width:16px;height:16px;flex:0 0 auto;margin-top:2px}
.wfi small{display:block;color:#555;font-size:12px}
.wfi:hover,.wfi.on{background:var(--navy);color:#fff}
.wfi:hover small,.wfi.on small{color:#dfe6ff}
.webpage{flex:1;display:flex;flex-direction:column;background:#fff;overflow:auto;min-width:0}
.webpage iframe{flex:1;border:0;width:100%;min-height:0;background:#fff}
.wbar{display:flex;align-items:center;gap:6px;padding:3px 6px;font-size:13.5px;background:#ffffe1;border-bottom:1px solid #d6d6d6}
.whome{padding:14px 18px;font-family:'Times New Roman',Times,serif;font-size:17px}
.whome h1{font-size:28px;margin:0 0 6px;color:#000080}
.whome .hint,.whome .link{font-family:Tahoma,Verdana,sans-serif}
.wgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin:12px 0}
.wcard{display:flex;gap:8px;align-items:flex-start;text-align:left;background:#fff;border:1px solid #808080;padding:8px;font-family:Tahoma,Verdana,sans-serif;font-size:14px;cursor:pointer}
.wcard:hover{background:#eef3ff;border-color:var(--navy)}
.wcard small{display:block;color:#555;font-size:12.5px}
.wcard b{color:#0000ee;text-decoration:underline}
.wblock{padding:20px;font-size:15.5px}
.wblock h2{margin:0 0 6px;font-size:20px}
.webring{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:2px 8px 4px;font-size:14px}
.webring .wrt{flex:1;text-align:center;color:#555}
@media (max-width:760px){
  .webmain{flex-direction:column;height:auto}
  .webfav{flex:0 0 auto;max-height:160px}
  .webpage{height:480px;flex:0 0 auto}
}
.w.sized .webmain,.w.max .webmain{flex:1;height:auto;min-height:0}
/* Loading screen while a site opens, and a note under a site (2026-09-26) */
.webpage{position:relative}
.webpage iframe.wwait{visibility:hidden}
.wload{position:absolute;inset:28px 0 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#fff;font-size:15px}
.wglobe svg{width:48px;height:48px;animation:wspin 1.6s linear infinite}
@keyframes wspin{to{transform:rotateY(360deg)}}
.wprog{width:220px;height:16px;border:1px solid #808080;background:#fff;padding:1px}
.wprog i{display:block;height:100%;width:0;background:repeating-linear-gradient(90deg,#000080 0 10px,#fff 10px 12px);animation:wfill 6s steps(18,end) forwards}
@keyframes wfill{to{width:92%}}
.wnote{display:inline-block;margin-left:6px;padding:0 5px;font-size:12px;font-weight:700;color:#7a1f10;background:#FFD35A;border:1px solid #b8860b}
.wcard .wnote{margin:3px 0 0;align-self:flex-start}
@media (prefers-reduced-motion:reduce){.wglobe svg,.wprog i{animation:none}.wprog i{width:60%}}

/* 2026-09-26, C4C - world Mara feedback: room between the words and the Open button (37). */
.wblock p:last-child{margin-top:18px}
.webw.wikiw .webring{display:none}
