/* One transparent frame over the live city/farm canvas, with DOM controls. */
.canvas-wrap{--minimap-width:calc(var(--mini-width,148px) + 16px);--minimap-height:calc(var(--minimap-width) * 1174 / 1339)}
#minimap-hud{position:absolute;z-index:7;top:var(--mini-top);right:var(--mini-right);width:var(--minimap-width);aspect-ratio:1339/1174;container-type:inline-size;isolation:isolate;pointer-events:auto;user-select:none;-webkit-user-select:none;touch-action:manipulation;color:#fff3db;font-variant-numeric:tabular-nums}
#minimap-anchor{position:absolute;left:4.3%;top:15.4%;width:91.4%;height:68%;visibility:hidden;pointer-events:none}
.minimap-frame{position:absolute;inset:0;background:url('assets/ui/minimap-v176.webp') center/100% 100% no-repeat;pointer-events:none}
.minimap-header{position:absolute;left:8.5%;right:7.5%;top:6.3%;height:7.8%;display:flex;align-items:center;justify-content:space-between;gap:3px;font-size:clamp(8px,5.2cqw,13px);font-weight:800;line-height:1;white-space:nowrap;text-shadow:0 1px 2px #000}
.minimap-location{display:flex;align-items:center;gap:3px;min-width:0}
.minimap-location svg{width:1em;height:1em;flex:none;color:#f4cc7b}
#minimap-title{overflow:hidden;text-overflow:ellipsis;font-size:inherit}
#minimap-hud #world-clock{position:static;flex:none;color:#fff;font:inherit;letter-spacing:0;pointer-events:none}
#minimap-hud .minimap-footer{position:absolute;left:8.5%;right:7.5%;top:85.2%;height:8%;display:flex;align-items:center;justify-content:space-between;gap:3px;font-size:clamp(8px,4.65cqw,12px);line-height:1;font-weight:750;white-space:nowrap}
#minimap-hud #sync-status{min-width:0;display:flex;align-items:center;gap:4px;overflow:hidden;text-overflow:ellipsis;color:#fff3db}
#sync-status::before{content:'';width:.65em;height:.65em;flex:none;border-radius:50%;background:#ed706c;box-shadow:0 0 4px #ed706c60}
#minimap-hud[data-connection="online"] #sync-status::before{background:#70ef49;box-shadow:0 0 5px #70ef4990}
#minimap-hud:is([data-connection="connecting"],[data-save-error="true"][data-connection="online"]) #sync-status::before{background:#f5c56b;box-shadow:0 0 4px #f5c56b70}
#minimap-hud #multiplayer-status{position:relative;display:flex;align-items:center;justify-content:center;flex:none;gap:3px;min-width:22px;min-height:22px;padding:0 2px;font:inherit;line-height:1;cursor:pointer;touch-action:manipulation;backdrop-filter:none;-webkit-backdrop-filter:none}
#minimap-hud #multiplayer-status svg{width:1em;height:1em}
#minimap-expand{position:absolute;right:7%;bottom:18.5%;width:clamp(24px,13cqw,34px);height:clamp(24px,13cqw,34px);min-height:0;padding:5px;display:grid;place-items:center;cursor:pointer;touch-action:manipulation}
#minimap-expand svg{width:100%;height:100%}
.map-collapse-icon,#minimap-hud.is-expanded .map-expand-icon{display:none}
#minimap-hud.is-expanded .map-collapse-icon{display:block}
#minimap-hud.is-expanded{top:50%;left:50%;right:auto;transform:translate(-50%,-50%);width:min(640px,calc(100% - var(--app-safe-left,0px) - var(--app-safe-right,0px) - 24px),calc((var(--visual-height,100dvh) - var(--app-safe-top,0px) - var(--app-safe-bottom,0px) - 36px) * 1339 / 1174));z-index:25}
#minimap-hud.is-expanded .minimap-header{font-size:clamp(12px,4cqw,20px)}
#minimap-hud.is-expanded .minimap-footer{font-size:clamp(11px,3.6cqw,17px)}
#minimap-hud.is-expanded #minimap-expand{width:36px;height:36px}
#minimap-hud.is-expanded #multiplayer-status{min-width:32px;min-height:28px}
.canvas-wrap #online-widget{top:calc(var(--mini-top) + var(--minimap-height) + 4px);max-height:max(72px,calc(100% - var(--mini-top) - var(--minimap-height) - 100px))}
body.minimap-expanded :is(.vitals-hud,.hud-tools,#job-guide-hud,.left-status-stack,.quickbar,.topbar,#minimap-tools,.actions,#settings-toggle,#chat-toggle,#pvp-hint,.farm-seed-hud){visibility:hidden!important}
body:not(.in-game) #minimap-hud,body.in-house #minimap-hud{display:none!important}
/* Keep the integrated buttons dark, overriding the shared gold button theme. */
@layer rp-theme{
 #minimap-hud #multiplayer-status{background:transparent!important;border:0!important;border-radius:3px!important;color:#ffe1a0!important;box-shadow:none!important}
 #minimap-hud #multiplayer-status:is(:hover,:active,[aria-expanded="true"]){color:#fff!important}
 #minimap-hud #minimap-expand{background:linear-gradient(135deg,#292a2b,#0c0e11)!important;border:1px solid #dbb777!important;border-radius:6px!important;color:#ffe1a0!important;box-shadow:0 2px 4px #0008,inset 0 1px #fff2!important}
 #minimap-hud #minimap-expand:is(:hover,:active){background:#493e29!important}
}