/* Мир сайта globox.pro: эмалевые таблички на тёмной стене. Цвет главной таблички - текущий статус. */
:root{
  --wall:#1b1d26;--wall-2:#232634;--milk:#fff8f2;--ink:#14161f;--muted:#c9c3bd;--line:rgb(255 248 242/.12);
  --ok:#1e7f4f;--ok-edge:#145c38;--warn:#e0a100;--warn-edge:#a87800;--bad:#c62828;--bad-edge:#8e1b1b;
  --plan:#2b3a67;--plan-edge:#1d2747;--wait:#3a3e4d;--wait-edge:#2a2d39;--enamel:#f5501a;--enamel-light:#ff9a5c;--cobalt:#2b3a67;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-color:#a7adb8 var(--wall)}
body{margin:0;background:var(--wall);color:var(--milk);font:400 16px/1.6 "Golos Text",system-ui,sans-serif}
::selection{background:var(--enamel);color:var(--milk)}
:focus-visible{outline:3px solid var(--enamel-light);outline-offset:3px}
a{color:inherit}
.top{max-width:1120px;margin:0 auto;padding:20px 16px;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:10px;font:400 26px/1 "Russo One",sans-serif;letter-spacing:-.02em;text-decoration:none}
.emblem{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--milk);box-shadow:inset 0 0 0 3px #d9420e}
.emblem svg{width:78%;height:78%}
.top nav{margin-left:auto;display:flex;gap:20px;font-weight:600}
.top nav a{text-decoration:none;color:var(--muted)}.top nav a:hover{color:var(--milk)}
main{max-width:1120px;margin:0 auto;padding:0 16px 56px}

.plate{position:relative;margin:8px 0 28px;border-radius:32px;padding:clamp(36px,6vw,64px) clamp(28px,6vw,72px);
  background:var(--c);color:var(--fg,var(--milk));
  box-shadow:inset 0 0 0 8px var(--c),inset 0 0 0 13px var(--milk),inset 0 0 0 16px var(--e),0 24px 50px -14px rgb(0 0 0/.6);
  transition:background-color .6s cubic-bezier(.16,1,.3,1),box-shadow .6s cubic-bezier(.16,1,.3,1)}
.plate[data-state=loading]{--c:var(--wait);--e:var(--wait-edge)}
.plate[data-state=ok]{--c:var(--ok);--e:var(--ok-edge)}
.plate[data-state=degraded],.plate[data-state=partial]{--c:var(--warn);--e:var(--warn-edge);--fg:var(--ink)}
.plate[data-state=down]{--c:var(--bad);--e:var(--bad-edge)}
.plate[data-state=maintenance]{--c:var(--plan);--e:var(--plan-edge)}
.plate[data-state=unknown]{--c:var(--wait);--e:var(--wait-edge)}
.plate h1{margin:0;font:400 clamp(2rem,5.4vw,4rem)/1.02 "Russo One",sans-serif;letter-spacing:-.02em;text-wrap:balance;max-width:18ch}
.plate p{margin:14px 0 0;font-size:clamp(1rem,1.6vw,1.25rem);max-width:52ch}
.screw{position:absolute;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#c9ced6 45%,#6b7180);box-shadow:inset 0 0 0 1.5px #4c5260,0 1px 2px rgb(0 0 0/.4)}
.screw:after{content:"";position:absolute;left:4px;right:4px;top:8px;height:2px;background:#454b58;transform:rotate(var(--a))}
.s1{top:24px;left:24px;--a:-25deg}.s2{top:24px;right:24px;--a:60deg}.s3{bottom:24px;left:24px;--a:10deg}.s4{bottom:24px;right:24px;--a:-70deg}

.notices{display:grid;gap:12px;margin:0 0 28px}
.notice{border-radius:16px;padding:18px 22px;background:var(--wall-2);box-shadow:inset 0 0 0 2px var(--k,var(--line))}
.notice h3{margin:0 0 4px;font-size:1.05rem}.notice p{margin:0;white-space:pre-line}.notice time{color:var(--muted);font-size:.9rem}

.block{margin-top:48px}
.block h2{margin:0 0 16px;font:400 clamp(1.5rem,3vw,2rem)/1.1 "Russo One",sans-serif;letter-spacing:-.01em}
.block-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;margin-bottom:16px}
.block-head h2{margin:0}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;font-size:.875rem;color:var(--muted)}
.legend span{display:inline-flex;align-items:center;gap:6px}.legend .t{width:8px;height:16px}

.group{margin:0 0 24px}
.group h3{margin:0 0 10px;font-size:.95rem;font-weight:600;color:var(--muted)}
.comp{position:relative;border-radius:16px;background:var(--cobalt);padding:20px 24px 18px;margin-bottom:12px;
  box-shadow:inset 0 0 0 4px var(--cobalt),inset 0 0 0 6px rgb(255 248 242/.8),0 10px 20px -12px rgb(0 0 0/.7)}
.comp.planned{background:var(--wall-2);box-shadow:inset 0 0 0 1.5px var(--line)}
.row{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px}
.row .name{font-weight:700;font-size:1.05rem}
.row .state{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.row .meta{margin-left:auto;color:#c9d1ea;font-size:.9rem;font-variant-numeric:tabular-nums}
.comp.planned .meta,.comp.planned .state{color:var(--muted)}
.dot{width:10px;height:10px;border-radius:50%;background:var(--k);box-shadow:0 0 0 3px rgb(255 248 242/.15)}
.bars{display:grid;grid-template-columns:repeat(90,1fr);gap:2px;height:34px;margin-top:14px}
.t{display:block;border-radius:2px;background:#5b6588}
.t.ok{background:#3fbf7f}.t.warn{background:#e0a100}.t.bad{background:#ef5350}.t.none{background:#4a5372}
.bars .t:hover{outline:2px solid var(--milk);outline-offset:1px}
.axis{display:flex;justify-content:space-between;margin-top:6px;font-size:.8rem;color:#c9d1ea}
.note{color:var(--muted);font-size:.95rem;margin:6px 0 0}

.history{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.history li{padding:16px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:150px 1fr;gap:4px 24px}
.history time{color:var(--muted);font-variant-numeric:tabular-nums}
.history b{display:block}
.history p{margin:2px 0 0;white-space:pre-line}
.history .empty{grid-column:1/-1;color:var(--muted)}
.axis .d30{display:none}

.subscribe p{max-width:62ch}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0 12px}
.sign{display:inline-block;padding:14px 26px;border-radius:14px;background:var(--milk);color:var(--ink);text-decoration:none;font:400 1.15rem/1 "Russo One",sans-serif;
  box-shadow:inset 0 0 0 3px var(--ink),0 6px 14px -6px rgb(0 0 0/.5);transition:transform .2s ease-out,box-shadow .2s ease-out}
.sign:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 3px #d9420e,0 12px 20px -8px rgb(0 0 0/.55)}
.sign.ghost{background:transparent;color:var(--milk);box-shadow:inset 0 0 0 2px var(--milk)}
.fine{color:var(--muted);font-size:.95rem}
.foot{border-top:1px solid var(--line);color:var(--muted);font-size:.875rem}
.foot p{max-width:1120px;margin:0 auto;padding:14px 16px 0}.foot p:last-child{padding-bottom:28px}
@media (max-width:720px){
  .bars{grid-template-columns:repeat(30,1fr)}.bars .t:nth-child(-n+60){display:none}
  .axis .d90{display:none}.axis .d30{display:inline}
  .row .meta{margin-left:0;width:100%}
  .history li{grid-template-columns:1fr}
  .top nav{gap:14px;font-size:.95rem}
  .screw{width:14px;height:14px}.screw:after{top:6px}
  .s1,.s2{top:16px}.s3,.s4{bottom:16px}.s1,.s3{left:16px}.s2,.s4{right:16px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}