.wrap-wide{max-width:1060px}

.page-hero{margin-bottom:48px;position:relative}

.page-title{
  font-size:2.25rem;
  font-weight:800;
  letter-spacing:-.045em;
  margin-bottom:14px;
  line-height:1.08;
  background:linear-gradient(135deg,#ffffff 0%,#6b6b85 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.page-sub{font-size:.92rem;color:var(--fg-3);max-width:660px;line-height:1.7}

.section-head-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:24px;
  flex-wrap:wrap;
}

.section-title{
  display:flex;
  align-items:center;
  gap:11px;
  font-size:.7rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:var(--fg-5);
  margin:0;
}
.section-icon-svg{width:15px;height:15px;flex-shrink:0;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}
.section-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  height:20px;
  padding:0 8px;
  border-radius:var(--r-full);
  background:var(--accent-bg);
  color:var(--accent-3);
  font-size:.66rem;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  letter-spacing:.02em;
  border:1px solid var(--accent-line);
}

.filters{
  display:inline-flex;
  gap:3px;
  padding:4px;
  background:var(--bg-2);
  border:1px solid var(--line-2);
  border-radius:12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02),var(--sh-1);
}
.filter{
  padding:9px 17px;
  border-radius:9px;
  background:transparent;
  border:none;
  color:var(--fg-3);
  font-size:.81rem;
  font-weight:600;
  cursor:pointer;
  transition:background var(--dur-2) var(--ease),color var(--dur-2) var(--ease),box-shadow var(--dur-3) var(--ease);
  font-family:inherit;
  display:inline-flex;
  align-items:center;
  gap:8px;
  letter-spacing:-.005em;
  min-height:38px;
}
.filter:hover:not(.active){background:var(--bg-4);color:var(--fg-1)}
.filter.active{
  background:linear-gradient(140deg,var(--accent),var(--accent-2));
  color:#fff;
  box-shadow:0 6px 20px var(--accent-glow),inset 0 1px 0 rgba(255,255,255,.16);
}
.filter-count{
  padding:1px 8px;
  border-radius:5px;
  background:rgba(255,255,255,.08);
  font-size:.65rem;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  min-width:20px;
  text-align:center;
  line-height:1.55;
}
.filter.active .filter-count{background:rgba(255,255,255,.28)}

.incident-list{display:flex;flex-direction:column;gap:16px}

.maint-card{
  background:linear-gradient(135deg,rgba(96,165,250,.045) 0%,rgba(96,165,250,.005) 60%),var(--bg-2);
  border:1px solid rgba(96,165,250,.16);
  border-left:3px solid var(--info);
  border-radius:var(--r-md);
  padding:28px;
  animation:fade-up .45s var(--ease-out);
  transition:border-color var(--dur-3) var(--ease),box-shadow var(--dur-4) var(--ease),transform var(--dur-3) var(--ease-smooth);
  position:relative;
  overflow:hidden;
  contain:layout style;
}
.maint-card::before{
  content:'';
  position:absolute;
  top:-80px;
  right:-80px;
  width:260px;
  height:260px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(96,165,250,.14),transparent 70%);
  filter:blur(50px);
  pointer-events:none;
  transition:opacity var(--dur-4) var(--ease);
}
.maint-card:hover{
  border-color:rgba(96,165,250,.3);
  border-left-color:var(--info);
  transform:translateY(-2px);
  box-shadow:0 16px 48px rgba(96,165,250,.1),var(--sh-3);
}
.maint-card.in_progress{
  background:linear-gradient(135deg,rgba(250,204,21,.055) 0%,rgba(250,204,21,.005) 60%),var(--bg-2);
  border-color:rgba(250,204,21,.2);
  border-left-color:var(--warn);
}
.maint-card.in_progress::before{background:radial-gradient(circle,rgba(250,204,21,.15),transparent 70%)}
.maint-card.in_progress:hover{border-color:rgba(250,204,21,.38);box-shadow:0 16px 48px rgba(250,204,21,.1),var(--sh-3)}

.maint-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px;position:relative;z-index:1}
.maint-title{
  font-size:1.04rem;
  font-weight:620;
  color:var(--fg-1);
  line-height:1.4;
  letter-spacing:-.018em;
}
.maint-badges{display:flex;gap:6px;flex-shrink:0;flex-wrap:wrap}
.maint-desc{
  font-size:.87rem;
  color:var(--fg-2);
  line-height:1.7;
  margin-bottom:18px;
  overflow-wrap:anywhere;
  word-break:break-word;
  position:relative;
  z-index:1;
}

.maint-window{
  display:flex;
  align-items:center;
  gap:26px;
  padding:16px 20px;
  background:rgba(5,5,8,.35);
  border-radius:12px;
  font-size:.8rem;
  flex-wrap:wrap;
  border:1px solid var(--line-2);
  position:relative;
  z-index:1;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.maint-window-item{display:flex;align-items:center;gap:9px;color:var(--fg-3)}
.maint-window-item svg{width:13px;height:13px;color:var(--fg-4);flex-shrink:0;stroke-linecap:round;stroke-linejoin:round}
.maint-window-label{color:var(--fg-5);font-size:.65rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.maint-window-value{font-variant-numeric:tabular-nums;color:var(--fg-1);font-weight:550;letter-spacing:-.008em}
.maint-window-countdown{
  margin-left:auto;
  color:var(--info-2);
  font-weight:600;
  font-size:.75rem;
  padding:5px 12px;
  background:var(--info-bg);
  border-radius:var(--r-full);
  letter-spacing:-.008em;
  border:1px solid var(--info-line);
  display:inline-flex;
  align-items:center;
  gap:7px;
}
.maint-window-countdown::before{
  content:'';
  width:5px;
  height:5px;
  border-radius:50%;
  background:currentColor;
  box-shadow:0 0 8px currentColor;
  animation:pulse 2s var(--ease) infinite;
}

.incident-large{
  background:var(--bg-2);
  border:1px solid var(--line-2);
  border-radius:var(--r-md);
  padding:26px 28px;
  border-left:3px solid var(--warn);
  animation:fade-up .45s var(--ease-out);
  transition:border-color var(--dur-3) var(--ease),box-shadow var(--dur-4) var(--ease),transform var(--dur-3) var(--ease-smooth),background var(--dur-3) var(--ease);
  position:relative;
  overflow:hidden;
  contain:layout style;
}
.incident-large::before{
  content:'';
  position:absolute;
  top:-100px;
  right:-100px;
  width:340px;
  height:340px;
  border-radius:50%;
  opacity:.04;
  background:currentColor;
  filter:blur(70px);
  pointer-events:none;
  transition:opacity var(--dur-4) var(--ease);
}
.incident-large:hover{
  border-color:var(--line-3);
  background:var(--bg-3);
  transform:translateY(-2px);
  box-shadow:0 16px 48px rgba(0,0,0,.35),var(--sh-3);
}
.incident-large:hover::before{opacity:.09}
.incident-large.critical{border-left-color:var(--err);color:var(--err)}
.incident-large.major{border-left-color:var(--orange);color:var(--orange)}
.incident-large.minor{border-left-color:var(--warn);color:var(--warn)}
.incident-large.maintenance{border-left-color:var(--info);color:var(--info)}

.incident-large .incident-head{margin-bottom:14px;position:relative;z-index:1}
.incident-large .incident-title{
  font-size:1.06rem;
  font-weight:620;
  line-height:1.4;
  letter-spacing:-.022em;
  color:var(--fg-1);
}

.incident-header-badges{display:flex;gap:6px;flex-shrink:0;flex-wrap:wrap;align-items:center}

.incident-desc{
  font-size:.88rem;
  color:var(--fg-2);
  line-height:1.75;
  margin-bottom:18px;
  overflow-wrap:anywhere;
  word-break:break-word;
  position:relative;
  z-index:1;
}

.incident-meta{
  display:flex;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
  font-size:.75rem;
  color:var(--fg-4);
  padding-top:18px;
  border-top:1px solid var(--line-1);
  position:relative;
  z-index:1;
}
.meta-item{display:flex;align-items:center;gap:8px}
.meta-item svg{width:12px;height:12px;flex-shrink:0;stroke-linecap:round;stroke-linejoin:round}
.meta-item strong{color:var(--fg-2);font-weight:600;letter-spacing:-.008em}

.duration-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 11px;
  border-radius:var(--r-full);
  font-size:.7rem;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  letter-spacing:.02em;
  border:1px solid transparent;
}
.duration-badge svg{width:11px;height:11px;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5}
.duration-badge.fast{background:var(--ok-bg);color:var(--ok-2);border-color:var(--ok-line)}
.duration-badge.mid{background:var(--warn-bg);color:var(--warn-2);border-color:var(--warn-line)}
.duration-badge.slow{background:var(--err-bg);color:var(--err-2);border-color:var(--err-line)}
.duration-badge.ongoing{background:var(--err-bg);color:var(--err-2);border-color:var(--err-line)}
.duration-badge.ongoing::before{
  content:'';
  width:5px;
  height:5px;
  border-radius:50%;
  background:currentColor;
  box-shadow:0 0 8px currentColor;
  animation:pulse 1.8s var(--ease) infinite;
}

.timeline{margin-top:22px;padding-top:22px;border-top:1px solid var(--line-1);position:relative;z-index:1}
.timeline-title{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--fg-5);margin-bottom:16px}
.timeline-item{display:flex;gap:18px;padding:13px 0;position:relative}
.timeline-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:linear-gradient(140deg,var(--accent),var(--accent-2));
  margin-top:7px;
  flex-shrink:0;
  position:relative;
  z-index:1;
  box-shadow:0 0 0 4px var(--bg-2),0 0 18px var(--accent-glow),inset 0 1px 0 rgba(255,255,255,.3);
}
.timeline-item:not(:last-child)::before{
  content:'';
  position:absolute;
  left:4.5px;
  top:19px;
  bottom:-13px;
  width:1px;
  background:linear-gradient(180deg,var(--line-3),transparent);
}
.timeline-body{flex:1;min-width:0}
.timeline-msg{
  font-size:.86rem;
  color:var(--fg-1);
  line-height:1.7;
  margin-bottom:6px;
  overflow-wrap:anywhere;
  word-break:break-word;
  letter-spacing:-.008em;
}
.timeline-meta{font-size:.72rem;color:var(--fg-4);display:flex;gap:11px;flex-wrap:wrap;align-items:center}
.timeline-meta .badge{font-size:.61rem;padding:3px 9px}

.empty-state{
  text-align:center;
  padding:80px 28px;
  color:var(--fg-4);
  font-size:.9rem;
  background:var(--bg-2);
  border:1px solid var(--line-2);
  border-radius:var(--r-md);
  line-height:1.6;
}
.empty-icon{
  width:58px;
  height:58px;
  margin:0 auto 20px;
  border-radius:17px;
  background:var(--ok-bg);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--ok);
  box-shadow:0 0 40px var(--ok-glow),inset 0 1px 0 rgba(255,255,255,.08);
  animation:fade-scale .5s var(--ease-spring);
}
.empty-icon svg{width:26px;height:26px;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5}
.empty-title{color:var(--fg-1);font-weight:620;font-size:1rem;margin-bottom:7px;letter-spacing:-.018em}
.empty-sub{color:var(--fg-4);font-size:.84rem;line-height:1.65}

.skeleton-card{
  height:150px;
  border-radius:var(--r-md);
  background:linear-gradient(90deg,var(--bg-2) 0%,var(--bg-3) 20%,var(--bg-4) 40%,var(--bg-3) 60%,var(--bg-2) 100%);
  background-size:200% 100%;
  animation:shimmer 2s cubic-bezier(.4,0,.6,1) infinite;
  border:1px solid var(--line-2);
}

.incident-links{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid var(--line-1);
  position:relative;
  z-index:1;
}

.link-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  font-size:.75rem;
  font-weight:500;
  color:var(--fg-4);
  background:var(--bg-3);
  border:1px solid var(--line-2);
  border-radius:8px;
  transition:background var(--dur-2) var(--ease),color var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease);
  cursor:pointer;
  font-family:inherit;
  letter-spacing:-.005em;
}
.link-btn:hover{background:var(--bg-4);color:var(--fg-2);border-color:var(--line-3)}
.link-btn svg{width:12px;height:12px;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}
.link-btn.copied{color:var(--ok-2);background:var(--ok-bg);border-color:var(--ok-line)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}

@media (forced-colors:active){
  .incident-large,.maint-card,.empty-state{border:1px solid CanvasText}
  .filters,.filter{border:1px solid CanvasText}
  .timeline-dot{forced-color-adjust:none;outline:1px solid CanvasText}
}

@media (max-width:700px){
  .page-title{font-size:1.7rem}
  .page-sub{font-size:.87rem}
  .page-hero{margin-bottom:36px}
  .section-head-row{flex-direction:column;align-items:stretch;gap:16px}
  .filters{display:flex;justify-content:space-between;width:100%}
  .filter{flex:1;justify-content:center;padding:10px 9px;font-size:.76rem}
  .filter-count{display:none}
  .filter.active .filter-count{display:inline-block}
  .incident-large,.maint-card{padding:22px 20px}
  .incident-head,.maint-head{flex-direction:column;align-items:flex-start;gap:12px}
  .maint-window{flex-direction:column;align-items:flex-start;gap:14px}
  .maint-window-countdown{margin-left:0}
  .incident-meta{gap:14px}
  .timeline-item{gap:14px}
  .empty-state{padding:60px 22px}
  .incident-links{flex-wrap:wrap}
}

@media print{
  .filters,.page-head-actions,.search-box,.link-btn{display:none!important}
  .incident-large,.maint-card{background:#fff!important;border:1px solid #ccc!important;page-break-inside:avoid;break-inside:avoid}
  .timeline-dot{background:#999!important;box-shadow:none!important}
  .page-title{color:#000!important;-webkit-text-fill-color:#000!important}
                }