:root{color-scheme:dark;font-family:IBM Plex Sans,Segoe UI,Noto Sans TC,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg: #0b101b;--bg-alt: #0f1727;--panel: rgba(18, 25, 40, .94);--panel-strong: rgba(13, 19, 31, .98);--border: #27324a;--border-soft: #1b2436;--text: #f5f7fa;--muted: #98a6ba;--muted-strong: #c7d0df;--green: #73bf69;--red: #f2495c;--amber: #ffb357;--blue: #5794f2;--teal: #56d2f5;--slate: #8f9baa;--shadow: 0 18px 48px rgba(0, 0, 0, .24)}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-height:100vh;background:radial-gradient(circle at top left,rgba(87,148,242,.08),transparent 30%),radial-gradient(circle at top right,rgba(115,191,105,.06),transparent 24%),linear-gradient(180deg,#0b101b,#0a0e17);color:var(--text)}button,input,table{font:inherit}.dashboard-shell{max-width:1540px;margin:0 auto;padding:20px}.panel{overflow:hidden;background:linear-gradient(180deg,#121928f5,#0d131ffa);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow)}.panel__header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 18px 0}.panel__header h2{margin:0;font-size:1rem;font-weight:600;letter-spacing:-.01em}.hero{position:relative;margin-bottom:16px;padding:22px}.hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(130deg,rgba(87,148,242,.1),transparent 30%),linear-gradient(310deg,rgba(115,191,105,.08),transparent 26%);pointer-events:none}.hero__content{position:relative;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(320px,.95fr);gap:20px}.eyebrow{display:inline-flex;align-items:center;padding:4px 10px;border:1px solid rgba(87,148,242,.3);border-radius:999px;background:#5794f21a;color:#a8c5ff;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase}.hero h1{margin:14px 0 10px;font-size:clamp(2rem,2.4vw,3rem);line-height:1.05;letter-spacing:-.04em}.hero__service{display:grid;gap:6px;padding:14px 16px;border:1px solid rgba(87,148,242,.16);border-radius:10px;background:#080d1666}.hero__service-name{font-size:1rem;font-weight:600}.hero__service-url{color:var(--muted);font-size:.88rem;word-break:break-all}.hero__status-panel{display:grid;gap:14px;align-self:stretch;padding:16px;border:1px solid rgba(115,191,105,.16);border-radius:12px;background:#080d169e}.hero__status-head,.hero__status-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.hero__status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.hero__status-item{display:grid;gap:7px;padding:12px;border:1px solid var(--border-soft);border-radius:10px;background:#ffffff05}.hero__status-item strong{line-height:1.5;word-break:break-word}.hero__status-item--wide{grid-column:1 / -1}.hero__status-text{font-size:.95rem;font-weight:600}.hero__status-text.is-ok{color:#8fd681}.hero__status-text.is-issue{color:#ff8c9b}.meta-label{color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}.refresh-button{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 16px;border:1px solid #34425d;border-radius:10px;background:linear-gradient(180deg,#182236,#131b2b);color:var(--text);cursor:pointer;transition:transform .14s ease,border-color .14s ease,background .14s ease}.refresh-button:hover:enabled{transform:translateY(-1px);border-color:#4a5f84;background:linear-gradient(180deg,#1b2942,#152034)}.refresh-button:disabled{opacity:.65;cursor:wait}.error-banner{display:grid;gap:4px;margin-bottom:16px;padding:14px 16px;border:1px solid rgba(242,73,92,.36);border-radius:12px;background:#531421db;color:#ffd5db}.loading-panel{display:grid;place-items:center;gap:10px;min-height:260px}.loading-panel__pulse{width:16px;height:16px;border-radius:999px;background:var(--blue);box-shadow:0 0 #5794f266;animation:loadingPulse 1.6s infinite}.stats-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:16px}.stat-card{position:relative;display:grid;gap:10px;min-height:128px;padding:18px;border-radius:12px;background:linear-gradient(180deg,#121928fa,#0d131ffa);border:1px solid var(--border)}.stat-card:after{content:"";position:absolute;inset:0 auto 0 0;width:4px;opacity:.95}.accent-green:after{background:var(--green)}.accent-blue:after{background:var(--blue)}.accent-teal:after{background:var(--teal)}.accent-amber:after{background:var(--amber)}.accent-slate:after{background:var(--slate)}.stat-card__label{color:var(--muted);font-size:.76rem;text-transform:uppercase;letter-spacing:.08em}.stat-card__value{font-size:clamp(1.5rem,1.8vw,2.1rem);font-weight:700;letter-spacing:-.04em}.stat-card__detail{color:var(--muted-strong);font-size:.84rem;line-height:1.55}.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:16px}.chart-wrapper{padding:8px 12px 14px}.insights-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.8fr);gap:16px;margin-bottom:16px}.summary-panel__body{display:grid;gap:0;padding:10px 18px 18px}.summary-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--border-soft)}.summary-row:last-child{border-bottom:0}.summary-row span{color:var(--muted);font-size:.88rem}.summary-row strong{text-align:right}.summary-ok{color:#8fd681}.summary-issue{color:#ff8c9b}.status-badge{display:inline-flex;align-items:center;gap:8px;min-width:92px;height:32px;padding:0 12px;border-radius:999px;font-weight:700;letter-spacing:.06em;font-size:.78rem}.status-badge__led{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 12px currentColor}.status-badge.is-up{background:#73bf691f;color:#8fd681;border:1px solid rgba(115,191,105,.28)}.status-badge.is-up .status-badge__led{animation:statusBeacon 3.6s ease-in-out infinite}.status-badge.is-down{background:#f2495c24;color:#ff8c9b;border:1px solid rgba(242,73,92,.3)}.status-badge.is-down .status-badge__led{animation:alertBeacon 1.8s ease-in-out infinite}.incident-list{display:grid;gap:12px;padding:12px 18px 18px}.incident-item{padding:14px;border:1px solid rgba(242,73,92,.18);border-radius:12px;background:#f2495c0d}.incident-item__header,.incident-item__meta{display:flex;align-items:center;justify-content:space-between;gap:12px}.incident-item__meta{margin-top:8px;color:var(--muted);font-size:.82rem}.incident-item p{margin:10px 0 0;color:var(--muted-strong);font-size:.9rem;line-height:1.55}.incident-tag{display:inline-flex;align-items:center;justify-content:center;min-width:68px;padding:4px 8px;border-radius:999px;background:#ffb3571f;color:#ffcb8a;font-size:.76rem;font-weight:600}.empty-state{padding:24px;border:1px dashed var(--border);border-radius:12px;color:var(--muted);text-align:center}.table-shell{padding:10px 12px 14px;overflow-x:auto}.checks-table{width:100%;min-width:760px;border-collapse:collapse}.checks-table thead tr{background:#ffffff05}.checks-table th{padding:11px 10px;border-bottom:1px solid var(--border);color:var(--muted);text-align:left;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em}.checks-table td{padding:12px 10px;border-bottom:1px solid var(--border-soft);color:var(--text);vertical-align:top;font-size:.86rem}.checks-table tbody tr:hover{background:#5794f20d}.checks-table__empty{text-align:center;color:var(--muted)}.has-error{color:#ffb1bb!important}@keyframes loadingPulse{0%{box-shadow:0 0 #5794f266}70%{box-shadow:0 0 0 16px #5794f200}to{box-shadow:0 0 #5794f200}}@keyframes statusBeacon{0%,to{opacity:.9;transform:scale(1);box-shadow:0 0 8px currentColor}50%{opacity:.28;transform:scale(.92);box-shadow:0 0 18px currentColor}}@keyframes alertBeacon{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.88)}}@media (max-width: 1320px){.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width: 1120px){.hero__content,.dashboard-grid,.insights-grid{grid-template-columns:1fr}}@media (max-width: 720px){.dashboard-shell{padding:12px}.stats-grid,.hero__status-grid{grid-template-columns:1fr}.hero{padding:18px}.hero__status-head,.hero__status-footer,.incident-item__header,.incident-item__meta,.summary-row{flex-direction:column;align-items:flex-start}.stats-grid{grid-template-columns:1fr}.summary-row strong{text-align:left}}
