/* Uptime Abbey: local assets, quiet decoration, honest status colors. */
:root{--bg:#100e25;--panel:#1b1939;--text:#f3efff;--muted:#b0accb;--line:#3d365b;--down:#c2a2ff;--up:#84b9ff}
body{background:radial-gradient(ellipse at 0 0,#34205b80,transparent 40%),radial-gradient(ellipse at 100% 12%,#19367780,transparent 45%),var(--bg);font-family:"Segoe UI",system-ui,sans-serif}
main{max-width:1500px;padding:28px 32px}
a{color:#b5c6ff}
header{border-bottom:1px solid #50437080;padding-bottom:21px;gap:20px}
.brand{display:flex;align-items:center;gap:15px}
.abbey-mark{width:70px;height:60px;flex:none}
header h1{font-family:Georgia,"Times New Roman",serif;font-size:33px;font-weight:500;letter-spacing:-.6px;line-height:1.2}
header p{font-size:12px;margin:6px 0 0;color:#bcb0d5!important}
header nav{font-size:11px;gap:4px}
header nav a{text-decoration:none;color:#c7c4e5;padding:7px 9px;border-radius:8px}
header nav a:hover{background:#39315e}
.jump{gap:8px;margin:19px 0}
.jump a{padding:7px 14px;border:1px solid #4f4371;border-radius:20px;font-size:11px;background:#211b3d80;color:#c7bddf}
.jump a:hover{color:white;background:#3e2e68;border-color:#9b80cf}
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:470px;border:1px solid #72639880;border-radius:24px;margin:20px 0 32px;background:#181430;box-shadow:0 18px 60px #08071450}
.hero:before{content:"";position:absolute;z-index:-2;inset:0;background-image:url('/abbey-dachshunds.jpg');background-repeat:no-repeat;background-size:125% auto;background-position:left 14%}
.hero:after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#191431 0%,#191431f5 25%,#191431b5 40%,#19143122 59%,#20366218 82%,#1c275c55),linear-gradient(0deg,#191431f5,#28225210 36%,#31294710 72%,#19143135)}
.hero-summary{width:47%;padding:37px 36px;display:flex;flex-direction:column;gap:25px;min-width:0}
.eyebrow{display:flex;align-items:center;gap:8px;font-size:10px;text-transform:uppercase;letter-spacing:2.2px;color:#d0b5f2;margin:0 0 13px}
.little-star{font-size:22px;line-height:1}
.hero h2{font-family:Georgia,"Times New Roman",serif;font-size:45px;font-weight:400;letter-spacing:-1.7px;line-height:1.1;margin:0;color:#fff4ff}
.hero h2 em{font-weight:400;color:#d3b7ff}
.hero-description{font-size:12px;color:#c2b6d4;margin:15px 0 0}
.hero-health{display:flex;align-items:center;gap:17px}
.health-dial{--portion:0%;--dial-color:#737086;width:89px;height:89px;flex:none;display:grid;place-items:center;position:relative;border-radius:50%;background:conic-gradient(var(--dial-color) var(--portion),#514266 0)}
.health-dial:before{content:'';position:absolute;inset:6px;background:#211a36;border-radius:50%}
.dial-value{position:relative;text-align:center}
.dial-value strong{font-size:26px;font-weight:650;letter-spacing:-1px}
.dial-value span{font-size:12px;color:#c0afce}
.dial-value small{display:block;font-size:8px;letter-spacing:.5px;text-transform:uppercase;color:#d6c9e1}
.health-copy strong{display:block;font-size:15px;line-height:1.3;max-width:260px}
.health-copy p{font-size:10px;color:#c4b8d0;max-width:260px;line-height:1.6}
.hero-bottom{display:flex;flex-wrap:wrap;gap:7px}
.hero-tag{font-size:9px;background:#1c1735df;border:1px solid #69588390;border-radius:9px;padding:7px 9px;color:#c1afd2}
.hero-tag strong{display:block;color:#e6dcfa;font-size:11px;font-weight:600;margin-top:2px}
.residents-note{position:absolute;bottom:28px;right:28px;display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid #cfc0f345;background:#211b3ddf;border-radius:14px}
.residents-note strong{display:block;font-size:11px;font-weight:600;color:#f0def8}
.residents-note span:not(.paw):not(.resident-heart){display:block;font-size:9px;color:#c2b2d0;margin-top:2px}
.resident-heart{color:#e5b5e0;font-size:27px;line-height:1;margin-left:6px}
.paw{position:relative;display:block;width:25px;height:26px;flex:none;transform:rotate(-13deg);color:#c6a6ed}
.paw i,.paw b{position:absolute;display:block;background:currentColor}
.paw i{width:5px;height:7px;border-radius:50%}
.paw i:nth-child(1){top:7px;left:0;transform:rotate(-25deg)}
.paw i:nth-child(2){top:1px;left:6px;transform:rotate(-10deg)}
.paw i:nth-child(3){top:1px;left:14px;transform:rotate(10deg)}
.paw i:nth-child(4){top:7px;left:20px;transform:rotate(25deg)}
.paw b{width:16px;height:13px;left:5px;top:12px;border-radius:60% 60% 45% 45%}
.section-head h2,.section-label{font-size:20px;font-weight:600;letter-spacing:-.4px}
.section-head h2:before,.section-label:before{content:'✧';display:inline-block;color:#ba98ee;font-size:22px;margin-right:9px;font-weight:400}
.section-head p{font-size:11px}
.network-banner{padding:13px 17px;border-radius:12px;background:linear-gradient(110deg,#1d3242,#242344);border-color:#496575}
.network-banner strong{font-size:14px}
.network-banner small{font-size:11px;color:#b6c3d1}
.network-banner.attention{background:#372630;border-color:#c48c50}
.network-banner.unknown{background:#29253d;border-color:#71667f}
.monitor-grid{gap:12px}
.monitor{background:linear-gradient(135deg,#282042,#1a1e3c);border-color:#493961;border-radius:14px;padding:16px}
.monitor.critical{border-top:1px solid #9680c6;background:linear-gradient(135deg,#372857,#202b50)}
.monitor-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}
.monitor-icon{width:33px;height:33px;border-radius:10px;display:grid;place-items:center;background:#493564;color:#d8c2ff}
.monitor-icon.down{background:#512d40;color:#ffbdb4}
.monitor-icon.unknown{background:#423c53;color:#c8bdd2}
.graphic-icon{width:21px;height:21px;min-height:0;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.monitor h3{font-size:12px;min-height:34px;font-weight:600;margin-bottom:10px}
.monitor p{font-size:10px}
.monitor .chip{font-size:10px}
.chip{background:#213f40;color:#95e5cc}
.chip.down,.chip.disabled{background:#512d3b;color:#ffb4ac}
.chip.unknown,.chip.unavailable,.chip.stale{background:#423c53;color:#d7d1e5}
.chip.pending,.chip.maintenance{background:#4c4227;color:#f1d38e}
.uptime-track{height:3px;background:#473c60;border-radius:3px;overflow:hidden;margin-top:8px}
.uptime-track span{display:block;height:100%;background:#9f8dde}
.monitor.is-stale .uptime-track span{background:#85808f}
.dns-card,.panel,.card{background:linear-gradient(125deg,#282042,#181f40);border-color:#4a3a65}
.dns-card{padding:23px}
.dns-card h3{font-size:16px}
.dns-body{display:flex;align-items:center;gap:22px;margin:22px 0 17px}
.block-ring{--share:0%;width:104px;height:104px;flex:none;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(#ba9aef var(--share),#44375f 0)}
.block-ring:before{content:'';position:absolute;inset:7px;border-radius:50%;background:#27203f}
.ring-label{position:relative;text-align:center}
.ring-label strong{font-size:24px;font-weight:600;letter-spacing:-.5px}
.ring-label small{display:block;font-size:9px;letter-spacing:1px;text-transform:uppercase}
.block-ring.is-stale{filter:grayscale(1);opacity:.65}
.dns-metrics{flex:1;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin:0}
.dns-metrics dt{font-size:10px}
.dns-metrics dd{font-size:24px;font-variant-numeric:tabular-nums}
.dns-card>p{font-size:10px}
.metric-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.metric-top .muted{font-size:11px}
.metric-top .graphic-icon{color:#baa8ed;width:20px;height:20px}
.card{padding:22px;overflow:hidden}
.value{font-size:38px;font-weight:650;font-variant-numeric:tabular-nums}
.unit{font-size:12px}
.spark{min-height:0;height:38px;width:100%;margin-top:15px}
.spark-caption{font-size:9px;color:#ac9dc6;margin-top:5px}
.latency-card{padding:17px;background:#1c2142;border-color:#494570;border-radius:12px}
.latency-card h3{font-size:11px;color:#c9c2e2;font-weight:500;display:flex;align-items:center;gap:7px}
.latency-card .graphic-icon{width:16px;height:16px;color:#a9bfff}
.latency-card strong{font-size:27px}
.latency-card p{font-size:10px}
.panel{padding:23px;border-radius:16px}
.bar h2{font-size:17px}
.legend,.bar label,.chart-note{font-size:11px}
select{font-size:12px;border-color:#64517f;background:#201a39;border-radius:8px}
select:focus-visible,a:focus-visible{outline:2px solid #bf9df2;outline-offset:4px}
.banner{font-size:12px;background:#241f41;border-color:#50426c}
.banner.warning{border-color:#cb9744;color:#ffdb9c}
#latest{font-size:11px}
.chart-wrap{overflow-x:auto;width:100%;scrollbar-color:#796093 #211934}
.chart-wrap>svg{min-width:650px}
.chart-scroll-hint{display:none}
.scroll{scrollbar-color:#796093 #211934}
table{font-size:12px}
th{font-size:10px;text-transform:uppercase;letter-spacing:.7px}
th,td{padding:13px 14px}
tbody tr:hover{background:#342948}
.instructions h2{font-size:16px}
.instructions p,.instructions code{font-size:12px}
code{color:#d4bcf4}
footer{border-top:1px solid var(--line);padding:22px 0 12px;font-size:10px;color:#b0a0c5}
.abbey-signoff{display:flex;align-items:center;gap:10px;margin:0 0 18px;color:#e0cfee;font-family:Georgia,"Times New Roman",serif;font-size:20px}
.abbey-signoff img{width:52px;height:40px}
.abbey-signoff small{display:block;font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;letter-spacing:.5px;color:#b8a4ca}
#network,#dns,#latency-panel,#speed{scroll-margin-top:20px}
@media(min-width:1400px){.hero-summary{padding:42px}.hero{min-height:500px}.hero h2{font-size:52px}.hero-summary{gap:28px}.hero-description{font-size:13px}.health-copy strong{font-size:17px}.health-copy p{font-size:11px}}
@media(max-width:1150px){main{padding:25px}.hero-summary{padding:30px;width:51%}.hero h2{font-size:39px}.hero-health{gap:13px}.health-copy strong{font-size:14px}.hero:before{background-size:140% auto;background-position:10% 15%}.hero:after{background:linear-gradient(90deg,#191431,#191431ef 28%,#19143175 48%,#19143115 65%),linear-gradient(0deg,#191431,#19143110 40%)}.residents-note{right:20px;bottom:25px;padding:11px}.dns-grid{grid-template-columns:1fr}.dns-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:850px) and (min-width:761px){.hero-summary{width:55%;padding:25px}.hero h2{font-size:35px}.health-dial{width:78px;height:78px}.health-copy strong{font-size:13px}.hero-tag{font-size:8px}.hero-tag strong{font-size:10px}.residents-note{max-width:260px}.residents-note strong{font-size:10px}.residents-note span:not(.paw):not(.resident-heart){font-size:8px}}
@media(max-width:760px){
  main{padding:20px 16px}
  header{gap:16px}.brand{gap:10px}.abbey-mark{width:59px;height:52px}header h1{font-size:30px}header p{font-size:10px}header nav{gap:3px}header nav a{font-size:10px;padding:5px 7px}
  .jump{gap:5px;margin:16px 0}.jump a{font-size:10px;padding:6px 10px}
  .hero{min-height:0;border-radius:20px}
  .hero:before{background-size:auto 480px;background-position:51% top}
  .hero:after{background:linear-gradient(0deg,#191431 0%,#191431 33%,#191431f2 43%,#19143118 67%,#19143108 85%,#19143125)}
  .hero-summary{width:100%;padding:330px 24px 25px;gap:23px}
  .eyebrow{font-size:9px;margin-bottom:10px}.hero h2{font-size:40px}.hero-description{font-size:12px}.hero-health{gap:18px}.health-dial{width:90px;height:90px}.health-copy strong{font-size:15px}.health-copy p{font-size:10px}
  .hero-tag{font-size:9px}.hero-tag strong{font-size:11px}
  .residents-note{top:20px;right:18px;bottom:auto;left:auto;padding:8px 10px;gap:7px}.residents-note strong{font-size:9px}.residents-note span:not(.paw):not(.resident-heart){font-size:8px}.resident-heart{font-size:22px}.residents-note .paw{transform:scale(.75) rotate(-13deg);margin-right:-2px}
  .monitor-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.monitor{padding:14px}.monitor h3{font-size:12px;min-height:32px}.monitor-top{gap:5px}.monitor .chip{font-size:9px;padding:3px 6px}.monitor-icon{width:29px;height:29px}
  .network-banner strong{font-size:13px}.network-banner small{font-size:10px}.section-head p{font-size:10px}.section-head h2,.section-label{font-size:18px}
  .dns-card{padding:17px}.dns-body{gap:18px}.block-ring{width:95px;height:95px}.ring-label strong{font-size:22px}.dns-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.dns-metrics>div:first-child{grid-column:1/-1}.dns-metrics dd{font-size:22px}.dns-card h3{font-size:14px}.dns-card .chip{font-size:10px}
  .card{padding:16px}.value{font-size:29px}.metric-top{gap:5px}.metric-top .muted{font-size:10px}.unit{font-size:10px}.panel{padding:17px}.latency-card{padding:13px}.latency-card h3{font-size:10px;align-items:flex-start;min-height:28px;gap:5px}.latency-card strong{font-size:24px}.chart-scroll-hint{display:block;font-size:10px;color:#b9a7cf}.bar{gap:10px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}