:root{--bg: #eef4ef;--card: #ffffff;--text: #18231f;--muted: #5f6f69;--border: #d7e2db;--dark: #16352c;--dark2: #214538;--accent: #0f8f6f;--accent-soft: #d7f4ec;--red-bg: #fee2e2;--red-t: #b91c1c;--ora-bg: #ffedd5;--ora-t: #c2410c;--grn-bg: #dcfce7;--grn-t: #166534;--slate-bg: #e5e7eb;--slate-t: #374151}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Manrope,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:radial-gradient(circle at top left,rgba(15,143,111,.14),transparent 28%),linear-gradient(180deg,#f6fbf8 0%,var(--bg) 40%,#e8f0eb 100%);color:var(--text)}button,input,select{font:inherit}button:disabled{cursor:not-allowed;opacity:.55;transform:none;box-shadow:none}.login-wrap{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px}.login-card,.card{background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:0 20px 50px #16352c14}.login-card{width:min(460px,100%);padding:22px}.brand,.hdr-left,.hdr-right,.row,.toolbar,.action-row{display:flex;gap:10px;align-items:center}.brand{margin-bottom:18px;align-items:flex-start}.brand-copy h1{margin:0}.brand-copy p{margin:8px 0 0;color:var(--muted)}.eyebrow{display:inline-flex;margin-bottom:8px;padding:5px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.logo{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,#16352c,#0f8f6f);color:#fff;font-weight:700;box-shadow:0 14px 30px #0f8f6f33}.logo.small{width:34px;height:34px}.login-form{display:flex;flex-direction:column;gap:10px}.field{display:flex;flex-direction:column;gap:6px}.field label,.muted,.meta,.nav-foot,.loc,.k{color:var(--muted)}input,select{width:100%;padding:11px 12px;border-radius:12px;border:1px solid var(--border);background:#ffffffeb;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}input:focus,select:focus{outline:none;border-color:#0f8f6f8c;box-shadow:0 0 0 4px #0f8f6f1f}.btn,.link-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:12px;cursor:pointer;font-weight:600;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease}.btn{background:linear-gradient(135deg,var(--dark),var(--accent));color:#fff;padding:11px 14px;box-shadow:0 14px 24px #0f8f6f29}.btn.secondary,.link-btn{background:#fffffff2;color:var(--text);border:1px solid var(--border)}.btn:hover,.link-btn:hover,.nav-item:hover,.crumbs button:hover{transform:translateY(-1px)}.btn:hover,.link-btn:hover{box-shadow:0 12px 24px #16352c1f}.error{display:none;padding:10px 12px;border-radius:10px;background:var(--red-bg);color:var(--red-t)}.error.shown,.app.shown{display:block}.app{display:none;height:100%}.app-header{min-height:64px;background:linear-gradient(135deg,var(--dark),#215847);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 14px}.hdr-sub{font-size:12px;color:#cbd5e1}.hdr-title{font-family:Manrope,Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:20px;font-weight:850;letter-spacing:0;line-height:1}.pill{border:1px solid rgba(255,255,255,.15);padding:6px 10px;border-radius:999px;background:#ffffff0f}.connection-indicator{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;position:relative;border-radius:999px;background:#ffffff14;border:1px solid rgba(255,255,255,.08)}.connection-dot{width:12px;height:12px;border-radius:999px}.connection-indicator.online .connection-dot{background:#8cf0b7;box-shadow:0 0 0 8px #8cf0b71f}.connection-indicator.offline .connection-dot{background:#fca5a5;box-shadow:0 0 0 8px #fca5a51f}.connection-tooltip{position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%) translateY(-4px);padding:6px 10px;border-radius:10px;background:#0f172aeb;color:#f8fafc;font-size:12px;line-height:1;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease;box-shadow:0 10px 24px #0f172a38}.connection-indicator:hover .connection-tooltip{opacity:1;transform:translate(-50%) translateY(0)}.layout{height:calc(100% - 64px);display:flex}.sidebar{width:220px;background:linear-gradient(180deg,var(--dark2),#18362d);color:#e5e7eb;padding:14px 12px;display:flex;flex-direction:column;gap:10px}.mobile-nav{display:none}.nav-item{padding:12px;border-radius:14px;cursor:pointer;display:flex;justify-content:space-between;border:1px solid transparent;transition:background .18s ease,border-color .18s ease,transform .18s ease}.nav-item.active{background:#ffffff24;border-color:#ffffff1f}.nav-badge,.badge{border-radius:999px;font-size:11px;font-weight:700}.nav-badge{background:#ffffff1a;padding:3px 8px}.nav-foot{margin-top:auto;font-size:12px}.main{flex:1;padding:18px;overflow:auto;display:flex;flex-direction:column;gap:12px}.page{display:flex;flex-direction:column;gap:12px}.toolbar{flex-wrap:wrap}.filters-toggle{display:none}.page-size-select{max-width:180px}.kpi-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.kpi{padding:16px;border-radius:18px;border:1px solid var(--border);background:linear-gradient(180deg,#fffffff5,#f7fbf8f5)}.label{font-size:12px;color:var(--muted)}.value{font-size:22px;font-weight:800;margin-top:6px}.card-header,.card-body{padding:14px 16px}.card-header{border-bottom:1px solid var(--border);display:flex;justify-content:space-between;gap:10px}.card-header h2{margin:0;font-size:15px}.table-card{overflow:hidden}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed}th,td{padding:10px;border-bottom:1px solid var(--border);text-align:left;vertical-align:middle}th{background:#f5faf7;color:var(--muted)}th:nth-child(1){width:118px}th:nth-child(2){width:72px}th:nth-child(4){width:150px}th:nth-child(5),th:nth-child(6){width:118px}th.confirmation-cell,td.confirmation-cell{width:170px}td{overflow-wrap:anywhere}.clickable{cursor:pointer}.table-row{transition:background .18s ease}.table-row:hover td{background:#0f8f6f0d}.row-action{color:var(--accent);font-weight:700;white-space:nowrap;text-align:center;width:42px}th:last-child{width:42px}.empty-cell{padding:26px 12px;text-align:center;color:var(--muted)}.badge{display:inline-flex;align-items:center;padding:3px 8px;gap:6px}.b-cv{background:var(--slate-bg);color:var(--slate-t)}.b-ai{background:#dbeafe;color:#1d4ed8}.s-high{background:var(--red-bg);color:var(--red-t)}.s-med{background:var(--ora-bg);color:var(--ora-t)}.s-low{background:var(--grn-bg);color:var(--grn-t)}.status-pill{padding:5px 10px}.status-open{background:#dbeafe;color:#1d4ed8}.status-in_work{background:var(--ora-bg);color:var(--ora-t)}.status-resolved{background:var(--grn-bg);color:var(--grn-t)}.status-false_alarm{background:var(--slate-bg);color:var(--slate-t)}.confirmation-pill{padding:5px 10px;min-width:146px;justify-content:center;white-space:nowrap}.confirmed-yes{background:var(--grn-bg);color:var(--grn-t)}.confirmed-no{background:var(--red-bg);color:var(--red-t)}.confirmed-empty{background:var(--slate-bg);color:var(--slate-t)}.station-status.online{background:var(--grn-bg);color:var(--grn-t)}.station-status.warn{background:var(--ora-bg);color:var(--ora-t)}.station-status.offline{background:var(--red-bg);color:var(--red-t)}.stations-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;padding:12px}.station{padding:14px;border:1px solid var(--border);border-radius:16px;background:linear-gradient(180deg,#fff,#f7fbf8)}.top{display:flex;justify-content:space-between;gap:10px}.station h3{margin:0;font-size:14px}.detail-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:12px}.detail-left,.detail-right{display:flex;flex-direction:column;gap:12px}.crumbs{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--muted)}.crumbs button{border:none;background:transparent;color:var(--accent);cursor:pointer;font-weight:700;padding:0;transition:color .18s ease,transform .18s ease}.kv{display:grid;grid-template-columns:160px 1fr;gap:8px 12px}.event-summary{border:1px solid var(--border);background:#f7fbf8;border-radius:8px;color:var(--text);font-size:13px;line-height:1.5;padding:12px}.event-summary-label{color:var(--muted);font-size:12px;font-weight:700;margin-bottom:4px}.pagination{display:flex;align-items:center;justify-content:center;gap:12px;padding:10px 16px;border-top:1px solid var(--border)}.pagination-top{border-top:none;border-bottom:1px solid var(--border)}.pager-btn{width:40px;height:36px;min-width:40px;padding:0;background:#fff;box-shadow:none}.pager-btn:hover{background:#f5faf7;box-shadow:none;transform:none}.pager-meta{min-width:190px;display:inline-flex;align-items:center;justify-content:center;gap:8px;color:var(--muted);font-size:12px;line-height:1.4;white-space:nowrap}.pager-page{color:var(--text);font-weight:800}.pager-arrow{font-size:22px;line-height:1;color:var(--text)}.media-grid{display:grid;gap:12px}.media-grid-detail{grid-template-columns:repeat(3,minmax(0,1fr))}.media-item{padding:14px;border:1px solid var(--border);border-radius:16px;background:linear-gradient(180deg,#fff,#f7fbf8)}.media-kind{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.media-item-head{min-height:54px;display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:8px}.media-description{margin-top:4px;color:var(--muted);font-size:12px;line-height:1.35}.media-url{font-size:13px;line-height:1.5;color:var(--text);word-break:break-word}.media-preview{width:100%;display:block;border-radius:14px;border:1px solid rgba(15,143,111,.12);background:#e8f3ef;aspect-ratio:16 / 9;object-fit:cover;margin-bottom:10px}.media-placeholder{min-height:180px;display:grid;place-items:center;border-radius:14px;border:1px dashed var(--border);background:linear-gradient(180deg,#fff,#f3f7f4);color:var(--muted);text-align:center;padding:16px;margin-bottom:10px}.media-preview-fallback{margin-bottom:10px}.media-link{font-size:13px;font-weight:700;color:var(--accent);text-decoration:none}.media-link:hover{text-decoration:underline}.empty-state{padding:18px;border:1px dashed var(--border);border-radius:16px;color:var(--muted);text-align:center}.action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.status-btn,.confirm-btn{justify-content:center;min-height:46px}.status-btn.active{border-color:#0f8f6f73;background:var(--accent-soft);color:#0d6a54;box-shadow:inset 0 0 0 1px #0f8f6f14}.confirm-btn{min-height:58px;box-shadow:none}.confirm-btn:hover,.confirm-btn.active{box-shadow:none;transform:none}.confirm-btn.confirm-yes.active{border-color:#16653459;background:var(--grn-bg);color:var(--grn-t)}.confirm-btn.confirm-no.active{border-color:#b91c1c59;background:var(--red-bg);color:var(--red-t)}.event-nav-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.event-nav-btn{width:100%;min-height:46px;box-shadow:none;font-size:24px;line-height:1}.event-nav-btn:hover{box-shadow:none;transform:none}.mobile-sticky-actions{display:none}@media (max-width: 980px){.sidebar{display:none}.mobile-nav{display:flex;gap:6px;padding:8px 10px;border-bottom:1px solid var(--border);background:#fffffff5}.mobile-nav-item{-webkit-appearance:none;-moz-appearance:none;appearance:none;flex:1;min-height:38px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--text);font-weight:700}.mobile-nav-item.active{border-color:#0f8f6f73;background:var(--accent-soft);color:#0d6a54}.layout{height:calc(100% - 111px)}.kpi-row,.detail-grid{grid-template-columns:1fr}.hdr-right,.toolbar,.action-grid{flex-wrap:wrap;grid-template-columns:1fr}.page-size-select{max-width:none}}@media (max-width: 760px){body{background:#f6fbf8}.app-header{min-height:auto;padding:10px 12px;align-items:flex-start;gap:10px}.hdr-left,.hdr-right{width:100%}.hdr-right{justify-content:space-between}.hdr-right .pill{display:none}.layout{height:calc(100% - 105px)}.main{padding:10px}.kpi-row{grid-template-columns:repeat(2,minmax(0,1fr))}.card,.login-card{border-radius:10px;box-shadow:0 10px 24px #16352c0f}.card-header{align-items:flex-start;flex-direction:column}.toolbar{display:grid;grid-template-columns:1fr}.filters-toggle{display:block;margin:10px 12px 0;min-height:38px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--text);font-weight:800}.filters-panel{display:none}.filters-panel.open{display:grid}.pagination{justify-content:center;flex-wrap:nowrap;gap:8px}.pager-btn{flex:0 0 38px}.pager-meta{min-width:0;width:auto;flex:1;gap:6px}.table-wrap{overflow:visible}table,thead,tbody,tr,th,td{display:block;table-layout:auto}thead{display:none}tbody{display:grid;gap:10px;padding:12px}tr.table-row{display:grid;grid-template-columns:1fr;gap:8px 10px;padding:12px;border:1px solid var(--border);border-radius:10px;background:#fff}td{padding:0;border:none}tr.table-row td:nth-child(1),tr.table-row td:nth-child(3),tr.table-row td:nth-child(4){grid-column:1 / -1}tr.table-row td:nth-child(1){color:var(--muted);font-size:12px}tr.table-row td:nth-child(3){font-weight:700;line-height:1.35}.row-action{display:none}.confirmation-cell{width:auto}.confirmation-pill{min-width:0}.empty-cell{display:block}.detail-grid,.media-grid-detail,.kv{grid-template-columns:1fr}.k{font-size:12px}.action-grid{grid-template-columns:1fr}.event-page{padding-bottom:86px}.label-card{display:none}.mobile-sticky-actions{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:44px 1fr 1fr 44px;gap:8px;padding:10px;border-top:1px solid var(--border);background:#fffffffa;box-shadow:0 -10px 24px #16352c14}.mobile-sticky-actions .confirm-btn,.mobile-sticky-actions .event-nav-btn{min-height:48px;padding:8px 10px;font-size:13px}.mobile-sticky-actions .event-nav-btn{padding:0;font-size:24px}.confirm-btn{min-height:62px}.media-item{padding:10px}.media-preview,.media-placeholder{border-radius:8px}}
