/* MY WORLD — mobile pass V3 / 2026-11-14. Approved CLEAN SVG geometry unchanged. */
:root { --mw-mobile-line-height:1.3; }
/* Ambient tint is emitted exclusively by sphere shader. No square CSS box. */
#world .globe-atmosphere-halo{display:none!important}
#world .globe-webgl-v2{background:transparent!important;filter:none!important;border-radius:0!important;clip-path:none!important;mix-blend-mode:normal!important}
#world .globe-wrap:before,#world .globe-wrap:after{display:none!important}
#world .globe-wrap:not(.map-mode){background:transparent!important;box-shadow:none!important}
#world .marker-label-bg{display:none!important;fill:none!important;stroke:none!important}
#world .marker-label{fill:#FAFCFF!important;font-weight:400!important;font-size:12.4px!important;letter-spacing:0!important;paint-order:stroke!important;stroke:#06090E!important;stroke-opacity:.94!important;stroke-width:2.6px!important;stroke-linejoin:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.9))!important}
#world .mw-marker-owner-accent{pointer-events:none;filter:drop-shadow(0 0 2px currentColor)}
#world .top-year-filter{position:relative!important;isolation:isolate!important;z-index:10!important}
#world .top-year-filter .year-chips{display:block!important;max-width:100%!important}
#world .mw-years-dropdown{position:relative;width:100%;max-width:380px;margin:0 auto;font-weight:400}
#world .mw-years-dropdown>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;min-height:40px;max-width:100%;background:rgba(10,19,27,.75);border:1px solid rgba(229,188,101,.36);border-radius:12px;color:#F1E8D5;padding:8px 12px;font-size:15px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
#world .mw-years-dropdown>summary::-webkit-details-marker{display:none}
#world .mw-years-dropdown>summary:after{content:'⌄';margin-left:8px;flex:none;color:#E5BC65;font-size:20px;line-height:1}
#world .mw-years-dropdown[open]>summary:after{transform:rotate(180deg)}
#world .mw-years-options{position:absolute;left:0;right:0;top:calc(100% + 5px);max-height:min(48dvh,380px);overflow:auto;overscroll-behavior:contain;z-index:90;background:#101A23;border:1px solid rgba(229,188,101,.5);box-shadow:0 12px 30px rgba(0,0,0,.57);border-radius:14px;padding:6px 8px}
#world .mw-year-row{display:flex;align-items:center;gap:10px;min-height:42px;color:#F3EEE5;font-size:15px;font-weight:400;border-bottom:1px solid rgba(255,255,255,.04)}
#world .mw-year-row:last-child{border:0}
#world .mw-year-row>input{accent-color:#E5BC65;width:20px;height:20px;flex:none}
/* Add place must open at the top of a narrow viewport, not as a bottom sheet. */
@media(max-width:767px){
 #addOverlay .sheet{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:0!important;transform:none!important;width:100vw!important;height:100dvh!important;min-height:100dvh!important;max-height:100dvh!important;border-radius:0!important;overflow-y:auto!important;overscroll-behavior:contain!important;padding:calc(8px + env(safe-area-inset-top)) 14px max(22px,env(safe-area-inset-bottom))!important}
 #addOverlay .handle{display:none!important}
 #world .app,body.mode-personal #world .app{align-content:start!important;justify-content:initial!important;min-height:0!important;padding-top:0!important}
 #world .topbar{min-height:44px!important;padding:0 0 2px!important}
 #world .topbar>div:first-child{min-height:42px!important}
 #world .hero{margin:0 0 2px!important;padding:0!important}
 #world .hero h2{margin:0 0 2px!important}
 #world .hero p{margin:0!important;line-height:1.23!important}
 #world .stats{margin:4px 0!important}
 #world .top-year-filter{padding:6px 9px!important;margin:4px 0!important}
 #world .top-year-filter .top-year-title{font-size:14px!important;line-height:1.15!important}
 #world .participant-panel{margin:4px 0!important;padding:6px 9px!important}
 #world .globe-wrap:not(.map-mode){margin:0 auto 15px!important}
 #world .mw-years-dropdown>summary{font-size:14.5px}
}
/* Readability in information/help/LOD windows: compact but not cramped. */
.overlay .helper,.overlay .muted-small,.overlay .simple-content p,.overlay .simple-content li{line-height:var(--mw-mobile-line-height)!important}
#lodPromptOverlay .helper,#mapDataOverlay .helper{font-size:15px!important;line-height:1.26!important;margin-top:5px!important;margin-bottom:6px!important}
#lodPromptOverlay .lod-choice small,#mapDataOverlay .lod-choice small{line-height:1.25!important}
#lodPromptOverlay .lod-region-card{font-size:15px!important;line-height:1.26!important}
#lodPromptOverlay .sheet,#mapDataOverlay .sheet{font-size:16px!important;line-height:1.3!important}
/* One standard, centered status-card for short and long notifications. */
.toast,#toast{position:fixed!important;left:50%!important;right:auto!important;bottom:max(16px,env(safe-area-inset-bottom))!important;width:max-content!important;min-width:min(220px,calc(100vw - 28px))!important;max-width:min(420px,calc(100vw - 28px))!important;box-sizing:border-box!important;transform:translate(-50%,15px)!important;opacity:0;text-align:center!important;white-space:normal!important;overflow-wrap:anywhere!important;line-height:1.22!important;font-size:15px!important;font-weight:400!important;padding:12px 15px!important;border-radius:14px!important;border:1px solid rgba(229,188,101,.5)!important;background:rgba(16,25,33,.97)!important;box-shadow:0 12px 32px rgba(0,0,0,.5)!important}
.toast.show,#toast.show{opacity:1!important;transform:translate(-50%,0)!important}
/* Category marker selectors use images only; text is accessible through aria-label. */
.mw-marker-option span{display:none!important}
.mw-category-config{padding:12px 0 14px;border-top:1px solid rgba(229,188,101,.16)}
.mw-category-config:first-child{border-top:0}
.mw-category-title{font-size:18px;color:#F3C975;margin-bottom:8px;font-weight:400}
.mw-category-picker{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:6px!important}
.mw-category-picker .mw-marker-option{min-height:55px!important;padding:5px 2px!important;gap:0!important;aspect-ratio:1.08;border-radius:12px!important}
.mw-category-picker .mw-marker-option img{width:100%!important;max-width:46px!important;height:46px!important;object-fit:contain}
.mw-color-label{font-size:15px;font-weight:400;color:#E3D2AF;margin:12px 0 8px}
.mw-category-colors{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.mw-color-dot{width:35px;height:35px;border-radius:50%;border:2px solid transparent;background:var(--c);box-shadow:inset 0 0 3px rgba(0,0,0,.4)}
.mw-color-dot.active{outline:2px solid #F9E3B0;outline-offset:2px}
.mw-category-colors>input[type=color]{width:40px;height:38px;border:1px solid #9A855B;border-radius:10px;background:transparent;padding:3px}
/* New settings expose member color controls, previously placeholder-hidden. */
#familySetup .marker-colors-pending{display:block!important}
#familySetup .color-palette.marker-colors-pending{display:flex!important;flex-wrap:wrap!important;gap:7px!important;align-items:center!important}
#familySetup .setup-icon-choice{border-top:1px solid rgba(229,188,101,.28);padding-top:15px}
#familySetup .setup-icon-info{font-size:15px;line-height:1.3;margin-bottom:10px}
.mw-auto-marker{display:flex;align-items:center;gap:10px;border:1px solid rgba(229,188,101,.24);border-radius:14px;background:rgba(9,16,23,.34);padding:9px 12px;margin:12px 0}
.mw-auto-marker .label{margin:0;font-weight:400!important;font-size:15px!important;flex:1}
.mw-auto-marker img{object-fit:contain;width:46px;height:46px;flex:none;filter:drop-shadow(0 0 3px var(--accent,#E5BC65))}
.mw-auto-marker .helper{font-size:13px!important;line-height:1.2!important;margin:0;max-width:120px}
@media(max-width:400px){.mw-auto-marker{flex-wrap:wrap}.mw-auto-marker .helper{max-width:100%;flex-basis:100%}}
/* Root cause of the 150px empty strip: the 300x150 starfield canvas was left
   in document flow. Always keep the night sky fixed behind the screens. */
#starfieldV2{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;display:block!important;z-index:0!important;pointer-events:none!important;user-select:none!important}
#activationScreen,#reveal,#familySetup,#world{position:relative;z-index:1}

/* Personal colors are chosen separately for each category; hide the obsolete global personal color card. */
body.mode-personal #familySetup #setupMembers{display:none!important}
body.mode-personal #familySetup .setup-note{display:none!important}