:root{--bg:#050806;--surface:#0b110d;--surface2:#101813;--border:#1d2b22;--text:#f3f7f4;--muted:#7f8d84;--green:#2ee66b;--warning:#f2b84b;--danger:#ff5c5c}*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;background:radial-gradient(circle at top right,rgba(46,230,107,.08),transparent 30%),var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}.container{width:min(1500px,calc(100% - 40px));margin:28px auto}.topbar{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:20px 22px;margin-bottom:20px;background:rgba(11,17,13,.9);border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 48px #0006}.brand,.header-actions,.system-info{display:flex;align-items:center}.brand{gap:14px}.brand-logo{display:grid;place-items:center;width:58px;height:58px;flex:0 0 58px;border:1px solid #caff704d;border-radius:15px;background:#070a08;overflow:hidden;box-shadow:inset 0 0 22px #caff700f,0 0 22px #caff700d}.brand-logo img{display:block;width:46px;height:46px;object-fit:contain}.brand h1{margin:0;font-size:32px}.brand p,.system-info small,.table-title p{margin:5px 0 0;color:var(--muted)}.header-actions{gap:18px}.system-info{gap:10px}.system-info>div{display:flex;flex-direction:column}.system-indicator{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px #2ee66b1a,0 0 18px #2ee66b99}button{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border:1px solid #19bd52;border-radius:11px;background:var(--green);color:#031006;font-weight:800;cursor:pointer}button:disabled{opacity:.65;cursor:wait}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.summary-card{padding:20px;min-height:116px;background:linear-gradient(145deg,var(--surface2),var(--surface));border:1px solid var(--border);border-radius:18px}.summary-card span{display:block;color:var(--muted);font-size:13px;font-weight:700}.summary-card b{display:block;margin-top:12px;font-size:34px}.normal-card{border-color:#2ee66b44}.normal-card b{color:var(--green)}.warning-card{border-color:#f2b84b44}.warning-card b{color:var(--warning)}.fault-card{border-color:#ff5c5c44}.fault-card b{color:var(--danger)}.filters{display:grid;grid-template-columns:1fr 210px auto;gap:12px;padding:14px;margin-bottom:18px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.filters input[type=search],.filters select{min-height:44px;padding:0 14px;background:var(--surface2);color:var(--text);border:1px solid var(--border);border-radius:10px;outline:none}.filters input:focus,.filters select:focus{border-color:#19bd52;box-shadow:0 0 0 3px #2ee66b1a}.problem-only{display:flex;align-items:center;gap:9px;padding:0 14px;background:var(--surface2);border:1px solid var(--border);border-radius:10px;white-space:nowrap}.problem-only input{accent-color:var(--green)}.table-panel{overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 48px #0006}.table-title{padding:20px 22px;border-bottom:1px solid var(--border)}.table-title h2{margin:0}.table{overflow:auto}table{border-collapse:collapse;width:100%;min-width:1080px}th,td{padding:15px 16px;border-bottom:1px solid var(--border);text-align:left;vertical-align:middle}th{background:#0e1711;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em}tbody tr:hover{background:#ffffff08}.row-warning{background:linear-gradient(90deg,#f2b84b18,transparent 35%)}.row-fault{background:linear-gradient(90deg,#ff5c5c18,transparent 35%)}.row-warning td:first-child{box-shadow:inset 3px 0 0 var(--warning)}.row-fault td:first-child{box-shadow:inset 3px 0 0 var(--danger)}.station-name{font-weight:800}.power-value{color:var(--green);font-weight:800}.fault-cell{max-width:420px;color:#c4cec7;overflow-wrap:anywhere}.status{display:inline-flex;align-items:center;gap:8px;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:850}.status-dot{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor}.status-normal,.status-ok{background:#2ee66b18;color:var(--green)}.status-warning,.status-alarm,.status-connecting{background:#f2b84b18;color:var(--warning)}.status-fault,.status-offline,.status-error{background:#ff5c5c18;color:var(--danger)}.status-disabled,.status-unknown{background:#919e951f;color:#9aa69f}.empty-state{padding:42px;text-align:center;color:var(--muted)}@media(max-width:1000px){.summary-grid{grid-template-columns:repeat(2,1fr)}.topbar{align-items:flex-start}.header-actions{flex-direction:column;align-items:flex-end}.filters{grid-template-columns:1fr 1fr}.filters input[type=search]{grid-column:1/-1}}@media(max-width:700px){.brand-logo{width:52px;height:52px;flex-basis:52px}.brand-logo img{width:41px;height:41px}.container{width:calc(100% - 22px);margin:12px auto}.topbar{flex-direction:column}.header-actions{width:100%;align-items:stretch}.header-actions button{justify-content:center}.summary-grid,.filters{grid-template-columns:1fr}.filters input[type=search]{grid-column:auto}.brand h1{font-size:26px}}
/* Dashboard header: keep the growing action set compact on narrow screens. */
@media (max-width: 1000px) {
  .header-actions { flex-direction: row !important; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
}
@media (max-width: 700px) {
  body { font-size: 17px; }
  .header-actions { display: grid !important; grid-template-columns: .6fr 1.7fr 1fr; align-items: center !important; width: 100%; }
  .header-actions .session-user { display: none; }
  .session-user-icon { font-size: 12px; }
  .header-actions .logout-form, .header-actions > a, .header-actions > button { width: 100%; }
  button, .users-link, .primary-link { min-height: 48px; padding: 12px 14px; font-size: 16px; }
  .brand h1 { font-size: 28px; }
  .brand p, .form-hint, .form-value, .table-title p { font-size: 16px; line-height: 1.45; }
  .summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-bottom: 12px; }
  .summary-card { min-height: 0; padding: 9px 6px; text-align: center; }
  .summary-card span, .telegram-recipient small { font-size: 10px; line-height: 1.15; }
  .summary-card b { margin-top: 5px; font-size: 22px; }
  .filters input[type=search], .filters select { min-height: 48px; font-size: 16px; }
  .filters { display: block; padding: 10px; }
  .filters input[type=search] { width: 100%; }
  .filters select, .filters .problem-only { display: none; }
  .problem-only { min-height: 48px; font-size: 16px; }
  .status { font-size: 14px; padding: 7px 11px; }
  .table { overflow: visible; }
  table { min-width: 0; table-layout: fixed; }
  th, td { padding: 12px 8px; font-size: 15px; overflow-wrap: anywhere; }
  th { font-size: 12px; }
  th:nth-child(1), td:nth-child(1), th:nth-child(4), td:nth-child(4), th:nth-child(5), td:nth-child(5) { display: none; }
  th:nth-child(2), td:nth-child(2) { width: 29%; }
  th:nth-child(3), td:nth-child(3) { width: 23%; }
  th:nth-child(6), td:nth-child(6) { width: 48%; }
  .form-section { padding: 22px 18px; }
  .form-section h2 { font-size: 21px; }
  .telegram-recipient { align-items: flex-start; flex-direction: column; }
  .telegram-recipient > div { width: 100%; }
  .telegram-recipient > div button { flex: 1; }
}

/* =========================
   LOGIN PAGE
   ========================= */

.login-page {
    min-height: 100vh;
    margin: 0;
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at top, rgba(202, 255, 112, 0.08), transparent 34%),
        #050806;
    color: #eef5eb;
    font-family: Inter, Arial, sans-serif;
}

.login-wrapper {
    width: 100%;
    max-width: 460px;
    padding: 24px;
    box-sizing: border-box;
}

.login-card {
    position: relative;
    padding: 38px;
    border: 1px solid rgba(202, 255, 112, 0.22);
    border-radius: 22px;
    background: rgba(10, 15, 11, 0.96);
    box-shadow:
        0 28px 80px rgba(0, 0, 0, 0.55),
        inset 0 0 40px rgba(202, 255, 112, 0.025);
}

.login-logo {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    margin-bottom: 25px;
    border: 1px solid rgba(202, 255, 112, 0.3);
    border-radius: 18px;
    background: #070a08;
    box-shadow: 0 0 28px rgba(202, 255, 112, 0.08);
}

.login-logo img {
    width: 57px;
    height: 57px;
    object-fit: contain;
}

.login-heading {
    margin-bottom: 28px;
}

.login-label {
    margin-bottom: 10px;
    color: #caff70;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.16em;
}

.login-heading h1 {
    margin: 0 0 12px;
    font-size: 30px;
    line-height: 1.15;
}

.login-heading p {
    margin: 0;
    color: #909b91;
    font-size: 14px;
    line-height: 1.6;
}

.login-form {
    display: grid;
    gap: 11px;
}

.login-form label {
    margin-top: 8px;
    color: #c7d0c7;
    font-size: 13px;
    font-weight: 600;
}

.login-form input {
    width: 100%;
    box-sizing: border-box;
    padding: 14px 15px;
    border: 1px solid #273028;
    border-radius: 11px;
    outline: none;
    background: #080c09;
    color: #f3f7f1;
    font-size: 15px;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.login-form input:focus {
    border-color: #caff70;
    box-shadow: 0 0 0 3px rgba(202, 255, 112, 0.1);
}

.login-form button {
    margin-top: 14px;
    padding: 14px 18px;
    border: 0;
    border-radius: 11px;
    cursor: pointer;
    background: #caff70;
    color: #10150e;
    font-size: 15px;
    font-weight: 800;
    transition:
        transform 0.15s ease,
        filter 0.15s ease;
}

.login-form button:hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
}

.login-form button:active {
    transform: translateY(0);
}

.login-error {
    margin-bottom: 18px;
    padding: 12px 14px;
    border: 1px solid rgba(255, 100, 100, 0.32);
    border-radius: 10px;
    background: rgba(255, 70, 70, 0.08);
    color: #ff9c9c;
    font-size: 14px;
}

.login-footer {
    margin-top: 26px;
    color: #667068;
    font-size: 12px;
    text-align: center;
}

@media (max-width: 520px) {
    .login-wrapper {
        padding: 14px;
    }

    .login-card {
        padding: 28px 22px;
    }

    .login-heading h1 {
        font-size: 26px;
    }
}
.users-link{display:inline-flex;align-items:center;justify-content:center;padding:11px 16px;border:1px solid var(--border);border-radius:11px;background:var(--surface2);color:var(--text);font-weight:800;text-decoration:none;white-space:nowrap}.users-link:hover{border-color:var(--green);color:var(--green);background:#2ee66b12}

.primary-link,.table-action{display:inline-flex;align-items:center;justify-content:center;padding:11px 16px;border:1px solid #19bd52;border-radius:11px;background:var(--green);color:#031006;font-weight:800;text-decoration:none;white-space:nowrap}.primary-link:hover{filter:brightness(1.06)}.users-page .topbar{margin-bottom:20px}.users-panel,.user-form-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 48px #0006;overflow:hidden}.role-badge{display:inline-flex;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:800}.role-admin{background:#2ee66b18;color:var(--green)}.role-user{background:#ffffff10;color:var(--text)}.table-action{padding:8px 12px;background:transparent;color:var(--green);border-color:#2ee66b55;font-size:12px}.table-action:hover{background:#2ee66b12}.user-form-card{padding:0}.form-section{padding:24px 26px;border-bottom:1px solid var(--border)}.form-section h2{margin:0 0 8px;font-size:18px}.form-hint,.form-value{margin:0 0 18px;color:var(--muted)}.form-section>label{display:grid;gap:8px;max-width:520px;margin-top:16px;color:var(--text);font-weight:700}.form-section input[type=text],.form-section input[type=password],.form-section input:not([type]){min-height:44px;padding:0 14px;background:var(--surface2);color:var(--text);border:1px solid var(--border);border-radius:10px;outline:none}.form-section input:focus{border-color:#19bd52;box-shadow:0 0 0 3px #2ee66b1a}.form-section small{color:var(--muted);font-weight:400}.station-permissions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}.station-check{display:flex;align-items:center;gap:12px;padding:13px 14px;background:var(--surface2);border:1px solid var(--border);border-radius:11px;cursor:pointer}.station-check:hover{border-color:#2ee66b77}.station-check input{width:17px;height:17px;accent-color:var(--green)}.station-check span{display:flex;flex-direction:column;gap:3px}.station-check small{font-size:12px}.form-actions{display:flex;justify-content:flex-end;align-items:center;gap:12px;padding:20px 26px}@media(max-width:700px){.station-permissions{grid-template-columns:1fr}.form-actions{justify-content:stretch;flex-direction:column-reverse}.form-actions>a,.form-actions>button{width:100%}.users-page .header-actions{align-items:stretch}.users-page .header-actions>a{width:100%}}

.brand-logo,.login-logo{display:block;text-decoration:none}.brand-logo:focus-visible,.login-logo:focus-visible{outline:2px solid var(--green);outline-offset:3px}

.brand-logo{display:grid}.login-logo{display:block}
.station-open{padding:0;border:0;background:transparent;color:var(--text);font:inherit;font-weight:800;cursor:pointer;text-align:left}.station-open:hover{color:var(--green);text-decoration:underline}.station-modal[hidden]{display:none}.station-modal{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:20px}.modal-backdrop{position:absolute;inset:0;background:#000b}.station-modal-card{position:relative;width:min(760px,100%);max-height:90vh;overflow:auto;padding:26px;background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:0 22px 60px #000}.station-modal-card h2{margin:0}.modal-subtitle{color:var(--muted);margin:6px 0 18px}.modal-close{position:absolute;top:15px;right:16px;padding:2px 10px;border-color:var(--border);background:var(--surface2);color:var(--text);font-size:24px}.power-chart-wrap{min-height:250px;padding:12px;background:var(--surface2);border:1px solid var(--border);border-radius:12px}.power-chart-wrap canvas{width:100%;height:250px;display:block}.issue-list{display:grid;gap:10px}.issue-item{display:grid;gap:5px;padding:13px;border-left:3px solid var(--danger);background:#ff5c5c0c;border-radius:8px}.issue-item span,.issue-item small{color:var(--muted)}

.token-list{display:grid;gap:8px;margin-top:16px}.token-item{display:flex;align-items:center;gap:12px;padding:10px 12px;background:var(--surface2);border:1px solid var(--border);border-radius:10px}.token-item span{color:var(--muted);font-size:12px}.token-item .table-action{margin-left:auto}.token-result{margin:12vh auto;padding:28px;max-width:720px}.token-secret{display:block;overflow-wrap:anywhere;padding:14px;margin:18px 0;background:var(--surface2);border:1px solid var(--border);border-radius:10px;color:var(--green)}

.session-user{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--border);border-radius:11px;background:var(--surface2);color:var(--text);font-weight:700}.session-user-icon{color:var(--green)}.logout-form{margin:0}.logout-button{min-width:43px;height:43px;padding:0;justify-content:center;border-color:var(--border);background:var(--surface2);color:var(--text);font-size:21px}.logout-button:hover{border-color:var(--danger);color:var(--danger);background:#ff5c5c12}@media(max-width:700px){.session-user{justify-content:center}.logout-button{width:100%}}

.telegram-actions{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.telegram-recipient-list{display:grid;gap:10px}.telegram-recipient{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;background:var(--surface2);border:1px solid var(--border);border-radius:10px}.telegram-recipient span{display:grid;gap:4px}.telegram-recipient small{color:var(--muted)}.telegram-recipient>div{display:flex;gap:8px}.telegram-link-card{max-width:650px;margin:10vh auto;padding:28px}.telegram-link-card p{color:var(--muted);line-height:1.5}.telegram-link-card .users-link{margin-top:16px}