:root {
    color-scheme: dark;
    --bg: #0c0f12;
    --panel: #151a1f;
    --panel-2: #1d242b;
    --line: #2f3943;
    --text: #edf2f7;
    --muted: #9aa8b6;
    --accent: #ff8a1f;
    --teal: #28c7c9;
    --danger: #ff5f57;
    --ok: #42d392;
    --warn: #ffd166;
}
* { box-sizing: border-box; }
body {
    margin: 0;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: radial-gradient(circle at top left, #1d282c 0, var(--bg) 36rem);
    color: var(--text);
}
a { color: inherit; text-decoration: none; }
.shell { min-height: 100vh; display: grid; grid-template-columns: 15rem 1fr; }
.shell-auth { display: flex; align-items: center; justify-content: center; }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 1.25rem; background: #0a0d10; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 1.5rem; }
.brand { display: flex; align-items: center; gap: .75rem; font-weight: 800; }
.brand img { width: 3rem; height: 3rem; border-radius: 8px; object-fit: cover; }
.sidebar nav, .sidebar-section { display: grid; gap: .35rem; }
.sidebar-nav { gap: 1.25rem; }
.sidebar-label {
    margin: .35rem .75rem .2rem;
    color: #6f7d8b;
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.sidebar a:not(.brand), .logout { display: flex; gap: .65rem; align-items: center; color: var(--muted); padding: .75rem; border-radius: 8px; }
.sidebar a:hover { background: var(--panel); color: var(--text); }
.logout { margin-top: auto; }
.content { padding: 2rem; max-width: 1500px; width: 100%; }
.content:has(.dashboard-page),
.content:has(.calendar-page),
.content:has(.stuff-form-page),
.content:has(.stuffs-page-map),
.content:has(.map-admin-panel) { max-width: none; }
.content-auth { min-height: 100vh; max-width: none; width: 100%; display: flex; align-items: center; justify-content: center; padding: 2rem; }
.page-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.25rem; }
h1, h2, p { margin-top: 0; }
h1 { font-size: clamp(2rem, 4vw, 3.8rem); margin-bottom: .25rem; }
h2 { font-size: 1.1rem; }
.eyebrow, .muted, small { color: var(--muted); }
.eyebrow { text-transform: uppercase; font-size: .75rem; letter-spacing: .08em; margin-bottom: .25rem; }
.actions, .panel-head, .availability-actions { display: flex; gap: .65rem; align-items: center; flex-wrap: wrap; }
.btn, button { border: 1px solid var(--line); background: var(--panel-2); color: var(--text); padding: .72rem .9rem; border-radius: 8px; cursor: pointer; display: inline-flex; gap: .45rem; align-items: center; font: inherit; }
.btn.primary, button.primary { border-color: #db6f11; background: var(--accent); color: #171009; font-weight: 800; }
.btn.danger, button.danger { border-color: color-mix(in srgb, var(--danger) 55%, var(--line)); color: #ffb0aa; }
.panel, .auth-panel, .metrics article, .lineup-card, .session-card { background: color-mix(in srgb, var(--panel) 92%, transparent); border: 1px solid var(--line); border-radius: 8px; }
.panel, .auth-panel { padding: 1.25rem; }
.narrow { max-width: 34rem; width: 100%; }
.auth-panel { width: min(100%, 30rem); margin: 0 auto; padding: 2rem; text-align: center; }
.auth-logo { width: 9rem; height: 9rem; object-fit: contain; border-radius: 14px; margin: 0 auto 1.35rem; display: block; }
.auth-panel h1 { text-align: center; font-size: 3.25rem; line-height: 1; margin-bottom: 1.5rem; }
.auth-panel .form-stack { text-align: left; }
.auth-panel .btn, .auth-panel button { width: 100%; justify-content: center; font-weight: 800; }
.metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .85rem; margin-bottom: 1rem; }
.metrics article { padding: 1rem; }
.metrics strong { display: block; font-size: 2rem; }
.grid.two { display: grid; grid-template-columns: 1.1fr .9fr; gap: 1rem; }
.lineup-list { display: grid; gap: .55rem; }
.lineup-row, .session-row { display: flex; align-items: center; gap: .75rem; padding: .7rem; border-radius: 8px; background: #10151a; }
.lineup-row span, .session-row span { display: grid; }
.utility-dot { width: 2.25rem; height: 2.25rem; border-radius: 8px; display: grid; place-items: center; background: #27313a; flex: 0 0 auto; }
.utility-dot img { width: 1.55rem; height: 1.55rem; object-fit: contain; filter: drop-shadow(0 .15rem .25rem #0008); }
.utility-dot.smoke { color: #b7c3cf; }
.utility-dot.flash { color: #ffe08a; }
.utility-dot.molotov { color: #ff8a1f; }
.utility-dot.he { color: #83d9ff; }
.filters { display: grid; grid-template-columns: 2fr repeat(3, 1fr) auto; gap: .65rem; margin-bottom: 1rem; }
input, select, textarea { width: 100%; background: #0f1418; border: 1px solid var(--line); border-radius: 8px; color: var(--text); padding: .75rem; font: inherit; }
textarea { min-height: 8rem; }
label, .form-field { display: grid; gap: .35rem; }
.form-field ul, label ul, .form-stack > ul { margin: .2rem 0 0; padding: 0; list-style: none; color: #ffb0aa; font-size: .9rem; }
.password-field { position: relative; display: block; width: 100%; }
.password-field input { padding-right: 3.25rem !important; }
.auth-panel .password-field .password-toggle,
.password-field .password-toggle {
    position: absolute;
    right: .45rem;
    left: auto;
    top: 50%;
    transform: translateY(-50%);
    width: 2.25rem;
    min-width: 2.25rem;
    max-width: 2.25rem;
    height: 2.25rem;
    min-height: 2.25rem;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--muted);
    display: grid;
    place-items: center;
    justify-content: center;
    font: inherit;
    line-height: 1;
    z-index: 2;
}
.password-field .password-toggle:hover, .password-field .password-toggle:focus-visible { color: var(--text); background: #ffffff0d; outline: 1px solid #596673; }
.password-field .password-toggle svg { width: 1.15rem; height: 1.15rem; }
.input-icon-field { position: relative; display: block; width: 100%; }
.input-icon-field input { padding-right: 3.25rem !important; }
.input-icon-field .input-icon {
    position: absolute;
    top: 50%;
    right: .95rem;
    transform: translateY(-50%);
    color: var(--muted);
    display: grid;
    place-items: center;
    pointer-events: none;
    z-index: 2;
}
.input-icon-field .input-icon svg { width: 1.15rem; height: 1.15rem; }
.password-criteria { list-style: none; margin: .1rem 0 .25rem; padding: 0; display: grid; gap: .35rem; color: var(--muted); font-size: .92rem; }
.password-criteria li { display: flex; align-items: center; gap: .45rem; }
.password-criteria li.is-valid { color: var(--ok); }
.password-rule-icon {
    width: 1rem;
    height: 1rem;
    border: 1.5px solid currentColor;
    border-radius: 50%;
    display: grid;
    place-items: center;
    flex: 0 0 1rem;
}
.password-rule-icon svg { width: .72rem; height: .72rem; stroke-width: 3; }
.form-stack, .form-grid { display: grid; gap: .85rem; }
.form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-grid > div:nth-last-child(-n+3), .form-grid button { grid-column: 1 / -1; }
.check { display: flex; align-items: center; gap: .5rem; }
.check input { width: auto; }
.map-admin-panel {
    max-width: none;
    width: 100%;
    min-height: calc(100vh - 4rem);
}
.map-admin-panel .form-stack { align-content: start; }
.map-admin-panel .form-stack > .btn.primary {
    width: min(100%, 24rem);
    justify-content: center;
}
.map-admin-grid {
    display: grid;
    grid-template-columns: minmax(18rem, 24rem) minmax(0, 1fr);
    gap: 1.2rem;
    align-items: stretch;
}
.map-admin-fields { display: grid; gap: .85rem; align-content: start; }
.map-point-fields {
    display: grid;
    gap: .65rem;
    padding: .85rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #10151a;
}
.map-point-fields h2 { margin: 0; }
.map-point-coordinate-grid {
    display: grid;
    grid-template-columns: auto repeat(2, minmax(0, 1fr));
    gap: .45rem;
    align-items: center;
}
.map-point-coordinate-grid strong { color: var(--muted); }
.map-point-coordinate-grid input { padding: .55rem; }
.map-point-editor {
    min-width: 0;
    display: grid;
    grid-template-rows: auto minmax(34rem, 1fr);
    gap: .75rem;
    align-self: stretch;
}
.map-point-radar {
    position: relative;
    width: 100%;
    min-height: 42rem;
    height: calc(100vh - 15rem);
    border: 1px solid var(--line);
    border-radius: 8px;
    background:
        radial-gradient(circle at center, #26313a 0, #12171c 68%);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    overflow: hidden;
}
.map-point-handle {
    position: absolute;
    left: var(--x);
    top: var(--y);
    transform: translate(-50%, -50%);
    min-width: 0;
    width: 2.8rem;
    height: 2.8rem;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    display: grid;
    place-items: center;
    cursor: grab;
    touch-action: none;
    z-index: 2;
    filter: drop-shadow(0 .35rem .55rem #000b);
}
.map-point-handle:active { cursor: grabbing; }
.map-point-handle:hover,
.map-point-handle:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
    background: #0007;
}
.map-point-handle img {
    width: 2.55rem;
    height: 2.55rem;
    object-fit: contain;
    pointer-events: none;
}
.map-point-handle span {
    position: absolute;
    left: 50%;
    bottom: calc(100% + .45rem);
    transform: translateX(-50%);
    width: max-content;
    padding: .35rem .5rem;
    border-radius: 8px;
    background: #000c;
    color: var(--text);
    display: none;
    font-size: .78rem;
    font-weight: 850;
    pointer-events: none;
}
.map-point-handle:hover span,
.map-point-handle:focus-visible span { display: block; }
.app-page, .stuffs-page { display: grid; gap: 1.25rem; }
.app-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    min-height: 6rem;
}
.app-hero .actions { justify-content: flex-end; }
.app-logo {
    margin: 0;
    font-size: clamp(2.35rem, 5vw, 4.6rem);
    line-height: .9;
    font-weight: 950;
    font-style: italic;
    text-transform: uppercase;
    letter-spacing: 0;
    text-shadow: 0 .2rem 0 #0009;
}
.app-logo span { color: var(--text); }
.app-logo strong { color: var(--accent); }
.hero-copy {
    max-width: 43rem;
    margin: .65rem 0 0;
    color: var(--muted);
}
.stuffs-hero {
    min-height: 5.25rem;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1rem;
}
.stuffs-hero .actions { justify-content: flex-end; }
.stuffs-search-icon {
    width: 2.6rem;
    height: 2.6rem;
    display: grid;
    place-items: center;
    color: var(--text);
    border-radius: 8px;
}
.stuffs-search-icon:hover { background: #ffffff10; }
.stuffs-logo {
    font-size: clamp(2.35rem, 5vw, 4.6rem);
    line-height: .9;
    font-weight: 950;
    font-style: italic;
    text-transform: uppercase;
    letter-spacing: 0;
    text-shadow: 0 .2rem 0 #0009;
}
.stuffs-logo span { color: var(--text); }
.stuffs-logo strong { color: var(--accent); }
.stuff-toolbar {
    display: grid;
    grid-template-columns: minmax(14rem, 1fr) minmax(10rem, .32fr) minmax(9rem, .25fr) auto auto;
    gap: .65rem;
    align-items: center;
}
.toolbar-search { position: relative; display: block; }
.toolbar-search input { padding-left: 2.6rem; }
.toolbar-search svg {
    position: absolute;
    top: 50%;
    left: .85rem;
    transform: translateY(-50%);
    color: var(--muted);
    pointer-events: none;
}
.map-detail-layout {
    display: grid;
    grid-template-columns: minmax(19rem, 22rem) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}
.map-detail-sidebar {
    position: sticky;
    top: 1.25rem;
    display: grid;
    gap: 1rem;
    align-self: start;
}
.map-detail-title {
    display: grid;
    gap: .9rem;
}
.map-detail-heading {
    display: flex;
    align-items: center;
    gap: .9rem;
}
.map-detail-heading img {
    width: 5.75rem;
    height: 5.75rem;
    object-fit: contain;
    filter: drop-shadow(0 .45rem .7rem #0009);
}
.map-detail-heading h1 {
    font-size: 1.45rem;
    margin: 0;
    line-height: 1;
    font-style: italic;
}
.map-filter-card {
    display: grid;
    gap: .55rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--panel) 92%, transparent);
}
.map-filter-card h2 {
    margin: .35rem 0 .25rem;
    font-size: 1rem;
}
.nade-filter {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: .65rem;
    padding: .62rem;
    border-radius: 8px;
    color: var(--text);
}
.nade-filter:hover,
.nade-filter.active {
    background: #ffffff18;
}
.nade-filter small {
    color: var(--text);
    font-weight: 900;
}
.utility-dot.all { color: var(--accent); }
.side-switcher {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .35rem;
    padding: .25rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #0f1418;
}
.side-switcher a {
    min-height: 2.65rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    border-radius: 6px;
    color: var(--muted);
    font-weight: 850;
}
.side-switcher img {
    width: 1.2rem;
    height: 1.2rem;
    object-fit: contain;
    filter: drop-shadow(0 .12rem .22rem #0008);
}
.side-switcher a:hover,
.side-switcher a.active {
    background: #ffffff1a;
    color: var(--text);
}
.map-submit { justify-content: center; margin-top: .55rem; }
.map-quick-switcher {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .45rem;
}
.map-quick-switcher a {
    min-width: 0;
    min-height: 3rem;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .45rem;
    padding: .45rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #0f1418;
    color: var(--muted);
    font-weight: 850;
}
.map-quick-switcher a:hover,
.map-quick-switcher a.active {
    border-color: color-mix(in srgb, var(--accent) 62%, var(--line));
    background: #ffffff18;
    color: var(--text);
}
.map-quick-switcher img {
    width: 1.8rem;
    height: 1.8rem;
    object-fit: contain;
    filter: drop-shadow(0 .2rem .35rem #0009);
}
.map-quick-switcher span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.map-quick-switcher small {
    min-width: 1.55rem;
    height: 1.55rem;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: #ffffff12;
    color: var(--text);
    font-size: .75rem;
    font-weight: 950;
}
.radar-area {
    min-width: 0;
    display: grid;
    gap: 1rem;
}
.stuffs-page-map .radar-area {
    min-height: calc(100vh - 4rem);
}
.radar-top-actions {
    position: absolute;
    top: 1rem;
    right: 1rem;
    display: flex;
    gap: .45rem;
    z-index: 5;
}
.radar-bottom-actions {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    display: grid;
    gap: .55rem;
    justify-items: end;
    z-index: 20;
    pointer-events: auto;
}
.radar-level-switcher,
.map-point-level-switcher {
    position: absolute;
    right: 1rem;
    top: 4.35rem;
    z-index: 6;
    display: grid;
    overflow: hidden;
    border-radius: 8px;
    background: #3339;
    box-shadow: 0 .45rem 1rem #0007;
}
.radar-level-switcher button,
.map-point-level-switcher button {
    width: 2.25rem;
    height: 2.25rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--text);
    font-weight: 950;
    cursor: pointer;
}
.radar-level-switcher button:hover,
.radar-level-switcher button:focus-visible,
.map-point-level-switcher button:hover,
.map-point-level-switcher button:focus-visible {
    background: #ffffff18;
}
.radar-level-switcher button.active,
.map-point-level-switcher button.active {
    background: #ffffff2a;
}
.icon-btn {
    width: 2.45rem;
    min-width: 2.45rem;
    height: 2.45rem;
    min-height: 2.45rem;
    padding: 0;
    display: inline-grid;
    place-items: center;
    justify-content: center;
    align-items: center;
    gap: 0;
    border-radius: 8px;
    color: var(--text);
    background: #0006;
    line-height: 1;
}
.icon-btn svg { width: 1.15rem; height: 1.15rem; display: block; }
.icon-btn:hover { background: #ffffff18; }
.icon-btn.active {
    border-color: #db6f11;
    background: var(--accent);
    color: #171009;
}
.icon-btn:disabled {
    opacity: .38;
    cursor: not-allowed;
}
.icon-btn:disabled:hover { background: #0006; }
.radar-toggle {
    width: auto;
    min-height: 2.45rem;
    padding: .65rem .9rem;
    display: flex;
    align-items: center;
    gap: .45rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--text);
    background: #0009;
    font-size: .86rem;
    font-weight: 850;
    white-space: nowrap;
    cursor: pointer;
    pointer-events: auto;
}
.radar-toggle:hover { background: #ffffff18; }
.radar-toggle.active { border-color: #db6f11; }
.radar-map[data-radar-stuffs-hidden="true"] .radar-marker,
.radar-map[data-radar-stuffs-hidden="true"] .radar-start-marker,
.radar-map[data-radar-stuffs-hidden="true"] .radar-lineup-layer {
    visibility: hidden;
}
.radar-map {
    position: relative;
    height: calc(100vh - 4rem);
    min-height: 42rem;
    background: #0c0f12;
    overflow: hidden;
}
.radar-map[data-radar-tool="pan"] {
    cursor: grab;
    touch-action: none;
    user-select: none;
}
.radar-map[data-radar-tool="temporary-draw"],
.radar-map[data-radar-tool="draw"] {
    cursor: crosshair;
    touch-action: none;
    user-select: none;
}
.radar-map.is-panning { cursor: grabbing; }
.radar-canvas {
    position: absolute;
    inset: 0;
    transform: translate3d(var(--radar-pan-x, 0px), var(--radar-pan-y, 0px), 0) scale(var(--radar-zoom, 1));
    transform-origin: center;
    transition: transform .18s ease;
    background:
        radial-gradient(circle at center, #26313a 0, #12171c 68%);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.radar-callouts-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: fill;
    pointer-events: none;
    z-index: 1;
    opacity: .86;
}
.radar-callouts-layer[hidden] { display: none !important; }
.radar-map.is-interacting .radar-canvas { transition: none; }
.radar-drawing-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 3;
    overflow: visible;
}
.radar-drawing-line {
    fill: none;
    stroke: var(--accent);
    stroke-width: 5;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
    filter: drop-shadow(0 .2rem .35rem #000d);
}
.radar-drawing-line.is-temporary { stroke: var(--teal); }
.radar-empty {
    position: absolute;
    left: 1rem;
    top: 1rem;
    z-index: 6;
    margin: 0;
    padding: .75rem 1rem;
    border-radius: 8px;
    background: #0009;
    color: var(--muted);
}
.radar-landmark {
    position: absolute;
    left: var(--x);
    top: var(--y);
    transform: translate(-50%, -50%);
    width: 2.8rem;
    height: 2.8rem;
    display: grid;
    place-items: center;
    z-index: 1;
    filter: drop-shadow(0 .35rem .55rem #000b);
}
.radar-landmark[hidden],
.map-point-handle[hidden],
.lineup-current-point[hidden] {
    display: none !important;
}
.radar-landmark img {
    width: 2.55rem;
    height: 2.55rem;
    object-fit: contain;
}
.radar-landmark span {
    position: absolute;
    left: 50%;
    bottom: calc(100% + .45rem);
    transform: translateX(-50%);
    display: none;
    width: max-content;
    padding: .4rem .55rem;
    border-radius: 8px;
    background: #000a;
    color: var(--text);
    font-size: .78rem;
    font-weight: 850;
}
.radar-landmark:hover,
.radar-landmark:focus-visible { z-index: 3; }
.radar-landmark:hover span,
.radar-landmark:focus-visible span { display: block; }
.radar-lineup-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
    overflow: visible;
}
.radar-lineup-layer .radar-lineup-trajectory {
    fill: none;
    stroke: #ffbd00;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-dasharray: 10 8;
    filter: drop-shadow(0 .25rem .35rem #000c);
}
.radar-marker {
    position: absolute;
    left: var(--x);
    top: var(--y);
    transform: translate(-50%, -50%);
    width: 3rem;
    height: 3rem;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #130f07;
    font-weight: 950;
    line-height: 1;
    text-decoration: none;
    z-index: 2;
}
.radar-marker.active {
    z-index: 5;
}
.radar-marker > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 .35rem .55rem #000b);
    pointer-events: none;
    transition: filter .16s ease, transform .16s ease;
}
.radar-marker > span {
    position: relative;
    z-index: 1;
    color: #120d05;
    font-size: 1rem;
    font-weight: 1000;
    text-shadow: 0 1px 0 #ffffffb8, 0 0 .4rem #ffffff80;
}
.radar-marker.molotov > span,
.radar-marker.he > span {
    color: #180709;
}
.radar-marker.active > img {
    transform: scale(1.1);
    filter: drop-shadow(0 .35rem .55rem #000c) drop-shadow(0 0 .45rem #fff);
}
.radar-start-marker {
    position: absolute;
    transform: translate(-50%, -50%);
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    border: 2px solid #ffd363;
    border-radius: 50%;
    background: #ffbd00;
    color: #130f07;
    font-size: .86rem;
    font-weight: 1000;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 .4rem .9rem #000a, 0 0 0 .2rem #0005;
    z-index: 6;
}
.radar-start-marker:hover,
.radar-start-marker:focus-visible {
    transform: translate(-50%, -50%) scale(1.08);
    outline: 0;
    z-index: 12;
}
.radar-start-marker.no-video {
    background: #39444e;
    border-color: #7f91a3;
    color: var(--text);
}
.radar-video-preview {
    position: absolute;
    left: 50%;
    bottom: calc(100% + .75rem);
    transform: translateX(-50%);
    width: min(28rem, 74vw);
    display: none;
    padding: .45rem;
    border-radius: 8px;
    background: #05080b;
    color: var(--text);
    box-shadow: 0 1rem 2rem #000d;
    pointer-events: auto;
}
.radar-video-preview::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    border: .45rem solid transparent;
    border-top-color: #05080b;
}
.radar-video-preview-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .2rem .25rem .5rem;
}
.radar-video-preview strong {
    display: block;
    color: var(--text);
    font-size: .78rem;
    font-weight: 950;
    text-align: left;
}
.radar-video-edit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.75rem;
    padding: .25rem .55rem;
    border-radius: 6px;
    background: var(--accent);
    color: #150c03;
    font-size: .78rem;
    font-weight: 950;
    white-space: nowrap;
}
.radar-video-edit:hover,
.radar-video-edit:focus-visible {
    background: #ff9a2d;
}
.radar-video-delete-form {
    display: inline-flex;
    margin: 0;
}
.radar-video-delete {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .3rem;
    min-height: 1.75rem;
    padding: .25rem .55rem;
    border: 0;
    border-radius: 6px;
    background: #8f2f35;
    color: var(--text);
    font: inherit;
    font-size: .78rem;
    font-weight: 950;
    white-space: nowrap;
    cursor: pointer;
}
.radar-video-delete:hover,
.radar-video-delete:focus-visible {
    background: #b43e46;
}
.radar-video-delete svg {
    width: .9rem;
    height: .9rem;
}
.radar-video-preview iframe {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
    border-radius: 6px;
    background: #111820;
    pointer-events: none;
}
.radar-start-marker:hover .radar-video-preview,
.radar-start-marker:focus-visible .radar-video-preview {
    display: block;
}
.radar-marker small {
    position: absolute;
    left: 50%;
    bottom: calc(100% + .55rem);
    transform: translateX(-50%);
    width: max-content;
    max-width: 15rem;
    display: none;
    padding: .55rem .65rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #111a;
    color: var(--text);
    text-align: left;
    font-size: .8rem;
    line-height: 1.35;
    box-shadow: 0 .75rem 1.5rem #0009;
}
.radar-marker:hover,
.radar-marker:focus-visible { z-index: 4; }
.radar-marker:hover > img,
.radar-marker:focus-visible > img { transform: scale(1.08); }
.radar-marker:hover small,
.radar-marker:focus-visible small { display: block; }
.stuff-map-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}
.stuff-map-card {
    position: relative;
    min-height: 21rem;
    aspect-ratio: 9 / 10;
    border: 1px solid #30343a;
    border-radius: 8px;
    overflow: hidden;
    isolation: isolate;
    background: #151a1f;
    box-shadow: 0 .7rem 1.6rem #0008;
    transform: translateZ(0);
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.stuff-map-card:hover {
    transform: translateY(-.18rem);
    border-color: color-mix(in srgb, var(--accent) 70%, white);
    box-shadow: 0 1rem 2rem #000a;
}
.map-card-art {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        radial-gradient(circle at 30% 28%, #fff3 0 2rem, transparent 2.1rem),
        linear-gradient(135deg, #38434b, #14191f);
    background-size: cover;
    background-position: center;
    transform: scale(1.02);
    transition: transform .2s ease, filter .2s ease;
    z-index: -2;
}
.stuff-map-card:hover .map-card-art { transform: scale(1.06); filter: saturate(1.12) brightness(1.08); }
.map-card-sheen {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, #0007, #0000 40%, #0006),
        repeating-linear-gradient(135deg, #ffffff0b 0 .1rem, transparent .1rem 1.8rem);
    z-index: -1;
}
.map-card-emblem,
.selected-map-emblem {
    position: absolute;
    left: 50%;
    top: 37%;
    transform: translate(-50%, -50%);
    width: 6.25rem;
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    border: .22rem solid #edf2f7;
    border-radius: 50%;
    background: #111b;
    color: var(--accent);
    font-size: 3.2rem;
    font-weight: 950;
    text-shadow: 0 .15rem 0 #000;
    box-shadow: 0 .5rem 1.5rem #0009;
}
.map-card-emblem img,
.selected-map-emblem img {
    width: 88%;
    height: 88%;
    object-fit: contain;
    filter: drop-shadow(0 .35rem .5rem #0009);
}
.map-card-emblem.has-map-icon,
.selected-map-emblem.has-map-icon {
    width: 8.1rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.selected-map-emblem.has-map-icon { width: 6.25rem; }
.map-card-emblem.has-map-icon img,
.selected-map-emblem.has-map-icon img {
    width: 100%;
    height: 100%;
}
.map-card-content {
    position: absolute;
    left: 1.45rem;
    right: 1.45rem;
    bottom: 1.05rem;
    display: grid;
    gap: .25rem;
}
.map-card-content strong {
    font-size: 2rem;
    line-height: .95;
    font-weight: 950;
    font-style: italic;
    text-shadow: 0 .16rem 0 #000;
}
.map-card-content small {
    color: var(--text);
    font-weight: 850;
    text-shadow: 0 .12rem 0 #000;
}
.map-card-mirage .map-card-art {
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        radial-gradient(circle at 78% 22%, #78b9ff66 0 6rem, transparent 6.2rem),
        linear-gradient(90deg, #c39a62 0 28%, transparent 28% 33%, #aa7e4c 33% 60%, #d5b782 60%);
}
.map-card-dust2 .map-card-art,
.map-card-dust-2 .map-card-art {
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        radial-gradient(circle at 72% 18%, #7bc8ff55 0 6rem, transparent 6.2rem),
        linear-gradient(135deg, #c6a571, #82613a 45%, #d9c091);
}
.map-card-nuke .map-card-art {
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        repeating-linear-gradient(90deg, #ffd02955 0 .55rem, transparent .55rem 2.5rem),
        linear-gradient(135deg, #2076a8, #47b8d7 52%, #273b56);
}
.map-card-inferno .map-card-art {
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        radial-gradient(circle at 72% 38%, #e1432b80 0 4.4rem, transparent 4.5rem),
        linear-gradient(135deg, #a45d44, #d0b08a 45%, #55616f);
}
.map-card-overpass .map-card-art {
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        radial-gradient(circle at 25% 80%, #88e45455 0 5rem, transparent 5.1rem),
        linear-gradient(135deg, #5c6872, #323b42 45%, #738470);
}
.map-card-ancient .map-card-art {
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        radial-gradient(circle at 38% 48%, #d5c36e55 0 5rem, transparent 5.1rem),
        linear-gradient(135deg, #31534a, #677a65 48%, #243532);
}
.map-card-anubis .map-card-art {
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        radial-gradient(circle at 68% 35%, #f2b97055 0 5rem, transparent 5.1rem),
        linear-gradient(135deg, #6d4937, #bd8f65 48%, #253544);
}
.map-card-cache .map-card-art {
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        radial-gradient(circle at 70% 32%, #b8e06566 0 4rem, transparent 4.1rem),
        linear-gradient(135deg, #66715e, #2d3c47 50%, #a35d45);
}
.map-card-train .map-card-art {
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        repeating-linear-gradient(0deg, #ffffff10 0 .25rem, transparent .25rem 2rem),
        linear-gradient(135deg, #4c5964, #293138 45%, #8c5746);
}
.map-card-vertigo .map-card-art {
    background:
        linear-gradient(180deg, #0000 8%, #0008 58%, #000e 100%),
        repeating-linear-gradient(90deg, #f6c02766 0 .5rem, transparent .5rem 3rem),
        linear-gradient(135deg, #6e8795, #2c3842 45%, #d2a13d);
}
.selected-map {
    position: relative;
    min-height: 13rem;
    display: flex;
    align-items: end;
    gap: 1.25rem;
    padding: 1.25rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow: hidden;
    isolation: isolate;
    background: var(--panel);
}
.selected-map .map-card-art { transform: none; }
.selected-map-emblem {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    width: 5rem;
    flex: 0 0 auto;
}
.selected-map h1 { margin: 0; }
.selected-map span:not(.map-card-art):not(.selected-map-emblem) { font-weight: 850; }
.lineup-grid-selected { margin-top: 0; }
.lineup-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr)); gap: 1rem; }
.lineup-card { overflow: hidden; }
.map-board { position: relative; aspect-ratio: 16 / 10; min-height: 14rem; background: linear-gradient(135deg, #28323a, #11171c); overflow: hidden; }
.map-board:before { content: ""; position: absolute; inset: 1rem; border: 2px solid #596673; transform: rotate(-8deg); opacity: .38; }
.map-name { position: absolute; left: 1rem; top: 1rem; z-index: 2; font-weight: 900; text-transform: uppercase; color: #ffffffcc; }
.lane { position: absolute; background: #ffffff18; border: 1px solid #ffffff20; }
.lane-a { width: 72%; height: 18%; left: 12%; top: 24%; transform: rotate(-12deg); }
.lane-b { width: 62%; height: 16%; left: 24%; top: 58%; transform: rotate(14deg); }
.site { position: absolute; width: 3.2rem; height: 3.2rem; display: grid; place-items: center; border: 2px solid var(--accent); border-radius: 50%; font-weight: 900; }
.site-a { right: 17%; top: 19%; }
.site-b { left: 16%; bottom: 19%; }
.point { position: absolute; left: var(--sx); top: var(--sy); transform: translate(-50%, -50%); width: 2.25rem; height: 2.25rem; display: grid; place-items: center; border-radius: 50%; background: var(--teal); color: #051315; z-index: 4; }
.point.end { left: var(--ex); top: var(--ey); background: var(--accent); }
.trajectory { position: absolute; left: var(--sx); top: var(--sy); right: calc(100% - var(--ex)); bottom: calc(100% - var(--ey)); border-top: 3px dashed var(--accent); transform-origin: left top; opacity: 0; transition: opacity .16s ease; z-index: 3; }
.lineup-card:hover .trajectory { opacity: 1; }
.lineup-body { padding: 1rem; }
.card-title { display: flex; gap: .75rem; align-items: flex-start; }
.tags { display: flex; flex-wrap: wrap; gap: .4rem; }
.tags span, .pill, .availability-roster span { border: 1px solid var(--line); border-radius: 999px; padding: .35rem .55rem; color: var(--muted); }
.dashboard-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .85rem;
}
.metric-tile,
.ops-card,
.calendar-session-card {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--panel) 92%, transparent);
}
.metric-tile {
    min-height: 8.6rem;
    display: grid;
    align-content: start;
    gap: .35rem;
    padding: 1rem;
}
.metric-tile svg {
    width: 1.35rem;
    height: 1.35rem;
    color: var(--accent);
}
.metric-tile strong {
    font-size: 2.5rem;
    line-height: 1;
}
.metric-tile span { font-weight: 850; }
.metric-tile small { margin-top: auto; }
.dashboard-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(20rem, .75fr);
    gap: 1rem;
}
.ops-card {
    min-width: 0;
    padding: 1rem;
}
.wide-card { grid-column: span 1; }
.session-focus {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .9rem;
    align-items: center;
    padding: .85rem;
    border-radius: 8px;
    background: #10151a;
}
.session-focus time,
.date-badge {
    width: 4.25rem;
    min-height: 4.25rem;
    display: grid;
    place-items: center;
    padding: .45rem;
    border: 1px solid color-mix(in srgb, var(--accent) 55%, var(--line));
    border-radius: 8px;
    background: #0007;
    text-align: center;
}
.session-focus time strong,
.date-badge strong {
    font-size: 1.55rem;
    line-height: 1;
}
.session-focus time span,
.date-badge span {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 850;
    text-transform: uppercase;
}
.session-focus h3,
.calendar-session-head h2 {
    margin: 0 0 .25rem;
    font-size: 1.25rem;
}
.session-focus p,
.calendar-session-head p,
.calendar-session-head .eyebrow { margin-bottom: 0; }
.readiness-block,
.session-readiness {
    display: grid;
    gap: .55rem;
    margin-top: .9rem;
}
.readiness-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    color: var(--muted);
    font-weight: 850;
}
.readiness-head strong { color: var(--text); }
.readiness-bar,
.mini-readiness {
    height: .55rem;
    display: block;
    overflow: hidden;
    border-radius: 999px;
    background: #0008;
}
.readiness-bar span,
.mini-readiness span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--teal), var(--accent));
}
.availability-stats {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}
.availability-stats span,
.calendar-team-list span,
.member-chip {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: .4rem .6rem;
    color: var(--muted);
}
.availability-stats strong { color: var(--text); }
.availability-stats .available,
.status-button.available.active,
.status-pill-button.available.active,
.member-availability.available { border-color: color-mix(in srgb, var(--ok) 60%, var(--line)); background: color-mix(in srgb, var(--ok) 22%, transparent); color: var(--text); }
.availability-stats .maybe,
.status-button.maybe.active,
.status-pill-button.maybe.active,
.member-availability.maybe { border-color: color-mix(in srgb, var(--warn) 60%, var(--line)); background: color-mix(in srgb, var(--warn) 22%, transparent); color: var(--text); }
.availability-stats .unavailable,
.status-button.unavailable.active,
.status-pill-button.unavailable.active,
.member-availability.unavailable { border-color: color-mix(in srgb, var(--danger) 60%, var(--line)); background: color-mix(in srgb, var(--danger) 22%, transparent); color: var(--text); }
.member-grid {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
.member-chip strong,
.calendar-team-list strong,
.member-availability strong {
    width: 1.85rem;
    height: 1.85rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #22303a;
    color: var(--text);
}
.session-stack,
.my-availability-list {
    display: grid;
    gap: .65rem;
}
.session-preview,
.my-availability-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(5rem, .24fr) auto;
    align-items: center;
    gap: .75rem;
    padding: .75rem;
    border-radius: 8px;
    background: #10151a;
}
.session-preview:hover { background: #ffffff12; }
.session-preview span:not(.mini-readiness),
.my-availability-row > span { display: grid; gap: .1rem; }
.session-preview time {
    min-width: 4.6rem;
    color: var(--text);
    font-weight: 850;
}
.session-preview em {
    color: var(--muted);
    font-style: normal;
    font-weight: 850;
}
.lineup-list.dense { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.map-strip {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .85rem;
}
.mini-map-card {
    position: relative;
    min-height: 10rem;
    display: grid;
    align-content: end;
    justify-items: start;
    gap: .2rem;
    overflow: hidden;
    isolation: isolate;
    padding: .85rem;
    border: 1px solid #30343a;
    border-radius: 8px;
    background: var(--panel);
}
.mini-map-card .map-card-art {
    position: absolute;
    inset: 0;
    z-index: -2;
    background-size: cover;
    background-position: center;
    filter: brightness(.8);
}
.mini-map-card:after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(180deg, #0001, #000d);
}
.mini-map-card img {
    position: absolute;
    top: .65rem;
    left: .65rem;
    width: 3.25rem;
    height: 3.25rem;
    object-fit: contain;
    filter: drop-shadow(0 .3rem .45rem #0009);
}
.mini-map-card strong {
    font-size: 1.25rem;
    font-style: italic;
    font-weight: 950;
    text-shadow: 0 .12rem 0 #000;
}
.mini-map-card small {
    color: var(--text);
    font-weight: 850;
}
.calendar-overview {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(18rem, .75fr);
    gap: 1rem;
}
.availability-calendar-card {
    position: relative;
    min-height: calc(100vh - 12rem);
    padding: .85rem;
}
.availability-calendar {
    --fc-page-bg-color: transparent;
    --fc-neutral-bg-color: #10151a;
    --fc-border-color: var(--line);
    --fc-button-bg-color: var(--panel-2);
    --fc-button-border-color: var(--line);
    --fc-button-hover-bg-color: #ffffff18;
    --fc-button-hover-border-color: #596673;
    --fc-button-active-bg-color: var(--accent);
    --fc-button-active-border-color: #db6f11;
    --fc-today-bg-color: color-mix(in srgb, var(--accent) 12%, transparent);
    --fc-event-bg-color: color-mix(in srgb, var(--ok) 72%, #0f1418);
    --fc-event-border-color: color-mix(in srgb, var(--ok) 78%, var(--line));
    --fc-event-text-color: #07110d;
    color: var(--text);
}
.availability-calendar .fc {
    font-family: inherit;
}
.availability-calendar .fc-toolbar {
    gap: .75rem;
    margin-bottom: .9rem;
}
.availability-calendar .fc-toolbar-title {
    color: var(--text);
    font-size: clamp(1.35rem, 2vw, 2rem);
    font-weight: 950;
    font-style: italic;
    text-transform: capitalize;
}
.availability-calendar .fc-button {
    min-height: 2.5rem;
    border-radius: 8px;
    box-shadow: none !important;
    font-weight: 850;
}
.availability-calendar .fc-button-primary:not(:disabled).fc-button-active,
.availability-calendar .fc-button-primary:not(:disabled):active {
    color: #171009;
}
.availability-calendar .fc-col-header-cell-cushion,
.availability-calendar .fc-timegrid-slot-label-cushion,
.availability-calendar .fc-daygrid-day-number {
    color: var(--muted);
}
.availability-calendar .fc-scrollgrid,
.availability-calendar .fc-theme-standard td,
.availability-calendar .fc-theme-standard th {
    border-color: var(--line);
}
.availability-calendar .fc-timegrid-slot {
    height: 2.45rem;
}
.availability-calendar .fc-event {
    border-radius: 8px;
    padding: .2rem .35rem;
    cursor: pointer;
    box-shadow: 0 .35rem .9rem #0006;
}
.availability-calendar .availability-event-specific {
    --fc-event-bg-color: color-mix(in srgb, var(--accent) 82%, #12171c);
    --fc-event-border-color: color-mix(in srgb, var(--accent) 86%, var(--line));
    --fc-event-text-color: #120c05;
}
.availability-calendar .fc-event-title {
    font-weight: 900;
}
.availability-calendar .fc-event-time {
    font-weight: 800;
}
.availability-calendar .fc-highlight {
    background: color-mix(in srgb, var(--accent) 28%, transparent);
}
.calendar-loading,
.calendar-fallback {
    position: absolute;
    inset: .85rem;
    display: grid;
    place-items: center;
    padding: 1rem;
    border-radius: 8px;
    color: var(--muted);
    text-align: center;
    background: color-mix(in srgb, var(--panel) 85%, transparent);
}
.calendar-loading[hidden],
.calendar-fallback[hidden] {
    display: none;
}
.calendar-fallback {
    gap: .3rem;
}
.calendar-fallback strong {
    color: var(--text);
    font-size: 1.15rem;
}
.calendar-fallback span {
    color: var(--muted);
}
.slot-modal[hidden] { display: none; }
.slot-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: #0009;
    backdrop-filter: blur(8px);
}
.slot-modal-card {
    width: min(100%, 42rem);
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--panel) 98%, transparent);
    box-shadow: 0 1.5rem 4rem #000b;
}
.slot-modal-card header,
.slot-modal-card footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}
.slot-modal-card h2 { margin: 0; }
.slot-modal-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(7rem, 1fr));
    gap: .75rem;
}
.slot-days-field,
.slot-scope-field {
    grid-column: 1 / -1;
    display: grid;
    gap: .45rem;
}
.slot-days-field > span,
.slot-scope-field > span {
    color: var(--text);
    font-weight: 850;
}
.slot-day-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .45rem;
}
.slot-day-choice,
.slot-scope-switch label {
    position: relative;
    min-width: 0;
}
.slot-day-choice input,
.slot-scope-switch input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.slot-day-choice span,
.slot-scope-switch span {
    min-height: 2.55rem;
    display: grid;
    place-items: center;
    padding: .45rem .55rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--muted);
    background: #0c1115;
    font-weight: 900;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, color .16s ease;
}
.slot-day-choice:hover span,
.slot-scope-switch label:hover span {
    border-color: #536170;
    color: var(--text);
}
.slot-day-choice:has(input:checked) span,
.slot-scope-switch label:has(input:checked) span {
    border-color: color-mix(in srgb, var(--accent) 72%, var(--line));
    color: #170f05;
    background: var(--accent);
}
.slot-scope-switch {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
}
.slot-note-field { grid-column: 1 / -1; }
.slot-modal-card footer {
    justify-content: flex-end;
}
.schedule-overview {
    grid-template-columns: minmax(0, 1.35fr) minmax(20rem, .65fr);
}
.availability-create-form {
    display: grid;
    grid-template-columns: minmax(9rem, .7fr) minmax(8rem, .45fr) minmax(8rem, .45fr) minmax(12rem, 1fr) auto;
    gap: .75rem;
    align-items: end;
}
.availability-create-form .btn {
    min-height: 2.95rem;
    justify-content: center;
}
.today-slot-list,
.my-slot-list,
.team-schedule-grid {
    display: grid;
    gap: .75rem;
}
.today-slot {
    display: grid;
    gap: .15rem;
    padding: .75rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #10151a;
}
.today-slot strong { color: var(--text); }
.my-schedule-card {
    display: grid;
    gap: 1rem;
}
.slot-edit-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .65rem;
    align-items: end;
    padding: .75rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #10151a;
}
.slot-edit-row > form:last-child {
    display: flex;
    align-items: end;
}
.slot-edit-row > form:last-child .btn {
    width: 2.95rem;
    min-width: 2.95rem;
    height: 2.95rem;
    justify-content: center;
    padding: 0;
}
.slot-edit-form {
    display: grid;
    grid-template-columns: minmax(9rem, .75fr) minmax(7rem, .4fr) minmax(7rem, .4fr) minmax(12rem, 1fr) auto;
    gap: .65rem;
    align-items: end;
}
.week-summary-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .75rem;
}
.week-summary-mini {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .45rem;
}
.week-summary-mini span {
    display: grid;
    gap: .15rem;
    padding: .65rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #10151a;
}
.week-summary-mini strong {
    color: var(--text);
}
.week-summary-card {
    min-height: 6.5rem;
    display: grid;
    align-content: center;
    gap: .15rem;
    padding: .85rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--panel) 92%, transparent);
}
.week-summary-card strong {
    color: var(--text);
    font-size: 1rem;
}
.week-summary-card span {
    color: var(--accent);
    font-weight: 900;
}
.team-schedule-grid {
    grid-template-columns: repeat(auto-fit, minmax(24rem, 1fr));
}
.member-schedule-card {
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--panel) 92%, transparent);
}
.member-schedule-card.mine {
    border-color: color-mix(in srgb, var(--accent) 65%, var(--line));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent);
}
.member-schedule-card > header {
    display: flex;
    align-items: center;
    gap: .75rem;
}
.member-schedule-card > header > strong {
    width: 2.7rem;
    height: 2.7rem;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #22303a;
    color: var(--text);
}
.member-schedule-card h2,
.member-day h3 {
    margin: 0;
}
.member-week {
    display: grid;
    grid-template-columns: repeat(7, minmax(8.5rem, 1fr));
    gap: .55rem;
    overflow-x: auto;
    padding-bottom: .2rem;
}
.member-day {
    min-height: 11rem;
    display: grid;
    align-content: start;
    gap: .45rem;
    padding: .65rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #10151a;
}
.member-day h3 {
    color: var(--muted);
    font-size: .85rem;
    text-transform: uppercase;
}
.schedule-slot {
    display: grid;
    gap: .15rem;
    padding: .55rem;
    border: 1px solid color-mix(in srgb, var(--ok) 45%, var(--line));
    border-radius: 8px;
    background: color-mix(in srgb, var(--ok) 14%, transparent);
}
.schedule-slot strong {
    color: var(--text);
    font-size: .95rem;
}
.schedule-empty {
    color: #6f7d8b;
    font-size: .85rem;
}
.empty-state.compact {
    min-height: 9rem;
}
.calendar-team-list {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
.calendar-team-list .mine {
    border-color: color-mix(in srgb, var(--accent) 70%, var(--line));
    color: var(--text);
}
.calendar-board {
    display: grid;
    gap: 1rem;
}
.calendar-session-card {
    display: grid;
    gap: 1rem;
    padding: 1rem;
}
.calendar-session-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .9rem;
    align-items: center;
}
.calendar-session-actions { display: flex; justify-content: flex-end; }
.my-session-response {
    display: grid;
    gap: .55rem;
    padding: .85rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #10151a;
}
.my-session-response h3,
.calendar-overview h2 { margin: 0; }
.availability-actions form { margin: 0; }
.availability-actions.compact { gap: .35rem; flex-wrap: nowrap; }
.status-button {
    width: 2.35rem;
    min-width: 2.35rem;
    height: 2.35rem;
    min-height: 2.35rem;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: #0f1418;
}
.status-button svg { width: 1rem; height: 1rem; }
.status-pill-button {
    min-height: 2.45rem;
    border-radius: 8px;
    font-weight: 850;
}
.team-availability-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
    gap: .55rem;
}
.member-availability {
    min-height: 4.3rem;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: .2rem .55rem;
    padding: .7rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #10151a;
}
.member-availability strong { grid-row: span 2; }
.member-availability span { font-weight: 850; }
.member-availability small { line-height: 1.2; }
.member-availability.mine {
    outline: 1px solid color-mix(in srgb, var(--accent) 60%, transparent);
    outline-offset: 2px;
}
.member-availability.missing small { color: var(--muted); }
.empty-state {
    min-height: 16rem;
    display: grid;
    place-items: center;
    text-align: center;
}
.empty-state svg {
    width: 2.4rem;
    height: 2.4rem;
    color: var(--muted);
}
.form-card {
    max-width: 48rem;
    width: 100%;
}
.stuff-form-card {
    max-width: none;
    min-height: calc(100vh - 10rem);
    align-content: start;
}
.stuff-lineup-form {
    display: grid;
    gap: 1rem;
}
.stuff-form-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    align-items: start;
}
.stuff-form-fields {
    display: grid;
    gap: .85rem;
}
.stuff-form-inline {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}
.stuff-form-meta {
    grid-template-columns: minmax(14rem, 1fr) minmax(14rem, 1fr) max-content minmax(22rem, 1.5fr);
    align-items: start;
}
.stuff-form-meta.without-floor {
    grid-template-columns: minmax(14rem, 1fr) minmax(14rem, 1fr) minmax(22rem, 1.5fr);
}
.stuff-form-meta > label,
.stuff-form-meta > .lineup-floor-selector-inline {
    min-width: 0;
}
.stuff-form-meta .lineup-floor-selector-inline {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: .35rem;
    padding: 0;
    border: 0;
    background: transparent;
}
.stuff-form-meta .lineup-floor-selector-inline > span {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: 1.35;
    text-transform: none;
}
.stuff-form-meta .lineup-floor-selector-inline .lineup-radar-level-switcher {
    width: max-content;
    min-height: 3.15rem;
    display: grid;
    grid-template-columns: repeat(2, 3.05rem);
}
.stuff-form-meta .lineup-floor-selector-inline .lineup-radar-level-switcher button {
    min-width: 0;
    min-height: 3.05rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text);
    font-size: 1rem;
    font-weight: 900;
}
.lineup-radar-landmark {
    pointer-events: none;
    z-index: 4;
}
.lineup-radar-landmark img {
    width: 2.55rem;
    height: 2.55rem;
    object-fit: contain;
}
.lineup-radar-bottom-actions {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    z-index: 8;
}
.lineup-radar-toggle {
    border: 0;
}
.stuff-form-card textarea {
    min-height: 16rem;
}
.lineup-point-editor {
    display: grid;
    gap: .75rem;
    min-width: 0;
}
.lineup-point-editor header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}
.lineup-point-editor h2 { margin: 0; }
.lineup-editor-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .45rem;
}
.lineup-floor-selector {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .85rem;
    padding: .65rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #0c1115;
}
.lineup-floor-selector > span {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
}
.lineup-floor-selector .lineup-radar-level-switcher {
    flex: 1;
    justify-content: flex-end;
}
.lineup-floor-selector .lineup-radar-level-switcher button {
    min-width: 10rem;
    padding: 0 .85rem;
}
.lineup-radar-level-switcher {
    display: inline-flex;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #0c1115;
}
.lineup-radar-level-switcher button {
    min-width: 2.45rem;
    height: 2.35rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--muted);
    font-weight: 950;
    cursor: pointer;
}
.lineup-radar-level-switcher button:hover,
.lineup-radar-level-switcher button:focus-visible {
    background: #ffffff12;
    color: var(--text);
}
.lineup-radar-level-switcher button.active {
    background: #ffffff18;
    color: var(--text);
}
.lineup-point-mode {
    display: inline-grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .4rem;
    padding: .25rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #0c1115;
}
.lineup-point-mode button {
    min-height: 2.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    padding: .45rem .65rem;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--muted);
    font-weight: 900;
    cursor: pointer;
}
.lineup-point-mode button.active {
    background: var(--accent);
    color: #170f05;
}
.lineup-point-radar {
    position: relative;
    min-height: 46rem;
    height: calc(100vh - 20rem);
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow: hidden;
    background: #080c0f;
}
.lineup-point-canvas {
    position: absolute;
    inset: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.lineup-editor-trajectory {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
}
.lineup-editor-trajectory line {
    stroke: var(--accent);
    stroke-width: 3;
    stroke-dasharray: 10 8;
    stroke-linecap: round;
    filter: drop-shadow(0 .25rem .35rem #000d);
}
.lineup-existing-point,
.lineup-current-point {
    position: absolute;
    transform: translate(-50%, -50%);
    display: grid;
    place-items: center;
    font-weight: 950;
    line-height: 1;
    cursor: pointer;
}
.lineup-existing-point {
    width: 1.9rem;
    height: 1.9rem;
    border: 0;
    background: transparent;
    color: var(--muted);
    z-index: 3;
}
.lineup-existing-end {
    width: 3rem;
    height: 3rem;
    color: #130f07;
}
.lineup-existing-end img,
.lineup-current-end img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 .35rem .55rem #000b);
    pointer-events: none;
}
.lineup-existing-end span,
.lineup-current-end span {
    position: relative;
    z-index: 1;
    color: #130f07;
    font-weight: 1000;
    text-shadow: 0 1px 0 #ffffffb8, 0 0 .35rem #ffffff80;
}
.lineup-existing-start {
    border: 2px solid #ffd363;
    border-radius: 50%;
    background: #ffbd00;
    color: #130f07;
    box-shadow: 0 .4rem .9rem #000a, 0 0 0 .2rem #0005;
}
.lineup-current-point {
    width: 2.75rem;
    height: 2.75rem;
    appearance: none;
    padding: 0;
    border: 0;
    background: transparent;
    color: #100b04;
    z-index: 4;
}
.lineup-current-start {
    width: 2rem;
    height: 2rem;
    border: 2px solid #ffd363;
    border-radius: 50%;
    background: #ffbd00;
    color: #130f07;
    box-shadow: 0 .4rem .9rem #000a, 0 0 0 .2rem #0005;
}
.lineup-current-end {
    width: 3rem;
    height: 3rem;
}
.lineup-current-end img {
    filter: drop-shadow(0 .35rem .6rem #000c) drop-shadow(0 0 .35rem #fff);
}
.lineup-point-state {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
}
.lineup-point-state span {
    padding: .6rem .7rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--muted);
    background: #0c1115;
    font-weight: 800;
}
.lineup-point-editor.is-ready .lineup-point-state span {
    border-color: color-mix(in srgb, var(--ok) 42%, var(--line));
    color: var(--text);
}
.locked-map-context {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    width: fit-content;
    max-width: 100%;
    margin-bottom: 1rem;
    padding: .65rem .8rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #10151a;
}
.locked-map-context img {
    width: 3rem;
    height: 3rem;
    object-fit: contain;
    flex: 0 0 auto;
}
.locked-map-context span {
    display: grid;
    min-width: 0;
}
.locked-map-context small {
    color: var(--muted);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
}
.locked-map-context strong {
    color: var(--text);
    font-size: 1.05rem;
}
.form-card .btn.primary {
    justify-content: center;
    font-weight: 900;
}
.table-card { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { border-bottom: 1px solid var(--line); padding: .8rem; text-align: left; }
.table-actions { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.table-actions form { margin: 0; }
.status-pill {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: .3rem .55rem;
    color: var(--muted);
    font-size: .88rem;
    font-weight: 750;
}
.status-pill.visible { border-color: color-mix(in srgb, var(--ok) 55%, var(--line)); color: var(--ok); }
.status-pill.hidden { border-color: color-mix(in srgb, var(--danger) 55%, var(--line)); color: #ffb0aa; }
.toast-container {
    position: fixed;
    top: 1.25rem;
    right: 1.25rem;
    width: min(26rem, calc(100vw - 2rem));
    display: grid;
    gap: .75rem;
    z-index: 9999;
    pointer-events: none;
}
.toast {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: start;
    gap: .75rem;
    padding: .9rem;
    border: 1px solid var(--line);
    border-left: 3px solid var(--muted);
    border-radius: 8px;
    background: color-mix(in srgb, var(--panel) 95%, transparent);
    color: var(--text);
    box-shadow: 0 1rem 2.5rem #0008;
    backdrop-filter: blur(10px);
    pointer-events: auto;
    transition: opacity .18s ease, transform .18s ease;
}
.toast.is-hiding { opacity: 0; transform: translateY(-.35rem); }
.toast p { margin: 0; line-height: 1.35; }
.toast > svg { width: 1.15rem; height: 1.15rem; margin-top: .05rem; }
.toast-success { border-left-color: var(--ok); }
.toast-success > svg { color: var(--ok); }
.toast-warning { border-left-color: var(--warn); }
.toast-warning > svg { color: var(--warn); }
.toast-danger, .toast-error { border-left-color: var(--danger); }
.toast-danger > svg, .toast-error > svg { color: var(--danger); }
.toast-info, .toast-notice { border-left-color: var(--teal); }
.toast-info > svg, .toast-notice > svg { color: var(--teal); }
.toast .toast-close {
    width: 1.8rem;
    min-width: 1.8rem;
    height: 1.8rem;
    min-height: 1.8rem;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--muted);
    display: grid;
    place-items: center;
    justify-content: center;
}
.toast .toast-close:hover, .toast .toast-close:focus-visible { background: #ffffff12; color: var(--text); outline: 1px solid #596673; }
.toast .toast-close svg { width: 1rem; height: 1rem; }
svg { width: 1.1rem; height: 1.1rem; }
@media (max-width: 900px) {
    .shell { grid-template-columns: 1fr; }
    .sidebar { position: static; height: auto; }
    .content { padding: 1rem; }
    .metrics, .grid.two, .filters, .session-card, .form-grid, .stuff-toolbar, .stuffs-hero, .app-hero, .dashboard-metrics, .dashboard-layout, .calendar-overview, .calendar-session-head, .availability-create-form, .slot-edit-form, .week-summary-grid, .week-summary-mini, .slot-modal-grid { grid-template-columns: 1fr; }
    .app-hero .actions { justify-content: flex-start; }
    .stuffs-hero { justify-items: start; }
    .stuffs-logo, .app-logo { font-size: 3rem; }
    .map-detail-layout { grid-template-columns: 1fr; }
    .map-detail-sidebar { position: static; }
    .map-admin-grid { grid-template-columns: 1fr; }
    .stuff-form-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .stuff-form-meta > label:last-child { grid-column: 1 / -1; }
    .stuff-form-layout { grid-template-columns: 1fr; }
    .radar-map { height: calc(100vh - 2rem); min-height: 32rem; }
    .stuff-map-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lineup-list.dense, .map-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .calendar-session-actions { justify-content: flex-start; }
    .availability-calendar .fc-toolbar { align-items: stretch; }
    .availability-calendar .fc-toolbar-chunk { display: flex; justify-content: center; flex-wrap: wrap; gap: .35rem; }
    .availability-calendar .fc-toolbar-title { text-align: center; }
    .slot-day-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .auth-panel { padding: 1.25rem; }
    .auth-logo { width: 7rem; height: 7rem; }
    .auth-panel h1 { font-size: 2.5rem; }
}
@media (max-width: 1100px) {
    .stuff-form-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .stuff-form-meta > label:last-child { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    .stuff-map-grid { grid-template-columns: 1fr; }
    .map-strip, .session-preview, .my-availability-row, .slot-edit-row, .team-schedule-grid { grid-template-columns: 1fr; }
    .slot-edit-row > form:last-child .btn { width: 100%; }
    .member-week { grid-template-columns: 1fr; overflow-x: visible; }
    .mini-readiness { width: 100%; }
    .availability-actions { align-items: stretch; }
    .availability-actions form { flex: 1 1 auto; }
    .status-pill-button { width: 100%; justify-content: center; }
    .side-switcher { grid-template-columns: 1fr; }
    .radar-map { height: calc(100vh - 2rem); min-height: 28rem; }
    .lineup-point-radar { min-height: 26rem; }
    .stuff-form-inline,
    .lineup-point-state,
    .lineup-point-editor header { grid-template-columns: 1fr; }
    .lineup-point-editor header { display: grid; align-items: stretch; }
    .lineup-floor-selector {
        display: grid;
        align-items: stretch;
    }
    .lineup-floor-selector .lineup-radar-level-switcher {
        display: grid;
        grid-template-columns: 1fr;
    }
    .lineup-floor-selector .lineup-radar-level-switcher button {
        width: 100%;
    }
    .radar-top-actions { top: .65rem; right: .65rem; }
    .radar-bottom-actions { right: .65rem; bottom: .65rem; left: .65rem; }
    .radar-toggle { justify-content: center; width: 100%; }
    .radar-marker { width: 2.2rem; height: 2.2rem; font-size: .9rem; }
    .slot-day-grid,
    .slot-scope-switch { grid-template-columns: 1fr; }
    .toast-container { top: .75rem; right: .75rem; left: .75rem; width: auto; }
}