.app-frame{
  border-radius:32px;padding:10px;
  background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(232,240,253,.72));
  border:1px solid rgba(255,255,255,.85);
  box-shadow:var(--shadow-lg);
}
.app-topbar{
  min-height:68px;display:flex;justify-content:space-between;gap:14px;align-items:center;
  padding:14px 14px 10px;
}
.app-kicker{display:block;color:var(--primary);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;font-weight:800}
.status-badge{display:inline-flex;align-items:center;white-space:nowrap;padding:8px 10px;border-radius:999px;font-size:.72rem;font-weight:800}
.status-ok{background:#eafaf3;color:#08784d}
.app-body{display:grid;gap:12px}
.asset-card,.risk-panel,.trend-panel,.recommendation-panel{
  background:rgba(255,255,255,.86);border:1px solid rgba(223,231,242,.9);
  border-radius:24px;padding:16px;box-shadow:var(--shadow-sm)
}
.asset-head{display:flex;justify-content:space-between;align-items:center;gap:14px}
.asset-head span{display:block;color:var(--muted);font-size:.84rem;font-weight:700}
.asset-head strong{font-size:2.35rem;letter-spacing:-.06em}
.radial{
  --size:86px;width:var(--size);height:var(--size);border-radius:50%;
  background:conic-gradient(var(--primary) calc(var(--value)*1%),#e6edf8 0);
  display:grid;place-items:center;position:relative;flex:0 0 auto;
}
.radial:after{content:"";position:absolute;inset:9px;border-radius:50%;background:white}
.radial span{position:relative;z-index:1;font-weight:850;color:var(--ink)}
.panel-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.panel-title span{color:var(--success);font-weight:800}
.risk-matrix{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.risk-matrix i{height:38px;border-radius:13px;background:#edf3fb}
.risk-matrix i:nth-child(3),.risk-matrix i:nth-child(6){background:#fff3d8}
.risk-matrix i:nth-child(9){background:#ffe7e8}
.risk-matrix .active{background:var(--primary);box-shadow:0 0 0 5px rgba(18,100,255,.12)}
.trend-chart{height:150px;width:100%}
.grid-line{stroke:#dfe7f2;stroke-width:1}
.area{fill:url(#chartFill)}
.line{fill:none;stroke:#1264ff;stroke-width:5;stroke-linecap:round}
.recommendation-panel{background:#071a33;color:#c5d5ee}
.recommendation-panel h3{color:white;margin:8px 0}
.mini-label{color:#7eb0ff;font-weight:850;font-size:.75rem;text-transform:uppercase;letter-spacing:.12em}


/* Sprint 2 - Dashboard Experience */
.dashboard-experience{
  background:
    radial-gradient(circle at 90% 10%, rgba(18,100,255,.12), transparent 32rem),
    linear-gradient(180deg,rgba(255,255,255,.58),rgba(238,244,255,.76));
}
.sentinel-console{
  display:grid;
  background:#071a33;
  color:#c7d8f2;
  border-radius:32px;
  overflow:hidden;
  box-shadow:var(--shadow-lg);
  border:1px solid rgba(255,255,255,.16);
}
.console-sidebar{
  display:none;
  background:rgba(255,255,255,.05);
  border-right:1px solid rgba(255,255,255,.1);
  padding:22px;
}
.console-logo{display:flex;align-items:center;gap:12px;margin-bottom:24px}
.console-logo span{width:32px;height:32px;border-radius:12px;background:linear-gradient(145deg,#1264ff,#79a9ff)}
.console-logo strong{color:white}
.console-sidebar nav{display:grid;gap:8px}
.console-sidebar a{padding:12px 14px;border-radius:14px;color:#bdd0ec;font-weight:700}
.console-sidebar a.active,.console-sidebar a:hover{background:rgba(255,255,255,.09);color:white}
.console-main{padding:14px;display:grid;gap:14px}
.console-header{
  display:grid;
  gap:14px;
  padding:12px;
}
.console-header span{display:block;color:#7eb0ff;text-transform:uppercase;letter-spacing:.12em;font-size:.74rem;font-weight:850}
.console-header strong{color:white;font-size:1.25rem}
.console-actions{display:grid;grid-template-columns:1fr;gap:10px}
.console-actions button{
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.08);
  color:white;
  border-radius:14px;
  min-height:44px;
  padding:0 14px;
  font-weight:800;
}
.console-actions .primary-action{background:var(--primary);border-color:transparent}
.console-kpis{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.console-kpis article{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  padding:16px;
}
.console-kpis span{display:block;color:#9fb6d6;font-size:.82rem;font-weight:750}
.console-kpis strong{display:block;color:white;font-size:1.85rem;letter-spacing:-.05em;margin:4px 0}
.console-kpis small{color:#b7c8e2}
.console-kpis .positive{color:#71e3ad}
.console-layout{display:grid;gap:14px}
.console-panel{
  background:#0b2344;
  border:1px solid rgba(255,255,255,.12);
  border-radius:24px;
  padding:16px;
}
.console-panel strong{color:white}
.large-panel{min-height:260px}
.forecast-chart{width:100%;height:220px;margin-top:10px}
.forecast-grid{stroke:rgba(255,255,255,.08);stroke-width:1}
.forecast-area{fill:url(#forecastFill)}
.forecast-line{fill:none;stroke:#7eb0ff;stroke-width:5;stroke-linecap:round}
.forecast-points circle{fill:white;stroke:#1264ff;stroke-width:5}
.priority-list{display:grid;gap:10px}
.priority-list div{
  display:grid;
  grid-template-columns:1fr;
  gap:2px;
  padding:12px;
  border-radius:16px;
  background:rgba(255,255,255,.07);
}
.priority-list b{color:white}
.priority-list span{color:#adc2df;font-size:.92rem}
.priority-list i{
  width:max-content;
  margin-top:6px;
  font-style:normal;
  font-size:.74rem;
  font-weight:850;
  padding:5px 9px;
  border-radius:999px;
}
.priority-list .low{background:#eafaf3;color:#08784d}
.priority-list .medium{background:#fff4d8;color:#946200}
.priority-list .high{background:#ffe8ea;color:#b4232a}
.cost-card{
  min-height:188px;
  border-radius:20px;
  background:linear-gradient(145deg,rgba(18,100,255,.24),rgba(255,255,255,.07));
  padding:18px;
  display:grid;
  align-content:center;
  gap:6px;
}
.cost-card span{color:#9fb6d6}
.cost-card strong{font-size:2.4rem;letter-spacing:-.06em}
.cost-card small{color:#bfd1ea}
.page-hero h1{margin-top:24px;max-width:900px}
.page-hero .hero-lead{margin-top:18px}