@import url('https://fonts.googleapis.com/css2?family=Courier+Prime&family=Tahoma:wght@400;700&display=swap');

/* src/app.css */
/* ============================================
 * MDC Shared Component Styles
 * Eliminates CSS duplication across pages.
 * Imported globally via app.css.
 * ============================================ */
/* --- Modals --- */
.modal-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.4);
    display: flex; align-items: center; justify-content: center;
    z-index: 100;
}
.modal-box {
    background: #ece9d8;
    border: 2px outset #fff;
    width: 420px;
    max-height: 80vh;
    overflow-y: auto;
}
.modal-header {
    background: linear-gradient(to right, #0055ea, #2b7bea);
    color: white;
    padding: 4px 8px;
    font-size: 12px;
    font-weight: bold;
}
.modal-body {
    padding: 12px;
    display: flex; flex-direction: column; gap: 8px;
}
.modal-footer {
    display: flex; justify-content: flex-end; gap: 6px;
    padding: 8px 12px;
    border-top: 1px solid #aca899;
}
/* --- Form fields --- */
.field-label {
    font-size: 11px; font-weight: bold;
    display: flex; flex-direction: column; gap: 2px;
}
.field-label input,
.field-label textarea,
.field-label select {
    font-size: 11px; padding: 3px 4px;
    border: 1px solid #7f9db9;
    font-family: 'Tahoma', sans-serif;
}
/* --- Badges --- */
.badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 3px;
    font-size: 10px;
    color: white;
    background: #666;
}
.badge-success { background: #27ae60; }
.badge-danger  { background: #c0392b; }
.badge-warning { background: #e67e22; }
.badge-info    { background: #2980b9; }
.badge-muted   { background: #95a5a6; }
.badge-dark    { background: #2c3e50; }
/* --- Data Tables --- */
.data-table {
    width: 100%; border-collapse: collapse; font-size: 11px;
}
.data-table th {
    text-align: left; padding: 4px 6px;
    background: #ece9d8; border: 1px solid #aca899;
    font-size: 10px;
}
.data-table td {
    padding: 4px 6px; border: 1px solid #d4d0c8;
}
.data-table td.empty {
    text-align: center; color: #999; padding: 12px;
}
/* --- Detail Tabs --- */
.detail-tabs {
    display: flex; gap: 0;
    border-bottom: 2px solid #0055ea;
    margin-top: 6px;
}
.detail-tabs button {
    padding: 4px 12px;
    border: 1px solid #aca899; border-bottom: none;
    background: #ece9d8; cursor: pointer;
    font-size: 11px; margin-bottom: -2px;
}
.detail-tabs button.active {
    background: white;
    border-bottom: 2px solid white;
    font-weight: bold;
}
/* --- Layout Helpers --- */
.tab-toolbar {
    display: flex; gap: 4px; margin-bottom: 6px; flex-wrap: wrap;
}
.header-title-row {
    display: flex; justify-content: space-between; align-items: center;
}
.action-cell {
    display: flex; gap: 3px;
}
.empty-state {
    text-align: center; padding: 20px; color: #999; font-size: 12px;
}
.empty-state.large {
    margin-top: 60px; font-size: 13px;
}
#svelte {
    height: 100%;
    width: 100%;
}
:root {
    --xp-blue: #0054E3;
    --xp-bg: #ECE9D8;        /* Bejul clasic */
    --win-gray: #d4d0c8;
    --text-color: #0b0b0b;
    --border-light: #ffffff;
    --border-shadow: #aca899;
    --border-dark: #716f64;
}
* { box-sizing: border-box; }
body {
    margin: 0; padding: 0;
    font-family: 'Tahoma', sans-serif;
    font-size: 13px; /* Font lizibil */
    background-color: transparent;
    height: 100%;
    width: 100%;
    overflow: hidden;
    display: flex;
}
::-webkit-resizer {
    background-color: #0055ea; /* Culoare vizibilă pentru colț */
    border: 1px solid #fff;
}
/* Boot Screen */
#boot-screen {
    position: absolute; top:0; left:0; width:100%; height:100%;
    background: #000; color: #ccc;
    font-family: 'Courier Prime', monospace;
    padding: 40px; z-index: 9999;
    font-size: 16px;
    border: 3px solid #0055EA;
}
/* Main Window */
.win-desktop {
    width: 100%; height: 100%;
    background-color: var(--xp-bg);
    border: 3px solid #0055EA;
    display: flex; flex-direction: column;
    overflow: hidden;
    position: relative;
}
/* Title Bar */
.win-title-bar {
    height: 32px;
    background: linear-gradient(to bottom, #0058EE 0%, #3593FF 4%, #288EFF 18%, #127dff 44%, #0369fc 100%);
    display: flex; justify-content: space-between; align-items: center;
    padding: 0 8px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.3);
}
.win-title-text {
    color: white; font-weight: bold; text-shadow: 1px 1px 1px rgba(0,0,0,0.5); font-size: 14px;
}
.win-controls { display: flex; gap: 4px; }
.win-control-btn {
    width: 22px; height: 22px; border: 1px solid #fff; border-radius: 3px;
    background: linear-gradient(#fff, #c0c0c0); color: black; font-weight:bold;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.win-control-btn.close {
    background: linear-gradient(#ff8e85, #d64738); color: white; border-color: #fff;
}
/* Menu Bar */
/* Bara principală de sus */
.win-menu-bar {
    background: #ECE9D8; /* Bejul clasic XP */
    border-bottom: 1px solid #ACA899; /* Linie fină de separare */
    padding: 2px 6px;
    display: flex; 
    gap: 2px;
    font-size: 11px;
    color: #000;
    position: relative;
    z-index: 5000;
    user-select: none; /* Previne selectarea textului */
}
/* Item din bara principală (File, View etc.) */
.win-menu-item {
    position: relative;
}
.menu-label {
    padding: 3px 7px;
    cursor: default;
    display: block;
    border: 1px solid transparent; /* Rezervăm spațiul pentru border la hover */
    border-radius: 2px;
}
/* Hover pe bara de sus - Stil XP (Box subtil) */
.menu-label:hover {
    background-color: #316AC5; /* Albastru XP */
    color: white;
    border-color: #002D96;
    box-shadow: inset 0 0 1px rgba(255,255,255,0.2);
}
/* Când meniul este deschis */
.menu-label.active {
    background-color: #FFFFFF;
    color: #000;
    border: 1px solid #ACA899;
    border-bottom: 1px solid #fff; /* Se unește vizual cu dropdown-ul */
    z-index: 6001; /* Peste dropdown */
    position: relative;
    border-radius: 2px 2px 0 0;
}
/* --- DROPDOWN CONTAINER (The XP Look) --- */
.win-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: -1px; /* Suprapunere pixel-perfect cu butonul activ */
    
    background-color: #FFF; /* XP folosește fundal alb */
    border: 1px solid #ACA899; /* Chenar gri definit */
    min-width: 200px;
    padding: 2px;
    
    /* Umbra clasică XP */
    box-shadow: 4px 4px 4px rgba(0,0,0,0.3);
    z-index: 6000;

    /* MAGIA XP: Banda gri din stânga (Gutter) */
    /* Folosim un gradient linear pentru a simula banda de iconițe */
    background-image: linear-gradient(to right, #ECE9D8 26px, #FFF 26px);
}
/* ELEMENTE DIN LISTA DROPDOWN */
.dd-item {
    padding: 3px 15px 3px 32px; /* Padding stânga mare pentru a sări peste banda gri */
    cursor: default;
    color: #000;
    display: flex;
    white-space: nowrap;
    border: 1px solid transparent; /* Border invizibil pentru layout stabil */
    line-height: 1.2;
}
/* Hover pe itemi - Albastru XP */
.dd-item:hover {
    background-color: #316AC5;
    border-color: #002D96; /* Border fin la hover */
    color: white;
}
/* Text roșu (Panic) */
.dd-item.red-text { font-weight: bold; color: #d32f2f; }
.dd-item.red-text:hover { background: #d32f2f; border-color: #b71c1c; color: #ffeb3b; }
/* Disabled */
.dd-item.disabled { color: #A1A192; text-shadow: 1px 1px 0 #FFF; }
.dd-item.disabled:hover { background: none; border-color: transparent; color: #A1A192; }
/* Separator - Trebuie să respecte banda din stânga */
.dd-separator {
    height: 1px;
    background: #ACA899;
    margin: 4px 2px 4px 28px; /* Începe după 28px (banda gri) */
}
/* Toolbar */
.win-toolbar {
    background: linear-gradient(to bottom, #f3f4f5 0%, #dcdcdc 100%);
    border-bottom: 1px solid #aca899; padding: 5px; display: flex; gap: 4px;
}
.xp-toolbar-btn {
    background: none; border: 1px solid transparent; border-radius: 3px;
    padding: 4px 12px; text-align: center; cursor: pointer; color: #000; font-size: 12px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.xp-toolbar-btn img { height: 32px; margin-bottom: 2px; }
/* Icoane Mari */
.xp-toolbar-btn:hover { border: 1px solid #aca899; background: #f0f0f0; box-shadow: inset 0 0 2px #fff; }
.xp-toolbar-btn.active { border: 1px solid #aca899; background: #dcdcdc; box-shadow: inset 1px 1px 2px #888; }
.separator { width: 1px; background: #aca899; margin: 0 4px; height: 36px; align-self: center; }
/* Address Bar */
.win-address-bar {
    padding: 6px 10px; display: flex; gap: 10px; align-items: center; border-bottom: 1px solid #aca899;
}
.address-input {
    flex: 1; border: 1px solid #7f9db9; background: #fff; padding: 3px; display: flex; align-items: center; gap: 8px; font-size: 12px;
}
.xp-btn-go {
    background: url('https://win98icons.alexmeub.com/icons/png/arrow_right-0.png') no-repeat center;
    background-size: 16px; width: 28px; height: 22px; border: 1px solid #aca899;
}
/* Workspace */
.win-workspace {
    flex: 1; background: #fff; overflow: hidden; position: relative; padding: 10px;
}
/* Fieldset */
.xp-fieldset {
    border: 1px solid #D0D0BF; border-radius: 3px; padding: 10px; margin: 0;
    background: #fcfcfc; height: 100%; display: flex; flex-direction: column;
}
.xp-fieldset legend { color: #0046D5; font-weight: bold; padding: 0 6px; font-size: 12px; }
/* Inputs */
.xp-input {
    border: 1px solid #7F9DB9; padding: 4px; font-family: 'Tahoma'; font-size: 12px; outline: none;
}
.xp-input:focus { border-color: #f1c40f; box-shadow: 0 0 2px orange; }
/* Tables */
.xp-table { width: 100%; border-collapse: collapse; font-size: 12px; background: #fff; }
.xp-table th {
    background: linear-gradient(#fff, #ece9d8); border: 1px solid #aca899;
    padding: 6px; text-align: left; font-weight: normal; color: #444; position: sticky; top: 0;
}
.xp-table td { border: 1px solid #dcdcdc; padding: 5px; }
.xp-table tr:hover { background: #FFFFCC; cursor: pointer; }
/* Status Bar */
.win-status-bar { border-top: 1px solid #aca899; background: #ece9d8; padding: 4px; display: flex; gap: 6px; font-size: 11px; }
.status-panel { border: 1px solid; border-color: #aca899 #fff #fff #aca899; padding: 3px 8px; }
.status-panel.status.green { background: #cfc; color: green; }
.status-panel.status.red { background: #fcc; color: red; }
.status-panel.action { flex: 1; }
/* Buttons General */
.xp-btn {
    border: 1px solid #003c74; background: linear-gradient(to bottom, #fff 0%, #ece9d8 100%);
    padding: 4px 12px; font-size: 12px; cursor: pointer;
}
.xp-btn:active { background: #ddd; }
.xp-btn.primary { font-weight: bold; border: 1px solid #000; }
/* Panic Mode */
@keyframes blinker { 50% { opacity: 0; } }
body.panic-mode .win-desktop { border-color: red; }
body.panic-mode .win-title-bar { background: red; }
/* --- MODAL (FIXED CENTER) --- */
#modal-overlay {
    position: fixed; /* Folosim fixed ca să fie raportat la ecran, nu la div-ul părinte */
    top: 0; 
    left: 0; 
    width: 100vw; 
    height: 100vh;
    background: rgba(0, 0, 0, 0.2); /* Fundal ușor întunecat */
    z-index: 99999; /* Să fie peste tot */
    
    /* Magia pentru centrare perfectă */
    display: flex;
    justify-content: center;
    align-items: center;
}
#modal-window {
    /* Resetăm poziționarea veche care îl arunca în dreapta */
    position: relative; 
    top: auto; 
    left: auto; 
    transform: none;
    
    /* Design */
    width: 450px; 
    background: #ECE9D8; 
    border: 3px solid #0054E3;
    box-shadow: 4px 4px 15px rgba(0,0,0,0.4);
    display: flex; 
    flex-direction: column;
}
.win-body-inner { 
    padding: 15px; 
    background: #ECE9D8; 
    display: flex; 
    flex-direction: column; 
    gap: 8px; 
}
.win-footer { 
    padding: 8px; 
    display: flex; 
    justify-content: flex-end; 
    gap: 6px; 
    border-top: 1px solid #fff; 
}
.hidden { display: none !important; }/* src/app.css */
:root {
    /* Windows XP Color Palette */
    --win-bg: #ece9d8;
    --win-blue-header: linear-gradient(180deg, #0054e3 0%, #0047c2 100%);
    --win-border-light: #fff;
    --win-border-dark: #7f9db9;
    --win-border-shadow: #aca899;
    --win-text: #000;
    --win-input-bg: #fff;
    
    /* Semantic Colors */
    --color-danger: #cc0000;
    --color-success: #008000;
    --color-warning: #ffff00;
    --color-navy: #000080;
}

body {
    font-family: 'Tahoma', sans-serif;
    font-size: 11px;
    color: var(--win-text);
    margin: 0;
    overflow: hidden; /* Prevent full page scroll inside CEF */
}

/* Global Reset for Box Sizing */
*, *::before, *::after {
    box-sizing: border-box;
}

/* Scrollbar specific MDC-ului */
::-webkit-scrollbar {
    width: 12px;
}
::-webkit-scrollbar-track {
    background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border: 1px solid #fff;
}
::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Helper Animations */
@keyframes blink {
    50% { opacity: 0; }
}
.blink-anim {
    animation: blink 1s step-end infinite;
}
    #boot-screen.svelte-d8thsd {
        position: absolute; top: 0; left: 0; width: 100%; height: 100%;
        background: #000; color: #ccc;
        font-family: 'Courier Prime', 'Courier New', monospace;
        padding: 40px; z-index: 9999; font-size: 14px;
        overflow: hidden; display: flex; flex-direction: column;
    }

    .boot-content.svelte-d8thsd { width: 100%; max-width: 800px; }

    .line.svelte-d8thsd { min-height: 18px; white-space: pre-wrap; margin: 0; line-height: 1.2; }

    .cursor-line.svelte-d8thsd { color: #fff; animation: svelte-d8thsd-blink 0.5s step-end infinite; }

    .loading-section.svelte-d8thsd { margin-top: 20px; width: 300px; }

    .bar-border.svelte-d8thsd { border: 2px solid #0f0; padding: 2px; height: 16px; width: 100%; }

    .bar-fill.svelte-d8thsd { height: 100%; background-color: #0f0; width: 0%; transition: width 0.1s linear; }

    .bar-text.svelte-d8thsd { margin-top: 5px; color: #0f0; font-size: 12px; font-weight: bold; }

    @keyframes svelte-d8thsd-blink { 50% { opacity: 0; } }

    .login-desktop.svelte-1fogsvw {
        height: 100%; width: 100%;
        background-color: #008080;
        display: flex; align-items: center; justify-content: center;
        font-family: 'Tahoma', sans-serif;
    }

    .login-window.svelte-1fogsvw {
        width: 420px;
        background: #ece9d8;
        border: 1px solid #000;
        box-shadow: 2px 2px 10px rgba(0,0,0,0.5);
        display: flex; flex-direction: column;
        user-select: none;
    }

    .win-title-bar.svelte-1fogsvw {
        background: linear-gradient(90deg, #000080, #1084d0);
        padding: 3px 4px;
        display: flex; justify-content: space-between; align-items: center;
    }
    .title-text.svelte-1fogsvw {
        color: white; font-weight: bold; font-size: 11px;
        display: flex; align-items: center; gap: 6px;
    }
    .title-text.svelte-1fogsvw img:where(.svelte-1fogsvw) { width: 14px; height: 14px; }
    .win-controls.svelte-1fogsvw { display: flex; gap: 2px; }
    .win-control-btn.svelte-1fogsvw {
        width: 16px; height: 14px;
        background: #ece9d8; border: 1px solid #fff;
        border-right-color: #444; border-bottom-color: #444;
        font-size: 9px; font-family: monospace; font-weight: bold;
        display: flex; align-items: center; justify-content: center;
    }
    .disabled.svelte-1fogsvw { color: #888; }

    .login-content.svelte-1fogsvw {
        padding: 15px; display: flex; gap: 15px;
        border-bottom: 1px solid #d8d0c8;
    }

    .banner-side.svelte-1fogsvw {
        width: 80px;
        display: flex; flex-direction: column; align-items: center;
        text-align: center; gap: 10px;
    }
    .banner-text.svelte-1fogsvw { font-size: 10px; color: #666; }

    .form-side.svelte-1fogsvw { flex: 1; display: flex; flex-direction: column; gap: 10px; }
    .instruction.svelte-1fogsvw { font-size: 11px; color: #000; margin-bottom: 5px; }

    .inp-row.svelte-1fogsvw { display: flex; align-items: center; gap: 10px; }
    .inp-row.svelte-1fogsvw label:where(.svelte-1fogsvw) { width: 70px; text-align: right; font-size: 11px; }
    .xp-input.svelte-1fogsvw {
        flex: 1; border: 1px solid #7f9db9;
        padding: 2px; font-size: 11px; outline: none;
    }
    .xp-input.svelte-1fogsvw:focus { border-color: #003c74; }

    .error-msg.svelte-1fogsvw {
        background: #ffffcc; border: 1px solid #cc0000; color: #cc0000;
        padding: 4px; font-size: 10px; display: flex; align-items: center; gap: 5px;
    }

    .login-footer.svelte-1fogsvw {
        padding: 10px; display: flex; justify-content: flex-end; gap: 6px;
        background: #ece9d8;
    }

    .xp-btn.svelte-1fogsvw {
        min-width: 75px; padding: 3px 8px; font-size: 11px;
        background: #ece9d8; border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer;
    }
    .xp-btn.svelte-1fogsvw:active {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }
    .xp-btn.svelte-1fogsvw:disabled { color: #888; cursor: default; }

    .xp-welcome-screen.svelte-15l8ss6 {
        position: fixed; top: 0; left: 0; width: 100%; height: 100%;
        background-color: #5A7EDC;
        display: flex; flex-direction: column;
        font-family: 'Tahoma', sans-serif;
        overflow: hidden; z-index: 2000;
    }

    .blue-bar-top.svelte-15l8ss6, .blue-bar-bottom.svelte-15l8ss6 {
        height: 65px; width: 100%;
        background: linear-gradient(to bottom, #003399 0%, #5A7EDC 100%);
        border-bottom: 2px solid #486AE2;
        flex-shrink: 0;
    }
    .blue-bar-bottom.svelte-15l8ss6 {
        background: linear-gradient(to top, #003399 0%, #5A7EDC 100%);
        border-top: 2px solid #486AE2; border-bottom: none;
        display: flex; align-items: center; justify-content: flex-end;
        padding-right: 30px;
    }

    .content-split.svelte-15l8ss6 {
        flex: 1; display: flex; flex-direction: row;
        align-items: stretch; width: 100%;
        position: relative; overflow: hidden;
    }

    .left-side.svelte-15l8ss6 {
        flex: 1; display: flex; flex-direction: column;
        justify-content: center; align-items: flex-end;
        padding-right: 50px; text-align: right;
    }
    .win-logo.svelte-15l8ss6 img:where(.svelte-15l8ss6) { width: 200px; height: auto; margin-bottom: 15px; }
    .instruction-text.svelte-15l8ss6 {
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', sans-serif;
        font-size: 19px; color: white;
        text-shadow: 2px 2px 5px rgba(0,0,0,0.4);
        font-weight: normal; opacity: 0.9;
    }

    .divider-line.svelte-15l8ss6 {
        width: 2px; height: 65%; align-self: center;
        background: linear-gradient(to bottom,
            transparent 0%, rgba(255,255,255,0.4) 20%,
            rgba(255,255,255,0.8) 50%, rgba(255,255,255,0.4) 80%,
            transparent 100%);
        box-shadow: 1px 0 2px rgba(0,0,0,0.2);
    }

    .right-side.svelte-15l8ss6 {
        flex: 1; display: flex; flex-direction: column;
        justify-content: center; align-items: flex-start;
        padding-left: 50px;
    }

    .user-list.svelte-15l8ss6 {
        display: flex; flex-direction: column; gap: 15px;
        max-height: 100%; overflow-y: auto; padding-right: 10px;
    }

    .user-card.svelte-15l8ss6 {
        background: transparent; border: none;
        display: flex; align-items: center; gap: 15px;
        padding: 8px 12px; border-radius: 8px;
        cursor: pointer; text-align: left;
        transition: all 0.2s ease; min-width: 280px;
    }
    .user-card.svelte-15l8ss6:hover {
        background: rgba(49, 106, 197, 0.6);
        box-shadow: inset 0 0 0 1px rgba(255,255,255,0.3);
    }

    .user-icon-frame.svelte-15l8ss6 {
        width: 48px; height: 48px;
        background-color: #fff; border: 2px solid #fff;
        border-radius: 4px; outline: 2px solid #F1B62E;
        overflow: hidden; flex-shrink: 0;
    }
    .user-icon-frame.svelte-15l8ss6 img:where(.svelte-15l8ss6) { width: 100%; height: 100%; object-fit: cover; }

    .user-info.svelte-15l8ss6 { display: flex; flex-direction: column; }
    .user-info.svelte-15l8ss6 .name:where(.svelte-15l8ss6) {
        font-family: 'Tahoma', sans-serif; font-size: 20px;
        color: #fff; font-weight: 400;
        text-shadow: 1px 1px 3px rgba(0,0,0,0.6);
    }
    .user-info.svelte-15l8ss6 .status:where(.svelte-15l8ss6) {
        font-family: 'Tahoma', sans-serif; font-size: 11px;
        color: #E0E0E0; margin-top: 2px;
    }

    .turn-off-btn.svelte-15l8ss6 {
        background: transparent; border: none;
        display: flex; align-items: center; gap: 8px;
        cursor: pointer; opacity: 0.8; transition: opacity 0.2s;
    }
    .turn-off-btn.svelte-15l8ss6:hover { opacity: 1; }
    .shutdown-icon.svelte-15l8ss6 {
        width: 28px; height: 28px; background: #E55838;
        border: 2px solid #fff; border-radius: 4px;
        display: flex; align-items: center; justify-content: center;
        box-shadow: 1px 1px 3px rgba(0,0,0,0.4);
    }
    .shutdown-icon.svelte-15l8ss6 img:where(.svelte-15l8ss6) { width: 18px; height: 18px; filter: brightness(100); }
    .turn-off-btn.svelte-15l8ss6 span:where(.svelte-15l8ss6) {
        color: white; font-family: 'Tahoma'; font-weight: bold;
        font-size: 12px; text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
    }

    .loading-user.svelte-15l8ss6, .no-chars.svelte-15l8ss6 {
        color: white; font-style: italic;
        opacity: 0.7; margin-top: 20px;
    }

    .overlay.svelte-10byryg {
        position: absolute; top: 0; left: 0; width: 100%; height: 100%;
        background: rgba(0,0,0,0.4);
        display: flex; align-items: center; justify-content: center;
        z-index: 9999;
    }

    .modal-window.svelte-10byryg {
        width: 520px; background: #ece9d8;
        border: 2px outset #fff;
        box-shadow: 4px 4px 10px rgba(0,0,0,0.5);
        display: flex; flex-direction: column;
    }

    .title-bar.svelte-10byryg {
        background: linear-gradient(90deg, #000080, #1084d0);
        color: white; padding: 4px; font-weight: bold;
        display: flex; justify-content: space-between; align-items: center;
        font-family: 'Tahoma', sans-serif; font-size: 12px;
    }

    .close-btn.svelte-10byryg {
        background: #e81123; color: white; border: 1px solid #fff;
        width: 18px; height: 16px; font-size: 10px; cursor: pointer;
        font-weight: bold; line-height: 1; display: flex; align-items: center; justify-content: center;
    }

    .body.svelte-10byryg { padding: 15px; display: flex; flex-direction: column; gap: 10px; }

    .info-text.svelte-10byryg { font-size: 11px; color: #444; margin: 0; }

    .form-row.svelte-10byryg { display: flex; align-items: flex-start; gap: 10px; }
    .form-row.svelte-10byryg label:where(.svelte-10byryg) { width: 80px; font-weight: bold; font-size: 11px; font-family: 'Tahoma', sans-serif; padding-top: 3px; }
    .field-col.svelte-10byryg { display: flex; flex-direction: column; gap: 2px; flex: 1; }
    .error-hint.svelte-10byryg { font-size: 9px; color: #cc0000; font-weight: bold; }
    .preview-invalid.svelte-10byryg { opacity: 0.5; }

    .filter-row.svelte-10byryg {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .checkbox-label.svelte-10byryg {
        display: flex;
        align-items: center;
        gap: 4px;
        font-size: 11px;
        cursor: pointer;
    }

    .checkbox-label.svelte-10byryg input:where(.svelte-10byryg) {
        cursor: pointer;
    }

    .search-container.svelte-10byryg {
        position: relative;
        width: 100%;
    }

    .xp-input.svelte-10byryg {
        width: 100%; border: 2px inset #fff; padding: 4px 6px;
        font-size: 11px; font-family: 'Tahoma', sans-serif;
        box-sizing: border-box;
    }

    .search-input.svelte-10byryg {
        width: 100%;
    }

    .dropdown.svelte-10byryg {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        max-height: 250px;
        overflow-y: auto;
        background: #fff;
        border: 2px inset #fff;
        z-index: 100;
        box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    }

    .group-header.svelte-10byryg {
        background: #000080;
        color: #fff;
        padding: 3px 6px;
        font-size: 10px;
        font-weight: bold;
        position: sticky;
        top: 0;
    }

    .dropdown-item.svelte-10byryg {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        padding: 4px 8px;
        border: none;
        background: #fff;
        cursor: pointer;
        font-family: 'Tahoma', sans-serif;
        font-size: 11px;
        text-align: left;
    }

    .dropdown-item.svelte-10byryg:hover {
        background: #000080;
        color: #fff;
    }

    .dropdown-item.selected.svelte-10byryg {
        background: #e8eaf6;
    }

    .dropdown-item.occupied.svelte-10byryg {
        background: #fff8e8;
    }

    .dropdown-item.occupied.svelte-10byryg:hover {
        background: #cc6600;
    }

    .dropdown-item.svelte-10byryg:hover .item-role:where(.svelte-10byryg),
    .dropdown-item.svelte-10byryg:hover .item-occupants:where(.svelte-10byryg) {
        color: #ccc;
    }

    .item-left.svelte-10byryg {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .item-right.svelte-10byryg {
        text-align: right;
    }

    .item-callsign.svelte-10byryg {
        font-weight: bold;
        font-family: monospace;
    }

    .item-role.svelte-10byryg {
        font-size: 10px;
        color: #666;
    }

    .item-occupants.svelte-10byryg {
        font-size: 10px;
        color: #884400;
        font-style: italic;
    }

    .occupied-badge.svelte-10byryg {
        font-size: 8px;
        font-weight: bold;
        color: #fff;
        background: #cc6600;
        padding: 1px 4px;
        border-radius: 2px;
    }

    .slot-badge.svelte-10byryg {
        font-size: 8px;
        font-weight: bold;
        color: #fff;
        background: #008800;
        padding: 1px 4px;
        border-radius: 2px;
    }

    .full-badge.svelte-10byryg {
        font-size: 8px;
        font-weight: bold;
        color: #fff;
        background: #aa0000;
        padding: 1px 4px;
        border-radius: 2px;
    }

    .dropdown-item.full-slot.svelte-10byryg {
        background: #efefef;
        color: #888;
        cursor: not-allowed;
    }
    .dropdown-item.full-slot.svelte-10byryg:hover {
        background: #efefef;
        color: #888;
    }
    .dropdown-item.svelte-10byryg:disabled {
        opacity: 0.6;
        pointer-events: none;
    }

    .no-results.svelte-10byryg {
        padding: 10px;
        text-align: center;
        color: #999;
        font-style: italic;
        font-size: 11px;
    }

    .selection-info.svelte-10byryg {
        background: #fff;
        border: 2px inset #fff;
        padding: 8px;
    }

    .selection-info.occupied-selection.svelte-10byryg {
        background: #fff8e8;
        border-color: #cc6600;
    }

    .info-row.svelte-10byryg {
        display: flex;
        gap: 8px;
        font-size: 11px;
        padding: 2px 0;
        align-items: center;
    }

    .info-label.svelte-10byryg {
        font-weight: bold;
        color: #666;
        width: 60px;
    }

    .info-value.svelte-10byryg {
        color: #000;
    }

    .callsign-value.svelte-10byryg {
        font-family: monospace;
        font-weight: bold;
        color: #000080;
    }

    .occupied-warning.svelte-10byryg {
        font-size: 9px;
        font-weight: bold;
        color: #fff;
        background: #cc6600;
        padding: 1px 6px;
        margin-left: auto;
    }

    .occupant-names.svelte-10byryg {
        color: #884400;
        font-style: italic;
    }

    .partner-note.svelte-10byryg {
        font-size: 10px;
        color: #884400;
        font-style: italic;
        margin-top: 4px;
        padding-top: 4px;
        border-top: 1px dotted #ccc;
    }

    .preview-box.svelte-10byryg {
        margin-top: 6px; padding: 8px;
        background: #000; color: #0f0;
        font-family: monospace; text-align: center;
        border: 2px inset #fff; font-size: 14px;
    }

    .preview-box.preview-occupied.svelte-10byryg {
        background: #332200;
        color: #ffcc00;
    }

    .preview-partner.svelte-10byryg {
        font-size: 10px;
        opacity: 0.8;
        margin-left: 8px;
    }

    .footer.svelte-10byryg {
        padding: 8px; display: flex; justify-content: flex-end; gap: 8px;
        border-top: 1px solid #999;
    }

    .xp-btn.svelte-10byryg {
        min-width: 70px; padding: 3px 8px; font-size: 11px;
        background: #ece9d8; border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif;
    }
    .xp-btn.svelte-10byryg:active { border-top-color: #444; border-left-color: #444; border-right-color: #fff; border-bottom-color: #fff; }
    .primary.svelte-10byryg { font-weight: bold; }

    .dash-grid.svelte-1bdj869 {
        display: grid; grid-template-columns: 1fr 1fr;
        gap: 15px; height: 100%; padding: 5px; overflow: hidden;
    }

    .col-left.svelte-1bdj869, .col-right.svelte-1bdj869 {
        display: flex; flex-direction: column; gap: 15px;
        height: 100%; overflow: hidden;
    }

    .officer-profile-panel.svelte-1bdj869 {
        background: #fff; border: 2px inset #fff;
        padding: 12px; display: flex; flex-direction: column;
        gap: 12px; box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
    }

    .profile-header.svelte-1bdj869 {
        display: flex; align-items: center; gap: 12px;
        border-bottom: 1px solid #dcdcdc; padding-bottom: 12px;
    }
    .profile-pic.svelte-1bdj869 { width: 56px; height: 56px; border: 1px solid #999; padding: 2px; background: #ece9d8; }
    .p-name.svelte-1bdj869 { font-weight: bold; font-size: 15px; color: #000; }
    .p-rank.svelte-1bdj869 { font-size: 12px; color: #666; }

    .profile-grid.svelte-1bdj869 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 20px; }
    .p-row.svelte-1bdj869 { display: flex; flex-direction: column; }
    .p-lbl.svelte-1bdj869 { font-size: 10px; color: #888; font-weight: bold; }
    .p-val.svelte-1bdj869 { font-size: 13px; color: #000; font-family: 'Tahoma'; border-bottom: 1px dotted #eee; }

    .callsign-wrapper.svelte-1bdj869 {
        display: flex; align-items: center; justify-content: space-between;
        border-bottom: 1px dotted #eee;
    }
    .p-val.callsign.svelte-1bdj869 { border-bottom: none; color: #000080; font-weight: bold; }

    .tiny-btn.svelte-1bdj869 {
        font-size: 10px; padding: 0 6px; height: 18px;
        border: 1px solid #999; background: #e0e0e0; cursor: pointer; font-family: 'Tahoma';
    }
    .tiny-btn.svelte-1bdj869:hover { background: #fff; }

    .tiny-btn.alert.svelte-1bdj869 {
        border: 2px solid red;
    }
    .xp-fieldset.svelte-1bdj869 {
        border: 1px solid #d0d0bf; border-radius: 3px; padding: 8px;
        position: relative; background: #ece9d8;
    }
    .xp-fieldset.svelte-1bdj869 legend:where(.svelte-1bdj869) {
        background-color: #ece9d8; padding: 0 4px;
        color: #003399; font-family: 'Tahoma'; font-size: 11px;
    }

    .grid-buttons.svelte-1bdj869 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 1; }

    .neutral-btn.svelte-1bdj869, .panic-btn.svelte-1bdj869 {
        display: flex; flex-direction: column; align-items: center; justify-content: center;
        padding: 10px; border: 2px outset #fff; cursor: pointer;
        font-family: 'Tahoma'; min-height: 60px;
    }
    .neutral-btn.svelte-1bdj869 { background: #e0e0e0; color: #444; }
    .panic-btn.svelte-1bdj869 { background: #d4d0c8; color: #8b0000; border-color: #999; }
    .span2.svelte-1bdj869 { grid-column: span 2; }

    .neutral-btn.svelte-1bdj869:active, .neutral-btn.active.svelte-1bdj869 { border: 2px inset #fff; background: #ccc; color: #000; font-weight: bold; }
    .panic-btn.svelte-1bdj869:active, .panic-btn.active.svelte-1bdj869 { border: 2px inset #fff; background: #ccc; color: #ff0000; font-weight: bold; }

    .code.svelte-1bdj869 { font-size: 16px; font-weight: bold; margin-bottom: 3px; }
    .panic-btn.svelte-1bdj869 .code:where(.svelte-1bdj869) { font-weight: 900; font-size: 18px; }
    .desc.svelte-1bdj869 { font-size: 12px; }

    button.svelte-1bdj869:disabled { opacity: 0.6; cursor: not-allowed; filter: grayscale(100%); pointer-events: none; }

    /* Right column */
    .col-right.svelte-1bdj869 { display: flex; flex-direction: column; gap: 8px; height: 100%; overflow: hidden; }

    .stats-bar.svelte-1bdj869 { display: flex; gap: 8px; height: 70px; flex-shrink: 0; }
    .stat-box.svelte-1bdj869 {
        flex: 1; background: #fff; border: 1px solid #999;
        display: flex; flex-direction: column; align-items: center; justify-content: center;
        padding: 4px; box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
    }
    .stat-box.svelte-1bdj869 img:where(.svelte-1bdj869) { height: 24px; opacity: 0.8; }
    .stat-box.svelte-1bdj869 .num:where(.svelte-1bdj869) { font-size: 18px; font-weight: bold; color: #333; font-family: 'Tahoma'; }
    .stat-box.svelte-1bdj869 .num.alert:where(.svelte-1bdj869) { color: #d00000; }
    .stat-box.svelte-1bdj869 .lbl:where(.svelte-1bdj869) { font-size: 9px; font-weight: bold; color: #666; text-transform: uppercase; font-family: 'Tahoma'; }

    /* Roster */
    .roster-panel.svelte-1bdj869 {
        flex: 1; display: flex; flex-direction: column;
        border: 2px inset #fff; background: #fff; overflow: hidden;
    }
    .roster-hdr.svelte-1bdj869 {
        background: #000080; color: #fff;
        padding: 3px 7px; font-size: 11px; font-weight: bold; flex-shrink: 0;
    }
    .roster-scroll.svelte-1bdj869 { flex: 1; overflow-y: auto; }
    .roster-empty.svelte-1bdj869 { padding: 16px; text-align: center; color: #aaa; font-style: italic; font-size: 11px; }

    .roster-table.svelte-1bdj869 { width: 100%; border-collapse: collapse; font-size: 11px; }
    .roster-table.svelte-1bdj869 th:where(.svelte-1bdj869) {
        background: #d4d0c8; border-bottom: 1px solid #aca899;
        border-right: 1px solid #aca899; text-align: left;
        padding: 3px 6px; font-size: 10px; position: sticky; top: 0;
    }
    .roster-table.svelte-1bdj869 td:where(.svelte-1bdj869) { border-bottom: 1px dotted #ddd; padding: 3px 6px; border-right: 1px dotted #eee; }
    .roster-table.svelte-1bdj869 tr:where(.svelte-1bdj869):hover td:where(.svelte-1bdj869) { background: #eef3ff; }

    .cs-cell.svelte-1bdj869        { font-family: monospace; font-weight: bold; color: #000080; }
    .officers-cell.svelte-1bdj869  { display: flex; flex-wrap: wrap; gap: 3px; padding: 2px 6px; }
    .officer-tag.svelte-1bdj869 {
        font-size: 10px; background: #e8eaf6; border: 1px solid #9999cc;
        padding: 0 4px; color: #000080;
    }
    .roster-table.svelte-1bdj869 tr.my-unit:where(.svelte-1bdj869) td:where(.svelte-1bdj869) { background: #fffff0; }
    .roster-table.svelte-1bdj869 tr.my-unit:where(.svelte-1bdj869) .cs-cell:where(.svelte-1bdj869) { color: #8b0000; }

    .status-dot.svelte-1bdj869 {
        font-size: 10px; font-weight: bold; padding: 1px 5px;
        border: 1px solid; display: inline-block;
    }
    .status-dot.available.svelte-1bdj869, .status-dot.clear.svelte-1bdj869 {
        color: #005500; border-color: #005500; background: #ccffcc;
    }
    .status-dot.busy.svelte-1bdj869, .status-dot.out.svelte-1bdj869 {
        color: #886600; border-color: #886600; background: #fffacc;
    }
    .status-dot.meal-break.svelte-1bdj869, .status-dot.code-7.svelte-1bdj869 {
        color: #555; border-color: #999; background: #eee;
    }
    .status-dot.off-duty.svelte-1bdj869, .status-dot.off.svelte-1bdj869 {
        color: #999; border-color: #ccc; background: #f5f5f5;
    }
    .status-dot.officer-needs-help.svelte-1bdj869, .status-dot.help.svelte-1bdj869 {
        color: #fff; border-color: #cc0000; background: #cc0000;
    }
    .status-dot.unknown.svelte-1bdj869 {
        color: #bbb; border-color: #ddd; background: #f9f9f9;
    }

    .xp-select-container.svelte-1rex4e7 {
        position: relative;
        width: 100%;
        min-width: 120px;
        font-family: 'Tahoma', sans-serif;
        font-size: 11px;
    }

    .xp-select-display.svelte-1rex4e7 {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: #fff;
        border: 2px inset #fff; /* Stilul XP input */
        padding: 2px 4px;
        height: 22px;
        cursor: pointer;
        text-align: left;
    }

    .arrow-btn.svelte-1rex4e7 {
        background: #ECE9D8;
        border: 2px outset #fff;
        width: 16px;
        height: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 8px;
        color: #000;
    }
    
    .xp-select-display.svelte-1rex4e7:active:not(.disabled) .arrow-btn:where(.svelte-1rex4e7) {
        border-style: inset;
    }
    .xp-select-display.disabled.svelte-1rex4e7 {
        background: #e8e8e8; color: #666; cursor: default;
    }

    .xp-dropdown.svelte-1rex4e7 {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #fff;
        border: 1px solid #999;
        max-height: 150px;
        overflow-y: auto;
        z-index: 1000;
        box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
    }

    .xp-option.svelte-1rex4e7 {
        padding: 4px;
        cursor: default;
        color: #000;
    }

    .xp-option.svelte-1rex4e7:hover, .xp-option.selected.svelte-1rex4e7 {
        background-color: #000080; /* Albastru clasic Windows */
        color: #fff;
    }

    .modal-overlay.svelte-5lotty {
        position: fixed; inset: 0;
        background: rgba(0, 0, 0, 0.5);
        display: flex; align-items: center; justify-content: center;
        z-index: 9999;
    }

    .xp-window.svelte-5lotty {
        width: 440px; background: #ece9d8;
        border: 2px outset #fff;
        box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.5);
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
        font-size: 11px;
    }

    .window-header.svelte-5lotty {
        background: linear-gradient(90deg, #0054E3, #2f89fc);
        color: #fff; font-weight: bold; padding: 3px 5px;
        display: flex; justify-content: space-between; align-items: center;
    }
    .close-btn.svelte-5lotty {
        background: #d4d0c8; border: 1px outset #fff;
        width: 16px; height: 16px; font-size: 10px; line-height: 12px;
        cursor: pointer; padding: 0; text-align: center;
    }
    .close-btn.svelte-5lotty:active { border-style: inset; }

    .window-body.svelte-5lotty { padding: 10px; display: flex; flex-direction: column; gap: 10px; }

    .unit-bar.svelte-5lotty {
        background: #000080; color: #fff;
        padding: 3px 8px; font-size: 10px; font-weight: bold;
        display: flex; align-items: center; gap: 8px;
    }
    .unit-tag.svelte-5lotty {
        font-family: monospace; background: #fff; color: #000080;
        padding: 1px 5px; font-weight: bold;
    }

    .field-group.svelte-5lotty {
        border: 2px inset #fff; background: #fff;
        padding: 8px; display: flex; flex-direction: column; gap: 7px;
    }

    .field-row.svelte-5lotty { display: flex; align-items: flex-start; gap: 6px; }
    .field-col.svelte-5lotty { display: flex; flex-direction: column; gap: 3px; }
    .f-lbl.svelte-5lotty { min-width: 80px; font-weight: bold; color: #444; text-align: right; flex-shrink: 0; padding-top: 3px; }
    .flex1.svelte-5lotty { flex: 1; }
    .field-wrap.svelte-5lotty { display: flex; flex-direction: column; gap: 2px; }
    .full-width.svelte-5lotty { width: 100%; box-sizing: border-box; }
    .field-error.svelte-5lotty { border-color: #cc0000 !important; }
    .error-hint.svelte-5lotty { color: #cc0000; font-size: 9px; font-weight: bold; }

    .select-wrap.svelte-5lotty { width: 200px; }

    .xp-input.svelte-5lotty {
        border: 2px inset #fff; padding: 2px 4px;
        font-size: 11px; font-family: 'Tahoma', sans-serif; background: #fff;
    }

    .xp-textarea.svelte-5lotty {
        width: 100%; height: 60px; resize: none; padding: 4px;
        border: 2px inset #fff; background: #fff; outline: none;
        font-family: 'Tahoma', sans-serif; font-size: 11px;
        box-sizing: border-box;
    }

    .loc-row.svelte-5lotty { display: flex; gap: 4px; align-items: center; }
    .loc-btn.svelte-5lotty {
        padding: 2px 6px; font-size: 13px; flex-shrink: 0;
        background: #ece9d8; cursor: pointer;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        line-height: 1;
    }
    .loc-btn.svelte-5lotty:hover:not(:disabled) { background: #f5f3ef; }
    .loc-btn.svelte-5lotty:active:not(:disabled) {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }
    .loc-btn.svelte-5lotty:disabled { opacity: 0.4; cursor: default; }

    .btn-row.svelte-5lotty { display: flex; justify-content: flex-end; gap: 6px; }
    .xp-btn.svelte-5lotty {
        padding: 3px 12px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif;
    }
    .xp-btn.svelte-5lotty:hover { background: #f5f3ef; }
    .xp-btn.svelte-5lotty:active {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }
    .xp-btn.svelte-5lotty:disabled { color: #888; cursor: default; opacity: 0.7; }
    .xp-btn.bold.svelte-5lotty { font-weight: bold; }

    .cad-root.svelte-m90dam { display: flex; flex-direction: column; height: 100%; overflow: hidden; }

    .cad-toolbar.svelte-m90dam {
        display: flex; align-items: center; gap: 4px;
        padding: 3px 5px; border-bottom: 1px solid #aca899;
        background: #ece9d8; flex-shrink: 0;
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
    }
    .cad-tool-btn.svelte-m90dam {
        display: flex; flex-direction: column; align-items: center;
        background: transparent; border: 1px solid transparent;
        padding: 3px 7px; cursor: pointer; min-width: 68px;
        font-family: 'Tahoma', sans-serif;
    }
    .cad-tool-btn.svelte-m90dam:hover {
        border-color: #fff #808080 #808080 #fff;
        background: #f5f3ef;
    }
    .cad-tool-btn.svelte-m90dam span:where(.svelte-m90dam) { font-size: 10px; margin-top: 1px; }
    .sup-badge.svelte-m90dam {
        font-size: 10px; font-weight: bold; font-family: 'Tahoma', sans-serif;
        background: #000080; color: #fff; padding: 2px 8px;
        border: 1px solid #000066; align-self: center; letter-spacing: 1px;
    }

    .cad-layout.svelte-m90dam { display: flex; flex: 1; gap: 10px; padding: 5px; overflow: hidden; }

    .incidents-panel.svelte-m90dam { width: 300px; display: flex; flex-direction: column; background: #fff; border: 2px inset #fff; }
    .panel-header.svelte-m90dam { background: #000080; color: white; padding: 5px; font-weight: bold; font-size: 12px; }

    .list-scroll.svelte-m90dam { flex: 1; overflow-y: auto; background: #808080; padding: 4px; display: flex; flex-direction: column; gap: 4px; }

    .incident-card.svelte-m90dam { background: #e0e0e0; border: 1px solid #fff; border-right: 1px solid #444; border-bottom: 1px solid #444; padding: 6px; cursor: pointer; }
    .incident-card.svelte-m90dam:hover { background: #f0f0f0; }
    .incident-card.active.svelte-m90dam { background: #ffffcc; border: 1px solid #d4a017; }

    .inc-header.svelte-m90dam { display: flex; justify-content: space-between; margin-bottom: 4px; font-size: 11px; color: #666; }
    .code-badge.svelte-m90dam { background: #cc0000; color: white; padding: 0 3px; font-weight: bold; border-radius: 2px; }

    .inc-title.svelte-m90dam { font-weight: bold; font-size: 13px; color: #000; }
    .inc-loc.svelte-m90dam { font-size: 12px; margin-bottom: 4px; color: #333; }

    .inc-units.svelte-m90dam { display: flex; flex-wrap: wrap; gap: 2px; }
    .unit-tag.svelte-m90dam { background: #000080; color: white; font-size: 9px; padding: 1px 3px; }
    .no-units.svelte-m90dam { color: #cc0000; font-size: 9px; font-weight: bold; animation: svelte-m90dam-blink 1s infinite; }

    .details-panel.svelte-m90dam { flex: 1; display: flex; flex-direction: column; }
    .full-height.svelte-m90dam { height: 100%; display: flex; flex-direction: column; }

    .det-header.svelte-m90dam { border-bottom: 2px groove #fff; margin-bottom: 10px; padding-bottom: 5px; }
    .det-header.svelte-m90dam h2:where(.svelte-m90dam) { margin: 0; font-size: 18px; color: #cc0000; }
    .location.svelte-m90dam { font-size: 14px; font-weight: bold; margin: 2px 0 0 0; }

    .det-actions.svelte-m90dam { display: flex; gap: 5px; margin-bottom: 10px; flex-wrap: wrap; }
    .separator.svelte-m90dam { width: 10px; }

    .det-notes.svelte-m90dam { flex: 1; display: flex; flex-direction: column; }
    .notes-area.svelte-m90dam { flex: 1; resize: none; border: 2px inset #fff; background: #000; color: #00ff00; font-family: monospace; padding: 5px; }

    .empty-state.svelte-m90dam { flex: 1; display: flex; align-items: center; justify-content: center; color: #666; font-style: italic; background: #ece9d8; border: 2px inset #fff; }

    .xp-btn.svelte-m90dam {
        padding: 3px 10px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000; border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444; cursor: pointer;
    }
    .xp-btn.svelte-m90dam:disabled { color: #888; cursor: default; }
    .xp-btn.attached.svelte-m90dam { background: #d4f0d4; color: #006600; }
    .xp-btn.danger.svelte-m90dam { background: #ffcccc; color: #cc0000; }

    @keyframes svelte-m90dam-blink { 50% { opacity: 0.5; } }

    .win98-container.svelte-18g9soq {
        display: flex; flex-direction: column; height: 100%;
        background: #d4d0c8; padding: 2px;
        font-family: "Tahoma", "Microsoft Sans Serif", sans-serif;
    }

    .win98-toolbar.svelte-18g9soq {
        display: flex; align-items: center; padding: 4px; gap: 8px;
        border-bottom: 1px solid #808080;
    }

    /* (unused) .win98-btn-tool {
        display: flex; flex-direction: column; align-items: center;
        background: transparent; border: 1px solid transparent;
        padding: 4px 8px; cursor: pointer; min-width: 80px;
    }*/
    /* (unused) .win98-btn-tool:hover { border: 1px solid #fff; border-right-color: #808080; border-bottom-color: #808080; }*/
    /* (unused) .win98-btn-tool img { width: 24px; height: 24px; margin-bottom: 2px; }*/
    /* (unused) .win98-btn-tool span { font-size: 11px; }*/

    /* (unused) .win98-divider { width: 2px; height: 32px; background: #808080; border-right: 1px solid #fff; margin: 0 4px; }*/

    .win98-filter-group.svelte-18g9soq { display: flex; gap: 12px; }
    .win98-field.svelte-18g9soq { display: flex; align-items: center; gap: 5px; font-size: 11px; }
    .win98-input.svelte-18g9soq {
        background: white; border: 2px solid;
        border-color: #808080 #fff #fff #808080;
        font-size: 11px; padding: 2px;
    }
    .status-select-wrap.svelte-18g9soq { width: 110px; }

    .win98-content.svelte-18g9soq {
        flex: 1; background: white; border: 2px solid;
        border-color: #808080 #fff #fff #808080;
        overflow: auto; margin-top: 4px;
    }

    .win98-table.svelte-18g9soq { width: 100%; border-collapse: collapse; table-layout: fixed; }

    .win98-th.svelte-18g9soq {
        position: sticky; top: 0; background: #d4d0c8;
        border: 1px solid; border-color: #fff #808080 #808080 #fff;
        font-size: 11px; font-weight: normal; padding: 3px 6px; text-align: left;
    }

    .win98-td.svelte-18g9soq { border-right: 1px solid #f0f0f0; padding: 4px 6px; font-size: 11px; vertical-align: top; word-break: break-word; overflow-wrap: anywhere; }

    .win98-tr.svelte-18g9soq:nth-child(even) { background: #fcfcfc; }
    .win98-tr.svelte-18g9soq:hover { background: #0a246a; color: white; }
    .win98-tr.svelte-18g9soq:hover .secondary:where(.svelte-18g9soq) { color: #d4d0c8; }

    .primary.svelte-18g9soq { font-weight: bold; }
    .secondary.svelte-18g9soq { color: #666; font-size: 10px; }

    .win98-status.svelte-18g9soq { font-weight: bold; }
    .win98-status.pending.svelte-18g9soq { color: #cc0000; }
    .win98-status.responding.svelte-18g9soq { color: #006600; }
    .win98-status.attached.svelte-18g9soq { color: #000080; }
    .win98-tr.svelte-18g9soq:hover .win98-status:where(.svelte-18g9soq) { color: white; }

    .win98-btn-small.svelte-18g9soq {
        background: #d4d0c8; border: 1px solid;
        border-color: #fff #808080 #808080 #fff;
        font-size: 10px; padding: 1px 6px; cursor: pointer;
    }
    .win98-btn-small.svelte-18g9soq:active { border-color: #808080 #fff #fff #808080; }
    .win98-btn-small.svelte-18g9soq:disabled { color: #888; cursor: default; }

    .win98-footer.svelte-18g9soq { display: flex; gap: 2px; padding-top: 2px; }
    .win98-status-pane.svelte-18g9soq {
        background: #d4d0c8; border: 1px solid;
        border-color: #808080 #fff #fff #808080;
        padding: 2px 6px; font-size: 10px; min-width: 100px;
    }
    .win98-status-pane.full.svelte-18g9soq { flex: 1; }
    .text-center.svelte-18g9soq { text-align: center; }

    .xp-btn.svelte-10ezgq7 {
        font-family: 'Tahoma', sans-serif;
        border: 1px solid var(--win-border-dark);
        border-radius: 2px;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: normal;
        transition: all 0.1s;
    }

    .xp-btn.svelte-10ezgq7:active:not(:disabled) {
        transform: translateY(1px);
    }

    .xp-btn.svelte-10ezgq7:disabled {
        opacity: 0.6;
        cursor: not-allowed;
        filter: grayscale(100%);
    }

    /* Variants */
    .default.svelte-10ezgq7 {
        background: linear-gradient(180deg, #fff 0%, #ece9d8 100%);
        color: #000;
    }
    .default.svelte-10ezgq7:hover:not(:disabled) {
        box-shadow: 0 0 2px rgba(0,0,0,0.2);
    }

    .primary.svelte-10ezgq7 {
        background: var(--win-blue-header);
        color: white;
        font-weight: bold;
        border-color: #002d7a;
    }
    .primary.svelte-10ezgq7:hover:not(:disabled) {
        filter: brightness(1.1);
    }

    .danger.svelte-10ezgq7 {
        background: linear-gradient(180deg, #ff4d4d 0%, #cc0000 100%);
        color: white;
        border-color: #8a0000;
    }

    /* Sizes */
    .sm.svelte-10ezgq7 {
        font-size: 10px;
        padding: 1px 6px;
        height: 20px;
    }
    .md.svelte-10ezgq7 {
        font-size: 11px;
        padding: 3px 10px;
        height: 26px;
    }

    /* Shared modal/field styles come from shared-components.css */
    .modal-box.svelte-12v113h { width: 400px; } /* Override default 420px */
    .search-row.svelte-12v113h { display: flex; gap: 4px; }
    .search-row.svelte-12v113h input:where(.svelte-12v113h) { flex: 1; }
    .search-error.svelte-12v113h { color: #c00; font-size: 11px; padding: 4px 6px; background: #ffe0e0; border: 1px solid #fcc; }
    .person-card.svelte-12v113h { border: 1px solid #aca899; background: #fafafa; padding: 6px 8px; }
    .card-header.svelte-12v113h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
    .card-name.svelte-12v113h { font-weight: bold; font-size: 12px; }
    .card-badge.svelte-12v113h { font-size: 9px; padding: 1px 6px; border-radius: 2px; color: white; }
    .card-badge.ok.svelte-12v113h { background: #27ae60; }
    .card-table.svelte-12v113h { font-size: 11px; width: 100%; }
    .card-table.svelte-12v113h .lbl:where(.svelte-12v113h) { font-weight: bold; color: #555; width: 60px; padding: 1px 4px; }
    .card-table.svelte-12v113h td:where(.svelte-12v113h) { padding: 1px 4px; }
    .flag-tag.svelte-12v113h { display: inline-block; background: #fffacc; color: #664400; border: 1px solid #e6d68a; padding: 0 4px; margin: 1px 2px; font-size: 10px; }

    .modal-overlay.svelte-1n0iqcp {
        position: fixed; inset: 0;
        background: rgba(0, 0, 0, 0.5);
        display: flex; align-items: center; justify-content: center;
        z-index: 9999;
    }

    .xp-window.svelte-1n0iqcp {
        width: 440px; background: #ece9d8;
        border: 2px outset #fff;
        box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.5);
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
        font-size: 11px;
    }

    .window-header.svelte-1n0iqcp {
        background: linear-gradient(90deg, #0054E3, #2f89fc);
        color: #fff; font-weight: bold; padding: 3px 5px;
        display: flex; justify-content: space-between; align-items: center;
    }

    .close-btn.svelte-1n0iqcp {
        background: #d4d0c8; border: 1px outset #fff;
        width: 16px; height: 16px; font-size: 10px; line-height: 12px;
        cursor: pointer; padding: 0; text-align: center;
    }
    .close-btn.svelte-1n0iqcp:active { border-style: inset; }

    .window-body.svelte-1n0iqcp { padding: 10px; display: flex; flex-direction: column; gap: 10px; }

    .section-panel.svelte-1n0iqcp { border: 2px inset #fff; background: #fff; }
    .section-hdr.svelte-1n0iqcp {
        background: #000080; color: #fff;
        padding: 2px 6px; font-weight: bold; font-size: 11px;
    }

    /* Active flags list */
    .active-flags.svelte-1n0iqcp { padding: 6px; display: flex; flex-direction: column; gap: 4px; min-height: 36px; }
    .active-flag.svelte-1n0iqcp {
        display: flex; align-items: center; justify-content: space-between;
        border-bottom: 1px dotted #ddd; padding-bottom: 3px;
    }
    .active-flag.svelte-1n0iqcp:last-child { border-bottom: none; }
    .flag-name.svelte-1n0iqcp { font-weight: bold; color: #8b0000; }
    .empty-txt.svelte-1n0iqcp { color: #aaa; font-style: italic; font-size: 10px; }

    /* Flag picker grid */
    .flag-grid.svelte-1n0iqcp {
        display: flex; flex-wrap: wrap; gap: 4px; padding: 6px;
    }
    .flag-btn.svelte-1n0iqcp {
        padding: 3px 8px; font-size: 10px; font-weight: bold;
        background: #ece9d8; border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif;
        white-space: nowrap;
    }
    .flag-btn.svelte-1n0iqcp:hover:not(:disabled) { background: #f5f3ef; }
    .flag-btn.svelte-1n0iqcp:active:not(:disabled) {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }
    .flag-btn.active.svelte-1n0iqcp, .flag-btn.svelte-1n0iqcp:disabled {
        background: #d4d0c8; color: #888;
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
        cursor: default;
    }

    /* Remove button */
    .remove-btn.svelte-1n0iqcp {
        padding: 1px 6px; font-size: 10px; background: #ece9d8;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif;
    }
    .remove-btn.svelte-1n0iqcp:hover { background: #f5f3ef; }
    .remove-btn.svelte-1n0iqcp:active {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }

    .btn-row.svelte-1n0iqcp { display: flex; justify-content: flex-end; }
    .xp-btn.svelte-1n0iqcp {
        padding: 3px 12px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif;
    }
    .xp-btn.svelte-1n0iqcp:hover { background: #f5f3ef; }
    .xp-btn.svelte-1n0iqcp:active {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }

    .modal-overlay.svelte-1r3o23k {
        position: fixed; inset: 0;
        background: rgba(0, 0, 0, 0.5);
        display: flex; align-items: center; justify-content: center;
        z-index: 9999;
    }

    .xp-window.svelte-1r3o23k {
        width: 480px; background: #ece9d8;
        border: 2px outset #fff;
        box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.5);
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
        font-size: 11px;
    }

    .window-header.svelte-1r3o23k {
        background: linear-gradient(90deg, #0054E3, #2f89fc);
        color: #fff; font-weight: bold; padding: 3px 5px;
        display: flex; justify-content: space-between; align-items: center;
    }
    .close-btn.svelte-1r3o23k {
        background: #d4d0c8; border: 1px outset #fff;
        width: 16px; height: 16px; font-size: 10px; line-height: 12px;
        cursor: pointer; padding: 0; text-align: center;
    }
    .close-btn.svelte-1r3o23k:active { border-style: inset; }

    .window-body.svelte-1r3o23k { padding: 10px; display: flex; flex-direction: column; gap: 10px; }

    .notes-panel.svelte-1r3o23k, .add-panel.svelte-1r3o23k { border: 2px inset #fff; background: #fff; }
    .panel-hdr.svelte-1r3o23k {
        background: #000080; color: #fff;
        padding: 2px 6px; font-weight: bold; font-size: 11px;
    }

    /* Notes list */
    .notes-list.svelte-1r3o23k { max-height: 200px; overflow-y: auto; }
    .empty-txt.svelte-1r3o23k { padding: 10px; color: #aaa; font-style: italic; text-align: center; }

    .note-entry.svelte-1r3o23k {
        padding: 5px 7px; border-bottom: 1px dotted #ddd;
    }
    .note-entry.svelte-1r3o23k:last-child { border-bottom: none; }
    .note-meta.svelte-1r3o23k {
        display: flex; justify-content: space-between;
        margin-bottom: 2px;
    }
    .note-officer.svelte-1r3o23k { font-weight: bold; color: #000080; font-size: 10px; }
    .note-date.svelte-1r3o23k    { color: #888; font-size: 10px; flex: 1; }
    .del-note-btn.svelte-1r3o23k {
        background: transparent; border: none; color: #cc0000;
        font-size: 10px; font-weight: bold; cursor: pointer;
        padding: 0 2px; line-height: 1;
    }
    .del-note-btn.svelte-1r3o23k:hover { color: #ff0000; }
    .note-content.svelte-1r3o23k { color: #222; line-height: 1.4; }

    /* Add note */
    .note-input.svelte-1r3o23k {
        width: 100%; height: 70px; padding: 5px;
        border: none; resize: none; outline: none;
        font-family: 'Tahoma', sans-serif; font-size: 11px;
        background: #fff; box-sizing: border-box;
    }
    .field-footer.svelte-1r3o23k {
        display: flex; justify-content: space-between; align-items: center;
        padding: 2px 5px 3px; background: #fff; font-size: 9px;
    }
    .add-hint.svelte-1r3o23k   { color: #888; }
    .error-hint.svelte-1r3o23k { color: #cc0000; font-weight: bold; }
    .char-count.svelte-1r3o23k { color: #888; }
    .field-error.svelte-1r3o23k { border: 1px solid #cc0000 !important; }

    /* Buttons */
    .btn-row.svelte-1r3o23k { display: flex; justify-content: flex-end; gap: 6px; }
    .xp-btn.svelte-1r3o23k {
        padding: 3px 12px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif;
    }
    .xp-btn.svelte-1r3o23k:hover { background: #f5f3ef; }
    .xp-btn.svelte-1r3o23k:active {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }
    .xp-btn.svelte-1r3o23k:disabled { color: #888; cursor: default; opacity: 0.7; }
    .xp-btn.bold.svelte-1r3o23k { font-weight: bold; }

    .modal-overlay.svelte-d4mawe {
        position: fixed; inset: 0;
        background: rgba(0, 0, 0, 0.5);
        display: flex; align-items: center; justify-content: center;
        z-index: 9999;
    }

    .xp-window.svelte-d4mawe {
        width: 600px; background: #ece9d8;
        border: 2px outset #fff;
        box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.5);
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
        font-size: 11px;
    }

    .window-header.svelte-d4mawe {
        background: linear-gradient(90deg, #0054E3, #2f89fc);
        color: #fff; font-weight: bold; padding: 3px 5px;
        display: flex; justify-content: space-between; align-items: center;
    }
    .close-btn.svelte-d4mawe {
        background: #d4d0c8; border: 1px outset #fff;
        width: 16px; height: 16px; font-size: 10px; line-height: 12px;
        cursor: pointer; padding: 0; text-align: center;
    }
    .close-btn.svelte-d4mawe:active { border-style: inset; }

    .window-body.svelte-d4mawe { padding: 10px; display: flex; flex-direction: column; gap: 8px; }

    .reports-panel.svelte-d4mawe { border: 2px inset #fff; background: #fff; }
    .panel-hdr.svelte-d4mawe {
        background: #000080; color: #fff;
        padding: 2px 6px; font-weight: bold; font-size: 11px;
    }

    .reports-scroll.svelte-d4mawe { max-height: 280px; overflow-y: auto; }
    .empty-txt.svelte-d4mawe { padding: 20px; color: #aaa; font-style: italic; text-align: center; }

    .rep-table.svelte-d4mawe { width: 100%; border-collapse: collapse; font-size: 11px; }
    .rep-table.svelte-d4mawe th:where(.svelte-d4mawe) {
        background: #d4d0c8; border-bottom: 1px solid #aca899;
        border-right: 1px solid #aca899;
        text-align: left; padding: 3px 6px; font-size: 10px;
        position: sticky; top: 0;
    }
    .rep-table.svelte-d4mawe td:where(.svelte-d4mawe) { border-bottom: 1px dotted #ddd; padding: 4px 6px; border-right: 1px dotted #eee; }
    .rep-row.svelte-d4mawe { cursor: pointer; }
    .rep-row.svelte-d4mawe:hover td:where(.svelte-d4mawe) { background: #000080; color: #fff; }
    .rep-row.svelte-d4mawe:hover .status-tag:where(.svelte-d4mawe) { border-color: #fff; }

    .td-title.svelte-d4mawe { font-weight: bold; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .td-date.svelte-d4mawe  { font-size: 10px; color: #555; white-space: nowrap; }
    .mono.svelte-d4mawe     { font-family: monospace; font-size: 10px; color: #555; }

    .status-tag.svelte-d4mawe { font-weight: bold; font-size: 10px; padding: 1px 4px; border: 1px solid; }
    .status-tag.DRAFT.svelte-d4mawe     { color: #886600; border-color: #886600; background: #fffacc; }
    .status-tag.SUBMITTED.svelte-d4mawe { color: #005500; border-color: #005500; background: #ccffcc; }

    .bottom-note.svelte-d4mawe { font-size: 10px; color: #888; font-style: italic; }

    .btn-row.svelte-d4mawe { display: flex; justify-content: flex-end; }
    .xp-btn.svelte-d4mawe {
        padding: 3px 12px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif;
    }
    .xp-btn.svelte-d4mawe:hover { background: #f5f3ef; }
    .xp-btn.svelte-d4mawe:active {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }

    /* ── Root Layout ── */
    .rec-layout.svelte-1qsiwxv {
        display: flex; flex-direction: column; height: 100%;
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
        font-size: 11px; background: #ece9d8; overflow: hidden;
    }

    /* ── Search Bar ── */
    .rec-search-bar.svelte-1qsiwxv {
        display: flex; align-items: center; gap: 6px;
        padding: 5px 8px; background: #ece9d8;
        border-bottom: 2px groove #aca899; flex-shrink: 0;
    }
    .search-label.svelte-1qsiwxv { font-weight: bold; color: #444; white-space: nowrap; }
    .search-type-wrap.svelte-1qsiwxv { width: 120px; flex-shrink: 0; }
    .search-input.svelte-1qsiwxv {
        flex: 1; border: 2px inset #fff; padding: 2px 5px;
        font-size: 11px; font-family: 'Tahoma', sans-serif;
        background: #fff; outline: none;
    }

    /* ── Content Area ── */
    .rec-content.svelte-1qsiwxv {
        flex: 1; overflow-y: auto; padding: 8px;
        display: flex; flex-direction: column; gap: 8px;
    }

    .state-msg.svelte-1qsiwxv {
        flex: 1; display: flex; align-items: center; justify-content: center;
        text-align: center; color: #888; font-style: italic; line-height: 1.8;
    }
    .state-msg.err.svelte-1qsiwxv   { color: #cc0000; font-style: normal; font-weight: bold; }
    .state-msg.muted.svelte-1qsiwxv { color: #aaa; }

    /* ── Person Layout ── */
    .person-layout.svelte-1qsiwxv { display: flex; gap: 8px; align-items: flex-start; }
    .person-left.svelte-1qsiwxv { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }

    /* ── Vehicle Layout ── */
    .vehicle-layout.svelte-1qsiwxv { display: flex; flex-direction: column; gap: 6px; max-width: 560px; }

    /* ── Panels ── */
    .recs-panel.svelte-1qsiwxv { border: 2px inset #fff; background: #fff; }
    .panel-hdr.svelte-1qsiwxv {
        background: #000080; color: #fff;
        padding: 3px 7px; font-weight: bold; font-size: 11px;
    }
    .hdr-red.svelte-1qsiwxv { background: #8b0000; }

    /* ── Info Table ── */
    .info-table.svelte-1qsiwxv { width: 100%; border-collapse: collapse; }
    .info-table.svelte-1qsiwxv tr:where(.svelte-1qsiwxv) { border-bottom: 1px dotted #ddd; }
    .info-table.svelte-1qsiwxv tr:where(.svelte-1qsiwxv):last-child { border-bottom: none; }
    .ikey.svelte-1qsiwxv {
        width: 90px; padding: 4px 8px; font-weight: bold; color: #444;
        background: #f0ede4; border-right: 1px solid #ccc;
        white-space: nowrap; vertical-align: middle;
    }
    .ival.svelte-1qsiwxv  { padding: 4px 8px; vertical-align: middle; }
    .bold.svelte-1qsiwxv  { font-weight: bold; }
    .mono.svelte-1qsiwxv  { font-family: monospace; letter-spacing: 1px; }
    .muted-text.svelte-1qsiwxv { color: #999; font-style: italic; }

    /* Flags */
    .flags-row.svelte-1qsiwxv { display: flex; flex-wrap: wrap; gap: 3px; }
    .flag-tag.svelte-1qsiwxv {
        background: #fffacc; border: 1px solid #aca899;
        padding: 1px 5px; font-size: 10px; font-weight: bold; color: #664400;
    }

    /* Status Tags */
    .stag.svelte-1qsiwxv { font-weight: bold; font-size: 11px; padding: 1px 6px; }
    .stag.wanted.svelte-1qsiwxv { color: #cc0000; border: 1px solid #cc0000; background: #fff0f0; }
    .stag.clear.svelte-1qsiwxv  { color: #006600; border: 1px solid #006600; background: #f0fff0; }

    @keyframes svelte-1qsiwxv-blink { 50% { opacity: 0; } }
    .blink-anim.svelte-1qsiwxv { animation: svelte-1qsiwxv-blink 1s step-start infinite; }

    /* ── Warrants link row ── */
    .warrant-link-row.svelte-1qsiwxv {
        display: flex; align-items: center; justify-content: space-between;
        padding: 6px 8px; gap: 8px;
    }
    .warrant-link-text.svelte-1qsiwxv { color: #8b0000; font-weight: bold; font-size: 11px; }
    .warrant-link-btn.svelte-1qsiwxv  { color: #000080; font-weight: bold; }

    /* ── Licenses ── */
    .lic-valid.svelte-1qsiwxv { color: #006600; font-weight: bold; }
    .lic-none.svelte-1qsiwxv  { color: #aaa; font-style: italic; }

    /* ── Biometrics ── */
    .bio-check.svelte-1qsiwxv { display: flex; align-items: center; gap: 4px; cursor: pointer; }
    .bio-check.svelte-1qsiwxv input:where(.svelte-1qsiwxv) { cursor: pointer; }

    /* ── Actions ── */
    .action-row.svelte-1qsiwxv { display: flex; justify-content: flex-end; gap: 5px; }

    /* ── Mugshot ── */
    .mugshot-col.svelte-1qsiwxv {
        width: 148px; flex-shrink: 0;
        display: flex; flex-direction: column; border: 2px inset #fff;
    }
    .mugshot-frame.svelte-1qsiwxv { width: 100%; height: 180px; background: #111; overflow: hidden; }
    .mugshot-frame.svelte-1qsiwxv img:where(.svelte-1qsiwxv) { width: 100%; height: 100%; object-fit: cover; display: block; }
    .mugshot-id.svelte-1qsiwxv {
        background: #000080; color: #fff; text-align: center;
        font-size: 9px; font-family: monospace; padding: 2px 4px;
    }
    .mugshot-label.svelte-1qsiwxv {
        background: #d4d0c8; color: #555;
        font-size: 9px; font-weight: bold; letter-spacing: 1px;
        text-align: center; padding: 2px 4px;
    }
    .mugshot-btn.svelte-1qsiwxv {
        width: 100%;
        margin-top: 4px;
        font-size: 10px;
        padding: 3px 6px;
    }

    /* ── XP Buttons ── */
    .xp-btn.svelte-1qsiwxv {
        padding: 3px 10px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif; white-space: nowrap;
    }
    .xp-btn.svelte-1qsiwxv:hover { background: #f5f3ef; }
    .xp-btn.svelte-1qsiwxv:active {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }
    .xp-btn.svelte-1qsiwxv:disabled { color: #888; cursor: default; opacity: 0.7; }

    /* ── Properties ── */
    .props-row.svelte-1qsiwxv { display: flex; flex-wrap: wrap; gap: 3px; }
    .prop-tag.svelte-1qsiwxv {
        background: #f0ede4; border: 1px solid #aca899;
        padding: 1px 5px; font-size: 10px; font-weight: bold; color: #444;
    }
    .prop-open.svelte-1qsiwxv { color: #cc6600; font-style: italic; margin-left: 3px; }

    /* ── Mode Tabs ── */
    .rec-mode-tabs.svelte-1qsiwxv {
        display: flex; gap: 0; padding: 4px 8px 0;
        border-bottom: 2px solid #0055ea; background: #ece9d8; flex-shrink: 0;
    }
    .rec-mode-tabs.svelte-1qsiwxv button:where(.svelte-1qsiwxv) {
        padding: 4px 14px; border: 1px solid #aca899; border-bottom: none;
        background: #ece9d8; cursor: pointer; font-size: 11px;
        margin-bottom: -2px; font-family: 'Tahoma', sans-serif;
    }
    .rec-mode-tabs.svelte-1qsiwxv button.active:where(.svelte-1qsiwxv) {
        background: white; border-bottom: 2px solid white; font-weight: bold;
    }

    /* ── FIC Toolbar ── */
    .fic-toolbar.svelte-1qsiwxv {
        display: flex; align-items: center; gap: 6px;
        padding: 6px 8px; border-bottom: 1px solid #aca899; flex-shrink: 0;
    }
    .fic-content.svelte-1qsiwxv { flex: 1; overflow-y: auto; padding: 8px; }

    /* ── FIC Create Modal extras ── */
    .fic-subject-selected.svelte-1qsiwxv { display: flex; align-items: center; gap: 6px; }
    .fic-clear-btn.svelte-1qsiwxv { background: none; border: none; color: #cc0000; cursor: pointer; font-size: 12px; }
    .fic-person-search.svelte-1qsiwxv { display: flex; flex-direction: column; gap: 2px; }
    .fic-person-search.svelte-1qsiwxv input:where(.svelte-1qsiwxv) { font-size: 11px; padding: 3px 4px; border: 1px solid #7f9db9; }
    .fic-hint.svelte-1qsiwxv { font-size: 10px; color: #999; font-weight: normal; }

    .rp-layout.svelte-coljjc {
        display: flex; height: 100%;
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
        font-size: 11px; background: #ece9d8; overflow: hidden;
    }

    .rp-sidebar.svelte-coljjc {
        width: 220px; min-width: 220px;
        display: flex; flex-direction: column;
        border-right: 1px solid #aca899;
        box-shadow: 1px 0 0 #fff;
        background: #ece9d8; overflow: hidden;
    }
    .sidebar-header.svelte-coljjc {
        background: #000080; color: #fff;
        padding: 4px 8px; font-size: 11px; font-weight: bold;
        flex-shrink: 0;
    }
    .sidebar-actions.svelte-coljjc {
        display: flex; flex-direction: column; gap: 2px;
        padding: 6px; border-bottom: 1px solid #aca899; flex-shrink: 0;
    }
    .sidebar-tabs.svelte-coljjc { display: flex; border-bottom: 1px solid #aca899; flex-shrink: 0; }
    .stab.svelte-coljjc {
        flex: 1; padding: 4px; font-size: 11px; cursor: pointer;
        background: #d4d0c8; border: none; border-right: 1px solid #aca899;
        font-family: 'Tahoma', sans-serif; color: #444;
    }
    .stab.svelte-coljjc:last-child { border-right: none; }
    .stab.active.svelte-coljjc { background: #ece9d8; font-weight: bold; color: #000080; }
    .stab.svelte-coljjc:hover:not(.active) { background: #ddd9d0; }

    .supervisor-toggle.svelte-coljjc {
        padding: 4px 6px; background: #fffacc;
        border-bottom: 1px solid #aca899; flex-shrink: 0;
    }
    .toggle-label.svelte-coljjc {
        display: flex; align-items: center; gap: 5px;
        font-size: 10px; cursor: pointer; color: #886600; font-weight: bold;
    }
    .toggle-label.svelte-coljjc input:where(.svelte-coljjc) { cursor: pointer; }

    .report-list-wrap.svelte-coljjc {
        flex: 1; overflow-y: auto; background: #fff;
        border: 2px inset #fff; margin: 4px;
    }
    .list-item.svelte-coljjc { padding: 5px 6px; border-bottom: 1px dotted #ccc; cursor: pointer; }
    .list-item.svelte-coljjc:hover { background: #e8e8e8; }
    .list-item.active.svelte-coljjc { background: #000080; color: #fff; }
    .list-item.active.svelte-coljjc .li-meta:where(.svelte-coljjc) { color: #ccc; }
    .li-title.svelte-coljjc { font-weight: bold; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .li-meta.svelte-coljjc { font-size: 10px; color: #666; margin-top: 1px; }
    .li-delete.svelte-coljjc { flex: 1; float: right; margin-left: 8px; }
    .li-delete.svelte-coljjc:hover { color: #cc0000; font-weight: 800;}
    .li-status.svelte-coljjc { font-weight: bold; }
    .li-status.DRAFT.svelte-coljjc { color: #996600; }
    .li-status.SUBMITTED.svelte-coljjc { color: #006600; }
    .list-item.active.svelte-coljjc .li-status:where(.svelte-coljjc) { color: #ffcc88; }
    .li-author.svelte-coljjc { font-size: 9px; color: #888; font-style: italic; margin-top: 1px; }
    /* (unused) .list-item.active .li-author { color: #bbb; }*/
    .list-empty.svelte-coljjc { padding: 12px; text-align: center; color: #999; font-style: italic; }

    .rp-workspace.svelte-coljjc { flex: 1; display: flex; flex-direction: column; overflow: hidden; }

    .report-infobar.svelte-coljjc {
        background: #ece9d8; padding: 5px 8px;
        border-bottom: 2px groove #aca899; flex-shrink: 0;
    }
    .info-table.svelte-coljjc { border-collapse: collapse; margin-bottom: 5px; }
    .info-table.svelte-coljjc td:where(.svelte-coljjc) { padding: 1px 6px 1px 0; }
    .ib-label.svelte-coljjc { color: #666; font-size: 10px; font-weight: bold; white-space: nowrap; }
    .mono.svelte-coljjc { font-family: monospace; }
    .status-tag.svelte-coljjc {
        font-weight: bold; font-size: 10px; padding: 1px 5px;
        border: 1px solid #aca899;
    }
    .status-tag.DRAFT.svelte-coljjc { background: #fffacc; color: #886600; }
    .status-tag.SUBMITTED.svelte-coljjc { background: #ccffcc; color: #005500; }

    .infobar-title-row.svelte-coljjc { display: flex; gap: 5px; align-items: center; }
    .title-input.svelte-coljjc {
        flex: 1; font-size: 13px; font-weight: bold;
        border: 2px inset #fff; padding: 2px 5px;
        font-family: 'Tahoma', sans-serif; background: #fff;
    }
    .title-input.svelte-coljjc:disabled { background: #f0f0f0; color: #333; }
    .sup-badge.svelte-coljjc {
        font-size: 9px; font-weight: bold; letter-spacing: 1px;
        background: #8b0000; color: #fff; padding: 2px 6px;
        white-space: nowrap; flex-shrink: 0;
    }
    .case-link-badge.svelte-coljjc {
        font-size: 10px; font-weight: bold; letter-spacing: 0.5px;
        background: #00509e; color: #fff; padding: 2px 8px;
        white-space: nowrap; flex-shrink: 0; cursor: help;
        border: 1px solid #003a73;
    }

    .tab-nav.svelte-coljjc {
        display: flex; padding: 3px 5px 0;
        background: #ece9d8; border-bottom: 1px solid #aca899; flex-shrink: 0;
    }
    .xtab.svelte-coljjc {
        padding: 4px 12px; background: #d4d0c8;
        border: 1px solid #aca899; border-bottom: none;
        cursor: pointer; font-size: 11px; font-family: 'Tahoma', sans-serif;
        margin-right: 2px; position: relative; top: 1px;
    }
    .xtab.svelte-coljjc:hover:not(.active) { background: #ddd9d0; }
    .xtab.active.svelte-coljjc {
        background: #ece9d8; font-weight: bold;
        border-top: 2px solid #e68b2c; z-index: 1;
    }
    .tab-body.svelte-coljjc { flex: 1; overflow-y: auto; padding: 8px; background: #ece9d8; }

    .gen-grid.svelte-coljjc { display: flex; flex-direction: column; gap: 6px; max-width: 600px; }
    .field-row.svelte-coljjc { display: flex; align-items: center; gap: 6px; }
    .fl.svelte-coljjc { min-width: 90px; font-weight: bold; color: #444; text-align: right; flex-shrink: 0; }
    .field-inline.svelte-coljjc { display: flex; gap: 4px; flex: 1; }
    .flex1.svelte-coljjc { flex: 1; }
    .officers-row.svelte-coljjc { display: flex; flex-wrap: wrap; gap: 6px; }
    .unit-cell.svelte-coljjc { display: flex; flex-direction: column; align-items: center; gap: 1px; }
    .unit-tag.svelte-coljjc {
        background: #000080; color: #fff;
        font-size: 10px; padding: 1px 5px; font-family: monospace;
    }
    .unit-name.svelte-coljjc { font-size: 9px; color: #555; font-style: italic; }

    .ent-split.svelte-coljjc { display: flex; gap: 8px; height: 100%; }
    .ent-panel.svelte-coljjc { flex: 1; display: flex; flex-direction: column; border: 2px inset #fff; background: #fff; }
    .panel-header.svelte-coljjc {
        background: #000080; color: #fff; padding: 3px 6px;
        font-weight: bold; font-size: 11px;
        display: flex; justify-content: space-between; align-items: center;
        flex-shrink: 0;
    }
    .ent-list-scroll.svelte-coljjc { flex: 1; overflow-y: auto; }
    .ent-row.svelte-coljjc {
        display: flex; align-items: center; gap: 6px;
        padding: 4px 6px; border-bottom: 1px dotted #ccc;
    }
    .ent-row.svelte-coljjc:last-child { border-bottom: none; }
    .ent-name.svelte-coljjc { flex: 1; font-weight: bold; font-size: 12px; }
    .plate-tag.svelte-coljjc {
        font-family: monospace; font-size: 11px; font-weight: bold;
        background: #ffcc00; border: 1px solid #888; padding: 1px 4px;
    }
    .ent-empty.svelte-coljjc { padding: 12px; text-align: center; color: #999; font-style: italic; }
    .role-select-wrap.svelte-coljjc { width: 80px; flex-shrink: 0; }

    /* ── Charges Tab ── */
    .chg-split.svelte-coljjc { display: flex; gap: 8px; height: 100%; }

    .penal-panel.svelte-coljjc {
        width: 380px; min-width: 380px;
        display: flex; flex-direction: column; border: 2px inset #fff;
    }
    .penal-filterbar.svelte-coljjc {
        display: flex; gap: 4px; padding: 4px;
        background: #ece9d8; border-bottom: 1px solid #aca899;
        flex-shrink: 0; align-items: center;
    }
    .penal-filter-select.svelte-coljjc { width: 175px; flex-shrink: 0; }
    .penal-scroll.svelte-coljjc { flex: 1; overflow-y: auto; background: #fff; }
    .penal-cat.svelte-coljjc {
        background: #d4d0c8; padding: 3px 6px;
        font-size: 10px; font-weight: bold; color: #333;
        border-bottom: 1px solid #aca899; letter-spacing: 0.5px;
        position: sticky; top: 0; z-index: 1;
    }
    .penal-row.svelte-coljjc {
        display: flex; align-items: center; gap: 5px; width: 100%;
        padding: 4px 6px; text-align: left; background: none;
        border: none; border-bottom: 1px dotted #eee;
        cursor: pointer; font-family: 'Tahoma', sans-serif; font-size: 11px;
    }
    .penal-row.svelte-coljjc:hover { background: #ffffcc; }
    .pc-typebadge.svelte-coljjc {
        display: inline-block; width: 14px; text-align: center;
        font-weight: bold; font-size: 9px; color: #fff;
        border-radius: 2px; padding: 0 2px; flex-shrink: 0;
    }
    .type-I.svelte-coljjc { background: #c41616; }
    .type-D.svelte-coljjc { background: #d97e1a; }
    .type-C.svelte-coljjc { background: #6e6e6e; }
    .pc-code.svelte-coljjc { font-weight: bold; color: #000080; min-width: 48px; font-size: 10px; font-family: monospace; flex-shrink: 0; }
    .pc-title.svelte-coljjc { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pc-class-stack.svelte-coljjc { display: flex; gap: 2px; flex-shrink: 0; }
    .pc-class.svelte-coljjc {
        display: inline-block; font-weight: bold; font-size: 9px;
        color: #fff; padding: 1px 4px; min-width: 14px; text-align: center;
        border-radius: 2px;
    }
    .class-A.svelte-coljjc { background: #8b1a1a; }
    .class-B.svelte-coljjc { background: #b9772a; }
    .class-C.svelte-coljjc { background: #444; }
    .class-legacy.svelte-coljjc { background: #888; color: #fff; font-size: 8px; padding: 1px 4px; letter-spacing: 0.5px; }
    .type-legacy.svelte-coljjc { background: #888; }
    .legacy-row.svelte-coljjc td:where(.svelte-coljjc) { background: #f5f5f0 !important; color: #555; }
    .legacy-row.svelte-coljjc td:where(.svelte-coljjc) b:where(.svelte-coljjc) { color: #555; }
    .pc-meta.svelte-coljjc { font-size: 9px; color: #888; white-space: nowrap; min-width: 80px; text-align: right; flex-shrink: 0; }
    .pc-fine.svelte-coljjc { margin-left: 4px; color: #cc0000; font-weight: bold; }
    .pc-judge.svelte-coljjc {
        display: inline-block; background: #6a1b9a; color: #fff;
        font-weight: bold; padding: 1px 4px; font-size: 9px; border-radius: 2px;
    }
    .pc-sub-ind.svelte-coljjc {
        color: #888; font-weight: bold; font-size: 13px; flex-shrink: 0; line-height: 1;
    }

    .applied-panel.svelte-coljjc { flex: 1; display: flex; flex-direction: column; border: 2px inset #fff; }
    .chg-table-wrap.svelte-coljjc { flex: 1; overflow-y: auto; background: #fff; }

    .xp-table.svelte-coljjc { width: 100%; border-collapse: collapse; font-size: 11px; }
    .xp-table.svelte-coljjc th:where(.svelte-coljjc) {
        background: #d4d0c8; border-bottom: 1px solid #aca899;
        border-right: 1px solid #aca899; text-align: left; padding: 3px 5px;
        font-size: 10px; position: sticky; top: 0;
    }
    .xp-table.svelte-coljjc td:where(.svelte-coljjc) { border-bottom: 1px dotted #ddd; padding: 3px 5px; border-right: 1px dotted #eee; vertical-align: top; }
    .xp-table.svelte-coljjc tr:where(.svelte-coljjc):nth-child(even) td:where(.svelte-coljjc) { background: #f7f7f5; }
    .table-empty.svelte-coljjc { text-align: center; color: #999; font-style: italic; padding: 12px; }
    .sub-tag.svelte-coljjc { color: #6a1b9a; font-weight: bold; }
    .sub-summary.svelte-coljjc { font-size: 9px; color: #666; font-style: italic; margin-top: 1px; }
    .extras.svelte-coljjc { display: flex; flex-wrap: wrap; gap: 2px; }
    .ex-badge.svelte-coljjc {
        display: inline-block; font-size: 8px; font-weight: bold;
        padding: 1px 3px; border-radius: 2px; color: #fff;
    }
    .ex-badge.lic.svelte-coljjc { background: #1565c0; }
    .ex-badge.veh.svelte-coljjc { background: #2e7d32; }

    .calc-box.svelte-coljjc {
        padding: 8px; border-top: 2px groove #aca899;
        background: #ece9d8; display: flex; flex-direction: column; gap: 4px;
        flex-shrink: 0;
    }
    .plea-row.svelte-coljjc { display: flex; align-items: center; gap: 5px; cursor: pointer; }
    .calc-sep.svelte-coljjc { height: 1px; background: #aca899; margin: 2px 0; }
    .calc-row.svelte-coljjc { display: flex; justify-content: space-between; font-size: 12px; }
    .red.svelte-coljjc { color: #cc0000; }

    .narr-layout.svelte-coljjc { display: flex; flex-direction: column; height: 100%; gap: 5px; }
    .narr-toolbar.svelte-coljjc {
        display: flex; align-items: center; gap: 5px; flex-shrink: 0;
        padding-bottom: 5px; border-bottom: 1px solid #aca899;
    }
    .narr-area.svelte-coljjc {
        flex: 1; resize: none; padding: 6px;
        font-family: 'Courier New', monospace; font-size: 12px; line-height: 1.5;
        border: 2px inset #fff; background: #fff; outline: none; color: #111;
    }
    .narr-area.svelte-coljjc:disabled { background: #f0f0f0; }

    .empty-ws.svelte-coljjc {
        flex: 1; display: flex; flex-direction: column;
        align-items: center; justify-content: center;
        gap: 10px; color: #888; background: #ece9d8;
        border: 2px inset #fff; margin: 5px;
    }

    .xp-btn.svelte-coljjc {
        padding: 3px 8px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif;
        white-space: nowrap;
    }
    .xp-btn.svelte-coljjc:hover { background: #f5f3ef; }
    .xp-btn.svelte-coljjc:active {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }
    .xp-btn.svelte-coljjc:disabled { color: #888; cursor: default; opacity: 0.7; }
    .xp-btn.full.svelte-coljjc { width: 100%; text-align: left; }
    .xp-btn.small.svelte-coljjc { padding: 1px 6px; font-size: 10px; }
    .xp-btn.bold.svelte-coljjc { font-weight: bold; }

    .xp-input.svelte-coljjc {
        border: 2px inset #fff; padding: 2px 4px;
        font-size: 11px; font-family: 'Tahoma', sans-serif; background: #fff;
    }
    .xp-input.svelte-coljjc:disabled { background: #e8e8e8; color: #666; }
    .xp-input.tiny.svelte-coljjc { padding: 1px 3px; font-size: 10px; height: 18px; }

    .del-btn.svelte-coljjc {
        border: none; background: none; color: #999;
        cursor: pointer; font-weight: bold; font-size: 12px; padding: 0 3px;
    }
    .del-btn.svelte-coljjc:hover { color: #cc0000; }

    /* ── Modal ── */
    .modal-overlay.svelte-coljjc {
        position: fixed; inset: 0; background: rgba(0,0,0,0.45);
        display: flex; align-items: center; justify-content: center;
        z-index: 9999;
    }
    .modal-box.svelte-coljjc {
        background: #ece9d8; border: 2px outset #fff;
        box-shadow: 4px 4px 10px rgba(0,0,0,0.4);
        min-width: 520px; max-width: 720px; max-height: 80vh;
        display: flex; flex-direction: column;
        font-family: 'Tahoma', sans-serif; font-size: 11px;
    }
    .modal-title.svelte-coljjc {
        display: flex; align-items: center; gap: 6px;
        background: #000080; color: #fff;
        padding: 4px 8px; font-weight: bold; font-size: 12px;
        flex-shrink: 0;
    }
    .modal-close.svelte-coljjc {
        margin-left: auto; background: #ece9d8; color: #000;
        border: 1px outset #fff; cursor: pointer;
        width: 18px; height: 18px; line-height: 14px; font-size: 14px;
        padding: 0;
    }
    .modal-sub.svelte-coljjc {
        padding: 6px 10px 2px; font-weight: bold; color: #555;
    }
    .modal-options.svelte-coljjc {
        display: flex; flex-direction: column; gap: 4px;
        padding: 6px 10px; overflow-y: auto;
    }
    .modal-opt.svelte-coljjc {
        text-align: left; background: #fff; border: 1px solid #aca899;
        padding: 6px 8px; cursor: pointer; font-family: inherit; font-size: 11px;
        display: flex; flex-direction: column; gap: 3px;
    }
    .modal-opt.svelte-coljjc:hover { background: #ffffcc; border-color: #e68b2c; }
    .mo-head.svelte-coljjc { display: flex; align-items: center; gap: 6px; }
    .mo-label.svelte-coljjc { font-weight: bold; color: #6a1b9a; font-size: 13px; }
    .mo-time.svelte-coljjc { font-family: monospace; color: #000080; font-weight: bold; }
    .mo-fine.svelte-coljjc { color: #cc0000; font-weight: bold; font-family: monospace; }
    .mo-summary.svelte-coljjc { color: #333; }
    .mo-meta.svelte-coljjc { display: flex; gap: 4px; flex-wrap: wrap; }
    .modal-notes.svelte-coljjc {
        padding: 6px 10px; font-size: 10px; color: #666;
        background: #fffacc; border-top: 1px solid #aca899; font-style: italic;
        flex-shrink: 0;
    }

    .pc-layout.svelte-8s5ytw {
        display: flex; height: 100%;
        font-family: 'Tahoma', sans-serif; font-size: 11px;
        background: #ece9d8; overflow: hidden;
    }

    /* ── Sidebar ── */
    .pc-sidebar.svelte-8s5ytw {
        width: 250px; min-width: 250px;
        display: flex; flex-direction: column;
        border-right: 1px solid #aca899;
        background: #ece9d8; overflow-y: auto;
    }
    .pc-side-header.svelte-8s5ytw {
        background: #000080; color: #fff;
        padding: 5px 8px; font-weight: bold; font-size: 12px;
        position: sticky; top: 0; z-index: 1;
    }
    .pc-side-row.svelte-8s5ytw {
        display: flex; align-items: center; gap: 6px;
        padding: 5px 8px; background: none;
        border: none; border-bottom: 1px dotted #ccc;
        cursor: pointer; text-align: left; width: 100%;
        font-family: inherit; font-size: 11px;
    }
    .pc-side-row.svelte-8s5ytw:hover { background: #ffffcc; }
    .pc-side-row.active.svelte-8s5ytw { background: #000080; color: #fff; }
    .pc-side-id.svelte-8s5ytw {
        font-family: monospace; font-weight: bold;
        min-width: 28px; color: #000080;
    }
    .pc-side-row.active.svelte-8s5ytw .pc-side-id:where(.svelte-8s5ytw) { color: #ffcc88; }
    .pc-side-name.svelte-8s5ytw { flex: 1; }
    .pc-side-count.svelte-8s5ytw {
        font-size: 9px; color: #888;
        background: #fff; border: 1px solid #aca899;
        padding: 0 4px; border-radius: 8px; min-width: 18px; text-align: center;
    }
    .pc-side-row.active.svelte-8s5ytw .pc-side-count:where(.svelte-8s5ytw) { background: #ffcc88; color: #000; border-color: #fff; }

    .pc-legend.svelte-8s5ytw {
        margin-top: auto; padding: 8px; background: #fff;
        border-top: 1px solid #aca899; flex-shrink: 0;
        display: flex; flex-direction: column; gap: 3px;
    }
    .pc-legend-row.svelte-8s5ytw { display: flex; align-items: center; gap: 5px; font-size: 10px; color: #444; }

    /* ── Main ── */
    .pc-main.svelte-8s5ytw { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
    .pc-toolbar.svelte-8s5ytw {
        display: flex; gap: 6px; align-items: center;
        padding: 5px 8px; background: #ece9d8;
        border-bottom: 1px solid #aca899; flex-shrink: 0;
    }
    .pc-count.svelte-8s5ytw { font-size: 10px; color: #666; font-weight: bold; }

    .pc-body.svelte-8s5ytw { flex: 1; overflow-y: auto; padding: 8px; background: #fff; }

    .pc-title-section.svelte-8s5ytw { margin-bottom: 16px; }
    .pc-title-h.svelte-8s5ytw {
        font-size: 12px; font-weight: bold; color: #fff;
        background: #000080; padding: 4px 8px; margin: 0 0 4px 0;
        position: sticky; top: 0; z-index: 1;
    }
    .pc-articles.svelte-8s5ytw { display: flex; flex-direction: column; gap: 6px; }
    .pc-article.svelte-8s5ytw {
        border: 1px solid #aca899; background: #fffef8;
        padding: 6px 8px;
    }
    .pc-article-head.svelte-8s5ytw {
        display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
    }
    .pc-art-code.svelte-8s5ytw {
        font-family: monospace; font-weight: bold; color: #000080;
        min-width: 50px;
    }
    .pc-art-title.svelte-8s5ytw { font-weight: bold; color: #111; }
    .pc-art-spacer.svelte-8s5ytw { flex: 1; }
    .pc-art-time.svelte-8s5ytw { font-family: monospace; color: #555; font-weight: bold; }
    .pc-art-fine.svelte-8s5ytw { font-family: monospace; color: #cc0000; font-weight: bold; }

    .pc-art-meta.svelte-8s5ytw {
        display: flex; gap: 4px; flex-wrap: wrap;
        margin-top: 4px; align-items: center;
    }
    .pc-meta-label.svelte-8s5ytw { font-size: 10px; color: #888; }

    .pc-sub-list.svelte-8s5ytw {
        margin-top: 4px; padding: 4px 6px;
        background: #f7f5e8; border: 1px dashed #aca899;
        display: flex; flex-direction: column; gap: 3px;
    }
    .pc-sub-row.svelte-8s5ytw {
        display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
        font-size: 11px;
    }
    .pc-sub-label.svelte-8s5ytw { font-weight: bold; color: #6a1b9a; min-width: 22px; }
    .pc-sub-summary.svelte-8s5ytw { flex: 1; color: #333; min-width: 200px; }
    .pc-sub-time.svelte-8s5ytw { font-family: monospace; color: #555; }
    .pc-sub-classes.svelte-8s5ytw { display: flex; gap: 3px; }

    .pc-notes.svelte-8s5ytw {
        margin-top: 4px; padding: 3px 6px;
        background: #fffacc; border-left: 3px solid #d97e1a;
        font-size: 10px; color: #555; font-style: italic;
    }

    .pc-empty.svelte-8s5ytw { padding: 24px; text-align: center; color: #999; font-style: italic; }

    /* shared badges (duplicated from ReportsPage for self-containment) */
    .pc-typebadge.svelte-8s5ytw {
        display: inline-block; min-width: 14px; text-align: center;
        font-weight: bold; font-size: 9px; color: #fff;
        border-radius: 2px; padding: 0 3px;
    }
    .type-I.svelte-8s5ytw { background: #c41616; }
    .type-D.svelte-8s5ytw { background: #d97e1a; }
    .type-C.svelte-8s5ytw { background: #6e6e6e; }
    .pc-class.svelte-8s5ytw {
        display: inline-block; font-weight: bold; font-size: 9px;
        color: #fff; padding: 1px 4px; min-width: 14px; text-align: center;
        border-radius: 2px;
    }
    .class-A.svelte-8s5ytw { background: #8b1a1a; }
    .class-B.svelte-8s5ytw { background: #b9772a; }
    .class-C.svelte-8s5ytw { background: #444; }
    .pc-judge.svelte-8s5ytw {
        display: inline-block; background: #6a1b9a; color: #fff;
        font-weight: bold; padding: 1px 6px; font-size: 10px; border-radius: 2px;
    }
    .ex-badge.svelte-8s5ytw {
        display: inline-block; font-size: 9px; font-weight: bold;
        padding: 1px 4px; border-radius: 2px; color: #fff;
    }
    .ex-badge.lic.svelte-8s5ytw { background: #1565c0; }
    .ex-badge.veh.svelte-8s5ytw { background: #2e7d32; }

    .xp-input.svelte-8s5ytw {
        border: 2px inset #fff; padding: 2px 6px;
        font-size: 11px; font-family: 'Tahoma', sans-serif; background: #fff;
    }
    .flex1.svelte-8s5ytw { flex: 1; }

    .history-root.svelte-1ahrv9a {
        height: 100%; display: flex; flex-direction: column;
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
        font-size: 11px; background: #ece9d8; overflow: hidden;
    }

    /* Tab Nav */
    .tab-nav.svelte-1ahrv9a {
        display: flex; align-items: center; gap: 0;
        background: #ece9d8; border-bottom: 2px groove #aca899;
        padding: 4px 6px 0; flex-shrink: 0;
    }
    .htab.svelte-1ahrv9a {
        padding: 4px 12px; background: #d4d0c8;
        border: 1px solid #aca899; border-bottom: none;
        cursor: pointer; font-size: 11px; font-family: 'Tahoma', sans-serif;
        margin-right: 2px; position: relative; top: 1px;
    }
    .htab.svelte-1ahrv9a:hover:not(.active) { background: #ddd9d0; }
    .htab.active.svelte-1ahrv9a {
        background: #ece9d8; font-weight: bold;
        border-top: 2px solid #000080; z-index: 1;
    }
    .sup-badge.svelte-1ahrv9a {
        margin-left: auto; font-size: 9px; font-weight: bold;
        letter-spacing: 1px; background: #8b0000; color: #fff;
        padding: 2px 6px; white-space: nowrap; align-self: center;
    }

    /* Filter bar */
    .filter-bar.svelte-1ahrv9a {
        display: flex; align-items: center; gap: 5px; flex-shrink: 0;
        padding: 4px 7px; border-bottom: 1px solid #aca899;
    }
    .f-label.svelte-1ahrv9a { font-weight: bold; color: #444; white-space: nowrap; }
    .f-hint.svelte-1ahrv9a  { font-size: 10px; color: #888; font-style: italic; }

    .xp-input.svelte-1ahrv9a {
        border: 2px inset #fff; padding: 2px 4px;
        font-size: 11px; font-family: 'Tahoma', sans-serif; background: #fff;
        width: 140px;
    }

    /* Table */
    .table-wrap.svelte-1ahrv9a {
        flex: 1; overflow-y: auto; background: #fff; border: 2px inset #fff;
        margin: 4px;
    }

    .status-msg.svelte-1ahrv9a {
        padding: 20px; text-align: center; color: #aaa; font-style: italic;
    }

    .log-table.svelte-1ahrv9a { width: 100%; border-collapse: collapse; font-size: 11px; }
    .log-table.svelte-1ahrv9a th:where(.svelte-1ahrv9a) {
        background: #d4d0c8; border-bottom: 1px solid #aca899;
        border-right: 1px solid #aca899;
        text-align: left; padding: 3px 6px; font-size: 10px;
        position: sticky; top: 0;
    }
    .log-table.svelte-1ahrv9a td:where(.svelte-1ahrv9a) {
        border-bottom: 1px dotted #ddd; padding: 3px 6px;
        border-right: 1px dotted #eee; vertical-align: middle;
    }
    .log-table.svelte-1ahrv9a tr:where(.svelte-1ahrv9a):nth-child(even) td:where(.svelte-1ahrv9a) { background: #f7f7f5; }
    .log-table.svelte-1ahrv9a tr:where(.svelte-1ahrv9a):hover td:where(.svelte-1ahrv9a) { background: #eef3ff; }
    .log-table.svelte-1ahrv9a tr.log-row:where(.svelte-1ahrv9a) { cursor: pointer; }
    .log-table.svelte-1ahrv9a tr.log-row.selected:where(.svelte-1ahrv9a) td:where(.svelte-1ahrv9a) { background: #000080 !important; color: #fff; }
    .log-table.svelte-1ahrv9a tr.log-row.selected:where(.svelte-1ahrv9a) .action-tag:where(.svelte-1ahrv9a) { background: #fff; color: #000080; }
    .log-table.svelte-1ahrv9a tr.log-row.selected:where(.svelte-1ahrv9a) .mono:where(.svelte-1ahrv9a) { color: #ccc; }
    .details-cell.svelte-1ahrv9a {
        max-width: 300px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .mono.svelte-1ahrv9a  { font-family: monospace; font-size: 10px; color: #555; white-space: nowrap; }
    .bold.svelte-1ahrv9a  { font-weight: bold; }
    .muted.svelte-1ahrv9a { color: #aaa; font-style: italic; }

    .action-tag.svelte-1ahrv9a {
        font-weight: bold; font-size: 10px; color: #000080;
        background: #e8eaf6; border: 1px solid #9999cc;
        padding: 1px 4px; white-space: nowrap;
    }

    .code-tag.svelte-1ahrv9a {
        font-weight: bold; font-size: 10px; color: #884400;
        background: #fff8e8; border: 1px solid #ccaa66;
        padding: 1px 4px; white-space: nowrap;
    }

    .units-row.svelte-1ahrv9a { display: flex; flex-wrap: wrap; gap: 2px; }
    .unit-pill.svelte-1ahrv9a {
        background: #000080; color: #fff;
        font-size: 9px; padding: 1px 4px; font-family: monospace;
    }

    /* Footer */
    .footer-bar.svelte-1ahrv9a {
        font-size: 10px; color: #888; text-align: right;
        padding: 2px 4px; flex-shrink: 0;
        border-top: 1px solid #aca899;
    }

    /* Log Detail Panel */
    .log-detail-panel.svelte-1ahrv9a {
        flex-shrink: 0;
        border: 2px groove #aca899;
        margin: 0 4px 4px;
        background: #ece9d8;
    }
    .detail-header.svelte-1ahrv9a {
        background: #000080;
        color: #fff;
        padding: 3px 6px;
        font-weight: bold;
        font-size: 11px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .detail-title.svelte-1ahrv9a { letter-spacing: 1px; }
    .close-btn.svelte-1ahrv9a {
        background: #c0c0c0;
        border: 1px outset #fff;
        color: #000;
        font-size: 10px;
        font-weight: bold;
        width: 16px;
        height: 14px;
        cursor: pointer;
        font-family: 'Tahoma', sans-serif;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .close-btn.svelte-1ahrv9a:hover { background: #e0e0e0; }
    .close-btn.svelte-1ahrv9a:active { border-style: inset; }
    .detail-body.svelte-1ahrv9a {
        padding: 8px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 6px 12px;
    }
    .detail-row.svelte-1ahrv9a {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    .detail-row.full-width.svelte-1ahrv9a {
        grid-column: span 2;
    }
    .detail-label.svelte-1ahrv9a {
        font-size: 9px;
        font-weight: bold;
        color: #666;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    .detail-value.svelte-1ahrv9a {
        font-size: 12px;
        color: #000;
    }
    .detail-text.svelte-1ahrv9a {
        font-size: 12px;
        color: #000;
        background: #fff;
        border: 2px inset #fff;
        padding: 6px;
        white-space: pre-wrap;
        word-break: break-word;
        min-height: 40px;
        max-height: 100px;
        overflow-y: auto;
    }

    /* Related Incident/Call sections */
    .related-section.svelte-1ahrv9a {
        margin-top: 4px;
    }
    .related-box.svelte-1ahrv9a {
        background: #fff;
        border: 2px inset #fff;
        padding: 6px;
    }
    .related-box.incident.svelte-1ahrv9a {
        border-left: 3px solid #884400;
    }
    .related-box.call.svelte-1ahrv9a {
        border-left: 3px solid #000080;
    }
    .related-header.svelte-1ahrv9a {
        display: flex;
        gap: 8px;
        align-items: center;
        margin-bottom: 4px;
    }
    .related-code.svelte-1ahrv9a {
        font-weight: bold;
        font-size: 10px;
        color: #884400;
        background: #fff8e8;
        border: 1px solid #ccaa66;
        padding: 1px 4px;
    }
    .related-title.svelte-1ahrv9a {
        font-weight: bold;
        font-size: 12px;
        color: #000;
    }
    .related-caller.svelte-1ahrv9a {
        font-weight: bold;
        font-size: 11px;
        color: #000080;
    }
    .related-time.svelte-1ahrv9a {
        font-size: 10px;
        color: #666;
        font-family: monospace;
    }
    .related-info.svelte-1ahrv9a {
        display: flex;
        gap: 12px;
        font-size: 11px;
        color: #333;
        margin-bottom: 4px;
    }
    .related-notes.svelte-1ahrv9a, .related-message.svelte-1ahrv9a {
        font-size: 11px;
        color: #000;
        background: #f9f9f9;
        padding: 4px;
        border: 1px dotted #ccc;
        margin-top: 4px;
        white-space: pre-wrap;
        word-break: break-word;
        max-height: 60px;
        overflow-y: auto;
    }

    /* Buttons */
    .xp-btn.svelte-1ahrv9a {
        padding: 3px 10px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif; white-space: nowrap;
    }
    .xp-btn.svelte-1ahrv9a:hover { background: #f5f3ef; }
    .xp-btn.svelte-1ahrv9a:active {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }
    .xp-btn.svelte-1ahrv9a:disabled { color: #888; cursor: default; opacity: 0.7; }
/* required styles */

.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
	position: absolute;
	left: 0;
	top: 0;
	}
.leaflet-container {
	overflow: hidden;
	}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	  -webkit-user-drag: none;
	}
/* Prevents IE11 from highlighting tiles in blue */
.leaflet-tile::selection {
	background: transparent;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
	image-rendering: -webkit-optimize-contrast;
	}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
	width: 1600px;
	height: 1600px;
	-webkit-transform-origin: 0 0;
	}
.leaflet-marker-icon,
.leaflet-marker-shadow {
	display: block;
	}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg {
	max-width: none !important;
	max-height: none !important;
	}
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
	max-width: none !important;
	max-height: none !important;
	width: auto;
	padding: 0;
	}

.leaflet-container img.leaflet-tile {
	/* See: https://bugs.chromium.org/p/chromium/issues/detail?id=600120 */
	mix-blend-mode: plus-lighter;
}

.leaflet-container.leaflet-touch-zoom {
	-ms-touch-action: pan-x pan-y;
	touch-action: pan-x pan-y;
	}
.leaflet-container.leaflet-touch-drag {
	-ms-touch-action: pinch-zoom;
	/* Fallback for FF which doesn't support pinch-zoom */
	touch-action: none;
	touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	-ms-touch-action: none;
	touch-action: none;
}
.leaflet-container {
	-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.leaflet-tile {
	filter: inherit;
	visibility: hidden;
	}
.leaflet-tile-loaded {
	visibility: inherit;
	}
.leaflet-zoom-box {
	width: 0;
	height: 0;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	z-index: 800;
	}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
	-moz-user-select: none;
	}

.leaflet-pane         { z-index: 400; }

.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }

.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }

.leaflet-vml-shape {
	width: 1px;
	height: 1px;
	}
.lvml {
	behavior: url(#default#VML);
	display: inline-block;
	position: absolute;
	}


/* control positioning */

.leaflet-control {
	position: relative;
	z-index: 800;
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}
.leaflet-top,
.leaflet-bottom {
	position: absolute;
	z-index: 1000;
	pointer-events: none;
	}
.leaflet-top {
	top: 0;
	}
.leaflet-right {
	right: 0;
	}
.leaflet-bottom {
	bottom: 0;
	}
.leaflet-left {
	left: 0;
	}
.leaflet-control {
	float: left;
	clear: both;
	}
.leaflet-right .leaflet-control {
	float: right;
	}
.leaflet-top .leaflet-control {
	margin-top: 10px;
	}
.leaflet-bottom .leaflet-control {
	margin-bottom: 10px;
	}
.leaflet-left .leaflet-control {
	margin-left: 10px;
	}
.leaflet-right .leaflet-control {
	margin-right: 10px;
	}


/* zoom and fade animations */

.leaflet-fade-anim .leaflet-popup {
	opacity: 0;
	-webkit-transition: opacity 0.2s linear;
	   -moz-transition: opacity 0.2s linear;
	        transition: opacity 0.2s linear;
	}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
	opacity: 1;
	}
.leaflet-zoom-animated {
	-webkit-transform-origin: 0 0;
	    -ms-transform-origin: 0 0;
	        transform-origin: 0 0;
	}
svg.leaflet-zoom-animated {
	will-change: transform;
}

.leaflet-zoom-anim .leaflet-zoom-animated {
	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
	}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
	-webkit-transition: none;
	   -moz-transition: none;
	        transition: none;
	}

.leaflet-zoom-anim .leaflet-zoom-hide {
	visibility: hidden;
	}


/* cursors */

.leaflet-interactive {
	cursor: pointer;
	}
.leaflet-grab {
	cursor: -webkit-grab;
	cursor:    -moz-grab;
	cursor:         grab;
	}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
	cursor: crosshair;
	}
.leaflet-popup-pane,
.leaflet-control {
	cursor: auto;
	}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
	cursor: move;
	cursor: -webkit-grabbing;
	cursor:    -moz-grabbing;
	cursor:         grabbing;
	}

/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
	pointer-events: none;
	}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}

/* visual tweaks */

.leaflet-container {
	background: #ddd;
	outline-offset: 1px;
	}
.leaflet-container a {
	color: #0078A8;
	}
.leaflet-zoom-box {
	border: 2px dotted #38f;
	background: rgba(255,255,255,0.5);
	}


/* general typography */
.leaflet-container {
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1.5;
	}


/* general toolbar styles */

.leaflet-bar {
	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
	border-radius: 4px;
	}
.leaflet-bar a {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
	width: 26px;
	height: 26px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
.leaflet-bar a,
.leaflet-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
	}
.leaflet-bar a:hover,
.leaflet-bar a:focus {
	background-color: #f4f4f4;
	}
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: none;
	}
.leaflet-bar a.leaflet-disabled {
	cursor: default;
	background-color: #f4f4f4;
	color: #bbb;
	}

.leaflet-touch .leaflet-bar a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 18px 'Lucida Console', Monaco, monospace;
	text-indent: 1px;
	}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
	font-size: 22px;
	}


/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
	background: #fff;
	border-radius: 5px;
	}
.leaflet-control-layers-toggle {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAACf0lEQVR4AY1UM3gkARTePdvdoTxXKc+qTl3aU5U6b2Kbkz3Gtq3Zw6ziLGNPzrYx7946Tr6/ee/XeCQ4D3ykPtL5tHno4n0d/h3+xfuWHGLX81cn7r0iTNzjr7LrlxCqPtkbTQEHeqOrTy4Yyt3VCi/IOB0v7rVC7q45Q3Gr5K6jt+3Gl5nCoDD4MtO+j96Wu8atmhGqcNGHObuf8OM/x3AMx38+4Z2sPqzCxRFK2aF2e5Jol56XTLyggAMTL56XOMoS1W4pOyjUcGGQdZxU6qRh7B9Zp+PfpOFlqt0zyDZckPi1ttmIp03jX8gyJ8a/PG2yutpS/Vol7peZIbZcKBAEEheEIAgFbDkz5H6Zrkm2hVWGiXKiF4Ycw0RWKdtC16Q7qe3X4iOMxruonzegJzWaXFrU9utOSsLUmrc0YjeWYjCW4PDMADElpJSSQ0vQvA1Tm6/JlKnqFs1EGyZiFCqnRZTEJJJiKRYzVYzJck2Rm6P4iH+cmSY0YzimYa8l0EtTODFWhcMIMVqdsI2uiTvKmTisIDHJ3od5GILVhBCarCfVRmo4uTjkhrhzkiBV7SsaqS+TzrzM1qpGGUFt28pIySQHR6h7F6KSwGWm97ay+Z+ZqMcEjEWebE7wxCSQwpkhJqoZA5ivCdZDjJepuJ9IQjGGUmuXJdBFUygxVqVsxFsLMbDe8ZbDYVCGKxs+W080max1hFCarCfV+C1KATwcnvE9gRRuMP2prdbWGowm1KB1y+zwMMENkM755cJ2yPDtqhTI6ED1M/82yIDtC/4j4BijjeObflpO9I9MwXTCsSX8jWAFeHr05WoLTJ5G8IQVS/7vwR6ohirYM7f6HzYpogfS3R2OAAAAAElFTkSuQmCC);
	width: 36px;
	height: 36px;
	}
.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAAA0CAQAAABvcdNgAAAEsklEQVR4AWL4TydIhpZK1kpWOlg0w3ZXP6D2soBtG42jeI6ZmQTHzAxiTbSJsYLjO9HhP+WOmcuhciVnmHVQcJnp7DFvScowZorad/+V/fVzMdMT2g9Cv9guXGv/7pYOrXh2U+RRR3dSd9JRx6bIFc/ekqHI29JC6pJ5ZEh1yWkhkbcFeSjxgx3L2m1cb1C7bceyxA+CNjT/Ifff+/kDk2u/w/33/IeCMOSaWZ4glosqT3DNnNZQ7Cs58/3Ce5HL78iZH/vKVIaYlqzfdLu8Vi7dnvUbEza5Idt36tquZFldl6N5Z/POLof0XLK61mZCmJSWjVF9tEjUluu74IUXvgttuVIHE7YxSkaYhJZam7yiM9Pv82JYfl9nptxZaxMJE4YSPty+vF0+Y2up9d3wwijfjZbabqm/3bZ9ecKHsiGmRflnn1MW4pjHf9oLufyn2z3y1D6n8g8TZhxyzipLNPnAUpsOiuWimg52psrTZYnOWYNDTMuWBWa0tJb4rgq1UvmutpaYEbZlwU3CLJm/ayYjHW5/h7xWLn9Hh1vepDkyf7dE7MtT5LR4e7yYpHrkhOUpEfssBLq2pPhAqoSWKUkk7EDqkmK6RrCEzqDjhNDWNE+XSMvkJRDWlZTmCW0l0PHQGRZY5t1L83kT0Y3l2SItk5JAWHl2dCOBm+fPu3fo5/3v61RMCO9Jx2EEYYhb0rmNQMX/vm7gqOEJLcXTGw3CAuRNeyaPWwjR8PRqKQ1PDA/dpv+on9Shox52WFnx0KY8onHayrJzm87i5h9xGw/tfkev0jGsQizqezUKjk12hBMKJ4kbCqGPVNXudyyrShovGw5CgxsRICxF6aRmSjlBnHRzg7Gx8fKqEubI2rahQYdR1YgDIRQO7JvQyD52hoIQx0mxa0ODtW2Iozn1le2iIRdzwWewedyZzewidueOGqlsn1MvcnQpuVwLGG3/IR1hIKxCjelIDZ8ldqWz25jWAsnldEnK0Zxro19TGVb2ffIZEsIO89EIEDvKMPrzmBOQcKQ+rroye6NgRRxqR4U8EAkz0CL6uSGOm6KQCdWjvjRiSP1BPalCRS5iQYiEIvxuBMJEWgzSoHADcVMuN7IuqqTeyUPq22qFimFtxDyBBJEwNyt6TM88blFHao/6tWWhuuOM4SAK4EI4QmFHA+SEyWlp4EQoJ13cYGzMu7yszEIBOm2rVmHUNqwAIQabISNMRstmdhNWcFLsSm+0tjJH1MdRxO5Nx0WDMhCtgD6OKgZeljJqJKc9po8juskR9XN0Y1lZ3mWjLR9JCO1jRDMd0fpYC2VnvjBSEFg7wBENc0R9HFlb0xvF1+TBEpF68d+DHR6IOWVv2BECtxo46hOFUBd/APU57WIoEwJhIi2CdpyZX0m93BZicktMj1AS9dClteUFAUNUIEygRZCtik5zSxI9MubTBH1GOiHsiLJ3OCoSZkILa9PxiN0EbvhsAo8tdAf9Seepd36lGWHmtNANTv5Jd0z4QYyeo/UEJqxKRpg5LZx6btLPsOaEmdMyxYdlc8LMaJnikDlhclqmPiQnTEpLUIZEwkRagjYkEibQErwhkTAKCLQEbUgkzJQWc/0PstHHcfEdQ+UAAAAASUVORK5CYII=);
	background-size: 26px 26px;
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 44px;
	height: 44px;
	}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
	}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
	position: relative;
	}
.leaflet-control-layers-expanded {
	padding: 6px 10px 6px 6px;
	color: #333;
	background: #fff;
	}
.leaflet-control-layers-scrollbar {
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 5px;
	}
.leaflet-control-layers-selector {
	margin-top: 2px;
	position: relative;
	top: 1px;
	}
.leaflet-control-layers label {
	display: block;
	font-size: 13px;
	font-size: 1.08333em;
	}
.leaflet-control-layers-separator {
	height: 0;
	border-top: 1px solid #ddd;
	margin: 5px -10px 5px -6px;
	}

/* Default icon URLs */
.leaflet-default-icon-path { /* used only in path-guessing heuristic, see L.Icon.Default */
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAApCAYAAADAk4LOAAAFgUlEQVR4Aa1XA5BjWRTN2oW17d3YaZtr2962HUzbDNpjszW24mRt28p47v7zq/bXZtrp/lWnXr337j3nPCe85NcypgSFdugCpW5YoDAMRaIMqRi6aKq5E3YqDQO3qAwjVWrD8Ncq/RBpykd8oZUb/kaJutow8r1aP9II0WmLKLIsJyv1w/kqw9Ch2MYdB++12Onxee/QMwvf4/Dk/Lfp/i4nxTXtOoQ4pW5Aj7wpici1A9erdAN2OH64x8OSP9j3Ft3b7aWkTg/Fm91siTra0f9on5sQr9INejH6CUUUpavjFNq1B+Oadhxmnfa8RfEmN8VNAsQhPqF55xHkMzz3jSmChWU6f7/XZKNH+9+hBLOHYozuKQPxyMPUKkrX/K0uWnfFaJGS1QPRtZsOPtr3NsW0uyh6NNCOkU3Yz+bXbT3I8G3xE5EXLXtCXbbqwCO9zPQYPRTZ5vIDXD7U+w7rFDEoUUf7ibHIR4y6bLVPXrz8JVZEql13trxwue/uDivd3fkWRbS6/IA2bID4uk0UpF1N8qLlbBlXs4Ee7HLTfV1j54APvODnSfOWBqtKVvjgLKzF5YdEk5ewRkGlK0i33Eofffc7HT56jD7/6U+qH3Cx7SBLNntH5YIPvODnyfIXZYRVDPqgHtLs5ABHD3YzLuespb7t79FY34DjMwrVrcTuwlT55YMPvOBnRrJ4VXTdNnYug5ucHLBjEpt30701A3Ts+HEa73u6dT3FNWwflY86eMHPk+Yu+i6pzUpRrW7SNDg5JHR4KapmM5Wv2E8Tfcb1HoqqHMHU+uWDD7zg54mz5/2BSnizi9T1Dg4QQXLToGNCkb6tb1NU+QAlGr1++eADrzhn/u8Q2YZhQVlZ5+CAOtqfbhmaUCS1ezNFVm2imDbPmPng5wmz+gwh+oHDce0eUtQ6OGDIyR0uUhUsoO3vfDmmgOezH0mZN59x7MBi++WDL1g/eEiU3avlidO671bkLfwbw5XV2P8Pzo0ydy4t2/0eu33xYSOMOD8hTf4CrBtGMSoXfPLchX+J0ruSePw3LZeK0juPJbYzrhkH0io7B3k164hiGvawhOKMLkrQLyVpZg8rHFW7E2uHOL888IBPlNZ1FPzstSJM694fWr6RwpvcJK60+0HCILTBzZLFNdtAzJaohze60T8qBzyh5ZuOg5e7uwQppofEmf2++DYvmySqGBuKaicF1blQjhuHdvCIMvp8whTTfZzI7RldpwtSzL+F1+wkdZ2TBOW2gIF88PBTzD/gpeREAMEbxnJcaJHNHrpzji0gQCS6hdkEeYt9DF/2qPcEC8RM28Hwmr3sdNyht00byAut2k3gufWNtgtOEOFGUwcXWNDbdNbpgBGxEvKkOQsxivJx33iow0Vw5S6SVTrpVq11ysA2Rp7gTfPfktc6zhtXBBC+adRLshf6sG2RfHPZ5EAc4sVZ83yCN00Fk/4kggu40ZTvIEm5g24qtU4KjBrx/BTTH8ifVASAG7gKrnWxJDcU7x8X6Ecczhm3o6YicvsLXWfh3Ch1W0k8x0nXF+0fFxgt4phz8QvypiwCCFKMqXCnqXExjq10beH+UUA7+nG6mdG/Pu0f3LgFcGrl2s0kNNjpmoJ9o4B29CMO8dMT4Q5ox8uitF6fqsrJOr8qnwNbRzv6hSnG5wP+64C7h9lp30hKNtKdWjtdkbuPA19nJ7Tz3zR/ibgARbhb4AlhavcBebmTHcFl2fvYEnW0ox9xMxKBS8btJ+KiEbq9zA4RthQXDhPa0T9TEe69gWupwc6uBUphquXgf+/FrIjweHQS4/pduMe5ERUMHUd9xv8ZR98CxkS4F2n3EUrUZ10EYNw7BWm9x1GiPssi3GgiGRDKWRYZfXlON+dfNbM+GgIwYdwAAAAASUVORK5CYII=);
	}


/* attribution and scale controls */

.leaflet-container .leaflet-control-attribution {
	background: #fff;
	background: rgba(255, 255, 255, 0.8);
	margin: 0;
	}
.leaflet-control-attribution,
.leaflet-control-scale-line {
	padding: 0 5px;
	color: #333;
	line-height: 1.4;
	}
.leaflet-control-attribution a {
	text-decoration: none;
	}
.leaflet-control-attribution a:hover,
.leaflet-control-attribution a:focus {
	text-decoration: underline;
	}
.leaflet-attribution-flag {
	display: inline !important;
	vertical-align: baseline !important;
	width: 1em;
	height: 0.6669em;
	}
.leaflet-left .leaflet-control-scale {
	margin-left: 5px;
	}
.leaflet-bottom .leaflet-control-scale {
	margin-bottom: 5px;
	}
.leaflet-control-scale-line {
	border: 2px solid #777;
	border-top: none;
	line-height: 1.1;
	padding: 2px 5px 1px;
	white-space: nowrap;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	background: rgba(255, 255, 255, 0.8);
	text-shadow: 1px 1px #fff;
	}
.leaflet-control-scale-line:not(:first-child) {
	border-top: 2px solid #777;
	border-bottom: none;
	margin-top: -2px;
	}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
	border-bottom: 2px solid #777;
	}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	box-shadow: none;
	}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 2px solid rgba(0,0,0,0.2);
	background-clip: padding-box;
	}


/* popup */

.leaflet-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 20px;
	}
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	}
.leaflet-popup-content {
	margin: 13px 24px 13px 20px;
	line-height: 1.3;
	font-size: 13px;
	font-size: 1.08333em;
	min-height: 1px;
	}
.leaflet-popup-content p {
	margin: 17px 0;
	margin: 1.3em 0;
	}
.leaflet-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-top: -1px;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
	}
.leaflet-popup-tip {
	width: 17px;
	height: 17px;
	padding: 1px;

	margin: -10px auto 0;
	pointer-events: auto;

	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	        transform: rotate(45deg);
	}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
	background: white;
	color: #333;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	text-align: center;
	width: 24px;
	height: 24px;
	font: 16px/24px Tahoma, Verdana, sans-serif;
	color: #757575;
	text-decoration: none;
	background: transparent;
	}
.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
	color: #585858;
	}
.leaflet-popup-scrolled {
	overflow: auto;
	}

.leaflet-oldie .leaflet-popup-content-wrapper {
	-ms-zoom: 1;
	}
.leaflet-oldie .leaflet-popup-tip {
	width: 24px;
	margin: 0 auto;

	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
	}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
	border: 1px solid #999;
	}


/* div icon */

.leaflet-div-icon {
	background: #fff;
	border: 1px solid #666;
	}


/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
	position: absolute;
	padding: 6px;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: 3px;
	color: #222;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
	}
.leaflet-tooltip.leaflet-interactive {
	cursor: pointer;
	pointer-events: auto;
	}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	position: absolute;
	pointer-events: none;
	border: 6px solid transparent;
	background: transparent;
	content: "";
	}

/* Directions */

.leaflet-tooltip-bottom {
	margin-top: 6px;
}
.leaflet-tooltip-top {
	margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
	left: 50%;
	margin-left: -6px;
	}
.leaflet-tooltip-top:before {
	bottom: 0;
	margin-bottom: -12px;
	border-top-color: #fff;
	}
.leaflet-tooltip-bottom:before {
	top: 0;
	margin-top: -12px;
	margin-left: -6px;
	border-bottom-color: #fff;
	}
.leaflet-tooltip-left {
	margin-left: -6px;
}
.leaflet-tooltip-right {
	margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	top: 50%;
	margin-top: -6px;
	}
.leaflet-tooltip-left:before {
	right: 0;
	margin-right: -12px;
	border-left-color: #fff;
	}
.leaflet-tooltip-right:before {
	left: 0;
	margin-left: -12px;
	border-right-color: #fff;
	}

/* Printing */

@media print {
	/* Prevent printers from removing background-images of controls. */
	.leaflet-control {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
		}
	}

    .map-wrapper.svelte-n0gfya { width: 100%; height: 100%; background: #000; overflow: hidden; position: relative; }
    #map-container.svelte-n0gfya { width: 100%; height: 100%; z-index: 1; background: #0fa8d2; }
    .picker-toolbar.svelte-n0gfya { position: absolute; top: 8px; left: 50%; transform: translateX(-50%); z-index: 9999; background: rgba(8,10,14,0.9); padding: 6px 12px; display: flex; align-items: center; gap: 8px; border-radius: 4px; }
    .picker-hint.svelte-n0gfya { color: #ccc; font-size: 11px; }
    .picker-btn.svelte-n0gfya { padding: 4px 12px; border: none; cursor: pointer; font-size: 11px; font-weight: bold; border-radius: 2px; }
    .picker-btn.confirm.svelte-n0gfya { background: #27ae60; color: white; }
    .picker-btn.cancel.svelte-n0gfya { background: #c0392b; color: white; }

    /* ---- Debug panel ---- */
    /* (unused) .debug-panel {
        position: absolute;
        top: 8px; right: 8px;
        z-index: 9999;
        font-family: monospace;
        font-size: 11px;
    }*/
    /* (unused) .debug-toggle {
        background: rgba(0,0,0,0.8);
        color: #00bfff;
        border: 1px solid #00bfff;
        border-radius: 4px;
        padding: 3px 8px;
        cursor: pointer;
        float: right;
    }*/
    /* (unused) .debug-toggle:hover { background: rgba(0,191,255,0.15); }*/
    /* (unused) .debug-body {
        clear: both;
        margin-top: 4px;
        background: rgba(0,0,0,0.88);
        border: 1px solid #333;
        border-radius: 4px;
        padding: 10px 12px;
        display: flex;
        flex-direction: column;
        gap: 8px;
        min-width: 240px;
    }*/
    /* (unused) .debug-body label {
        color: #ccc;
        display: flex;
        flex-direction: column;
        gap: 3px;
    }*/
    /* (unused) .debug-body input[type="range"] { width: 100%; accent-color: #00bfff; cursor: pointer; }*/
    /* (unused) .num-input {
        width: 80px;
        background: #111;
        border: 1px solid #444;
        color: #fff;
        border-radius: 3px;
        padding: 1px 4px;
    }*/
    /* (unused) .val { color: #00bfff; margin-left: 4px; }*/
    /* (unused) .debug-info {
        background: #111;
        border-radius: 3px;
        padding: 4px 6px;
        color: #7fff7f;
        word-break: break-all;
        font-size: 10px;
    }*/
    /* (unused) .btn-reset {
        background: #1a1a1a;
        border: 1px solid #555;
        color: #ccc;
        border-radius: 3px;
        padding: 3px 8px;
        cursor: pointer;
        align-self: flex-start;
    }*/
    /* (unused) .btn-reset:hover { border-color: #00bfff; color: #00bfff; }*/

    /* ---- Markeri unități ---- */
    .custom-unit-marker { background: transparent; border: none; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; overflow: visible; }
    .unit-pin { width: 14px; height: 14px; background-color: rgba(0,0,0,0.5); border: 2px solid white; border-radius: 50%; position: relative; box-sizing: border-box; }
    .unit-arrow { width: 0; height: 0; border-left: 3px solid transparent; border-right: 3px solid transparent; border-bottom: 6px solid white; position: absolute; top: -2px; left: 2px; transform-origin: center bottom; transition: transform 0.2s linear; }
    .unit-label { background: rgba(0,0,0,0.7); color: white; padding: 0 2px; border-radius: 2px; font-size: 9px; font-weight: bold; white-space: nowrap; margin-top: 2px; position: absolute; top: 16px; }
    .leaflet-marker-icon { transition: none; }

    /* ---- Panic unit marker (static, no animations) ---- */
    .panic-shell {
        position: relative;
        width: 14px; height: 14px;
        display: flex; align-items: center; justify-content: center;
        overflow: visible;
    }

    /* Sonar rings - static display */
    .p-ring {
        position: absolute;
        border-radius: 50%;
        border: 1.5px solid rgba(255, 40, 40, 0.9);
        width: 14px; height: 14px;
        top: 0; left: 0;
        pointer-events: none;
    }
    .r1 { transform: scale(1.5); opacity: 0.6; }
    .r2 { transform: scale(2.2); opacity: 0.3; }

    /* Ray sticks - static display */
    .p-ray {
        position: absolute;
        background: rgba(255, 40, 40, 0.95);
        border-radius: 1px;
        pointer-events: none;
        opacity: 0.8;
    }
    .ray-n { width: 2px; height: 6px; left: 6px;  top: -8px;  }
    .ray-e { width: 6px; height: 2px; left: 15px; top: 6px;   }
    .ray-s { width: 2px; height: 6px; left: 6px;  top: 15px;  }
    .ray-w { width: 6px; height: 2px; left: -8px; top: 6px;   }

    /* Panic callsign label — red background, static */
    .panic-lbl {
        background: rgba(160, 0, 0, 0.92) !important;
    }

    /* Kill ALL Leaflet zoom/fade transitions — zoomAnimation:false nu acoperă CSS-ul intern */
    #map-container .leaflet-zoom-animated,
    #map-container .leaflet-tile-container,
    #map-container .leaflet-layer,
    #map-container .leaflet-tile,
    #map-container .leaflet-pane {
        transition: none !important;
        animation: none !important;
    }

    /* ---- Markeri apeluri 911 (static, no animations) ---- */
    .custom-call-marker { background: transparent; border: none; width: 24px; height: 24px; display: flex; flex-direction: column; align-items: center; overflow: visible; }
    .call-pin { width: 22px; height: 22px; background: #ff3333; border: 2px solid #fff; border-radius: 50%; color: #fff; font-size: 8px; font-weight: bold; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 8px rgba(255,50,50,0.8); }
    .call-label { background: rgba(180,0,0,0.85); color: #fff; padding: 1px 4px; border-radius: 2px; font-size: 8px; font-weight: bold; white-space: nowrap; text-align: center; margin-top: 2px; position: absolute; top: 22px; line-height: 1.2; }

    /* ---- Panel apeluri active ---- */
    .calls-panel.svelte-n0gfya {
        position: absolute;
        top: 8px; right: 8px;
        z-index: 9999;
        width: 220px;
        background: rgba(10, 10, 10, 0.92);
        border: 1px solid #cc2200;
        border-radius: 3px;
        font-family: 'Tahoma', sans-serif;
        font-size: 10px;
        color: #fff;
        box-shadow: 0 0 10px rgba(200,30,0,0.4);
    }
    .calls-panel-header.svelte-n0gfya {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 4px 8px;
        background: rgba(180, 30, 0, 0.7);
        border: none;
        color: #fff;
        font-size: 10px;
        font-weight: bold;
        cursor: pointer;
        text-align: left;
        font-family: 'Tahoma', sans-serif;
    }
    .calls-panel-header.svelte-n0gfya:hover { background: rgba(220, 40, 0, 0.8); }
    .calls-badge.svelte-n0gfya {
        background: #ff3300;
        color: #fff;
        border-radius: 50%;
        width: 16px; height: 16px;
        display: flex; align-items: center; justify-content: center;
        font-size: 9px; font-weight: bold; flex-shrink: 0;
    }
    .calls-chevron.svelte-n0gfya { margin-left: auto; }
    .calls-list.svelte-n0gfya { max-height: 280px; overflow-y: auto; }
    .call-row.svelte-n0gfya {
        display: flex;
        align-items: flex-start;
        gap: 6px;
        padding: 5px 8px;
        border-bottom: 1px solid rgba(255,255,255,0.07);
        cursor: default;
    }
    .call-row.has-loc.svelte-n0gfya { cursor: pointer; }
    .call-row.has-loc.svelte-n0gfya:hover { background: rgba(255,50,0,0.15); }
    .call-row-status.svelte-n0gfya {
        width: 6px; height: 6px; border-radius: 50%;
        background: #ff3300; margin-top: 3px; flex-shrink: 0;
    }
    .call-row-status.attached.svelte-n0gfya { background: #ffaa00; }
    .call-row-info.svelte-n0gfya { flex: 1; min-width: 0; }
    .call-row-caller.svelte-n0gfya { font-weight: bold; color: #ff9980; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .call-row-loc.svelte-n0gfya { color: #ccc; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .call-no-loc.svelte-n0gfya { color: #888; font-style: italic; font-size: 9px; }
    .call-row-goto.svelte-n0gfya { color: #ff6644; font-size: 13px; flex-shrink: 0; line-height: 1; }

    /* ---- Markeri incidente CAD ---- */
    .custom-incident-marker { background: transparent; border: none; width: 24px; height: 24px; display: flex; flex-direction: column; align-items: center; overflow: visible; }
    .incident-pin { width: 22px; height: 22px; background: #ff8c00; border: 2px solid #fff; border-radius: 4px; color: #fff; font-size: 9px; font-weight: bold; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 6px rgba(255,140,0,0.7); }
    .incident-label { background: rgba(150,70,0,0.88); color: #fff; padding: 1px 4px; border-radius: 2px; font-size: 8px; font-weight: bold; white-space: nowrap; text-align: center; margin-top: 2px; position: absolute; top: 22px; line-height: 1.2; max-width: 80px; overflow: hidden; text-overflow: ellipsis; }

    /* ---- Popup-uri dark MDC ---- */
    .mdc-popup .leaflet-popup-content-wrapper {
        background: rgba(8, 10, 14, 0.96);
        border: 1px solid #2a3040;
        border-radius: 3px;
        box-shadow: 0 3px 16px rgba(0, 0, 0, 0.85);
        color: #dde0e8;
        padding: 0;
    }
    .mdc-popup .leaflet-popup-content {
        margin: 0;
        padding: 0;
    }
    .mdc-popup .leaflet-popup-tip-container { margin-top: -1px; }
    .mdc-popup .leaflet-popup-tip { background: rgba(8, 10, 14, 0.96); box-shadow: none; }
    .mdc-popup .leaflet-popup-close-button {
        color: #667 !important;
        font-size: 16px !important;
        top: 4px !important; right: 5px !important;
    }
    .mdc-popup .leaflet-popup-close-button:hover { color: #99aacc !important; }

    /* Conținut popup */
    .mdc-popup-content {
        font-family: 'Tahoma', 'Segoe UI', sans-serif;
        font-size: 10px;
        line-height: 1.4;
        padding: 8px 10px;
        min-width: 140px;
    }
    .mdc-popup-title {
        font-size: 11px;
        font-weight: bold;
        color: #c8d0e0;
        border-bottom: 1px solid #2a3040;
        padding-bottom: 5px;
        margin-bottom: 6px;
        display: flex;
        align-items: center;
        gap: 5px;
        padding-right: 16px; /* space for close btn */
    }
    .mdc-popup-title--call     { color: #ff7766; }
    .mdc-popup-title--incident { color: #ffaa44; }
    .mdc-popup-row {
        display: flex;
        gap: 5px;
        margin-bottom: 3px;
        align-items: baseline;
    }
    .mdc-popup-lbl {
        color: #5a6680;
        min-width: 58px;
        flex-shrink: 0;
    }
    .mdc-popup-msg {
        margin-top: 6px;
        padding: 4px 6px;
        background: rgba(255,255,255,0.04);
        border-left: 2px solid #334466;
        border-radius: 0 2px 2px 0;
        color: #aab0c0;
        font-style: italic;
        word-break: break-word;
    }
    .mdc-dot {
        display: inline-block;
        width: 7px; height: 7px;
        border-radius: 50%;
        flex-shrink: 0;
    }

    /* ---- Waypoint marker ---- */
    .waypoint-marker {
        background: transparent;
        border: none;
        width: 24px;
        height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: visible;
    }
    .waypoint-pin {
        font-size: 24px;
        filter: drop-shadow(0 2px 4px rgba(0,0,0,0.5));
        animation: svelte-n0gfya-waypoint-bounce 0.5s ease-out;
    }
    @keyframes svelte-n0gfya-waypoint-bounce {
        0% { transform: translateY(-20px); opacity: 0; }
        50% { transform: translateY(5px); }
        100% { transform: translateY(0); opacity: 1; }
    }

    .modal-overlay.svelte-blspa4 {
        position: fixed; inset: 0; background: rgba(0,0,0,0.45);
        display: flex; align-items: center; justify-content: center; z-index: 220;
    }
    .picker-box.svelte-blspa4 {
        background: #ece9d8; border: 2px solid #000080;
        width: 560px; max-width: 92vw; max-height: 88vh;
        display: flex; flex-direction: column;
        box-shadow: 4px 4px 10px rgba(0,0,0,0.4);
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
    }
    .modal-hdr.svelte-blspa4 {
        background: #000080; color: #fff; padding: 4px 8px;
        font-weight: bold; font-size: 11px;
        display: flex; justify-content: space-between; align-items: center;
        flex-shrink: 0;
    }
    .modal-close.svelte-blspa4 {
        background: none; border: none; color: #fff;
        font-size: 12px; cursor: pointer; padding: 0 2px; line-height: 1;
    }
    .modal-close.svelte-blspa4:hover { opacity: 0.8; }

    .picker-tabs.svelte-blspa4 {
        display: flex; background: #ece9d8;
        border-bottom: 1px solid #aca899; flex-shrink: 0;
    }
    .ptab.svelte-blspa4 {
        flex: 1; padding: 5px 8px; background: #d4d0c8;
        border: none; border-right: 1px solid #aca899;
        cursor: pointer; font-size: 11px; font-family: 'Tahoma', sans-serif;
        color: #555;
    }
    .ptab.svelte-blspa4:last-child { border-right: none; }
    .ptab.active.svelte-blspa4 { background: #ece9d8; font-weight: bold; color: #000080; border-bottom: 2px solid #e68b2c; }
    .ptab.svelte-blspa4:hover:not(.active) { background: #ddd9d0; }

    .picker-body.svelte-blspa4 {
        flex: 1; padding: 8px; overflow-y: auto;
        display: flex; flex-direction: column; gap: 8px;
    }

    .search-input.svelte-blspa4 { flex-shrink: 0; }

    .picker-empty.svelte-blspa4 {
        padding: 16px; text-align: center; color: #888; font-style: italic;
    }
    .picker-empty.err.svelte-blspa4 { color: #cc0000; font-style: normal; font-weight: bold; }

    .report-list.svelte-blspa4 {
        flex: 1; border: 2px inset #fff; background: #fff;
        overflow-y: auto; max-height: 320px;
    }
    .report-row.svelte-blspa4 {
        display: grid;
        grid-template-columns: 60px 1fr;
        grid-template-rows: auto auto;
        column-gap: 6px;
        width: 100%; text-align: left;
        padding: 5px 8px; background: none;
        border: none; border-bottom: 1px dotted #ddd;
        cursor: pointer; font-family: 'Tahoma', sans-serif; font-size: 11px;
    }
    .report-row.svelte-blspa4:hover:not(:disabled) { background: #ffffcc; }
    .report-row.svelte-blspa4:disabled { opacity: 0.5; cursor: default; }
    .rr-type.svelte-blspa4 {
        grid-row: 1; grid-column: 1;
        font-weight: bold; font-size: 9px; color: #fff;
        background: #1565c0; padding: 1px 4px; border-radius: 2px;
        text-align: center; align-self: start;
    }
    .rr-title.svelte-blspa4 {
        grid-row: 1; grid-column: 2;
        font-weight: bold; color: #000080;
    }
    .rr-meta.svelte-blspa4 {
        grid-row: 2; grid-column: 2;
        font-size: 9px; color: #888;
    }

    .photo-pick.svelte-blspa4 {
        display: flex; flex-direction: column; gap: 6px; align-items: stretch;
    }
    .photo-preview.svelte-blspa4 {
        max-width: 100%; max-height: 280px;
        border: 1px solid #aca899; object-fit: contain;
        align-self: center;
    }

    .note-row.svelte-blspa4 { display: flex; flex-direction: column; gap: 3px; flex-shrink: 0; }
    .form-label.svelte-blspa4 {
        font-weight: bold; font-size: 11px; color: #333;
        display: flex; justify-content: space-between;
    }
    .char-hint.svelte-blspa4 { font-weight: normal; color: #888; font-size: 10px; }
    .form-input.svelte-blspa4 {
        border: 2px inset #fff; padding: 3px 6px; font-size: 11px;
        font-family: 'Tahoma', sans-serif; background: #fff; outline: none;
        width: 100%; box-sizing: border-box;
    }
    .form-input.svelte-blspa4:focus { border-color: #0055ea; }
    .form-textarea.svelte-blspa4 {
        border: 2px inset #fff; padding: 3px 6px; font-size: 11px;
        font-family: 'Tahoma', sans-serif; background: #fff; outline: none;
        width: 100%; box-sizing: border-box; resize: vertical;
    }
    .form-textarea.svelte-blspa4:focus { border-color: #0055ea; }

    .modal-footer.svelte-blspa4 {
        display: flex; justify-content: flex-end; gap: 5px;
        padding: 6px 10px; border-top: 1px solid #aca899; flex-shrink: 0;
    }

    .xp-btn.svelte-blspa4 {
        padding: 3px 10px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif; white-space: nowrap;
    }
    .xp-btn.svelte-blspa4:hover:not(:disabled) { background: #f5f3ef; }
    .xp-btn.svelte-blspa4:active:not(:disabled) {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }
    .xp-btn.svelte-blspa4:disabled { color: #888; cursor: default; opacity: 0.7; }
    .xp-btn.primary.svelte-blspa4 { background: #dce8f8; border-color: #0055ea; color: #000080; font-weight: bold; }
    .xp-btn.primary.svelte-blspa4:hover:not(:disabled) { background: #c8dcf8; }

    .war-layout.svelte-14k53ft {
        display: flex; flex-direction: column; height: 100%;
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
        font-size: 11px; background: #ece9d8; overflow: hidden;
    }

    /* ── Toolbar ── */
    .war-toolbar.svelte-14k53ft {
        display: flex; align-items: center; gap: 6px;
        padding: 5px 8px; background: #ece9d8;
        border-bottom: 2px groove #aca899; flex-shrink: 0;
    }
    .war-title.svelte-14k53ft { font-weight: bold; color: #000080; font-size: 12px; white-space: nowrap; }
    .pending-badge.svelte-14k53ft {
        background: #8b0000; color: #fff; font-weight: bold;
        padding: 1px 6px; font-size: 10px;
    }
    @keyframes svelte-14k53ft-blink { 50% { opacity: 0; } }
    .blink-anim.svelte-14k53ft { animation: svelte-14k53ft-blink 1s step-start infinite; }

    .filter-row.svelte-14k53ft { display: flex; align-items: center; gap: 3px; margin-left: auto; }
    .filter-label.svelte-14k53ft { color: #666; }
    .filter-btn.svelte-14k53ft {
        padding: 1px 6px; font-size: 10px; font-family: 'Tahoma', sans-serif;
        background: #ece9d8; border: 1px solid #aca899; cursor: pointer;
    }
    .filter-btn.active.svelte-14k53ft { background: #000080; color: #fff; border-color: #000080; }
    .filter-btn.svelte-14k53ft:hover:not(.active) { background: #d8d0c8; }

    /* ── Content ── */
    .war-content.svelte-14k53ft { flex: 1; overflow-y: auto; padding: 6px; }

    .state-msg.svelte-14k53ft {
        display: flex; align-items: center; justify-content: center;
        height: 100%; color: #888; font-style: italic;
    }
    .state-msg.err.svelte-14k53ft   { color: #cc0000; font-style: normal; font-weight: bold; }
    .state-msg.muted.svelte-14k53ft { color: #aaa; }

    /* ── Table ── */
    .war-table.svelte-14k53ft { width: 100%; border-collapse: collapse; font-size: 11px; }
    .war-table.svelte-14k53ft th:where(.svelte-14k53ft) {
        background: #000080; color: #fff;
        text-align: left; padding: 3px 6px; font-size: 10px;
        border-right: 1px solid #0000aa;
        position: sticky; top: 0; z-index: 1;
    }
    .war-table.svelte-14k53ft td:where(.svelte-14k53ft) { border-bottom: 1px dotted #ddd; padding: 3px 6px; border-right: 1px dotted #eee; }
    .war-table.svelte-14k53ft tr:where(.svelte-14k53ft):last-child td:where(.svelte-14k53ft) { border-bottom: none; }
    .war-table.svelte-14k53ft tr:where(.svelte-14k53ft):hover td:where(.svelte-14k53ft) { background: #f5f3ef; }
    .row-pending.svelte-14k53ft td:where(.svelte-14k53ft) { background: #fff8f0; }
    .row-pending.svelte-14k53ft:hover td:where(.svelte-14k53ft) { background: #fff0e0; }
    .row-rejected.svelte-14k53ft td:where(.svelte-14k53ft) { background: #f5f0f0; color: #888; }
    .row-rejected.svelte-14k53ft:hover td:where(.svelte-14k53ft) { background: #ebe0e0; }
    .row-rejected.svelte-14k53ft .td-subject:where(.svelte-14k53ft) { color: #888; }

    .td-id.svelte-14k53ft       { color: #888; font-size: 10px; text-align: right; }
    .td-subject.svelte-14k53ft  { font-weight: bold; color: #000080; }
    .td-reason.svelte-14k53ft   { color: #333; max-width: 240px; }
    .td-truncate.svelte-14k53ft { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .td-date.svelte-14k53ft     { white-space: nowrap; color: #555; font-size: 10px; }

    .row-clickable.svelte-14k53ft { cursor: pointer; }
    .row-clickable.svelte-14k53ft:hover td:where(.svelte-14k53ft) { background: #dce8f8 !important; }

    /* ── Status tags ── */
    .status-tag.svelte-14k53ft { font-weight: bold; font-size: 10px; padding: 1px 4px; border: 1px solid; white-space: nowrap; }
    .status-tag.pending.svelte-14k53ft  { color: #884400; border-color: #884400; background: #fff8e8; }
    .status-tag.approved.svelte-14k53ft { color: #006600; border-color: #006600; background: #f0fff0; }
    .status-tag.rejected.svelte-14k53ft { color: #cc0000; border-color: #cc0000; background: #fff0f0; }
    .wanted-tag.svelte-14k53ft          { color: #cc0000; border-color: #cc0000; background: #fff0f0; }

    /* ── Action buttons ── */
    .act-btn.svelte-14k53ft {
        padding: 1px 5px; font-size: 10px; font-family: 'Tahoma', sans-serif;
        border: 1px solid; cursor: pointer; margin-right: 2px;
    }
    .act-btn.approve.svelte-14k53ft { background: #f0fff0; border-color: #006600; color: #006600; }
    .act-btn.approve.svelte-14k53ft:hover { background: #d0f0d0; }
    .act-btn.reject.svelte-14k53ft  { background: #fff0f0; border-color: #cc0000; color: #cc0000; }
    .act-btn.reject.svelte-14k53ft:hover  { background: #ffd0d0; }

    /* ── XP buttons ── */
    .xp-btn.svelte-14k53ft {
        padding: 3px 10px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000;
        border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444;
        cursor: pointer; font-family: 'Tahoma', sans-serif; white-space: nowrap;
    }
    .xp-btn.svelte-14k53ft:hover { background: #f5f3ef; }
    .xp-btn.svelte-14k53ft:active {
        border-top-color: #444; border-left-color: #444;
        border-right-color: #fff; border-bottom-color: #fff;
    }
    .xp-btn.svelte-14k53ft:disabled { color: #888; cursor: default; opacity: 0.7; }
    .xp-btn.primary.svelte-14k53ft  { background: #dce8f8; border-color: #0055ea; color: #000080; font-weight: bold; }
    .xp-btn.primary.svelte-14k53ft:hover:not(:disabled) { background: #c8dcf8; }
    .xp-btn.danger.svelte-14k53ft   { background: #fff0f0; border-color: #cc0000; color: #cc0000; }
    .xp-btn.danger.svelte-14k53ft:hover:not(:disabled)  { background: #ffdddd; }

    /* ── Modals ── */
    .modal-overlay.svelte-14k53ft {
        position: fixed; inset: 0; background: rgba(0,0,0,0.4);
        display: flex; align-items: center; justify-content: center; z-index: 200;
    }
    .modal-box.svelte-14k53ft {
        background: #ece9d8; border: 2px solid #000080;
        min-width: 360px; max-width: 500px; width: 100%;
        box-shadow: 4px 4px 8px rgba(0,0,0,0.35);
    }
    .create-box.svelte-14k53ft { max-width: 520px; }

    .modal-hdr.svelte-14k53ft {
        background: #000080; color: #fff; padding: 4px 8px;
        font-weight: bold; font-size: 11px;
        display: flex; justify-content: space-between; align-items: center;
    }
    .hdr-red.svelte-14k53ft { background: #8b0000; }
    .modal-close.svelte-14k53ft {
        background: none; border: none; color: #fff;
        font-size: 12px; cursor: pointer; padding: 0 2px; line-height: 1;
    }
    .modal-close.svelte-14k53ft:hover { opacity: 0.8; }

    .modal-body.svelte-14k53ft { padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; }
    .modal-body.svelte-14k53ft p:where(.svelte-14k53ft) { margin: 0; font-size: 11px; }
    .reason-preview.svelte-14k53ft { color: #8b0000; font-style: italic; font-size: 10px; }

    .modal-footer.svelte-14k53ft {
        display: flex; justify-content: flex-end; gap: 5px;
        padding: 6px 10px; border-top: 1px solid #aca899;
    }

    /* ── Form elements ── */
    .form-row.svelte-14k53ft { display: flex; flex-direction: column; gap: 3px; }
    .form-label.svelte-14k53ft {
        font-weight: bold; font-size: 11px; color: #333;
        display: flex; justify-content: space-between;
    }
    .char-hint.svelte-14k53ft { font-weight: normal; color: #888; font-size: 10px; }

    .form-input.svelte-14k53ft {
        border: 2px inset #fff; padding: 3px 6px; font-size: 11px;
        font-family: 'Tahoma', sans-serif; background: #fff; outline: none;
        width: 100%; box-sizing: border-box;
    }
    .form-input.readonly.svelte-14k53ft { background: #f0ede4; color: #555; cursor: default; }
    .form-input.svelte-14k53ft:focus { border-color: #0055ea; }

    .form-textarea.svelte-14k53ft {
        border: 2px inset #fff; padding: 3px 6px; font-size: 11px;
        font-family: 'Tahoma', sans-serif; background: #fff; outline: none;
        width: 100%; box-sizing: border-box; resize: vertical;
    }
    .form-textarea.svelte-14k53ft:focus { border-color: #0055ea; }

    .input-with-btn.svelte-14k53ft { display: flex; gap: 4px; }
    .input-with-btn.svelte-14k53ft .form-input:where(.svelte-14k53ft) { flex: 1; }
    .check-btn.svelte-14k53ft { flex-shrink: 0; }

    /* ── Detail modal ── */
    .detail-box.svelte-14k53ft { max-width: 540px; }

    .detail-tbl.svelte-14k53ft { width: 100%; border-collapse: collapse; font-size: 11px; margin-bottom: 8px; }
    .detail-tbl.svelte-14k53ft tr:where(.svelte-14k53ft) { border-bottom: 1px dotted #ddd; }
    .detail-tbl.svelte-14k53ft tr:where(.svelte-14k53ft):last-child { border-bottom: none; }
    .dk.svelte-14k53ft {
        width: 90px; padding: 4px 8px; font-weight: bold; color: #444;
        background: #f0ede4; border-right: 1px solid #ccc; white-space: nowrap;
    }
    .dv.svelte-14k53ft { padding: 4px 8px; }
    .bold.svelte-14k53ft { font-weight: bold; }

    .narrative-block.svelte-14k53ft {
        border: 1px solid #aca899; background: #fff; padding: 0;
    }
    .narrative-label.svelte-14k53ft {
        background: #d4d0c8; padding: 2px 8px; font-weight: bold;
        font-size: 10px; color: #444; border-bottom: 1px solid #aca899;
    }
    .narrative-text.svelte-14k53ft {
        padding: 8px; font-size: 11px; white-space: pre-wrap; line-height: 1.5;
        color: #222; word-break: break-word; overflow-wrap: break-word;
    }

    /* ── Evidence block ── */
    .evidence-block.svelte-14k53ft { border: 1px solid #aca899; background: #fff; margin-top: 6px; }
    .evidence-hdr.svelte-14k53ft {
        background: #d4d0c8; padding: 3px 8px; font-weight: bold;
        font-size: 10px; color: #444; border-bottom: 1px solid #aca899;
        display: flex; justify-content: space-between; align-items: center;
    }
    .evidence-label.svelte-14k53ft { display: flex; align-items: center; gap: 5px; }
    .legacy-pill.svelte-14k53ft {
        background: #888; color: #fff; font-weight: bold;
        font-size: 9px; padding: 1px 5px; border-radius: 2px;
        letter-spacing: 0.5px;
    }
    .evidence-empty.svelte-14k53ft { padding: 8px; color: #888; font-style: italic; font-size: 11px; }
    .evidence-empty.err.svelte-14k53ft { color: #cc0000; font-style: normal; font-weight: bold; }
    .evidence-empty.svelte-14k53ft strong:where(.svelte-14k53ft) { color: #884400; }

    .evidence-list.svelte-14k53ft { list-style: none; padding: 0; margin: 0; }
    .evidence-row.svelte-14k53ft { padding: 5px 8px; border-bottom: 1px dotted #ddd; font-size: 11px; }
    .evidence-row.svelte-14k53ft:last-child { border-bottom: none; }

    .ev-line.svelte-14k53ft { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
    .ev-type.svelte-14k53ft {
        display: inline-block; font-weight: bold; font-size: 9px;
        color: #fff; padding: 1px 5px; border-radius: 2px;
        letter-spacing: 0.5px; min-width: 40px; text-align: center;
    }
    .ev-report.svelte-14k53ft { background: #1565c0; }
    .ev-photo.svelte-14k53ft  { background: #2e7d32; }
    .ev-title.svelte-14k53ft  { font-weight: bold; color: #000080; flex: 1; min-width: 0; word-break: break-word; }
    .ev-meta.svelte-14k53ft   { font-size: 10px; color: #555; font-style: italic; }
    .ev-photo-link.svelte-14k53ft {
        background: none; border: 1px solid #2e7d32; color: #2e7d32;
        cursor: pointer; padding: 1px 6px; font-size: 11px;
        font-family: 'Tahoma', sans-serif;
    }
    .ev-photo-link.svelte-14k53ft:hover { background: #e8f5e9; }

    .ev-report-link.svelte-14k53ft {
        background: none; border: none; padding: 0;
        font-family: 'Tahoma', sans-serif; font-size: 11px;
        font-weight: bold; color: #1565c0; cursor: pointer;
        text-align: left; text-decoration: underline; text-decoration-style: dotted;
        flex: 1; min-width: 0; word-break: break-word;
    }
    .ev-report-link.svelte-14k53ft:hover { color: #0d47a1; text-decoration-style: solid; }
    .ev-orphan.svelte-14k53ft { color: #888; font-style: italic; }
    .ev-note.svelte-14k53ft { padding: 3px 4px 0 46px; font-size: 10px; color: #555; font-style: italic; }
    .ev-foot.svelte-14k53ft { padding: 2px 4px 0 46px; font-size: 9px; color: #999; }
    .del-x.svelte-14k53ft {
        background: none; border: none; color: #999;
        cursor: pointer; font-weight: bold; font-size: 14px;
        padding: 0 4px; line-height: 1;
    }
    .del-x.svelte-14k53ft:hover { color: #cc0000; }

    .xp-btn.small.svelte-14k53ft { padding: 1px 6px; font-size: 10px; }

    /* ── Photo viewer ── */
    .photo-viewer.svelte-14k53ft {
        background: #ece9d8; border: 2px solid #000080;
        padding: 8px; display: flex; flex-direction: column;
        gap: 6px; align-items: flex-end;
        max-width: 90vw; max-height: 90vh;
    }
    .photo-viewer.svelte-14k53ft img:where(.svelte-14k53ft) {
        max-width: 100%; max-height: calc(90vh - 50px);
        border: 1px solid #aca899; object-fit: contain;
    }
    .photo-loading.svelte-14k53ft {
        padding: 40px 60px; color: #666; font-style: italic; font-size: 12px;
        border: 1px dashed #aca899; background: #fff; min-width: 220px;
        text-align: center;
    }

    /* ── Narrative inline edit ── */
    .narrative-label.svelte-14k53ft {
        display: flex; justify-content: space-between; align-items: center;
    }
    .narrative-edit.svelte-14k53ft {
        width: 100%; box-sizing: border-box;
        border: 2px inset #fff; padding: 6px 8px; font-size: 11px;
        font-family: 'Tahoma', sans-serif; background: #fff;
    }
    .narrative-edit-actions.svelte-14k53ft {
        display: flex; justify-content: flex-end; align-items: center; gap: 6px;
        padding: 4px 6px; background: #fffacc;
        border-top: 1px solid #aca899;
    }
    .xp-btn.xs.svelte-14k53ft { padding: 0 5px; font-size: 9px; font-weight: normal; }

    /* ── Comments thread ── */
    .comments-block.svelte-14k53ft { border: 1px solid #aca899; background: #fff; margin-top: 6px; }
    .comments-hdr.svelte-14k53ft {
        background: #d4d0c8; padding: 3px 8px; font-weight: bold;
        font-size: 10px; color: #444; border-bottom: 1px solid #aca899;
    }
    .comments-list.svelte-14k53ft { list-style: none; padding: 0; margin: 0; }
    .comment-row.svelte-14k53ft {
        padding: 6px 8px; border-bottom: 1px dotted #ddd;
        display: flex; flex-direction: column; gap: 3px;
    }
    .comment-row.svelte-14k53ft:last-child { border-bottom: none; }
    .comment-judge.svelte-14k53ft   { background: #fffaf5; border-left: 3px solid #6a1b9a; }
    .comment-officer.svelte-14k53ft { background: #f5f8ff; border-left: 3px solid #1565c0; }

    .comment-meta.svelte-14k53ft {
        display: flex; align-items: center; gap: 6px;
        font-size: 10px;
    }
    .comment-badge.svelte-14k53ft {
        display: inline-block; font-weight: bold; font-size: 9px;
        padding: 1px 5px; color: #fff; border-radius: 2px; letter-spacing: 0.5px;
    }
    .comment-badge.judge.svelte-14k53ft   { background: #6a1b9a; }
    .comment-badge.officer.svelte-14k53ft { background: #1565c0; }
    .comment-author.svelte-14k53ft { font-weight: bold; color: #000080; }
    .comment-date.svelte-14k53ft   { color: #888; margin-left: auto; }
    .comment-body.svelte-14k53ft   {
        font-size: 11px; color: #222; white-space: pre-wrap;
        line-height: 1.4; word-break: break-word;
    }

    .comment-compose.svelte-14k53ft {
        display: flex; flex-direction: column; gap: 3px;
        padding: 6px 8px; background: #f7f5e8; border-top: 1px solid #aca899;
    }
    .comment-compose-actions.svelte-14k53ft {
        display: flex; justify-content: flex-end; align-items: center; gap: 6px;
    }

    /* ── Drafts section (above the active warrants table) ── */
    .drafts-section.svelte-14k53ft {
        background: #fffacc; border-bottom: 1px solid #aca899; flex-shrink: 0;
    }
    .drafts-hdr.svelte-14k53ft {
        background: #d4d0c8; padding: 3px 8px; font-weight: bold;
        font-size: 10px; color: #555; border-bottom: 1px dotted #aca899;
        display: flex; justify-content: space-between; align-items: center;
    }
    .drafts-hint.svelte-14k53ft { font-weight: normal; font-style: italic; color: #888; }
    .drafts-list.svelte-14k53ft { display: flex; flex-direction: column; }
    .draft-row.svelte-14k53ft {
        display: flex; align-items: center; gap: 8px;
        padding: 4px 8px; border-bottom: 1px dotted #d4cc88;
        cursor: pointer; font-size: 11px;
    }
    .draft-row.svelte-14k53ft:last-child { border-bottom: none; }
    .draft-row.svelte-14k53ft:hover { background: #fff5b8; }
    .draft-type.svelte-14k53ft {
        background: #886600; color: #fff; font-weight: bold;
        font-size: 9px; padding: 1px 5px; min-width: 50px; text-align: center;
        border-radius: 2px;
    }
    .draft-subject.svelte-14k53ft { font-weight: bold; color: #000080; min-width: 140px; }
    .draft-meta.svelte-14k53ft { flex: 1; font-size: 10px; color: #886600; font-style: italic; }
    .draft-x.svelte-14k53ft {
        background: none; border: none; color: #886600;
        cursor: pointer; font-weight: bold; font-size: 14px; padding: 0 4px;
    }
    .draft-x.svelte-14k53ft:hover { color: #cc0000; }
    .draft-id.svelte-14k53ft {
        font-family: monospace; font-size: 10px; color: #ccc;
        margin-left: 6px; font-weight: normal;
    }

    /* ── Evidence mini-list inside the create modal ── */
    .ev-mini-empty.svelte-14k53ft {
        padding: 6px 8px; color: #888; font-style: italic; font-size: 10px;
        border: 1px dashed #aca899; background: #fff;
    }
    .ev-mini-list.svelte-14k53ft {
        display: flex; flex-direction: column; gap: 2px;
        border: 1px solid #aca899; background: #fff;
        max-height: 130px; overflow-y: auto;
    }
    .ev-mini-row.svelte-14k53ft {
        display: flex; align-items: center; gap: 5px;
        padding: 3px 5px; border-bottom: 1px dotted #ddd;
        font-size: 11px;
    }
    .ev-mini-row.svelte-14k53ft:last-child { border-bottom: none; }
    .ev-mini-title.svelte-14k53ft { flex: 1; font-weight: bold; color: #000080; }
    .ev-note-inline.svelte-14k53ft { color: #886600; cursor: help; }
    .autosave-note.svelte-14k53ft {
        margin-right: auto; font-size: 10px; color: #006600; font-style: italic;
    }

    /* ── Suspect card ── */
    .suspect-error.svelte-14k53ft { color: #cc0000; font-weight: bold; font-size: 11px; padding: 4px 6px; background: #fff0f0; border: 1px solid #cc0000; }

    .suspect-card.svelte-14k53ft {
        border: 1px solid #aca899; background: #fff;
        padding: 6px 8px; display: flex; flex-direction: column; gap: 5px;
    }
    .suspect-hdr.svelte-14k53ft {
        display: flex; align-items: center; justify-content: space-between;
    }
    .suspect-name.svelte-14k53ft { font-weight: bold; font-size: 12px; color: #000080; }

    .suspect-tbl.svelte-14k53ft { width: 100%; border-collapse: collapse; font-size: 11px; }
    .sk.svelte-14k53ft {
        width: 55px; padding: 2px 6px 2px 0; font-weight: bold;
        color: #555; vertical-align: top;
    }
    .sv.svelte-14k53ft { padding: 2px 10px 2px 0; vertical-align: top; }

    .flags-row.svelte-14k53ft { display: flex; flex-wrap: wrap; gap: 3px; }
    .flag-tag.svelte-14k53ft {
        background: #fffacc; border: 1px solid #aca899;
        padding: 1px 5px; font-size: 10px; font-weight: bold; color: #664400;
    }

    /* Page-specific layout (shared styles come from shared-components.css) */
    .detective-layout.svelte-ecf9wg { display: flex; height: 100%; gap: 2px; }
    .case-list-panel.svelte-ecf9wg { width: 320px; min-width: 280px; display: flex; flex-direction: column; border-right: 2px solid #808080; background: #ece9d8; }
    .case-detail-panel.svelte-ecf9wg { flex: 1; display: flex; flex-direction: column; overflow: auto; padding: 8px; }
    .panel-toolbar.svelte-ecf9wg { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px; border-bottom: 1px solid #aca899; align-items: center; }
    .my-cases-toggle.svelte-ecf9wg { font-size: 11px; display: flex; align-items: center; gap: 3px; cursor: pointer; }
    .search-input.svelte-ecf9wg { font-size: 11px; padding: 2px 4px; border: 1px solid #7f9db9; width: 100px; }
    .case-list.svelte-ecf9wg { overflow-y: auto; flex: 1; }
    .case-row.svelte-ecf9wg { display: block; width: 100%; text-align: left; padding: 6px 8px; border: none; border-bottom: 1px solid #d4d0c8; background: transparent; cursor: pointer; font-size: 11px; }
    .case-row.svelte-ecf9wg:hover { background: #e0dcd0; }
    .case-row.active.svelte-ecf9wg { background: #316ac5; color: white; }
    .case-row.active.svelte-ecf9wg .badge:where(.svelte-ecf9wg) { color: white; border-color: rgba(255,255,255,0.4); }
    .case-number.svelte-ecf9wg { font-weight: bold; font-size: 10px; color: #666; }
    .case-row.active.svelte-ecf9wg .case-number:where(.svelte-ecf9wg), .case-row.active.svelte-ecf9wg .case-lead:where(.svelte-ecf9wg) { color: #cde; }
    .case-title.svelte-ecf9wg { font-weight: 600; margin: 2px 0; }
    .case-meta.svelte-ecf9wg { display: flex; gap: 4px; margin: 2px 0; }
    .case-lead.svelte-ecf9wg { font-size: 10px; color: #888; }
    /* Badge variants specific to detective */
    .badge.division.svelte-ecf9wg { background: #555; }
    .badge.type-badge.svelte-ecf9wg { background: #2c3e50; }
    .badge.role-suspect.svelte-ecf9wg { background: #c0392b; }
    .badge.role-victim.svelte-ecf9wg { background: #2980b9; }
    .badge.role-witness.svelte-ecf9wg { background: #27ae60; }
    .badge.role-poi.svelte-ecf9wg { background: #8e44ad; }
    /* Detail panel */
    .detail-header.svelte-ecf9wg { padding: 4px 0; border-bottom: 1px solid #aca899; }
    .detail-header.svelte-ecf9wg h2:where(.svelte-ecf9wg) { margin: 0; font-size: 14px; }
    .header-badges.svelte-ecf9wg { display: flex; gap: 4px; margin: 4px 0; }
    .header-meta.svelte-ecf9wg { font-size: 11px; color: #555; }
    .detail-content.svelte-ecf9wg { flex: 1; overflow: auto; padding: 8px 0; }
    .detail-content.svelte-ecf9wg fieldset:where(.svelte-ecf9wg) { margin: 6px 0; padding: 8px; border: 1px solid #aca899; }
    .detail-content.svelte-ecf9wg fieldset:where(.svelte-ecf9wg) legend:where(.svelte-ecf9wg) { font-size: 11px; font-weight: bold; color: #003399; }
    .detail-content.svelte-ecf9wg fieldset:where(.svelte-ecf9wg) p:where(.svelte-ecf9wg) { margin: 2px 0; font-size: 12px; }
    .status-actions.svelte-ecf9wg { display: flex; gap: 4px; flex-wrap: wrap; }
    /* Feed */
    .feed-list.svelte-ecf9wg { display: flex; flex-direction: column; gap: 6px; max-height: 400px; overflow-y: auto; }
    .feed-entry.svelte-ecf9wg { border: 1px solid #d4d0c8; padding: 6px 8px; font-size: 11px; background: #fafafa; }
    .feed-entry.feed-report.svelte-ecf9wg { border-left: 3px solid #2c3e50; }
    .feed-entry.feed-comment.svelte-ecf9wg { border-left: 3px solid #4a90d9; }
    .feed-meta.svelte-ecf9wg { display: flex; gap: 6px; align-items: center; font-size: 10px; color: #666; margin-bottom: 2px; }
    .feed-date.svelte-ecf9wg { color: #999; }
    .feed-report-link.svelte-ecf9wg { background: none; border: none; color: #0055ea; text-decoration: underline; cursor: pointer; font-size: 11px; text-align: left; padding: 0; }
    .feed-report-link.svelte-ecf9wg:hover { color: #003399; }
    .feed-content.svelte-ecf9wg { white-space: pre-wrap; }
    .feed-compose.svelte-ecf9wg { display: flex; gap: 6px; margin-top: 8px; align-items: flex-start; }
    .feed-compose.svelte-ecf9wg textarea:where(.svelte-ecf9wg) { flex: 1; font-size: 11px; padding: 4px; border: 1px solid #7f9db9; font-family: 'Tahoma', sans-serif; resize: vertical; }
    /* Photo */
    .photo-link.svelte-ecf9wg { background: none; border: none; color: #0055ea; text-decoration: underline; cursor: pointer; font-size: 11px; font-weight: bold; }
    .photo-link.svelte-ecf9wg:hover { color: #003399; }
    .photo-viewer.svelte-ecf9wg { background: #ece9d8; border: 2px outset #fff; max-width: 80vw; max-height: 80vh; }
    .photo-viewer.svelte-ecf9wg .modal-header:where(.svelte-ecf9wg) { display: flex; justify-content: space-between; align-items: center; }
    .photo-close.svelte-ecf9wg { background: none; border: none; color: white; cursor: pointer; font-size: 14px; }
    .photo-container.svelte-ecf9wg { padding: 4px; display: flex; justify-content: center; }
    .photo-container.svelte-ecf9wg img:where(.svelte-ecf9wg) { max-width: 100%; max-height: 70vh; object-fit: contain; }

    /* Page-specific layout (shared styles come from shared-components.css) */
    .gangs-layout.svelte-1byx1hm { display: flex; height: 100%; gap: 2px; }
    .gang-list-panel.svelte-1byx1hm { width: 280px; min-width: 240px; display: flex; flex-direction: column; border-right: 2px solid #808080; background: #ece9d8; }
    .gang-detail-panel.svelte-1byx1hm { flex: 1; display: flex; flex-direction: column; overflow: auto; padding: 8px; }
    .panel-toolbar.svelte-1byx1hm { padding: 6px; border-bottom: 1px solid #aca899; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
    .archive-toggle.svelte-1byx1hm { font-size: 11px; display: flex; align-items: center; gap: 3px; cursor: pointer; }
    .search-input.svelte-1byx1hm { font-size: 11px; padding: 2px 4px; border: 1px solid #7f9db9; width: 80px; }
    .gang-list.svelte-1byx1hm { overflow-y: auto; flex: 1; }
    .gang-row.svelte-1byx1hm { display: block; width: 100%; text-align: left; padding: 6px 8px; border: none; border-bottom: 1px solid #d4d0c8; background: transparent; cursor: pointer; font-size: 11px; }
    .gang-row.svelte-1byx1hm:hover { background: #e0dcd0; }
    .gang-row.active.svelte-1byx1hm { background: #316ac5; color: white; }
    .gang-name.svelte-1byx1hm { font-weight: bold; }
    .gang-aliases.svelte-1byx1hm { font-size: 10px; color: #888; font-style: italic; }
    .gang-row.active.svelte-1byx1hm .gang-aliases:where(.svelte-1byx1hm) { color: #cde; }
    .gang-meta.svelte-1byx1hm { display: flex; gap: 4px; margin-top: 2px; }
    /* Badge variants specific to gangs */
    .badge.members.svelte-1byx1hm { background: #555; }
    .badge.colors.svelte-1byx1hm { background: #666; }
    .badge.status-active.svelte-1byx1hm { background: #27ae60; }
    .badge.status-inactive.svelte-1byx1hm { background: #95a5a6; }
    .badge.status-incarcerated.svelte-1byx1hm { background: #e67e22; }
    .badge.status-deceased.svelte-1byx1hm { background: #333; }
    /* Detail panel */
    .detail-header.svelte-1byx1hm h2:where(.svelte-1byx1hm) { margin: 0; font-size: 14px; }
    .aliases.svelte-1byx1hm { font-size: 11px; color: #666; font-style: italic; }
    .header-badges.svelte-1byx1hm { display: flex; gap: 4px; margin: 4px 0; }
    .detail-content.svelte-1byx1hm { flex: 1; overflow: auto; padding: 8px 0; }
    .detail-content.svelte-1byx1hm fieldset:where(.svelte-1byx1hm) { margin: 6px 0; padding: 8px; border: 1px solid #aca899; }
    .detail-content.svelte-1byx1hm fieldset:where(.svelte-1byx1hm) legend:where(.svelte-1byx1hm) { font-size: 11px; font-weight: bold; color: #003399; }
    .gang-status-row.svelte-1byx1hm { display: flex; align-items: center; gap: 8px; }
    .data-table.svelte-1byx1hm td.coords:where(.svelte-1byx1hm) { font-family: monospace; font-size: 10px; }
    .color-swatch.svelte-1byx1hm { display: inline-block; width: 12px; height: 12px; border: 1px solid #333; vertical-align: middle; margin-right: 4px; }
    /* Territory modal */
    .coords-section.svelte-1byx1hm { border: 1px solid #aca899; padding: 8px; background: #f5f3ed; }
    .pick-map-btn.svelte-1byx1hm { display: flex; justify-content: center; margin-bottom: 6px; }
    .coords-preview.svelte-1byx1hm { margin-top: 6px; font-size: 10px; font-family: monospace; color: #006600; text-align: center; }
    .color-picker-row.svelte-1byx1hm { display: flex; align-items: center; gap: 3px; flex-wrap: wrap; }
    .color-btn.svelte-1byx1hm { width: 20px; height: 20px; border: 2px solid #999; cursor: pointer; padding: 0; }
    .color-btn.selected.svelte-1byx1hm { border-color: #000; box-shadow: 0 0 3px rgba(0,0,0,0.5); }
    .color-btn.svelte-1byx1hm:hover { border-color: #333; }
    /* Landing stats */
    .landing-stats.svelte-1byx1hm { display: flex; flex-direction: column; align-items: center; padding: 40px 20px; }
    .landing-stats.svelte-1byx1hm h2:where(.svelte-1byx1hm) { margin: 0 0 20px; font-size: 16px; color: #003399; }
    .stats-grid.svelte-1byx1hm { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; width: 100%; max-width: 500px; }
    .stat-card.svelte-1byx1hm { border: 1px solid #aca899; background: #fafafa; padding: 12px; text-align: center; }
    .stat-card.critical.svelte-1byx1hm { border-color: #e74c3c; background: #fdf0ef; }
    .stat-card.warning.svelte-1byx1hm { border-color: #e67e22; background: #fdf5ef; }
    .stat-value.svelte-1byx1hm { font-size: 24px; font-weight: bold; color: #333; }
    .stat-label.svelte-1byx1hm { font-size: 10px; color: #666; margin-top: 4px; }
    .stats-hint.svelte-1byx1hm { font-size: 11px; color: #999; margin-top: 16px; }

    #app-container.svelte-lztlh0 {
        display: flex; flex-direction: column;
        height: 100%; width: 100%;
        font-family: 'Tahoma', 'Microsoft Sans Serif', sans-serif;
        font-size: 11px; background: #ece9d8; overflow: hidden;
    }

    #app-container.panic-mode.svelte-lztlh0 { animation: svelte-lztlh0-panic-flash 0.8s infinite; }
    @keyframes svelte-lztlh0-panic-flash { 50% { background-color: #ffdddd; } }

    /* Menu Bar */
    .win-menu-bar.svelte-lztlh0 {
        display: flex; align-items: center;
        background: #ece9d8; padding: 1px 2px;
        border-bottom: 1px solid #aca899; flex-shrink: 0;
    }
    .win-menu-item.svelte-lztlh0 { position: relative; }
    .menu-label.svelte-lztlh0 { display: inline-block; padding: 2px 6px; cursor: default; user-select: none; }
    .menu-label.svelte-lztlh0:hover, .menu-label.active.svelte-lztlh0 { background: #000080; color: #fff; }

    .win-dropdown.svelte-lztlh0 {
        position: absolute; top: 100%; left: 0;
        background: #ece9d8; border: 1px solid #808080;
        box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
        z-index: 1000; min-width: 160px;
    }
    .dd-item.svelte-lztlh0 { padding: 3px 20px 3px 10px; cursor: default; white-space: nowrap; }
    .dd-item.svelte-lztlh0:hover { background: #000080; color: #fff; }
    .dd-item.disabled.svelte-lztlh0 { color: #888; pointer-events: none; }
    .dd-item.red-text.svelte-lztlh0 { color: #cc0000; }
    .dd-separator.svelte-lztlh0 { height: 1px; background: #aca899; margin: 2px 4px; }

    .panic-indicator.svelte-lztlh0 {
        margin-left: auto; color: red; font-weight: bold;
        animation: svelte-lztlh0-blinker 1s infinite; padding: 2px 5px;
    }
    @keyframes svelte-lztlh0-blinker { 50% { opacity: 0; } }

    /* Toolbar */
    .win-toolbar.svelte-lztlh0 {
        display: flex; align-items: center;
        background: #ece9d8; padding: 2px 4px; gap: 2px;
        border-bottom: 1px solid #aca899; flex-shrink: 0;
    }
    .xp-toolbar-btn.svelte-lztlh0 {
        display: flex; align-items: center; gap: 4px;
        padding: 2px 6px; font-size: 11px; font-family: 'Tahoma';
        background: #ece9d8; border: 1px solid transparent; cursor: pointer;
    }
    .xp-toolbar-btn.svelte-lztlh0 img:where(.svelte-lztlh0) { width: 16px; height: 16px; }
    .xp-toolbar-btn.svelte-lztlh0:hover { border-color: #0055ea; background: #dce8f8; }
    .xp-toolbar-btn.active.svelte-lztlh0 {
        border: 1px solid #808080; background: #d8d0c8;
        border-top-color: #fff; border-left-color: #fff;
    }
    .xp-toolbar-btn.greyed.svelte-lztlh0 {
        opacity: 0.5; pointer-events: none; filter: grayscale(100%);
    }
    .separator.svelte-lztlh0 { width: 1px; height: 20px; background: #aca899; margin: 0 3px; }

    /* Address Bar */
    .win-address-bar.svelte-lztlh0 {
        display: flex; align-items: center; gap: 4px;
        background: #ece9d8; padding: 2px 4px;
        border-bottom: 1px solid #aca899; flex-shrink: 0;
    }
    .win-address-bar.svelte-lztlh0 label:where(.svelte-lztlh0) { font-size: 11px; }
    .address-input.svelte-lztlh0 {
        flex: 1; display: flex; align-items: center; gap: 4px;
        background: #fff; border: 2px inset #fff; padding: 1px 4px; font-size: 11px;
    }
    .address-input.svelte-lztlh0 img:where(.svelte-lztlh0) { height: 14px; }
    .xp-btn-go.svelte-lztlh0 {
        padding: 1px 8px; font-size: 11px; background: #ece9d8;
        border: 1px solid #000; border-top-color: #fff; border-left-color: #fff;
        border-right-color: #444; border-bottom-color: #444; cursor: pointer;
    }

    /* Workspace */
    .win-workspace.svelte-lztlh0 { flex: 1; overflow: hidden; position: relative; }

    /* Status Bar */
    .win-status-bar.svelte-lztlh0 {
        display: flex; background: #ece9d8;
        border-top: 1px solid #aca899; flex-shrink: 0;
    }
    .status-panel.svelte-lztlh0 { padding: 2px 8px; border-right: 1px solid #aca899; font-size: 10px; }
    .status-panel.user.svelte-lztlh0 { flex: 1; }
    .status-panel.time.svelte-lztlh0 { font-weight: bold; }
    .status-panel.status.green.svelte-lztlh0 { color: #006600; font-weight: bold; }
    .status-panel.status.red.svelte-lztlh0 { color: #cc0000; font-weight: bold; }

    .toast-layer.svelte-cqwvc2 {
        position: fixed;
        bottom: 40px; /* Puțin deasupra taskbar-ului Windows imaginar */
        right: 10px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        z-index: 999999; /* Peste orice modal */
        pointer-events: none; /* Să poți da click prin spațiul gol */
    }

    .xp-toast.svelte-cqwvc2 {
        width: 280px;
        background: #ECE9D8;
        border: 2px outset #fff; /* Efect 3D ieșit în relief */
        box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
        pointer-events: auto;
        display: flex;
        flex-direction: column;
        font-family: 'Tahoma', sans-serif;
    }

    /* Varianta de Eroare (Titlu Roșu) */
    .xp-toast.error.svelte-cqwvc2 .toast-header:where(.svelte-cqwvc2) {
        background: linear-gradient(90deg, #d32f2f, #ff6666);
    }

    .toast-header.svelte-cqwvc2 {
        background: linear-gradient(90deg, #0054E3, #2f89fc);
        padding: 3px 5px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: white;
        font-weight: bold;
        font-size: 11px;
    }

    .t-close.svelte-cqwvc2 {
        background: #ECE9D8;
        border: 1px outset #fff;
        font-size: 9px;
        width: 14px; height: 14px;
        line-height: 12px;
        color: black;
        cursor: pointer;
        padding: 0;
    }
    .t-close.svelte-cqwvc2:active { border-style: inset; }

    .toast-body.svelte-cqwvc2 {
        padding: 10px;
        display: flex;
        gap: 10px;
        align-items: flex-start;
        border: 1px solid #ACA899; /* Border interior fin */
        border-top: none;
        background: #fff; /* Corp alb pentru contrast */
    }

    .t-icon.svelte-cqwvc2 img:where(.svelte-cqwvc2) { width: 32px; height: 32px; }

    .t-msg.svelte-cqwvc2 {
        font-size: 12px;
        color: #333;
        line-height: 1.3;
        word-break: break-word;
    }

    .modal-overlay.svelte-1cplwtb {
        position: fixed; top: 0; left: 0; right: 0; bottom: 0;
        background: rgba(0,0,0,0.4);
        display: flex; align-items: center; justify-content: center;
        z-index: 99999;
    }

    .xp-window.svelte-1cplwtb {
        background: #ECE9D8;
        border: 2px outset #fff;
        box-shadow: 4px 4px 10px rgba(0,0,0,0.5);
        min-width: 300px;
        max-width: 400px;
        display: flex; flex-direction: column;
    }

    .window-header.svelte-1cplwtb {
        background: linear-gradient(90deg, #0054E3, #2f89fc);
        padding: 3px 5px; color: white; font-weight: bold; font-family: 'Tahoma'; font-size: 11px;
        display: flex; justify-content: space-between; align-items: center;
    }

    .close-btn.svelte-1cplwtb {
        background: #D4D0C8; border: 1px outset #fff; width: 16px; height: 16px;
        font-size: 10px; line-height: 12px; cursor: pointer; padding: 0;
    }

    .window-body.svelte-1cplwtb { padding: 15px; display: flex; flex-direction: column; gap: 20px; }

    .msg-content.svelte-1cplwtb { display: flex; gap: 15px; align-items: center; }
    .msg-content.svelte-1cplwtb p:where(.svelte-1cplwtb) { font-family: 'Tahoma'; font-size: 11px; color: #000; margin: 0; }

    .btn-row.svelte-1cplwtb { display: flex; justify-content: center; gap: 10px; }
    
    .xp-btn.svelte-1cplwtb {
        min-width: 70px; padding: 4px 10px;
        background: #ECE9D8; border: 2px outset #fff;
        cursor: pointer; font-family: 'Tahoma'; font-size: 11px;
    }
    .xp-btn.svelte-1cplwtb:active { border-style: inset; }

    .xp-prompt-input.svelte-1cplwtb {
        width: 100%; box-sizing: border-box;
        border: 2px inset #fff; padding: 3px 5px;
        font-family: 'Tahoma', sans-serif; font-size: 11px;
        background: #fff; outline: none;
    }

    .app-root.svelte-1n46o8q { width: 100vw; height: 100vh; overflow: hidden; }

    .web-mode.svelte-1n46o8q { background-color: #008080; display: flex; flex-direction: column; }
    .web-mode.svelte-1n46o8q .mdc-window:where(.svelte-1n46o8q) {
        width: 100%; height: 100%;
        display: flex; flex-direction: column; border: none;
    }

    .game-mode.svelte-1n46o8q { background-color: transparent; pointer-events: none; }
    .game-mode.svelte-1n46o8q .mdc-window:where(.svelte-1n46o8q) {
        position: absolute;
        background-color: #ece9d8;
        border: 2px solid #0055ea;
        box-shadow: 4px 4px 15px rgba(0,0,0,0.6);
        pointer-events: auto;
        will-change: transform;
        display: flex; flex-direction: column;
        resize: both; overflow: hidden;
        min-width: 600px; min-height: 400px;
        max-width: 100vw; max-height: 100vh;
    }

    .win-title-bar.svelte-1n46o8q {
        background: linear-gradient(90deg, #0055ea, #1084d0);
        padding: 4px 6px; display: flex;
        justify-content: space-between; align-items: center;
        flex-shrink: 0; user-select: none; cursor: default;
    }
    .win-title-text.svelte-1n46o8q {
        color: white; font-weight: bold;
        font-family: 'Tahoma', sans-serif; font-size: 13px;
        display: flex; align-items: center; pointer-events: none;
    }
    .win-controls.svelte-1n46o8q { display: flex; gap: 2px; }
    .win-control-btn.svelte-1n46o8q {
        width: 20px; height: 20px;
        background: #e81123; color: white;
        border: 1px solid #fff; font-weight: bold; cursor: pointer;
    }

    .window-content.svelte-1n46o8q {
        flex: 1; overflow: auto; position: relative;
        background-color: #ece9d8;
    }
