/* A single row with one island selector; the island list can grow without widening the map. */
.topbar{position:relative;z-index:10;gap:14px;padding:0 28px;isolation:isolate}
.topbar .brand{flex:none;gap:9px;font-size:23px;letter-spacing:1.5px}
.topbar .brand-mascot{width:53px;height:58px;object-fit:contain}
.island-picker{position:relative;flex:0 1 250px;min-width:0;margin-left:12px}
.island-toggle{display:flex;align-items:center;gap:10px;width:100%;min-width:0;min-height:46px;padding:8px 12px;color:#fcf7e7;background:#ffffff0b;border:1px solid #ffffff26;border-radius:12px;text-align:left;font-weight:700}
.island-toggle:hover,.island-toggle[aria-expanded=true]{background:#ffffff17;border-color:#e6bd72a6}
.island-toggle>img{width:26px;height:26px;flex:none}
#map-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px}
.island-chevron{flex:none;margin-left:auto;font-size:20px;line-height:16px;color:#f0cf8b;transition:transform .15s}
.island-toggle[aria-expanded=true] .island-chevron{transform:rotate(180deg)}
.island-dropdown{position:absolute;left:0;top:calc(100% + 12px);width:310px;max-width:calc(100vw - 24px);padding:14px 8px 8px;border:1px solid #d1dfd2;border-radius:18px;background:#fbf8ed;color:#234741;box-shadow:0 16px 40px #082a2c4d}
.island-dropdown h2{padding:0 10px 10px;font:700 14px 'DM Sans',sans-serif;letter-spacing:.2px}
#island-menu{max-height:min(360px,calc(100dvh - 190px));overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:3px}
.island-option{display:flex;align-items:center;gap:12px;width:100%;padding:11px 10px;border-radius:11px;text-align:left;background:transparent;color:#234741;min-height:65px}
.island-option:hover,.island-option:focus-visible{background:#e8ede1}
.island-option[aria-checked=true]{background:#e3eddb}
.island-option:focus-visible{outline:2px solid #a17630;outline-offset:-2px}
.island-icon{display:grid;place-items:center;width:40px;height:40px;flex:none;font-size:25px;border-radius:50%;background:#e5ead9}
.island-copy{min-width:0;flex:1}
.island-copy strong{display:block;font-size:15px;line-height:1.3;overflow-wrap:anywhere}
.island-copy small{display:block;margin-top:4px;font-size:11px;color:#69776a}
.island-status{display:flex;align-items:center;gap:5px;flex:none;color:#497953;font-size:21px;font-weight:800}
.island-status img{height:19px;width:19px}
.island-dropdown>p{padding:10px 10px 3px;font-size:10px;line-height:1.4;color:#69776a}
.header-wallets{display:flex;align-items:center;gap:12px;flex:none;margin-left:auto;padding:8px 13px;min-height:44px;border:1px solid #ffffff24;border-radius:24px;background:#071c2029}
.topbar .wallet{display:flex;align-items:center;gap:5px;min-width:0;padding:0;font-size:15px;white-space:nowrap;font-variant-numeric:tabular-nums}
.topbar .wallet>span{flex:none;width:18px;height:18px;border-width:1px;margin-right:0;line-height:16px;font-size:12px}
.topbar .magic-wallet>span{color:#c2acfa}
.header-wallets .wallet+.wallet{border-left:1px solid #ffffff28;padding-left:12px}
.topbar .notify-button,.topbar .save-button{flex:none;min-width:42px;height:44px;margin:0;padding:8px;border:1px solid #ffffff20;border-radius:12px;background:#ffffff08}
.topbar .save-button{display:flex;align-items:center;justify-content:center;gap:7px;padding:8px 12px}
.topbar .notify-button:hover,.topbar .save-button:hover{background:#ffffff16}
.topbar .player-pill{position:relative;flex:none;width:46px;min-width:46px;height:46px;margin:0;padding:0;justify-content:center;border-radius:50%;border:1px solid #d6b77580;background:#ffffff12}
.topbar #header-pet{display:grid;place-items:center;width:40px;height:40px;overflow:hidden;border-radius:50%}
.topbar #header-pet>.pet-art{width:40px;height:40px}
.topbar .player-pill .gear{position:absolute;right:-3px;bottom:-3px;padding:2px;border-radius:50%;background:#1b383b;color:#ecd298;font-size:12px;line-height:14px}
.topbar .header-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.topbar .event-button{min-height:44px;padding:6px 10px;gap:6px;font-size:13px;border-radius:12px;box-shadow:none}
.topbar .event-button>span{font-size:23px}
body.in-level .island-picker,body.in-camp .island-picker{display:none}
@media(max-width:1100px){.topbar{gap:10px;padding:0 18px}.topbar .brand{font-size:19px;letter-spacing:1px}.topbar .brand-mascot{width:44px;height:50px}.island-picker{margin-left:3px;flex-basis:225px}.header-wallets{gap:8px;padding:8px 10px}.header-wallets .wallet+.wallet{padding-left:8px}}
@media(max-width:900px){.topbar{gap:10px;padding:0 14px}.topbar .brand>span:last-child{display:none}.island-picker{flex-basis:240px;margin-left:0}.topbar .brand-mascot{width:43px;height:48px}}
@media(max-width:620px){.topbar{gap:6px;padding:0 10px}.topbar .brand{display:none}.island-picker{flex:1;min-width:80px}.island-toggle{min-height:42px;gap:5px;padding:7px 8px}.island-toggle>img{width:22px;height:22px}#map-name{font-size:13px}.island-chevron{font-size:17px}.header-wallets{gap:6px;min-height:40px;padding:7px 8px}.topbar .wallet{gap:3px;font-size:12px}.topbar .wallet>span{font-size:14px}.header-wallets .wallet+.wallet{padding-left:6px}.topbar .notify-button,.topbar .save-button{height:40px;min-width:34px;padding:6px;font-size:16px}.topbar .save-button b{display:none}.topbar .player-pill{width:36px;min-width:36px;height:36px}.topbar #header-pet,.topbar #header-pet>.pet-art{width:32px;height:32px}.topbar .event-button{min-height:40px;font-size:11px;padding:5px 7px;gap:4px}.topbar .event-button>span{font-size:20px}.island-dropdown{top:calc(100% + 15px)}}
@media(max-width:430px){.topbar{gap:4px;padding:0 6px}.island-picker{min-width:70px}.island-toggle{padding:7px 6px}.island-toggle>img{display:none}#map-name{font-size:12px}.header-wallets{gap:4px;padding:7px 5px}.header-wallets .wallet+.wallet{padding-left:4px}.topbar .wallet{font-size:11px;gap:2px}.topbar .wallet>span{font-size:12px}.topbar .notify-button,.topbar .save-button{min-width:30px;padding:5px}.topbar .player-pill{width:32px;min-width:32px;height:32px}.topbar #header-pet,.topbar #header-pet>.pet-art{width:29px;height:29px}.topbar .event-button{padding:5px;gap:3px;font-size:10px}.topbar .event-button>span{font-size:17px}}

@media(max-width:430px){.header-wallets{flex-direction:column;gap:1px;min-width:55px;min-height:42px;padding:4px 6px;border-radius:12px}.topbar .wallet{width:100%;justify-content:space-between;line-height:14px}.header-wallets .wallet+.wallet{padding-left:0;border-left:0}.topbar .wallet>span{width:12px;height:12px;line-height:10px;font-size:9px}}