/* UptimeStatus identity (2026-10-30, rebuilt from scratch): "a control room for your website". The one memorable
   element is the hero board, modeled on a real checks dashboard: rows of green ticks with one red tick, which is
   the whole pitch. Green and red are reserved for check results and never decorate anything else. Geometric
   display type (League Spartan) over a precise reader (Inter); cool paper, deep ink-navy, cobalt for actions.
   Loaded after site.css and cpanel.css on uptimestatus.page. */
@font-face{font-family:"US Display";src:url("fonts/LeagueSpartan-Bold.ttf") format("truetype");font-weight:700;font-display:swap}
@font-face{font-family:"US Display";src:url("fonts/LeagueSpartan-ExtraBold.ttf") format("truetype");font-weight:800;font-display:swap}
@font-face{font-family:"US Text";src:url("fonts/Inter_18pt-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"US Text";src:url("fonts/Inter_18pt-SemiBold.ttf") format("truetype");font-weight:600;font-display:swap}
@font-face{font-family:"US Text";src:url("fonts/Inter_18pt-Bold.ttf") format("truetype");font-weight:700;font-display:swap}

.brand-uptime{
  --navy:#0d1b2a;--navy-2:#13263a;--up:#16a34a;--up-hi:#34d399;--down:#dc2626;--down-hi:#f87171;
  --accent:#1747d1;--accent-strong:#0f34a3;--on-accent:#ffffff;
  --bg:#f3f6fa;--surface:#ffffff;--ink:#0d1b2a;--muted:#4a5a6c;--line:#d5dde7;
  font-family:"US Text",Inter,"Segoe UI",system-ui,sans-serif;
  background:var(--bg);color:var(--ink);
}
:root[data-theme=dark] .brand-uptime{--bg:#08111c;--surface:#0f1d2c;--ink:#e6edf5;--muted:#9fb0c3;--line:#22344a;--accent:#7aa2ff;--accent-strong:#a8c1ff;--on-accent:#06102a;--up:#34d399;--down:#f87171}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .brand-uptime{--bg:#08111c;--surface:#0f1d2c;--ink:#e6edf5;--muted:#9fb0c3;--line:#22344a;--accent:#7aa2ff;--accent-strong:#a8c1ff;--on-accent:#06102a;--up:#34d399;--down:#f87171}}

.brand-uptime h1,.brand-uptime h2,.brand-uptime h3,.brand-uptime .brand{font-family:"US Display","League Spartan","Avenir Next",system-ui,sans-serif;letter-spacing:-.01em}
.brand-uptime h2{font-weight:800;font-size:clamp(1.8rem,3.4vw,2.7rem);line-height:1.06;max-width:24ch}
.brand-uptime .cta{background:var(--accent);border-color:var(--accent);color:var(--on-accent);border-radius:999px}
.brand-uptime .cta:hover{background:var(--accent-strong);border-color:var(--accent-strong)}
.brand-uptime .cta.secondary{background:transparent;color:var(--accent);border:1.5px solid var(--accent)}
.brand-uptime a:focus-visible,.brand-uptime button:focus-visible,.brand-uptime input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

.brand-uptime .us-word-accent{color:var(--accent)}
.brand-uptime .site-footer .us-word-accent{color:#7aa2ff}

/* Hero: headline left, the board right */
.us-hero{padding:72px 0 80px;border-bottom:1px solid var(--line);background:radial-gradient(1200px 500px at 85% 10%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 70%)}
.us-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:center}
.us-kicker,.us-label{font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin:0 0 14px}
.us-hero h1{font-weight:800;font-size:clamp(2.4rem,5.4vw,4.2rem);line-height:1;margin:0 0 22px;max-width:15ch}
.us-hero .lead{font-size:1.15rem;line-height:1.6;color:var(--muted);max-width:34rem;margin:0 0 28px}
.us-hero .actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.brand-uptime .cta.us-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.brand-uptime .cta.us-ghost:hover{border-color:var(--ink);background:transparent}
.us-proof{list-style:none;display:flex;flex-wrap:wrap;gap:10px 28px;padding:0;margin:32px 0 0;color:var(--muted);font-size:.95rem}
.us-proof strong{display:block;font-family:"US Display",sans-serif;font-weight:800;font-size:1.6rem;color:var(--ink);line-height:1.1}

/* The board stays dark in both themes: it is a screen, not a page */
.us-board{margin:0;background:var(--navy);color:#dbe6f3;border-radius:18px;padding:20px;box-shadow:0 30px 60px -30px rgb(13 27 42 / 55%),0 0 0 1px rgb(255 255 255 / 6%) inset}
.us-board-head{display:flex;justify-content:space-between;align-items:center;margin:0 4px 14px}
.us-board-title{font-family:"US Display",sans-serif;font-weight:800;font-size:1.15rem;color:#ffffff}
.us-board-sum{display:flex;gap:8px;font-size:.8rem}
.us-board-sum b{padding:3px 10px;border-radius:999px;background:rgb(52 211 153 / 14%);color:var(--up-hi)}
.us-board-sum b.is-down{background:rgb(248 113 113 / 16%);color:var(--down-hi)}
.us-mons{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.us-mon{background:var(--navy-2);border-radius:12px;padding:12px 14px;border:1px solid rgb(255 255 255 / 6%)}
.us-mon.is-down{border-color:rgb(248 113 113 / 45%);box-shadow:0 0 0 3px rgb(248 113 113 / 10%)}
.us-mon-top{display:flex;align-items:center;gap:10px}
.us-mon-top strong{font-weight:600;color:#ffffff;font-size:.95rem;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.us-dot{width:9px;height:9px;border-radius:50%;background:var(--up-hi);box-shadow:0 0 0 4px rgb(52 211 153 / 18%)}
.us-mon.is-down .us-dot{background:var(--down-hi);box-shadow:0 0 0 4px rgb(248 113 113 / 22%);animation:us-pulse 1.6s ease-in-out infinite}
@keyframes us-pulse{50%{box-shadow:0 0 0 7px rgb(248 113 113 / 0%)}}
.us-state{font-size:.75rem;font-weight:700;color:var(--up-hi)}
.us-mon.is-down .us-state{color:var(--down-hi)}
.us-ticks{display:grid;grid-template-columns:repeat(30,minmax(0,1fr));gap:3px;margin:10px 0 8px}
.us-ticks i{display:block;height:20px;border-radius:2px;background:var(--up-hi);opacity:.85}
.us-ticks i.is-down{background:var(--down-hi);opacity:1}
.us-mon-meta{display:flex;justify-content:space-between;font-size:.75rem;color:#8ea3ba}
.us-alert{margin:8px 0 0;font-size:.8rem;font-weight:600;color:#ffd7d7;background:rgb(248 113 113 / 14%);border-radius:6px;padding:6px 10px}
.us-gauges{display:grid;gap:7px;margin-top:10px}
.us-gauge{display:grid;grid-template-columns:5.5rem minmax(0,1fr) 2.6rem;align-items:center;gap:10px;font-size:.75rem;color:#8ea3ba}
.us-gauge b{display:block;height:6px;border-radius:999px;background:rgb(255 255 255 / 10%);position:relative;overflow:hidden}
.us-gauge b::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--v);background:#7aa2ff;border-radius:inherit}
.us-gauge em{font-style:normal;text-align:right;color:#dbe6f3}
.us-board figcaption{font-size:.78rem;color:#8ea3ba;margin:12px 4px 0}
@media (prefers-reduced-motion:reduce){.us-mon.is-down .us-dot{animation:none}}

/* Sections */
.us-section{padding:72px 0;border-bottom:1px solid var(--line)}
.us-head{margin-bottom:36px}
.us-head h2{margin:0 0 12px}
.us-head p{color:var(--muted);font-size:1.05rem;max-width:40rem;margin:0}
.us-watch{list-style:none;counter-reset:us;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.us-watch li{counter-increment:us;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px}
.us-watch li::before{content:"0" counter(us);display:block;font-family:"US Display",sans-serif;font-weight:800;font-size:1.1rem;color:var(--accent);margin-bottom:10px}
.us-watch h3{font-size:1.2rem;margin:0 0 8px}
.us-watch p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.55}

.us-bars{list-style:none;padding:0;margin:0;display:grid;gap:14px;max-width:52rem}
.us-bars li{display:grid;grid-template-columns:10rem minmax(0,1fr) 11rem;gap:16px;align-items:center}
.us-bar-who{font-weight:600}
.us-bar{height:14px;border-radius:999px;background:color-mix(in srgb,var(--line) 60%,transparent);overflow:hidden}
.us-bar i{display:block;height:100%;width:var(--w);min-width:6px;background:var(--up);border-radius:inherit}
.us-bars li.is-customer .us-bar i{background:var(--down)}
.us-bar-when{color:var(--muted);font-size:.95rem}
.us-bars li.is-customer .us-bar-when{color:var(--down);font-weight:600}

.us-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.us-tool{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:24px;display:grid;gap:8px;align-content:start}
.us-tool label{font-weight:600;font-size:.95rem}
.us-tool input{font:inherit;font-size:1.3rem;font-weight:600;padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);max-width:14rem}
.us-tool output{display:block;margin-top:10px;padding:14px 16px;border-radius:10px;background:color-mix(in srgb,var(--accent) 8%,var(--surface));font-size:1rem;line-height:1.55}

.us-fears{background:var(--surface)}
.us-fear-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 40px}
.us-fear-grid article{border-left:4px solid var(--accent);padding:2px 0 2px 20px}
.us-fear-grid h3{font-size:1.2rem;margin:0 0 6px}
.us-fear-grid p{margin:0;color:var(--muted)}

.us-group{font-size:1rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:8px 0 14px;font-family:"US Text",sans-serif;font-weight:700}
.us-plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:36px}
.us-plans.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.us-plan{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px;display:flex;flex-direction:column;position:relative}
.us-plan.is-pick{border:2px solid var(--accent);box-shadow:0 20px 40px -28px color-mix(in srgb,var(--accent) 80%,transparent)}
.us-flag{position:absolute;top:-12px;left:20px;margin:0;background:var(--accent);color:var(--on-accent);font-size:.75rem;font-weight:700;padding:3px 10px;border-radius:999px}
.us-plan h3{font-size:1.35rem;margin:0 0 10px}
.us-price{margin:0;display:flex;align-items:baseline;gap:4px}
.us-price strong{font-family:"US Display",sans-serif;font-weight:800;font-size:2.2rem;line-height:1}
.us-price span{color:var(--muted)}
.us-sub{color:var(--muted);font-size:.85rem;margin:6px 0 16px}
.us-plan ul{list-style:none;padding:0;margin:0 0 20px;display:grid;gap:8px;font-size:.93rem}
.us-plan li{padding-left:22px;position:relative}
.us-plan li::before{content:"";position:absolute;left:0;top:.45em;width:10px;height:10px;border-radius:3px;background:var(--up)}
.us-buy{margin-top:auto;display:block;text-align:center;padding:.7em 1em;border-radius:999px;border:2px solid var(--accent);color:var(--accent);font-weight:700;text-decoration:none}
.us-buy:hover,.us-buy:focus-visible{background:var(--accent);color:var(--on-accent)}
.us-buy.is-solid{background:var(--accent);color:var(--on-accent)}
.us-buy.is-solid:hover{background:var(--accent-strong);border-color:var(--accent-strong)}
.us-note{color:var(--muted);font-size:.92rem;margin:0}

.us-band{background:var(--navy);color:#dbe6f3;border-bottom:0}
.us-band-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}
.us-band h2{color:#ffffff;font-size:clamp(1.5rem,2.6vw,2rem);margin:0 0 12px}
.us-band p{color:#a9bbcf;margin:0 0 22px}
.brand-uptime .cta.us-ghost-dark{background:transparent;color:#ffffff;border:1.5px solid rgb(255 255 255 / 40%)}
.brand-uptime .cta.us-ghost-dark:hover{border-color:#ffffff;background:rgb(255 255 255 / 6%)}

.us-guides{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.us-guides a{display:block;height:100%;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px;text-decoration:none;color:var(--ink)}
.us-guides a:hover{border-color:var(--accent)}
.us-guides h3{font-size:1.15rem;margin:0 0 8px;color:var(--accent)}
.us-guides p{margin:0;color:var(--muted);font-size:.95rem}

/* Footer: the navy of the board, one cobalt action */
.brand-uptime .site-footer{padding:80px 0 32px;background:var(--navy);border-top:6px solid var(--accent)}
.brand-uptime .site-footer .footer-grid{gap:48px 64px;align-items:start}
.brand-uptime .site-footer .footer-logo{font-family:"US Display",sans-serif;font-size:1.7rem;font-weight:800;color:#ffffff;gap:14px}
.brand-uptime .site-footer .footer-logo img{width:52px;height:52px}
.brand-uptime .site-footer .footer-brand p{color:#a9bbcf;font-size:1.05rem;line-height:1.6;max-width:30rem;margin:18px 0 26px}
.brand-uptime .site-footer .footer-actions{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:12px;flex-wrap:wrap;max-width:none}
.brand-uptime .site-footer .footer-actions .footer-action{flex:0 0 auto;width:auto;display:inline-flex;min-height:0;padding:.75em 1.4em;border-radius:999px;font-weight:700;text-decoration:none;border:2px solid rgb(255 255 255 / 35%);color:#ffffff;background:transparent}
.brand-uptime .site-footer .footer-actions .footer-action.primary{background:#ffffff;border-color:#ffffff;color:var(--navy)}
.brand-uptime .site-footer .footer-col h2{font-family:"US Text",sans-serif;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;font-weight:700;color:#7aa2ff;margin:0 0 14px}
.brand-uptime .site-footer .footer-col a{color:#d3deea;text-decoration:none}
.brand-uptime .site-footer .footer-col a:hover,.brand-uptime .site-footer .footer-col a:focus-visible{color:#ffffff;text-decoration:underline;text-underline-offset:4px}
.brand-uptime .site-footer .footer-bottom{border-top:1px solid rgb(255 255 255 / 12%);margin-top:56px;padding-top:22px;color:#8ea3ba;font-size:.88rem}
.brand-uptime .site-footer .footer-bottom a{color:#a9bbcf}
.brand-uptime .site-footer .footer-copy{color:#8ea3ba;font-size:.85rem}

@media (max-width:1000px){
  .us-hero-grid{grid-template-columns:1fr;gap:40px}
  .us-watch,.us-plans{grid-template-columns:repeat(2,minmax(0,1fr))}
  .us-guides,.us-plans.three{grid-template-columns:1fr}
}
@media (max-width:640px){
  .us-hero{padding:48px 0 56px}.us-section{padding:52px 0}
  .us-watch,.us-plans,.us-tools,.us-fear-grid,.us-band-grid{grid-template-columns:1fr}
  .us-bars li{grid-template-columns:1fr;gap:6px}
  .us-ticks i{height:16px}
}
