@import 'RolemasterCharacterCreation.Client.8aygufugn2.bundle.scp.css';

/* /Components/Pages/Campaign/BuildingMapView.razor.rz.scp.css */
.bld-frame[b-b7uz7sv1ch] {
    position: relative;
    background: #2a2a33;
    border: 1px solid var(--bs-border-color, #444);
    border-radius: .5rem;
    overflow: hidden;
    cursor: grab;
    touch-action: none;
}

.bld-frame.tm-panning[b-b7uz7sv1ch] { cursor: grabbing; }

.bld-map[b-b7uz7sv1ch] {
    display: block;
    width: 100%;
    height: auto;
    transform-origin: 0 0;
}

/* Floor selector tabs */
.bld-floors[b-b7uz7sv1ch] { flex-wrap: wrap; }

.town-zoom-controls[b-b7uz7sv1ch] {
    position: absolute;
    top: .5rem;
    right: .5rem;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.town-zoom-controls .btn[b-b7uz7sv1ch] {
    width: 2rem;
    height: 2rem;
    padding: 0;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

/* The uploaded building drawing — shown as-is, never intercepts pointer events. */
.bld-embed[b-b7uz7sv1ch] { pointer-events: none; }

/* Faint placement grid (GM only). */
.bld-decor[b-b7uz7sv1ch] { pointer-events: none; }

/* Legend markers — a small coloured circle on a square. Sizes are inline (cell-scaled). */
.bld-marker[b-b7uz7sv1ch] { pointer-events: none; }

/* Clickable squares (GM, Edit mode). */
.bld-cell[b-b7uz7sv1ch]       { fill: transparent; pointer-events: all; cursor: pointer; }
.bld-cell:hover[b-b7uz7sv1ch] { fill: rgba(255,255,255,0.10); }

/* Keyed-note markers (descriptions live in the side panel). */
.bld-note-marker[b-b7uz7sv1ch] { fill: #ffffff; stroke: #111; pointer-events: none; }
/* GM cue: a note the GM revealed to players (shown as a star) gets a gold ring. */
.bld-note-shown[b-b7uz7sv1ch]  { stroke: #d4a017; }
/* GM: the note dot is hoverable to reveal its keyed description. */
.bld-note-hot[b-b7uz7sv1ch]    { pointer-events: all; cursor: help; }

/* Fog of war. */
.bld-fog-player[b-b7uz7sv1ch] { fill: #c9c4b6; pointer-events: none; }              /* opaque parchment for players */
.bld-fog-gm[b-b7uz7sv1ch]     { fill: #6b7280; opacity: 0.30; pointer-events: none; } /* faint dim for the GM */

/* Fog-paint cells (GM fog mode) — class names match the shared fogPaint JS. */
.wm-fc-off[b-b7uz7sv1ch] { fill: rgba(20,30,60,0.28); stroke: rgba(255,255,255,0.22); stroke-width: 0.4; cursor: pointer; }
.wm-fc-on[b-b7uz7sv1ch]  { fill: rgba(70,170,90,0.16); stroke: rgba(40,120,50,0.45); stroke-width: 0.4; cursor: pointer; }
.wm-fc-off:hover[b-b7uz7sv1ch],
.wm-fc-on:hover[b-b7uz7sv1ch] { fill: rgba(255,235,140,0.35); }

/* Legend swatch */
.town-swatch[b-b7uz7sv1ch] {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,0.55);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.35) inset;
    vertical-align: -4px;
    margin-right: 6px;
}

/* Legend hover hint */
.bld-legend-row[b-b7uz7sv1ch] { cursor: help; border-radius: .35rem; }
.bld-legend-row:hover[b-b7uz7sv1ch] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }

.bld-tip[b-b7uz7sv1ch] {
    position: fixed;
    z-index: 2002;
    width: 280px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .6rem .7rem;
    pointer-events: none;
}

.bld-tip-head[b-b7uz7sv1ch] {
    font-weight: 700;
    margin-bottom: .35rem;
    display: flex;
    align-items: center;
    gap: .15rem;
}

.bld-tip-body[b-b7uz7sv1ch] {
    font-size: .82rem;
    line-height: 1.4;
    color: var(--bs-secondary-color, #555);
}

.bld-tip-item[b-b7uz7sv1ch] { padding-left: .9rem; position: relative; }
.bld-tip-item[b-b7uz7sv1ch]::before {
    content: "•";
    position: absolute;
    left: 0;
    opacity: .6;
}

/* ── Context menu + editor popovers (shared look with the other maps) ── */
.ctx-backdrop[b-b7uz7sv1ch] { position: fixed; inset: 0; z-index: 2000; background: transparent; }

.ctx-menu[b-b7uz7sv1ch],
.ctx-editor[b-b7uz7sv1ch] {
    position: fixed;
    z-index: 2001;
    min-width: 220px;
    max-height: 80vh;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .35rem;
}

.ctx-editor[b-b7uz7sv1ch] { width: 270px; padding: .75rem; overflow-y: auto; }

.ctx-title[b-b7uz7sv1ch] {
    font-weight: 700;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--bs-secondary-color, #888);
    padding: .25rem .5rem .4rem;
}

/* Bounded, scrollable list so the popup always fits on screen. Names expand inline. */
.ctx-scroll[b-b7uz7sv1ch] { max-height: 60vh; overflow-y: auto; }
.ctx-subitem.ctx-indent[b-b7uz7sv1ch] { padding-left: 1.7rem; }

.ctx-item[b-b7uz7sv1ch] {
    position: relative;
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-item:hover[b-b7uz7sv1ch] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }

.ctx-label[b-b7uz7sv1ch] { flex: 1 1 auto; }
.ctx-arrow[b-b7uz7sv1ch] { opacity: .55; font-size: .8rem; }
.ctx-danger[b-b7uz7sv1ch] { color: var(--bs-danger, #d9534f); }

.ctx-sep[b-b7uz7sv1ch] { height: 1px; margin: .3rem .25rem; background: var(--bs-border-color, rgba(125,125,125,0.4)); }

.ctx-subitem[b-b7uz7sv1ch] {
    padding: .3rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-subitem:hover[b-b7uz7sv1ch] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }
.ctx-muted[b-b7uz7sv1ch] { color: var(--bs-secondary-color, #888); font-style: italic; }

.ctx-gmnotes[b-b7uz7sv1ch] {
    background: rgba(220,170,40,0.10);
    border-color: rgba(220,170,40,0.55);
}
/* /Components/Pages/Campaign/CaveMapView.razor.rz.scp.css */
.cave-frame[b-l87b7yagd4] {
    position: relative;
    background: #2a2a33;
    border: 1px solid var(--bs-border-color, #444);
    border-radius: .5rem;
    overflow: hidden;
    cursor: grab;
    touch-action: none;
}

.cave-frame.tm-panning[b-l87b7yagd4] { cursor: grabbing; }

.cave-map[b-l87b7yagd4] {
    display: block;
    width: 100%;
    height: auto;
    transform-origin: 0 0;
}

.town-zoom-controls[b-l87b7yagd4] {
    position: absolute;
    top: .5rem;
    right: .5rem;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.town-zoom-controls .btn[b-l87b7yagd4] {
    width: 2rem;
    height: 2rem;
    padding: 0;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

/* The uploaded cave drawing — shown as-is, never intercepts pointer events. */
.cave-embed[b-l87b7yagd4] { pointer-events: none; }

/* Faint placement grid (GM only). */
.cave-decor[b-l87b7yagd4] { pointer-events: none; }

/* Legend markers — a small coloured circle on a square. Sizes are inline (cell-scaled). */
.cave-marker[b-l87b7yagd4] { pointer-events: none; }

/* Clickable squares (GM, Edit mode). */
.cave-cell[b-l87b7yagd4]       { fill: transparent; pointer-events: all; cursor: pointer; }
.cave-cell:hover[b-l87b7yagd4] { fill: rgba(255,255,255,0.10); }

/* Keyed-note markers (descriptions live in the side panel). */
.cave-note-marker[b-l87b7yagd4] { fill: #ffffff; stroke: #111; pointer-events: none; }
/* GM cue: a note the GM revealed to players (shown as a star) gets a gold ring. */
.cave-note-shown[b-l87b7yagd4]  { stroke: #d4a017; }
/* GM: the note dot is hoverable to reveal its keyed description. */
.cave-note-hot[b-l87b7yagd4]    { pointer-events: all; cursor: help; }

/* Fog of war. */
.cave-fog-player[b-l87b7yagd4] { fill: #c9c4b6; pointer-events: none; }              /* opaque parchment for players */
.cave-fog-gm[b-l87b7yagd4]     { fill: #6b7280; opacity: 0.30; pointer-events: none; } /* faint dim for the GM */

/* Fog-paint cells (GM fog mode) — class names match the shared fogPaint JS. */
.wm-fc-off[b-l87b7yagd4] { fill: rgba(20,30,60,0.28); stroke: rgba(255,255,255,0.22); stroke-width: 0.4; cursor: pointer; }
.wm-fc-on[b-l87b7yagd4]  { fill: rgba(70,170,90,0.16); stroke: rgba(40,120,50,0.45); stroke-width: 0.4; cursor: pointer; }
.wm-fc-off:hover[b-l87b7yagd4],
.wm-fc-on:hover[b-l87b7yagd4] { fill: rgba(255,235,140,0.35); }

/* Legend swatch */
.town-swatch[b-l87b7yagd4] {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,0.55);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.35) inset;
    vertical-align: -4px;
    margin-right: 6px;
}

/* Legend hover hint */
.cave-legend-row[b-l87b7yagd4] { cursor: help; border-radius: .35rem; }
.cave-legend-row:hover[b-l87b7yagd4] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }

.cave-tip[b-l87b7yagd4] {
    position: fixed;
    z-index: 2002;
    width: 280px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .6rem .7rem;
    pointer-events: none;
}

.cave-tip-head[b-l87b7yagd4] {
    font-weight: 700;
    margin-bottom: .35rem;
    display: flex;
    align-items: center;
    gap: .15rem;
}

.cave-tip-body[b-l87b7yagd4] {
    font-size: .82rem;
    line-height: 1.4;
    color: var(--bs-secondary-color, #555);
}

.cave-tip-item[b-l87b7yagd4] { padding-left: .9rem; position: relative; }
.cave-tip-item[b-l87b7yagd4]::before {
    content: "•";
    position: absolute;
    left: 0;
    opacity: .6;
}

/* ── Context menu + editor popovers (shared look with the other maps) ── */
.ctx-backdrop[b-l87b7yagd4] { position: fixed; inset: 0; z-index: 2000; background: transparent; }

.ctx-menu[b-l87b7yagd4],
.ctx-editor[b-l87b7yagd4] {
    position: fixed;
    z-index: 2001;
    min-width: 220px;
    max-height: 80vh;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .35rem;
}

.ctx-editor[b-l87b7yagd4] { width: 270px; padding: .75rem; overflow-y: auto; }

.ctx-title[b-l87b7yagd4] {
    font-weight: 700;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--bs-secondary-color, #888);
    padding: .25rem .5rem .4rem;
}

/* Bounded, scrollable list so the popup always fits on screen. Names expand inline. */
.ctx-scroll[b-l87b7yagd4] { max-height: 60vh; overflow-y: auto; }
.ctx-subitem.ctx-indent[b-l87b7yagd4] { padding-left: 1.7rem; }

.ctx-item[b-l87b7yagd4] {
    position: relative;
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-item:hover[b-l87b7yagd4] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }

.ctx-label[b-l87b7yagd4] { flex: 1 1 auto; }
.ctx-arrow[b-l87b7yagd4] { opacity: .55; font-size: .8rem; }
.ctx-danger[b-l87b7yagd4] { color: var(--bs-danger, #d9534f); }

.ctx-sep[b-l87b7yagd4] { height: 1px; margin: .3rem .25rem; background: var(--bs-border-color, rgba(125,125,125,0.4)); }

.ctx-subitem[b-l87b7yagd4] {
    padding: .3rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-subitem:hover[b-l87b7yagd4] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }
.ctx-muted[b-l87b7yagd4] { color: var(--bs-secondary-color, #888); font-style: italic; }

.ctx-gmnotes[b-l87b7yagd4] {
    background: rgba(220,170,40,0.10);
    border-color: rgba(220,170,40,0.55);
}
/* /Components/Pages/Campaign/DungeonMapView.razor.rz.scp.css */
.dgn-frame[b-v32t3nmvcf] {
    position: relative;
    background: #ffffff; /* paper */
    border: 1px solid var(--bs-border-color, #444);
    border-radius: .5rem;
    overflow: hidden;
    cursor: grab;
    touch-action: none;
}

.dgn-frame.tm-panning[b-v32t3nmvcf] { cursor: grabbing; }

.dgn-map[b-v32t3nmvcf] {
    display: block;
    width: 100%;
    height: auto;
    transform-origin: 0 0;
}

.town-zoom-controls[b-v32t3nmvcf] {
    position: absolute;
    top: .5rem;
    right: .5rem;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.town-zoom-controls .btn[b-v32t3nmvcf] {
    width: 2rem;
    height: 2rem;
    padding: 0;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

/* Floor rooms (display only) */
.dgn-room[b-v32t3nmvcf] { fill: #ffffff; stroke: none; pointer-events: none; }

/* Legend markers — a small coloured circle on a square (a room can hold several) */
.dgn-marker[b-v32t3nmvcf]        { stroke: #1a1a1a; stroke-width: 0.6; }
.dgn-marker-hidden[b-v32t3nmvcf] { stroke-dasharray: 1.4 1; }
/* GM cue: a legend the GM has revealed to players gets a bright ring. */
.dgn-marker-shown[b-v32t3nmvcf]  { stroke: #1f9d55; stroke-width: 1.3; }

/* Clickable squares (GM, Edit rooms mode) */
.dgn-cell[b-v32t3nmvcf]       { fill: transparent; pointer-events: all; cursor: pointer; }
.dgn-cell:hover[b-v32t3nmvcf] { fill: rgba(0,0,0,0.07); }

/* Decoration — never intercepts clicks meant for the floor. */
.dgn-decor[b-v32t3nmvcf]    { pointer-events: none; }
.dgn-water[b-v32t3nmvcf]    { fill: #a9cddd; opacity: .8; pointer-events: none; }
.dgn-wall[b-v32t3nmvcf]     { stroke: #111111; stroke-width: 3; stroke-linecap: square; pointer-events: none; }
.dgn-doorgap[b-v32t3nmvcf]  { stroke: #ffffff; stroke-width: 4.5; stroke-linecap: butt; pointer-events: none; } /* erases wall under a door */
.dgn-door[b-v32t3nmvcf]     { stroke: #111111; stroke-width: 1.4; stroke-linecap: round; pointer-events: none; } /* door leaf */
.dgn-column[b-v32t3nmvcf]   { fill: #2a2a2a; pointer-events: none; }

/* Keyed-note number markers (descriptions live in the side panel) */
.dgn-note-marker[b-v32t3nmvcf] { fill: #ffffff; stroke: #111; stroke-width: 0.8; pointer-events: none; }
/* GM cue: a note the GM has revealed to players (shown as a star) gets a gold ring. */
.dgn-note-shown[b-v32t3nmvcf]  { stroke: #d4a017; stroke-width: 1.4; }
/* GM: the note dot is hoverable to reveal its keyed description. */
.dgn-note-hot[b-v32t3nmvcf]    { pointer-events: all; cursor: help; }

/* Fog of war (light, to suit the paper map) */
.dgn-fog-player[b-v32t3nmvcf] { fill: #c9c4b6; pointer-events: none; }            /* opaque parchment for players */
.dgn-fog-gm[b-v32t3nmvcf]     { fill: #6b7280; opacity: 0.25; pointer-events: none; } /* faint dim for the GM */

/* Fog-paint cells (GM fog mode) — class names match the shared fogPaint JS. */
.wm-fc-off[b-v32t3nmvcf] { fill: rgba(20,30,60,0.20); stroke: rgba(255,255,255,0.25); stroke-width: 0.4; cursor: pointer; }
.wm-fc-on[b-v32t3nmvcf]  { fill: rgba(70,170,90,0.12); stroke: rgba(40,120,50,0.45); stroke-width: 0.4; cursor: pointer; }
.wm-fc-off:hover[b-v32t3nmvcf],
.wm-fc-on:hover[b-v32t3nmvcf] { fill: rgba(255,235,140,0.35); }

/* Legend swatch */
.town-swatch[b-v32t3nmvcf] {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,0.55);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.35) inset;
    vertical-align: -4px;
    margin-right: 6px;
}

/* Legend hover hint */
.dgn-legend-row[b-v32t3nmvcf] { cursor: help; border-radius: .35rem; outline: none; }
.dgn-legend-row:hover[b-v32t3nmvcf],
.dgn-legend-row:focus-visible[b-v32t3nmvcf] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }

.dgn-tip[b-v32t3nmvcf] {
    position: fixed;
    z-index: 2002;
    width: 280px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .6rem .7rem;
    pointer-events: none; /* never steals the hover from the legend row */
}

.dgn-tip-head[b-v32t3nmvcf] {
    font-weight: 700;
    margin-bottom: .35rem;
    display: flex;
    align-items: center;
    gap: .15rem;
}

.dgn-tip-body[b-v32t3nmvcf] {
    font-size: .82rem;
    line-height: 1.4;
    color: var(--bs-secondary-color, #555);
}

.dgn-tip-item[b-v32t3nmvcf] { padding-left: .9rem; position: relative; }
.dgn-tip-item[b-v32t3nmvcf]::before {
    content: "•";
    position: absolute;
    left: 0;
    opacity: .6;
}

/* ── Context menu + editor popovers (shared look with the other maps) ── */
.ctx-backdrop[b-v32t3nmvcf] { position: fixed; inset: 0; z-index: 2000; background: transparent; }

.ctx-menu[b-v32t3nmvcf],
.ctx-editor[b-v32t3nmvcf] {
    position: fixed;
    z-index: 2001;
    min-width: 220px;
    max-height: 80vh;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .35rem;
}

.ctx-editor[b-v32t3nmvcf] { width: 270px; padding: .75rem; overflow-y: auto; }

.ctx-title[b-v32t3nmvcf] {
    font-weight: 700;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--bs-secondary-color, #888);
    padding: .25rem .5rem .4rem;
}

/* Bounded, scrollable list so the popup always fits on screen. Names now expand inline
   (no side fly-out), so vertical clipping is fine. */
.ctx-scroll[b-v32t3nmvcf] { max-height: 60vh; overflow-y: auto; }
.ctx-subitem.ctx-indent[b-v32t3nmvcf] { padding-left: 1.7rem; }

.ctx-item[b-v32t3nmvcf] {
    position: relative;
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-item:hover[b-v32t3nmvcf] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }

.ctx-label[b-v32t3nmvcf] { flex: 1 1 auto; }
.ctx-arrow[b-v32t3nmvcf] { opacity: .55; font-size: .8rem; }
.ctx-danger[b-v32t3nmvcf] { color: var(--bs-danger, #d9534f); }

.ctx-sep[b-v32t3nmvcf] { height: 1px; margin: .3rem .25rem; background: var(--bs-border-color, rgba(125,125,125,0.4)); }

.ctx-sub[b-v32t3nmvcf] {
    display: none;
    position: absolute;
    left: 100%;
    top: 0;
    margin-left: .15rem;
    min-width: 200px;
    max-height: 320px;
    overflow-y: auto;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .25rem;
}

.ctx-item:hover > .ctx-sub[b-v32t3nmvcf] { display: block; }

.ctx-subitem[b-v32t3nmvcf] {
    padding: .3rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-subitem:hover[b-v32t3nmvcf] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }
.ctx-muted[b-v32t3nmvcf] { color: var(--bs-secondary-color, #888); font-style: italic; }

.ctx-gmnotes[b-v32t3nmvcf] {
    background: rgba(220,170,40,0.10);
    border-color: rgba(220,170,40,0.55);
}
/* /Components/Pages/Campaign/TownMap.razor.rz.scp.css */
.town-map-frame[b-9r1fxoqcyq] {
    position: relative;
    background: #3a5f7d; /* sea around the land */
    border: 1px solid var(--bs-border-color, #444);
    border-radius: .5rem;
    overflow: hidden;
    cursor: grab;
    touch-action: none; /* let the JS handle pan/zoom gestures */
}

.town-map-frame.tm-panning[b-9r1fxoqcyq] { cursor: grabbing; }

.town-map[b-9r1fxoqcyq] {
    display: block;
    width: 100%;
    height: auto;
    transform-origin: 0 0;
}

.town-zoom-controls[b-9r1fxoqcyq] {
    position: absolute;
    top: .5rem;
    right: .5rem;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.town-zoom-controls .btn[b-9r1fxoqcyq] {
    width: 2rem;
    height: 2rem;
    padding: 0;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

/* Base layers */
.town-water[b-9r1fxoqcyq]   { fill: #3a5f7d; }
.town-earth[b-9r1fxoqcyq]   { fill: #efe6d0; stroke: #c9bfa3; stroke-width: 2; }
.town-district[b-9r1fxoqcyq] { fill: rgba(0,0,0,0.02); stroke: rgba(120,100,60,0.25); stroke-width: 1.5; }
/* District/sector name labels are styled inline in TownMap.razor (DistrictLabelStyle). */
.town-road[b-9r1fxoqcyq]    { fill: none; stroke: #d8c9a8; stroke-linecap: round; stroke-linejoin: round; }
.town-plank[b-9r1fxoqcyq]   { fill: none; stroke: #b59a6a; stroke-linecap: round; }
.town-wall[b-9r1fxoqcyq]    { fill: none; stroke: #6b5d44; stroke-linejoin: round; }

/* Clickable features */
.town-square[b-9r1fxoqcyq],
.town-building[b-9r1fxoqcyq],
.town-prism[b-9r1fxoqcyq] {
    fill: #cdb892;
    stroke: #8a795d;
    stroke-width: 1.2;
    cursor: pointer;
    transition: filter .08s ease;
}

.town-square[b-9r1fxoqcyq] { fill: #e0d4b0; }
.town-prism[b-9r1fxoqcyq]  { fill: #b9a079; }

.town-building:hover[b-9r1fxoqcyq],
.town-square:hover[b-9r1fxoqcyq],
.town-prism:hover[b-9r1fxoqcyq] {
    filter: brightness(0.85);
    stroke: #1a1a1a;
    stroke-width: 2;
}

.town-marked[b-9r1fxoqcyq] {
    stroke: #2b2b2b;
    stroke-width: 1.4;
}

/* A place linked to a building map — double-click opens its floor plan. */
.town-linked[b-9r1fxoqcyq] {
    stroke: #1f6feb;
    stroke-width: 2;
    cursor: alias;
}

/* Legend / brush swatches */
.town-swatch[b-9r1fxoqcyq] {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,0.55);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.35) inset;
    vertical-align: -4px;
    margin-right: 6px;
}

/* ── Context menu + editor popovers ─────────────────────────────── */
.ctx-backdrop[b-9r1fxoqcyq] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: transparent;
}

.ctx-menu[b-9r1fxoqcyq],
.ctx-editor[b-9r1fxoqcyq] {
    position: fixed;
    z-index: 2001;
    min-width: 220px;
    max-height: 80vh;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .35rem;
}

.ctx-editor[b-9r1fxoqcyq] {
    width: 270px;
    padding: .75rem;
    overflow-y: auto;
}

.ctx-title[b-9r1fxoqcyq] {
    font-weight: 700;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--bs-secondary-color, #888);
    padding: .25rem .5rem .4rem;
}

.ctx-item[b-9r1fxoqcyq] {
    position: relative;
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-item:hover[b-9r1fxoqcyq] {
    background: var(--bs-secondary-bg, rgba(125,125,125,0.18));
}

.ctx-label[b-9r1fxoqcyq] { flex: 1 1 auto; }
.ctx-arrow[b-9r1fxoqcyq] { opacity: .55; font-size: .8rem; }

.ctx-danger[b-9r1fxoqcyq] { color: var(--bs-danger, #d9534f); }

.ctx-sep[b-9r1fxoqcyq] {
    height: 1px;
    margin: .3rem .25rem;
    background: var(--bs-border-color, rgba(125,125,125,0.4));
}

/* Fly-out submenu of place-names */
.ctx-sub[b-9r1fxoqcyq] {
    display: none;
    position: absolute;
    left: 100%;
    top: 0;
    margin-left: .15rem;
    min-width: 200px;
    max-height: 320px;
    overflow-y: auto;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .25rem;
}

.ctx-item:hover > .ctx-sub[b-9r1fxoqcyq] { display: block; }

.ctx-subitem[b-9r1fxoqcyq] {
    padding: .3rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-subitem:hover[b-9r1fxoqcyq] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }
.ctx-muted[b-9r1fxoqcyq] { color: var(--bs-secondary-color, #888); font-style: italic; }

/* GM-only notes field tint, so it's visually distinct from the public description */
.ctx-gmnotes[b-9r1fxoqcyq] {
    background: rgba(220,170,40,0.10);
    border-color: rgba(220,170,40,0.55);
}
/* /Components/Pages/Campaign/VillageMap.razor.rz.scp.css */
.town-map-frame[b-rb8s4zztb2] {
    position: relative;
    /* Cool, pale "winter survey map" wash like the reference render. */
    background: linear-gradient(160deg, #dbe3ec 0%, #eceff4 45%, #f4f6f9 100%);
    border: 1px solid var(--bs-border-color, #444);
    border-radius: .5rem;
    overflow: hidden;
    cursor: grab;
    touch-action: none; /* let the JS handle pan/zoom gestures */
}

.town-map-frame.tm-panning[b-rb8s4zztb2] { cursor: grabbing; }

.town-map[b-rb8s4zztb2] {
    display: block;
    width: 100%;
    height: auto;
    transform-origin: 0 0;
}

.town-zoom-controls[b-rb8s4zztb2] {
    position: absolute;
    top: .5rem;
    right: .5rem;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.town-zoom-controls .btn[b-rb8s4zztb2] {
    width: 2rem;
    height: 2rem;
    padding: 0;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

/* Base layers ─ cool palette */
.town-water[b-rb8s4zztb2]  { fill: #b6d2df; }            /* river */
.town-earth[b-rb8s4zztb2]  { fill: #eef2f6; stroke: #aebccb; stroke-width: 1.5; } /* land / snow */
.town-field[b-rb8s4zztb2]  { stroke: rgba(108,94,68,0.5); stroke-width: 1.4; }    /* fill is the hatch pattern */
.town-district[b-rb8s4zztb2] { fill: rgba(70,90,120,0.04); stroke: rgba(90,110,140,0.22); stroke-width: 1.5; }
/* District/sector name labels are styled inline in VillageMap.razor (DistrictLabelStyle). */
.town-road[b-rb8s4zztb2]   { fill: none; stroke: #e2e8f0; stroke-linecap: round; stroke-linejoin: round; }
.town-plank[b-rb8s4zztb2]  { fill: none; stroke: #9c7b50; stroke-linecap: round; } /* wooden bridges */
.town-wall[b-rb8s4zztb2]   { fill: none; stroke: #6b6f78; stroke-linejoin: round; }

/* A soft, lighter band hugging the riverbanks, like the layered blues in the picture. */
.town-water-bank[b-rb8s4zztb2] {
    fill: none;
    stroke: #d3e6ee;
    stroke-width: 6;
    stroke-linejoin: round;
    opacity: .8;
    pointer-events: none;
}

/* Clickable features ─ white roofs with a soft slate-blue cast shadow */
.town-square[b-rb8s4zztb2],
.town-building[b-rb8s4zztb2],
.town-prism[b-rb8s4zztb2] {
    fill: #eff3f8;
    stroke: #36475c;
    stroke-width: 1;
    cursor: pointer;
    transition: filter .08s ease;
}

.town-building[b-rb8s4zztb2],
.town-prism[b-rb8s4zztb2] {
    filter: drop-shadow(2px 3px 1.1px rgba(74,98,132,0.55));
}

.town-square[b-rb8s4zztb2] { fill: #e7e0d0; filter: none; } /* open plaza / market */
.town-prism[b-rb8s4zztb2]  { fill: #e9eef4; }               /* larger hall / temple */

.town-building:hover[b-rb8s4zztb2],
.town-square:hover[b-rb8s4zztb2],
.town-prism:hover[b-rb8s4zztb2] {
    filter: drop-shadow(2px 3px 1.1px rgba(74,98,132,0.55)) brightness(0.92);
    stroke: #1a1a1a;
    stroke-width: 1.6;
}

.town-marked[b-rb8s4zztb2] {
    stroke: #2b2b2b;
    stroke-width: 1.4;
}

/* A place linked to a building map — double-click opens its floor plan. */
.town-linked[b-rb8s4zztb2] {
    stroke: #1f6feb;
    stroke-width: 2;
    cursor: alias;
}

/* Legend / brush swatches */
.town-swatch[b-rb8s4zztb2] {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,0.55);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.35) inset;
    vertical-align: -4px;
    margin-right: 6px;
}

/* ── Context menu + editor popovers ─────────────────────────────── */
.ctx-backdrop[b-rb8s4zztb2] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: transparent;
}

.ctx-menu[b-rb8s4zztb2],
.ctx-editor[b-rb8s4zztb2] {
    position: fixed;
    z-index: 2001;
    min-width: 220px;
    max-height: 80vh;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .35rem;
}

.ctx-editor[b-rb8s4zztb2] {
    width: 270px;
    padding: .75rem;
    overflow-y: auto;
}

.ctx-title[b-rb8s4zztb2] {
    font-weight: 700;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--bs-secondary-color, #888);
    padding: .25rem .5rem .4rem;
}

.ctx-scroll[b-rb8s4zztb2] { max-height: 60vh; overflow-y: auto; }

.ctx-item[b-rb8s4zztb2] {
    position: relative;
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-item:hover[b-rb8s4zztb2] {
    background: var(--bs-secondary-bg, rgba(125,125,125,0.18));
}

.ctx-label[b-rb8s4zztb2] { flex: 1 1 auto; }
.ctx-arrow[b-rb8s4zztb2] { opacity: .55; font-size: .8rem; }

.ctx-danger[b-rb8s4zztb2] { color: var(--bs-danger, #d9534f); }

.ctx-sep[b-rb8s4zztb2] {
    height: 1px;
    margin: .3rem .25rem;
    background: var(--bs-border-color, rgba(125,125,125,0.4));
}

/* Fly-out submenu of place-names */
.ctx-sub[b-rb8s4zztb2] {
    display: none;
    position: absolute;
    left: 100%;
    top: 0;
    margin-left: .15rem;
    min-width: 200px;
    max-height: 320px;
    overflow-y: auto;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .25rem;
}

.ctx-item:hover > .ctx-sub[b-rb8s4zztb2] { display: block; }

.ctx-subitem[b-rb8s4zztb2] {
    padding: .3rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-subitem:hover[b-rb8s4zztb2] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }
.ctx-muted[b-rb8s4zztb2] { color: var(--bs-secondary-color, #888); font-style: italic; }

/* GM-only notes field tint, so it's visually distinct from the public description */
.ctx-gmnotes[b-rb8s4zztb2] {
    background: rgba(220,170,40,0.10);
    border-color: rgba(220,170,40,0.55);
}
/* /Components/Pages/Campaign/WorldMapView.razor.rz.scp.css */
.wm-frame[b-7s6g5urbb5] {
    position: relative;
    background: #cdd3dc; /* open sea, matches water hex fill */
    border: 1px solid var(--bs-border-color, #444);
    border-radius: .5rem;
    overflow: hidden;
    cursor: grab;
    touch-action: none;
}

.wm-frame.tm-panning[b-7s6g5urbb5] { cursor: grabbing; }

.wm-map[b-7s6g5urbb5] {
    display: block;
    width: 100%;
    height: auto;
    transform-origin: 0 0;
}

.wm-sea[b-7s6g5urbb5] { fill: #cdd3dc; }

.wm-hex[b-7s6g5urbb5] {
    stroke-width: 0.8;   /* same colour as fill (set inline) → blends the grid away */
    cursor: pointer;
}

/* Coastline drawn twice: a soft light "beach" halo under a thin dark shore line. */
.wm-coast-halo[b-7s6g5urbb5] {
    fill: none;
    stroke: #ebe3d2;
    stroke-width: 2.4;
    stroke-linejoin: round;
    opacity: .85;
    pointer-events: none;
}

.wm-coast[b-7s6g5urbb5] {
    fill: none;
    stroke: #4c4a45;
    stroke-width: 0.9;
    stroke-linejoin: round;
    pointer-events: none;
}

.wm-mtn[b-7s6g5urbb5]        { fill: #ddd8cb; stroke: #6c675d; stroke-width: 0.5; stroke-linejoin: round; pointer-events: none; }
.wm-mtn-shadow[b-7s6g5urbb5] { fill: #b6b0a3; pointer-events: none; }
.wm-forest[b-7s6g5urbb5]     { fill: #8a9a6e; opacity: 0.6; pointer-events: none; }
.wm-rock[b-7s6g5urbb5]       { fill: #a7a092; pointer-events: none; }

.wm-road[b-7s6g5urbb5]     { fill: none; stroke: #6f5733; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.wm-river[b-7s6g5urbb5]    { fill: none; stroke: #8aa6c2; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; opacity: .9; pointer-events: none; }
.wm-searoute[b-7s6g5urbb5] { fill: none; stroke: #7d8896; stroke-width: 1; stroke-dasharray: 2.5 2.5; opacity: .8; pointer-events: none; }

.wm-poi[b-7s6g5urbb5] { stroke: #2b2b2b; stroke-width: 1; pointer-events: none; }
/* Linked POIs get a white ring to signal they open a town map. */
.wm-poi-linked[b-7s6g5urbb5] { stroke: #ffffff; stroke-width: 2; filter: drop-shadow(0 0 1px rgba(0,0,0,0.6)); }

/* Fog of war */
.wm-fog-player[b-7s6g5urbb5] { fill: #b9c0cb; pointer-events: none; }            /* opaque cloud for players */
.wm-fog-gm[b-7s6g5urbb5]     { fill: #4b5a74; opacity: 0.4; pointer-events: none; } /* translucent for the GM */

.wm-fc-off[b-7s6g5urbb5] { fill: rgba(20,30,60,0.18); stroke: rgba(255,255,255,0.25); stroke-width: 0.4; cursor: pointer; }
.wm-fc-on[b-7s6g5urbb5]  { fill: rgba(70,170,90,0.10); stroke: rgba(40,120,50,0.45); stroke-width: 0.4; cursor: pointer; }
.wm-fc-off:hover[b-7s6g5urbb5],
.wm-fc-on:hover[b-7s6g5urbb5] { fill: rgba(255,235,140,0.35); }

.wm-swatch[b-7s6g5urbb5] {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,0.55);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.35) inset;
    vertical-align: -4px;
    margin-right: 6px;
}

.town-zoom-controls[b-7s6g5urbb5] {
    position: absolute;
    top: .5rem;
    right: .5rem;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.town-zoom-controls .btn[b-7s6g5urbb5] {
    width: 2rem;
    height: 2rem;
    padding: 0;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

/* ── Context menu + editor popovers (shared look with the town map) ── */
.ctx-backdrop[b-7s6g5urbb5] { position: fixed; inset: 0; z-index: 2000; background: transparent; }

.ctx-menu[b-7s6g5urbb5],
.ctx-editor[b-7s6g5urbb5] {
    position: fixed;
    z-index: 2001;
    min-width: 200px;
    max-height: 80vh;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #555);
    border-radius: .5rem;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.45);
    padding: .35rem;
}

.ctx-editor[b-7s6g5urbb5] { width: 270px; padding: .75rem; overflow-y: auto; }

.ctx-title[b-7s6g5urbb5] {
    font-weight: 700;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--bs-secondary-color, #888);
    padding: .25rem .5rem .4rem;
}

.ctx-scroll[b-7s6g5urbb5] { max-height: 60vh; overflow-y: auto; }

.ctx-item[b-7s6g5urbb5] {
    position: relative;
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .5rem;
    border-radius: .35rem;
    cursor: pointer;
    white-space: nowrap;
}

.ctx-item:hover[b-7s6g5urbb5] { background: var(--bs-secondary-bg, rgba(125,125,125,0.18)); }
.ctx-label[b-7s6g5urbb5] { flex: 1 1 auto; }
.ctx-danger[b-7s6g5urbb5] { color: var(--bs-danger, #d9534f); }
.ctx-sep[b-7s6g5urbb5] { height: 1px; margin: .3rem .25rem; background: var(--bs-border-color, rgba(125,125,125,0.4)); }

.ctx-gmnotes[b-7s6g5urbb5] {
    background: rgba(220,170,40,0.10);
    border-color: rgba(220,170,40,0.55);
}