:root{--green: #24d172;--green-600: #08aa5c;--red: #f04438;--amber: #eaaa08;--ink: #0f172a;--muted: #64748b;--border: #e7eaee;--bar-empty: #d7dbe0;--bg: #fbfcfd}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}.wrap{max-width:760px;margin:0 auto;padding:56px 20px 64px}.center{text-align:center}.muted{color:var(--muted)}.hero{text-align:center;margin-bottom:40px}.hero h1{font-size:30px;font-weight:700;margin:18px 0 8px;letter-spacing:-.02em}.hero .muted{font-size:15px}.hero-logo{width:56px;height:56px;border-radius:14px;display:inline-block;box-shadow:0 2px 8px #081f732e}.card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:20px 22px;box-shadow:0 1px 2px #1018280a}.card-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid var(--border);margin-bottom:18px}.card-title{font-weight:600;font-size:15px}.pill{font-size:13px;font-weight:600;padding:4px 10px;border-radius:999px;display:inline-flex;align-items:center;gap:6px}.pill:before{content:"";width:8px;height:8px;border-radius:999px;background:currentColor}.pill.ok{color:var(--green-600);background:#e1f5ee}.pill.down{color:#d92d20;background:#fee4e2}.pill.warn{color:#b54708;background:#fffaeb}.pill.unknown{color:var(--muted);background:#f1f5f9}.svc{padding:16px 0;border-bottom:1px solid var(--border)}.svc:last-child{border-bottom:none;padding-bottom:0}.svc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.svc-name{display:flex;align-items:center;gap:8px;font-weight:600;font-size:15px}.svc-uptime{color:var(--green-600);font-size:14px;font-weight:500}.dot{width:14px;height:14px;border-radius:999px;flex:none;position:relative}.dot.ok{background:var(--green)}.dot.down{background:var(--red)}.dot.unknown{background:var(--muted)}.bars{display:flex;gap:2px;height:34px;align-items:stretch;width:100%;overflow:hidden}.bars-wrap{position:relative}.bar{flex:1 1 0;min-width:0;border-radius:1px;background:var(--bar-empty);border:0;padding:0;cursor:pointer;transition:opacity .1s ease,filter .1s ease}.bar:hover{opacity:.7}.bar-active{filter:brightness(.72);opacity:1}.bar-pop{position:absolute;bottom:calc(100% + 9px);transform:translate(-50%);width:220px;max-width:calc(100vw - 40px);background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px #10182829;padding:11px 13px;text-align:left;z-index:10}.bar-pop-date{font-size:12px;color:var(--muted);margin-bottom:6px}.bar-pop-status{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:600}.bar-pop-dot{width:9px;height:9px;border-radius:999px;background:var(--muted);flex:none}.bar-pop-status.up{color:var(--green-600)}.bar-pop-status.up .bar-pop-dot{background:var(--green)}.bar-pop-status.partial{color:#b54708}.bar-pop-status.partial .bar-pop-dot{background:var(--amber)}.bar-pop-status.down{color:#d92d20}.bar-pop-status.down .bar-pop-dot{background:var(--red)}.bar-pop-pct{margin-left:auto;color:var(--ink);font-weight:600}.bar-pop-detail{margin-top:6px;font-size:13px;line-height:1.45;color:var(--ink)}@media(max-width:480px){.bars{gap:1px}.bar-pop{left:50%!important}.wrap{padding:32px 14px 48px}.hero h1{font-size:24px}.card{padding:16px 14px}.svc-name{min-width:0}.svc-name,.svc-uptime{font-size:13px}}.bar.up{background:var(--green)}.bar.down{background:var(--red)}.bar.partial{background:var(--amber)}.bar.nodata{background:var(--bar-empty)}.svc-foot{display:flex;justify-content:space-between;margin-top:8px;font-size:12px;color:var(--muted)}.foot{text-align:center;margin-top:28px;font-size:13px}