:root{color-scheme:dark;--bg:#0c111a;--panel:#141c29;--line:#293348;--text:#ecf0f7;--muted:#97a7bd;--accent:#69dbc1;--red:#ffa69e}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Tahoma,"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.8}button,input{font:inherit}button{cursor:pointer;border:1px solid transparent;border-radius:9px;padding:9px 16px;transition:background .15s,color .15s}button:disabled{opacity:.55;cursor:wait}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.primary{background:var(--accent);color:#092d27;font-weight:bold}.primary:hover{background:#8ee8d2}.secondary{background:#1b2637;color:var(--text);border-color:#35415a}.secondary:hover{background:#263449}.quiet{background:transparent;color:var(--muted);padding:5px 10px}.quiet:hover{color:var(--text);background:#263449}.muted{color:var(--muted)}h1,h2,p{margin:0}h1{font-size:30px;line-height:1.5;font-weight:700;margin:8px 0 10px}h2{font-size:20px;line-height:1.6}.eyebrow{color:var(--accent);font-size:12px}.small-text{font-size:12px}.topbar{max-width:1440px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:20px 5vw;border-bottom:1px solid var(--line);gap:18px}.brand{display:flex;align-items:center;gap:12px}.brand strong{font-size:17px}.brand-sub{display:block;font-size:11px}.brand-mark{width:52px;height:52px;background:#173c35;border:1px solid #2a6656;color:var(--accent);border-radius:15px;display:grid;place-items:center;font-size:30px;font-weight:bold}.brand-mark.small{width:40px;height:40px;font-size:24px;border-radius:11px}.account{display:flex;align-items:center;gap:12px;font-size:13px}.user-dot{width:8px;height:8px;border-radius:50%;background:var(--accent)}.account form{margin:0;border-right:1px solid var(--line);padding-right:8px}.shell{max-width:1230px;padding:36px 40px;margin:auto}.page-heading,.section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.page-heading{margin-bottom:28px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:0 0 38px}.stats article{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px 23px}.stat-label{color:var(--muted);font-size:12px;display:flex;align-items:center;gap:8px}.stats strong{display:block;font-size:30px;margin-top:10px;font-weight:600}.stats .stat-time{font-size:18px;line-height:54px}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;flex-shrink:0}.dot.running{background:var(--accent)}.dot.stopped{background:#8897ac}.section-heading{margin-bottom:18px}.section-heading h2{margin-bottom:3px}.bot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.bot-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:21px}.bot-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:22px}.bot-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#263245;color:#c1cdea;font-size:20px}.bot-name{font-size:16px;font-weight:bold;margin-bottom:3px}.bot-id{color:var(--muted);font-size:12px;direction:ltr;text-align:right}.bot-identity{display:flex;align-items:center;gap:12px}.badge{display:inline-flex;align-items:center;gap:7px;border:1px solid #35425a;background:#1e293b;color:#b7c5d8;font-size:11px;white-space:nowrap;padding:3px 9px;border-radius:99px}.badge.running{color:var(--accent);border-color:#285147;background:#152f2c}.badge.failed{color:var(--red);border-color:#654039;background:#352523}.bot-card-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid var(--line);padding-top:15px}.bot-meta{font-size:11px;color:var(--muted);direction:ltr}.restart{color:var(--accent);background:transparent;border-color:#38594f;font-size:12px;padding:7px 11px}.restart:hover{background:#173c35}.audit-section{margin-top:44px}.table-wrap{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:auto;margin-bottom:10px}table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:12px}th,td{text-align:right;padding:14px 18px;border-bottom:1px solid var(--line)}th{font-size:11px;font-weight:normal;color:var(--muted);background:#192232}tr:last-child td{border-bottom:0}tbody tr:hover{background:#1a2433}.empty{text-align:center;color:var(--muted);padding:32px}.audit-time{direction:ltr;text-align:right}.source{color:var(--muted);font-size:11px}.search-label input{width:260px}input{display:block;width:100%;background:#0e1622;border:1px solid #35415a;border-radius:8px;padding:10px 12px;color:var(--text)}input::placeholder{color:#8294ae}footer{display:flex;justify-content:space-between;color:#7b8ca5;font-size:11px;padding-top:32px;margin-top:36px;border-top:1px solid var(--line)}.notice{padding:13px 17px;border-radius:9px;background:#16362e;border:1px solid #2e6758;margin-bottom:22px;white-space:pre-wrap}.notice.error{background:#352523;border-color:#654039;color:#ffc6c0}[hidden]{display:none!important}.login-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 0%,#20372e 0,transparent 65%),var(--bg);padding:25px}.login-card{width:430px;max-width:100%;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:34px}.login-card .brand-mark{margin-bottom:26px}.login-card h1{font-size:28px}.login-card .muted{font-size:13px}.login-card form{margin-top:18px}.login-card label{display:block;margin:16px 0 7px;font-size:12px}.login-card input{height:47px}.full{width:100%;margin-top:25px;display:flex;justify-content:space-between;padding:11px 15px}.login-note{font-size:11px;color:var(--muted);border-top:1px solid var(--line);margin-top:26px;padding-top:18px}.login-message{color:var(--red);font-size:12px;margin-top:18px}.login-message:empty{display:none}dialog{background:var(--panel);color:var(--text);border:1px solid #43516a;border-radius:16px;padding:28px;width:430px;max-width:calc(100vw - 30px)}dialog::backdrop{background:#000a;backdrop-filter:blur(3px)}dialog h2{margin:8px 0 12px}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:950px){.bot-grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}.shell{padding:28px 24px}}@media(max-width:600px){h1{font-size:24px}.topbar{padding:15px;align-items:flex-start;flex-wrap:wrap}.account{width:100%;justify-content:flex-end}.shell{padding:24px 15px}.page-heading,.section-heading{align-items:flex-start;flex-direction:column;gap:14px}.bot-grid{grid-template-columns:1fr}.stats{gap:10px;margin-bottom:28px}.stats article{padding:15px}.stats strong{font-size:27px}.stats .stat-time{font-size:15px}.search-label,.search-label input{width:100%}footer{flex-direction:column;gap:5px}.login-card{padding:27px}.section-heading button{align-self:flex-end}}

/* Keep long account and bot names within their cards. */
.account > span:not(.user-dot), .bot-name, .bot-id, .notice { overflow-wrap: anywhere; }
.user-dot, .bot-icon, .account form { flex-shrink: 0; }
.bot-identity, .bot-identity > div:last-child, .stats article { min-width: 0; }
.bot-identity { flex: 1; }
dialog { max-height: calc(100dvh - 32px); overflow-y: auto; }

@media (max-width: 600px) {
  button { min-height: 44px; }
  input { font-size: 16px; min-height: 44px; }
  .account { justify-content: space-between; gap: 8px; }
  .account > span:not(.user-dot) { flex: 1; }
  .page-heading > button, .section-heading > button { width: 100%; }
  .bot-card { padding: 18px; }
  .restart { min-height: 44px; padding: 9px 14px; }
  .dialog-actions > button { flex: 1; }
  .table-wrap { background: transparent; border: 0; overflow: visible; }
  .audit-section table { display: block; white-space: normal; }
  .audit-section thead { display: none; }
  .audit-section tbody { display: grid; gap: 12px; }
  .audit-section tr {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 12px;
  }
  .audit-section td {
    display: flex; flex-direction: column; align-items: flex-start;
    min-width: 0; border: 0; padding: 8px; overflow-wrap: anywhere;
  }
  .audit-section td[data-label]::before { content: attr(data-label); color: var(--muted); font-size: 11px; margin-bottom: 4px; }
  .audit-section .audit-time, .audit-section .source, .audit-section .empty { grid-column: 1 / -1; }
  .audit-section .audit-time { direction: rtl; }
  .audit-section .badge { white-space: normal; max-width: 100%; }
  .audit-section .empty { align-items: center; }
}

@media (max-width: 360px) {
  .shell { padding-inline: 12px; }
  .topbar { padding-inline: 12px; }
  .stats article { padding: 12px; }
  .stats .stat-time { font-size: 13px; }
  .login-page { padding: 16px; }
  .login-card { padding: 22px; }
}