*{box-sizing:border-box;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
html,body{margin:0;height:100%;background:#0b2545;color:#eef}
.hidden{display:none!important}
#map{position:fixed;inset:0;z-index:0}

/* --- Вход --- */
.auth{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#0b2545,#13315c);z-index:50}
.authBox{width:min(380px,92vw);background:#fff;color:#123;border-radius:14px;padding:22px;box-shadow:0 10px 40px rgba(0,0,0,.4)}
.authBox h1{margin:0;color:#0b2545;letter-spacing:2px}
.authBox .sub{font-size:13px;color:#456;margin:6px 0 14px}
.authBox input{width:100%;padding:11px;margin:5px 0;border:1px solid #cbd5e1;border-radius:8px;font-size:15px}
.pwWrap{position:relative}
.pwWrap input{padding-right:40px!important}
.pwToggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:none;
 cursor:pointer;font-size:17px;line-height:1;padding:0}
.tabs{display:flex;gap:6px;margin-bottom:8px}
.tab{flex:1;padding:8px;border:0;border-radius:8px;background:#e2e8f0;cursor:pointer}
.tab.active{background:#0b2545;color:#fff}
.primary{width:100%;padding:12px;margin-top:8px;border:0;border-radius:8px;background:#c1121f;color:#fff;font-size:16px;font-weight:700;cursor:pointer}
.err{color:#c1121f;font-size:13px;min-height:18px;margin-top:6px}

/* --- Тестов банер (Правило 8) --- */
#testBanner{position:fixed;top:0;left:0;right:0;z-index:60;height:22px;line-height:22px;
 background:repeating-linear-gradient(45deg,#b45309,#b45309 14px,#8a3f07 14px,#8a3f07 28px);
 color:#fff;font-size:12px;font-weight:800;text-align:center;letter-spacing:.3px;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 8px;
 box-shadow:0 1px 6px rgba(0,0,0,.4)}
/* Движещ се надпис (marquee) — за да се прочете целият текст на тесен екран.
   Статично: центриран, с ellipsis. При .scroll: текстът минава дясно→ляво. */
#tbInner{display:inline}
#testBanner.scroll{text-align:left}
#testBanner.scroll #tbInner{display:inline-block;white-space:nowrap;will-change:transform;
 animation:tbMarquee var(--tbdur,12s) linear infinite}
@keyframes tbMarquee{from{transform:translateX(100vw)}to{transform:translateX(-100%)}}
@media (prefers-reduced-motion: reduce){#testBanner.scroll #tbInner{animation:none}}
body.testmode #topBar{top:22px}
body.testmode .panel{top:66px}
body.testmode .geoBanner{top:66px}
body.testmode #alarmToast{top:74px}

/* --- Горна лента (прозрачна; само елементите контрастират) --- */
#topBar{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;gap:8px;align-items:center;
 padding:6px 10px;background:transparent;font-size:13px;flex-wrap:wrap;pointer-events:none}
/* текстовите надписи не хващат клик (картата под тях е активна) */
#whoami,#meteoNow{pointer-events:none;color:#fff;font-weight:700;
 text-shadow:0 0 2px #000,0 0 4px #000,0 0 4px #0b2545,0 1px 2px #000}
#whoami{font-size:13px}
/* метео: по-плътен и контрастен текст върху светла карта, без плътен фон */
#meteoNow{font-size:12.5px;font-weight:800;letter-spacing:.2px;
 text-shadow:0 0 2px #000,0 0 3px #000,0 0 5px #000,0 1px 2px #000}
/* бутоните са интерактивни и имат собствен плътен фон около текста */
.mini{padding:6px 10px;border:0;border-radius:7px;background:#1d4e89;color:#fff;cursor:pointer;
 font-size:13px;pointer-events:auto;box-shadow:0 1px 4px rgba(0,0,0,.4)}
.mini.danger{background:#c1121f}

/* --- Бутон Аларма --- */
#btnAlarm{position:fixed;right:14px;bottom:20px;z-index:20;width:110px;height:110px;border-radius:50%;
 border:5px solid #fff;background:radial-gradient(circle at 35% 30%,#ff4d5a,#c1121f 70%);color:#fff;
 font-size:17px;font-weight:900;letter-spacing:1px;cursor:pointer;
 box-shadow:0 6px 24px rgba(193,18,31,.6);animation:pulse 2s infinite}
#btnAlarm small{font-size:12px;font-weight:700}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}

/* --- Лента за позиция на бедствието (T11; прозрачен фон) --- */
#posBar{position:fixed;right:14px;bottom:140px;z-index:20;width:min(230px,70vw);
 background:transparent;padding:0;font-size:12px;text-align:right;pointer-events:none}
#posLabel{margin-bottom:6px;pointer-events:none;color:#fff;
 text-shadow:0 0 3px #0b2545,0 0 3px #0b2545,0 1px 2px #000}
#posBar .posBtns{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
#posBar .mini{padding:5px 8px;font-size:12px;pointer-events:auto}
#posBar .mini.active{background:#c1121f}
.posHint{margin-top:6px;color:#ffd166;font-size:11px;pointer-events:none;
 text-shadow:0 0 3px #000,0 1px 2px #000}
.geoBanner{position:fixed;top:44px;left:50%;transform:translateX(-50%);z-index:35;
 background:#b45309;color:#fff;padding:10px 14px;border-radius:10px;max-width:92vw;font-size:13px;
 box-shadow:0 6px 24px rgba(0,0,0,.45)}
.geoBanner button{margin-left:8px}
#btnGeo.denied{background:#c1121f}
#btnGeo.granted{background:#166534}

/* --- Панели --- */
.panel{position:fixed;top:44px;left:8px;z-index:30;width:min(380px,94vw);max-height:80vh;overflow:auto;
 /* (Задача 3) висока плътност за четимост; видимостта на картата се постига чрез
    СГЪВАНЕ на шилда (Задача 2), не чрез прозрачност */
 background:rgba(255,255,255,.90);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
 color:#0b1220;border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.45);padding:10px;
 /* плавно сгъване настрани */
 transition:transform .28s ease, opacity .22s ease}
.panel b, .panel .nm{color:#06101f}
.panel .hint{color:#243444}
/* (Задача 2) сгънат шилд — изплъзва се към левия ръб, картата остава свободна */
.panel.collapsed{transform:translateX(calc(-100% - 14px));opacity:0;pointer-events:none}
@media (prefers-reduced-motion: reduce){ .panel{transition:none} }
/* дръжка в хедъра за сгъване */
.fold{border:0;background:none;font-size:20px;line-height:1;cursor:pointer;color:#555;padding:0 4px}
/* тънка дръжка/лента на ръба за разгъване (появява се при сгънат шилд) */
.panelTab{position:fixed;left:0;z-index:31;display:none;align-items:center;gap:6px;
 writing-mode:vertical-rl;background:rgba(255,255,255,.92);color:#0b1220;font-weight:600;
 font-size:13px;border:0;border-radius:0 10px 10px 0;box-shadow:0 4px 16px rgba(0,0,0,.4);
 padding:14px 7px;min-height:70px;cursor:pointer;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.panelTab.show{display:flex}
/* дръжки за преоформяне на КП района (T-схеми) */
.kpHandle{background:#7c3aed;border:2px solid #fff;border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,.5);cursor:grab}
.kpHandleAdd{display:flex;align-items:center;justify-content:center;background:#fff;color:#7c3aed;
 border:2px solid #7c3aed;border-radius:50%;font-weight:700;font-size:13px;line-height:1;box-shadow:0 1px 4px rgba(0,0,0,.5);cursor:copy}
.mini.active{outline:2px solid #0af;outline-offset:1px}
.panelHead{display:flex;justify-content:space-between;align-items:center;gap:2px;margin-bottom:6px}
.panelHead b{margin-right:auto}
.x{border:0;background:none;font-size:22px;cursor:pointer;color:#555}
.sect{border-top:1px solid #e2e8f0;margin-top:10px;padding-top:8px;font-size:14px}
.sect textarea,.sect select,.sect input{width:100%;margin:5px 0;padding:8px;border:1px solid #cbd5e1;border-radius:7px;font-size:14px}
.hint{font-size:11px;color:#678}
.caseItem{border:1px solid #e2e8f0;border-radius:9px;padding:8px;margin:6px 0;cursor:pointer}
.caseItem:hover{background:#f1f5f9}
.caseItem .sea{color:#0369a1;font-weight:700}
.caseItem .land{color:#166534;font-weight:700}
.upd{background:#f8fafc;border-radius:7px;padding:6px;margin:4px 0;font-size:13px}
.scen{border-left:4px solid;border-radius:5px;padding:6px 8px;margin:5px 0;font-size:13px;
 background:#f8fafc;cursor:pointer;user-select:none;position:relative;transition:background .1s}
.scen:hover{background:#eef2f7}
.scen .st{font-size:11px;color:#678;margin-left:4px}
.scen.top{background:#e0edff;box-shadow:inset 0 0 0 2px #1d4e89}
.scen.solo{background:#dcfce7;box-shadow:inset 0 0 0 2px #166534}
.scen.dim{opacity:.5}
.scen .tag{position:absolute;right:8px;top:6px;font-size:10px;font-weight:700;letter-spacing:.03em}
.scen.top .tag{color:#1d4e89} .scen.solo .tag{color:#166534}
.scenDel{float:right;background:#c1121f;color:#fff;border:0;border-radius:4px;width:20px;height:20px;
 line-height:18px;text-align:center;cursor:pointer;font-weight:700;padding:0;margin-left:6px}
.scenRe{float:right;background:#1d4e89;color:#fff;border:0;border-radius:4px;width:20px;height:20px;
 line-height:18px;text-align:center;cursor:pointer;font-weight:700;padding:0;margin-left:6px}
/* Модел суша/море: индикатор + ръчно превключване */
.typeCtrl{margin:8px 0;padding:7px 9px;border-radius:6px;background:#eef2f7;font-size:13px}
.typeCtrl.uncertain{background:#fff4e0;border:1px solid #f0a020}
.typeCtrl .tWarn{color:#9a5b00;margin-bottom:6px}
.typeCtrl .tInfo{color:#334;margin-bottom:6px}
.typeCtrl .tSrc{color:#678;font-size:11px}
.typeCtrl .tBtns{display:flex;gap:6px;flex-wrap:wrap}
.typeCtrl .tBtn{flex:1;min-width:120px;padding:6px 8px;border:1px solid #b7c2d0;border-radius:5px;
  background:#fff;cursor:pointer;font-size:13px}
.typeCtrl .tBtn.on{background:#1d4e89;color:#fff;border-color:#1d4e89;font-weight:700}
/* Задача 2: изписани дълбочини (море) / височини (суша) по картата */
.depthLbl{white-space:nowrap;font:700 11px/1 system-ui,Arial,sans-serif;
  pointer-events:none;transform:translate(-50%,-50%);text-align:center}
.depthLbl.sea{color:#0b4a8f;text-shadow:0 0 2px #fff,0 0 2px #fff,0 0 3px #fff}
.depthLbl.land{color:#6b4a12;text-shadow:0 0 2px #fff,0 0 2px #fff,0 0 3px #fff}
/* T-nova-2: обобщени вероятности POC/POD/POS/POSc */
.prob{margin:4px 0;padding:5px 7px;border-radius:5px;background:#eef6ff;font-size:12px;color:#234}
.timeRow{display:flex;gap:6px;align-items:center;margin-top:6px;flex-wrap:wrap}
.timeRow #timeField{flex:1;min-width:120px;margin:0;padding:6px}
.timeRow #timeLabel{font-weight:700;white-space:nowrap}
.usr{border:1px solid #e2e8f0;border-radius:8px;padding:7px;margin:5px 0;font-size:13px}
.usr .nm{font-weight:700}
.usr select{margin:3px 0;padding:5px;border:1px solid #cbd5e1;border-radius:6px;font-size:13px;width:100%}
.usr .ro{color:#456;font-size:12px}
.usr.inactive{opacity:.55}
.planItem{border:1px solid #e2e8f0;border-radius:8px;padding:7px;margin:6px 0;font-size:13px}
.planItem.on{box-shadow:inset 0 0 0 2px #1d4e89}
.planItem .nm{margin-bottom:3px}
.planItem .gpx{margin-left:6px;font-weight:700;color:#1d4e89;text-decoration:none}
.usr .gpx{margin-left:6px;font-weight:700;color:#1d4e89;text-decoration:none}
#admAudit{font-size:12px;max-height:160px;overflow:auto}
.aud{border-bottom:1px solid #eef;padding:3px 0;color:#345}

/* --- Координати при курсора (T14в) --- */
#coordCorner{position:fixed;left:8px;bottom:96px;z-index:15;pointer-events:none;
 font-family:ui-monospace,Consolas,monospace;font-size:12px;font-weight:700;color:#fff;
 text-shadow:0 0 2px #000,0 0 4px #000,0 1px 2px #000;white-space:pre}
body.testmode #coordCorner{bottom:96px}
#coordCursor{position:fixed;z-index:36;pointer-events:none;transform:translate(12px,12px);
 font-family:ui-monospace,Consolas,monospace;font-size:11px;font-weight:700;color:#fff;
 background:rgba(11,37,69,.55);padding:2px 5px;border-radius:5px;white-space:pre}
/* --- Слоеве панел --- */
.lyr{display:flex;align-items:center;gap:7px;margin:5px 0;font-size:13px;cursor:pointer}
.lyr input[type=range]{flex:1;margin:0}
.lyrRow{margin:8px 0}
.lyrRow .top{display:flex;align-items:center;gap:7px;font-size:13px}
.lyrRow input[type=range]{width:100%;margin:4px 0 0}
#measureOut{font-size:13px;margin-top:6px}
#measureOut .seg{color:#345;border-bottom:1px solid #eef;padding:2px 0}
#measureOut .tot{font-weight:700;margin-top:4px}
.leaflet-container.measuring{cursor:crosshair!important}
.leaflet-div-icon.mpt{background:#fff;border:2px solid #111;border-radius:50%;
 width:12px!important;height:12px!important;box-shadow:0 1px 3px rgba(0,0,0,.5)}
/* Меню при запазени измервания/надписи */
.markMenu{position:fixed;z-index:45;display:flex;gap:5px;padding:5px;border-radius:9px;
 background:rgba(11,37,69,.72);box-shadow:0 3px 12px rgba(0,0,0,.45)}
.markMenu button{padding:5px 9px}
.noteEditor{position:fixed;z-index:46;width:min(260px,82vw);padding:8px;border-radius:10px;
 background:rgba(11,37,69,.9);box-shadow:0 6px 24px rgba(0,0,0,.5)}
.noteEditor textarea{width:100%;height:70px;border:0;border-radius:6px;padding:6px;
 font-size:14px;resize:vertical;background:rgba(255,255,255,.95);color:#123}
.testTag{display:inline-block;background:#b45309;color:#fff;font-size:10px;font-weight:800;
 padding:1px 6px;border-radius:4px;letter-spacing:.5px;vertical-align:middle}
.pttRow{display:flex;gap:8px;align-items:center;margin-top:6px;flex-wrap:wrap}
.ptt{background:#0a7d5b;color:#fff;border:0;border-radius:8px;padding:11px 16px;font-size:14px;
 font-weight:700;cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:none}
.ptt.rec{background:#c1121f;animation:pttpulse 1s infinite}
@keyframes pttpulse{0%,100%{opacity:1}50%{opacity:.55}}
.disc{margin-top:6px;padding:7px 9px;border:1px solid #e0a800;border-left:4px solid #d98300;
 border-radius:6px;background:rgba(255,193,7,.12);font-size:11.5px;line-height:1.45;color:#5a3d00}
.qsCenter{color:#c026d3;font-size:20px;font-weight:900;line-height:22px;text-align:center;
 cursor:grab;text-shadow:0 0 3px #fff,0 0 3px #fff}
.qsCenter:active{cursor:grabbing}
.qsArrow div{font-size:13px;font-weight:900;line-height:16px;text-align:center;text-shadow:0 0 2px #fff,0 0 2px #fff}
.qsRow{display:flex;gap:6px;align-items:center;margin:4px 0;font-size:12px;flex-wrap:wrap}
.qsRow input[type=number]{width:64px;padding:4px;border-radius:5px;border:1px solid #bcd}
.qsRow select{flex:1;padding:4px;border-radius:5px}
#markSave #msName,#coordInput input{width:100%;margin:4px 0;padding:7px;border:0;border-radius:6px;
 background:rgba(255,255,255,.95);color:#123;font-size:14px;font-family:ui-monospace,Consolas,monospace}
.noteCtrls{display:flex;gap:8px;align-items:center;margin-top:6px;flex-wrap:wrap;color:#fff;font-size:12px}
.noteCtrls select{padding:4px;border-radius:6px}
.leaflet-div-icon.noteMk{background:none;border:0;font-size:16px;line-height:20px;text-align:center;
 filter:drop-shadow(0 1px 2px #000)}
.leaflet-tooltip.noteTip{max-width:240px;white-space:normal;text-align:left}

/* --- Известие --- */
#alarmToast{position:fixed;top:52px;left:50%;transform:translateX(-50%);z-index:40;
 background:#c1121f;color:#fff;padding:12px 18px;border-radius:10px;font-weight:700;
 box-shadow:0 6px 24px rgba(0,0,0,.5);max-width:92vw;text-align:center}
#timeLabel{font-weight:700;margin-left:6px}
input[type=range]{width:80%}

/* --- Leaflet tooltip-и: прозрачни, само текст с контур; пропускат клик --- */
.leaflet-tooltip{background:transparent!important;border:none!important;box-shadow:none!important;
 color:#fff!important;font-weight:700;font-size:12px;padding:0!important;white-space:nowrap;
 text-shadow:0 0 3px #000,0 0 3px #000,0 1px 2px #000;pointer-events:none!important}
/* без стрелка/опашка на tooltip-а */
.leaflet-tooltip:before,.leaflet-tooltip-top:before,.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,.leaflet-tooltip-right:before{display:none!important}

/* --- Потребителска документация (публични страници + оверлей) --- */
.docLinks{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:14px;
 border-top:1px solid #e2e8f0;padding-top:12px}
.docLinks a{color:#0b2545;font-size:13px;text-decoration:none;font-weight:600}
.docLinks a:hover{text-decoration:underline}
.helpLinks{display:flex;flex-direction:column;gap:10px;padding:6px 2px}
.helpLinks a{color:#0b2545;text-decoration:none;font-weight:600;padding:9px 11px;border:1px solid #cbd5e1;
 border-radius:8px;background:#f8fafc}
.helpLinks a:hover{background:#eef2f7}
.docPage{background:#0b2545;min-height:100%}
.docWrap{max-width:820px;margin:0 auto;padding:18px 16px 40px}
.docTop{margin-bottom:12px}
.docBack{color:#cfe0ff;text-decoration:none;font-weight:600;font-size:14px}
.docBanner{background:#c1121f;color:#fff;padding:10px 14px;border-radius:10px;font-weight:600;
 font-size:14px;margin-bottom:14px}
.docFoot{color:#9db4d8;font-size:12px;text-align:center;margin-top:22px}
.docContent{background:#fff;color:#1a2433;border-radius:12px;padding:22px 24px;line-height:1.62;
 box-shadow:0 8px 30px rgba(0,0,0,.3)}
.docContent h1{color:#0b2545;margin:.2em 0 .5em;font-size:26px;line-height:1.2}
.docContent h2{color:#13315c;margin:1.3em 0 .4em;font-size:20px;border-bottom:1px solid #e2e8f0;padding-bottom:4px}
.docContent h3{color:#13315c;margin:1.1em 0 .3em;font-size:16px}
.docContent p{margin:.6em 0}
.docContent ul,.docContent ol{margin:.5em 0 .8em;padding-left:1.4em}
.docContent li{margin:.25em 0}
.docContent a{color:#0a58ca}
.docContent code{background:#eef2f7;padding:1px 5px;border-radius:4px;font-size:.92em}
.docContent hr{border:0;border-top:1px solid #e2e8f0;margin:1.2em 0}
.docContent blockquote{margin:1em 0;padding:10px 14px;background:#fff7ed;border-left:4px solid #d98300;
 border-radius:6px;color:#5a3d00;font-weight:600}
.docOverlay{position:fixed;inset:0;background:rgba(4,12,28,.66);z-index:120;display:flex;
 align-items:flex-start;justify-content:center;padding:20px;overflow:auto}
.docModal{width:min(820px,96vw);background:#0b2545;border-radius:12px;padding:12px}
.docModal .panelHead{color:#fff;display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.docModal .docContent{max-height:78vh;overflow:auto}