/* Andreas Gundelach / CODEX — scoped to the visitor PWA; event colours come from APP_STYLES. */
.aikata-map{--marker-opacity:80%;--flag-opacity:75%;position:relative;overflow:hidden;isolation:isolate;touch-action:none;cursor:grab;outline:0;min-height:120px}
.aikata-map *{box-sizing:border-box}
.aikata-map .tiles,.aikata-map .markers{position:absolute;inset:0;pointer-events:none}
.aikata-map .tiles{z-index:1}
.aikata-map .map-image,.aikata-map .tile{position:absolute;left:0;top:0;max-width:none;user-select:none;pointer-events:none;transform-origin:0 0}
.aikata-map .tile{opacity:0;transition:opacity .15s}.aikata-map .tile.is-ready{opacity:1}
.aikata-map button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.aikata-map [hidden]{display:none!important}
.aikata-map .marker{position:absolute;left:0;top:0;display:grid;place-items:center;pointer-events:auto;padding:0;border-radius:50%;border:1px solid #ffffffb0;background:var(--marker-bg,#002856);background:color-mix(in srgb,var(--marker-bg,#002856) var(--marker-opacity),transparent);color:#fff;box-shadow:0 1px 4px #0005;font-weight:700;line-height:1;user-select:none}
.aikata-map .marker img{display:block;width:60%;height:60%;object-fit:contain;pointer-events:none}
.aikata-map .marker.is-group{border-width:1.5px;font-variant-numeric:tabular-nums}
.aikata-map .marker.is-selected{outline:3px solid #fff;box-shadow:0 0 0 5px #0009}
.aikata-map .marker.is-active{box-shadow:0 0 0 3px #ffffff80,0 2px 7px #0007}
.aikata-map .marker:focus-visible,.aikata-map .flag button:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.aikata-map .flag{position:absolute;z-index:10000;display:flex;flex-direction:column;background:var(--flag-bg,#0088cd);background:color-mix(in srgb,var(--flag-bg,#0088cd) var(--flag-opacity),transparent);border-radius:4px;box-shadow:0 2px 8px #0004;cursor:default;animation:aikata-flag-in .22s ease-out;transform-origin:0 50%;overflow:hidden}
.aikata-map .flag[data-side=left]{transform-origin:100% 50%}
.aikata-map .flag.list-above{flex-direction:column-reverse}
.aikata-map .flag.is-closing{animation:aikata-flag-out .18s forwards;pointer-events:none}
.aikata-map .flag-heading{display:flex;gap:5px;align-items:flex-start;min-height:30px;padding:7px 7px 6px 10px;overflow:auto}
.aikata-map .flag-title{font-size:12px;line-height:1.35;text-transform:uppercase;overflow-wrap:anywhere;flex:1;font-weight:600}
.aikata-map button.flag-title{background:none;border:0;color:inherit;text-align:left;padding:0}
.aikata-map .flag[data-side=right] .flag-heading{padding-left:calc(var(--flag-overlap) + 7px)}
.aikata-map .flag[data-side=left] .flag-heading{padding-right:calc(var(--flag-overlap) + 7px)}
.aikata-map .flag-close{background:none;border:0;color:inherit;padding:0;min-width:19px;font-size:20px;line-height:20px;flex:none}
.aikata-map .flag-list{overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;border-top:1px solid #ffffff45}
.aikata-map .list-above .flag-list{border-top:0;border-bottom:1px solid #ffffff45}
.aikata-map .flag-list button{display:block;width:100%;padding:9px 10px;text-align:left;white-space:normal;overflow-wrap:anywhere;background:none;border:0;border-bottom:1px solid #ffffff30;color:inherit;font-size:12px;line-height:1.4;text-transform:uppercase}
.aikata-map .flag-list button:hover,.aikata-map .flag-list button.is-selected{background:#ffffff25}
.aikata-map .map-controls{position:absolute;left:10px;top:10px;z-index:20000;display:flex;flex-direction:column;gap:1px;border-radius:4px;box-shadow:0 1px 5px #0005;overflow:hidden;cursor:default}
.aikata-map .map-controls button{display:grid;place-items:center;width:34px;height:34px;background:#fff;color:#333;border:0;font-size:24px;line-height:1}
.aikata-map .map-controls button:last-child{border-top:1px solid #ccc;font-size:23px}
.aikata-map .map-controls button:disabled{color:#aaa;cursor:default}.aikata-map .map-controls button:focus-visible{outline:2px solid #222;outline-offset:-3px}
.aikata-map .attribution{position:absolute;right:0;bottom:0;z-index:20000;background:#ffffffe8;padding:2px 5px;font-size:10px;line-height:1.4;color:#333;max-width:100%}
.aikata-map .attribution a{color:#075b8a;text-decoration:underline}
.aikata-map .map-message{position:absolute;left:8px;right:8px;bottom:22px;z-index:20001;padding:8px 10px;background:#ffffffeb;color:#333;box-shadow:0 1px 5px #0004;border-radius:4px;font-size:12px;line-height:1.4;cursor:default}
.aikata-map .map-message button{display:block;margin-top:6px;background:#eee;color:#222;border:1px solid #aaa;border-radius:3px;padding:4px 7px}
.aikata-map .announcement{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@keyframes aikata-flag-in{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes aikata-flag-out{to{opacity:0;clip-path:inset(0 100% 0 0)}}
.aikata-map .flag[data-side=left]{animation-name:aikata-flag-left-in}
.aikata-map .flag[data-side=left].is-closing{animation-name:aikata-flag-left-out}
@keyframes aikata-flag-left-in{from{opacity:0;clip-path:inset(0 0 0 100%)}to{opacity:1;clip-path:inset(0)}}
@keyframes aikata-flag-left-out{to{opacity:0;clip-path:inset(0 0 0 100%)}}
@media(prefers-reduced-motion:reduce){.aikata-map .flag,.aikata-map .tile{animation:none!important;transition:none!important}}

/* Core: content-sized flags, marker-sized type and live indicators. */
.aikata-map .flag-heading{min-height:0;padding:var(--flag-pad,4px) 7px;flex-direction:column;gap:2px}.aikata-map .flag-title{font-size:var(--flag-font,12px);line-height:var(--flag-line,14px);flex:none}.aikata-map .flag-list button{font-size:var(--flag-font,12px);line-height:var(--flag-line,14px);padding:var(--flag-pad,4px) 8px}.aikata-map .flag[data-side=right] .flag-list button:first-child{padding-left:calc(var(--flag-overlap) + 7px)}.aikata-map .flag[data-side=left] .flag-list button:first-child{padding-right:calc(var(--flag-overlap) + 7px)}.aikata-map .flag-status{display:block;font-size:.8em;line-height:1.15;font-weight:400;text-transform:none;margin-top:2px}.aikata-map .marker-alert{position:absolute;right:-8%;bottom:-5%;width:35%;height:35%;display:grid;place-items:center;border-radius:50%;background:#f2b739;color:#17212d;font-weight:800;font-size:.85em;box-shadow:0 1px 3px #0007}.aikata-map .marker[data-attendance=red]{border-bottom:3px solid #ed6c64}.aikata-map .marker[data-attendance=yellow]{border-bottom:3px solid #edc653}.aikata-map .marker[data-attendance=green]{border-bottom:3px solid #64c897}

.aikata-map .flag{font-size:var(--flag-font,12px)}
