/* Opti247 presentation DEMO workspace (T247-73 / 11934). SCRUM-35 v2 polish.
   Scoped to #demo / .demo-*; amber DEMO banners preserved. */
.demo-banner{
  position:sticky;top:0;z-index:20;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:var(--sp-2,8px) var(--sp-4,16px);box-sizing:border-box;width:100%;
  padding:var(--sp-3,12px) var(--sp-7,32px);background:#fff4ce;color:#5c4400;
  border-bottom:2px solid #a07a00;font-size:var(--fs-sm,14px);
  box-shadow:0 2px 8px rgba(160,122,0,.12);
}
.demo-banner p{margin:0;color:inherit;line-height:1.5;min-width:0;overflow-wrap:anywhere;font-weight:600}
.demo-banner-tag{display:inline-block;background:#5c4400;color:#fff;border-radius:999px;padding:3px 10px;letter-spacing:.04em;font-weight:700;font-size:var(--fs-xs,12px)}
.demo-banner-actions{display:flex;flex-wrap:wrap;gap:var(--sp-2,8px)}
.demo-banner button,.demo-ws button{margin-top:0}
.demo-banner button{padding:0 var(--sp-4,16px);min-height:36px;border-radius:var(--radius,6px);font-weight:600}
.demo-banner .demo-secondary,.demo-ws .demo-secondary{background:var(--surface,#fff);color:var(--accent-text,#B4A3FF);border:1px solid var(--accent,#1f4fd8)}
#navigation a.demo-nav{
  border:0;background:rgba(245,158,11,.12);color:#FBBF24; /* SCRUM-37 a11y: was #5c4400 on navy */
}
#navigation a.demo-nav:hover{background:rgba(245,158,11,.2);color:#FCD34D}
#navigation a.demo-nav[aria-current="page"]{
  background:#FBBF24;border:0;color:#0B1020;
}
#navigation a.demo-nav[aria-current="page"]:hover{background:#FCD34D;color:#0B1020}
#demo.demo-ws{
  max-width:none;min-width:0;
  background:var(--surface,#fff);border:1px solid var(--line-subtle,#d5dde8);
  border-radius:var(--radius-lg,18px);padding:var(--sp-6,24px) var(--sp-7,32px);
  box-shadow:var(--shadow,0 1px 2px rgba(15,27,45,.06),0 8px 24px rgba(15,27,45,.06));
}
.demo-ws .demo-intro{
  border-left:4px solid #a07a00;background:#fff9e6;color:#5c4400;
  padding:var(--sp-3,12px) var(--sp-4,16px);border-radius:var(--radius,6px);font-weight:600;
}
.demo-ws h3{font-size:var(--fs-lg,20px);font-weight:700;margin:var(--sp-5,20px) 0 var(--sp-3,12px);color:var(--ink,#0f1b2d)}
.demo-ws h4{font-size:var(--fs-md,16px);font-weight:700;margin:var(--sp-4,16px) 0 var(--sp-2,8px)}
.demo-ws h5{font-size:var(--fs-sm,14px);margin:var(--sp-3,12px) 0 var(--sp-1,4px);color:var(--ink-soft,#5a6a82)}
.demo-ws .demo-subtitle{margin-top:0}
.demo-tag{display:inline-block;font-size:12px;font-weight:700;color:#5c4400;background:#fff4ce;border:1px solid #a07a00;border-radius:999px;padding:2px 10px;vertical-align:middle}
.demo-tabs{display:flex;flex-wrap:wrap;gap:var(--sp-2,8px);margin:0 0 var(--sp-5,20px);padding-bottom:var(--sp-3,12px);border-bottom:1px solid var(--line-subtle,#d5dde8)}
.demo-tabs button{
  background:var(--surface,#fff);color:var(--ink,#0f1b2d);border:1px solid var(--line,#8b98ab);
  padding:8px 14px;border-radius:999px;font-weight:600;min-height:36px;
}
.demo-tabs button[aria-current="page"]{background:var(--accent,#1f4fd8);color:var(--accent-ink,#fff);border-color:var(--accent,#1f4fd8);box-shadow:0 1px 2px rgba(15,27,45,.08)}
.demo-context{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:var(--sp-2,8px) var(--sp-4,16px);margin:0 0 var(--sp-5,20px);
  padding:var(--sp-4,16px);border:1px solid #a07a00;border-radius:var(--radius-lg,18px);
  background:linear-gradient(180deg,#fffbeb 0%,#fff4ce 100%);font-size:var(--fs-sm,14px);
}
.demo-context-item{min-width:0}
.demo-context dt{color:var(--ink-soft,#5a6a82);font-weight:700;font-size:var(--fs-xs,12px);text-transform:uppercase;letter-spacing:.03em}
.demo-context dd{margin:0;overflow-wrap:anywhere;font-weight:600;color:var(--ink,#0f1b2d)}
.demo-context .demo-context-tag{grid-column:1/-1}
.demo-context .demo-context-tag dt{color:#FBBF24} /* SCRUM-37 a11y: amber on dark surface >=4.5:1 (was #5c4400, 1.67:1) */
.demo-context .demo-context-tag dd{display:none}
.demo-filters{
  border:1px solid var(--line-subtle,#d5dde8);border-radius:var(--radius-lg,18px);
  padding:var(--sp-4,16px);margin:0 0 var(--sp-4,16px);background:var(--bg,#eef2f7);
}
.demo-selects{display:flex;flex-wrap:wrap;gap:0 var(--sp-4,16px)}
.demo-selects>div{flex:1 1 12em;min-width:0}
.demo-selects label{margin:var(--sp-3,12px) 0 var(--sp-1,4px)}
.demo-alert{color:var(--danger,#b3261e);font-weight:600}
.demo-alert:empty{margin:0}
.demo-cards{list-style:none;margin:0 0 var(--sp-5,20px);padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--sp-4,16px)}
.demo-card{
  position:relative;overflow:hidden;border:1px solid var(--line-subtle,#d5dde8);border-radius:var(--radius-lg,18px);
  padding:var(--sp-4,16px);display:flex;flex-direction:column;gap:var(--sp-2,8px);min-width:0;
  background:var(--surface,#fff);box-shadow:var(--shadow-sm,0 1px 2px rgba(15,27,45,.05));
}
.demo-card::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent,#1f4fd8),#6b93f5)}
.demo-card-label{font-size:var(--fs-sm,14px);color:var(--ink-soft,#5a6a82);font-weight:600}
.demo-card strong{font-size:var(--fs-xl,24px);font-weight:700;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;letter-spacing:-.02em}
.demo-card .demo-tag{align-self:flex-start}
.demo-kpi{
  border:1px solid var(--accent,#1f4fd8);border-radius:var(--radius-lg,18px);
  padding:var(--sp-4,16px);margin:0 0 var(--sp-4,16px);background:var(--accent-soft,#e8eefc);
}
.demo-kpi h4{margin-top:0}
.demo-kpi p{margin:var(--sp-1,4px) 0}
.demo-empty{
  border:1px dashed var(--line,#8b98ab);border-radius:var(--radius-lg,18px);
  padding:var(--sp-4,16px);font-weight:700;text-align:center;background:var(--bg,#eef2f7);color:var(--ink,#0f1b2d);
}
.demo-goal-activity{border:1px dashed var(--muted,#6b7280);border-radius:var(--radius-lg,18px);padding:var(--sp-4,16px);margin:0 0 var(--sp-4,16px);background:var(--surface,#fff)}
.demo-goal-activity h4{margin-top:0}
.demo-kpi-value strong{font-size:var(--fs-2xl,30px);font-weight:700;font-variant-numeric:tabular-nums}
.demo-provisional{font-size:var(--fs-sm,14px);color:#5c4400;background:#fff4ce;border:1px solid #a07a00;border-radius:999px;padding:2px 10px;font-weight:600}
.demo-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--sp-4,16px);margin:0 0 var(--sp-4,16px)}
.demo-chart{margin:0;border:1px solid var(--line-subtle,#d5dde8);border-radius:var(--radius-lg,18px);padding:var(--sp-4,16px);min-width:0;background:var(--surface,#fff);box-shadow:var(--shadow-sm,0 1px 2px rgba(15,27,45,.05))}
.demo-chart figcaption{font-size:var(--fs-sm,14px);font-weight:700;margin-bottom:var(--sp-2,8px)}
.demo-chart-svg{display:block;width:100%;height:120px}
.demo-chart-bar{fill:var(--accent,#1f4fd8)}
.demo-chart-bar:hover{fill:var(--ink,#0f1b2d)}
.demo-chart-axis{stroke:var(--line,#8b98ab);stroke-width:1}
.demo-chart summary{cursor:pointer;font-size:var(--fs-sm,14px);margin-top:var(--sp-2,8px);font-weight:600;color:var(--accent,#1f4fd8)}
.demo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--sp-4,16px);align-items:start}
.demo-ws .tableWrap{
  overflow-x:auto;max-width:100%;margin:var(--sp-3,12px) 0;border:1px solid var(--line-subtle,#d5dde8);
  border-radius:var(--radius-lg,18px);background:var(--surface,#fff);
}
.demo-table{border-collapse:collapse;width:100%;font-size:var(--fs-sm,14px)}
.demo-table th,.demo-table td{padding:10px 12px;border-bottom:1px solid var(--line-subtle,#d5dde8);text-align:left;vertical-align:top}
.demo-table thead th{background:var(--bg,#eef2f7);white-space:nowrap;font-weight:700;color:var(--ink-soft,#5a6a82);font-size:var(--fs-xs,12px);text-transform:uppercase;letter-spacing:.03em}
.demo-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.demo-table tfoot th,.demo-table tfoot td{font-weight:700;border-top:2px solid var(--line,#8b98ab)}
#demo-camp-table{min-width:880px}
#demo-conv-table{min-width:640px}
.demo-table tr[data-selected] th,.demo-table tr[data-selected] td{background:var(--accent-soft,#e8eefc)}
.demo-ws button.demo-link{background:none;color:var(--accent,#1f4fd8);text-decoration:underline;padding:2px 4px;font-weight:600;text-align:left;overflow-wrap:anywhere;border:0;box-shadow:none;min-height:auto}
.demo-detail{margin-top:var(--sp-4,16px);border:1px solid var(--line-subtle,#d5dde8);border-radius:var(--radius-lg,18px);padding:var(--sp-5,20px);min-width:0;background:var(--bg,#eef2f7)}
.demo-detail h4{margin-top:0;overflow-wrap:anywhere}
.demo-dl{display:grid;grid-template-columns:minmax(8em,max-content) minmax(0,1fr);gap:var(--sp-1,4px) var(--sp-4,16px);margin:0 0 var(--sp-3,12px);font-size:var(--fs-sm,14px)}
.demo-dl dt{color:var(--ink-soft,#5a6a82);font-weight:600}
.demo-dl dd{margin:0;overflow-wrap:anywhere}
.demo-actions{display:flex;flex-wrap:wrap;gap:var(--sp-3,12px);margin-top:var(--sp-3,12px)}
.demo-picker{display:flex;flex-wrap:wrap;gap:var(--sp-2,8px);margin:0 0 var(--sp-3,12px)}
.demo-picker button{background:var(--surface,#fff);color:var(--ink,#0f1b2d);border:1px solid var(--line,#8b98ab);padding:8px 12px;border-radius:var(--radius,6px);font-weight:600}
.demo-picker button[aria-pressed="true"]{background:var(--accent-soft,#e8eefc);border-color:var(--accent,#1f4fd8);font-weight:700}
.demo-steps{list-style:none;margin:0;padding:0;display:grid;gap:var(--sp-3,12px)}
.demo-step{border:1px solid var(--line-subtle,#d5dde8);border-radius:var(--radius-lg,18px);padding:var(--sp-4,16px);background:var(--surface,#fff)}
.demo-step-track{display:block;height:10px;border:0;border-radius:999px;background:var(--line-subtle,#d5dde8);margin:var(--sp-2,8px) 0}
.demo-step-fill{display:block;height:100%;background:linear-gradient(90deg,var(--accent,#1f4fd8),#6b93f5);border-radius:999px}
.demo-reasons caption{text-align:left;font-weight:700;padding:var(--sp-1,4px) 0}
.demo-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--sp-1,4px) var(--sp-3,12px)}
.demo-rule{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--bg,#eef2f7);border:1px solid var(--line-subtle,#d5dde8);border-radius:var(--radius,6px);padding:var(--sp-3,12px);font-size:var(--fs-sm,14px);margin:0}
.demo-unavailable-action{margin-top:var(--sp-4,16px)}
.demo-unavailable-action button:disabled{cursor:not-allowed}
.demo-unavailable{font-size:var(--fs-sm,14px);margin:var(--sp-1,4px) 0 0;border-left:3px solid var(--line,#8b98ab);padding-left:var(--sp-3,12px);color:var(--ink-soft,#5a6a82)}
.demo-sim{margin-top:var(--sp-4,16px);border:1px dashed #a07a00;border-radius:var(--radius-lg,18px);padding:var(--sp-4,16px);background:#fffbeb}
.demo-sim h4{margin-top:0}
.demo-integrations{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--sp-3,12px)}
.demo-integration{border:1px solid var(--line-subtle,#d5dde8);border-radius:var(--radius-lg,18px);padding:var(--sp-4,16px);background:var(--surface,#fff);box-shadow:var(--shadow-sm,0 1px 2px rgba(15,27,45,.05))}
.demo-integration h4{margin-top:0}
.demo-state{display:inline-block;font-weight:700;border-radius:999px;padding:2px 12px;font-size:var(--fs-sm,14px)}
.demo-state-off{background:#eef1f5;color:var(--ink,#0f1b2d);border:1px solid var(--line,#8b98ab)}
.demo-message{min-width:16em;overflow-wrap:anywhere}
.demo-ws .demo-embedded{padding:0;margin-top:var(--sp-3,12px);box-shadow:none}
.demo-ws .demo-embedded h2{font-size:var(--fs-md,16px)}
.demo-ws .demo-embedded form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:0 var(--sp-4,16px)}
.demo-ws .demo-embedded .field{flex:1 1 12em;min-width:0}
.demo-ws .demo-embedded .actions{display:flex;flex-wrap:wrap;gap:var(--sp-3,12px);flex-basis:100%}
.demo-ws .demo-embedded .actions button{margin-top:var(--sp-4,16px)}
.demo-ws .demo-embedded table{border-collapse:collapse;width:100%;min-width:600px;font-size:var(--fs-sm,14px)}
.demo-ws .demo-embedded th,.demo-ws .demo-embedded td{padding:10px 12px;border-bottom:1px solid var(--line-subtle,#d5dde8);text-align:left;white-space:nowrap}
.demo-ws .demo-embedded tbody th button{margin:0;padding:2px 4px;background:none;color:var(--accent,#1f4fd8);text-decoration:underline;font-weight:600;border:0;box-shadow:none;min-height:auto}
.demo-ws .demo-embedded tbody tr[data-selected] th,.demo-ws .demo-embedded tbody tr[data-selected] td{background:var(--accent-soft,#e8eefc)}
.demo-ws .demo-embedded time{display:inline;margin:0}
.demo-ws .demo-embedded .pager{display:flex;align-items:center;gap:var(--sp-3,12px);flex-wrap:wrap}
.demo-ws .demo-embedded .detail{margin-top:var(--sp-4,16px);border:1px solid var(--line-subtle,#d5dde8);border-radius:var(--radius-lg,18px);padding:var(--sp-4,16px);background:var(--bg,#eef2f7)}
.demo-ws .demo-embedded .detail dl{display:grid;grid-template-columns:minmax(8em,max-content) minmax(0,1fr);gap:var(--sp-2,8px) var(--sp-4,16px)}
.demo-ws .demo-embedded .detail dd{margin:0}
.demo-ws .demo-embedded [role="alert"]:empty,.demo-ws .demo-embedded [role="status"]:empty{margin:0}
/* PR87 drilldown/closure + SCRUM-35 polish */
.demo-ws button.demo-count{font-variant-numeric:tabular-nums;min-width:2.75em;min-height:32px;text-align:center;border-radius:var(--radius,6px)}
.demo-ws button.demo-count[aria-expanded="true"]{background:var(--accent-soft,#e8eefc);border-radius:var(--radius,6px);text-decoration:none;box-shadow:inset 0 0 0 2px var(--accent,#2256db)}
.demo-step-head .demo-link{font-size:var(--fs-md,16px)}
.demo-drill{border-color:var(--accent,#2256db)}
#demo-drill-table{min-width:720px}
#demo-drill-table th[scope="row"]{min-width:9em;overflow-wrap:normal}
#demo-drill-table thead th{white-space:normal}
#demo-drill-table time{display:inline;margin:0}
.demo-row-actions{display:flex;flex-wrap:wrap;flex-direction:column;align-items:flex-start;gap:var(--sp-1,4px) var(--sp-2,8px)}
.demo-row-actions button{white-space:nowrap}
/* Focus/scroll targets clear the sticky DEMO banner. */
#demo [tabindex="-1"],#demo .demo-backbar,#demo .demo-drill,#demo .demo-check,#demo button{scroll-margin-top:140px}
.demo-table .demo-snapshot-col{background:#f7f3e6}
.demo-table thead .demo-snapshot-col{background:#f1e8c9}
.demo-backbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2,8px) var(--sp-4,16px);margin:0 0 var(--sp-4,16px);padding:var(--sp-2,8px) var(--sp-3,12px);border:1px solid var(--accent,#2256db);border-radius:var(--radius-lg,18px);background:var(--accent-soft,#e8eefc)}
.demo-backbar p{margin:0;min-width:0;overflow-wrap:anywhere}
.demo-check{margin-top:var(--sp-4,16px);border:1px solid var(--line-subtle,#d5dde8);border-radius:var(--radius-lg,18px);padding:var(--sp-4,16px);background:var(--surface,#fff)}
.demo-check h4{margin-top:0}
.demo-check .demo-unavailable{margin-bottom:var(--sp-3,12px)}
.demo-check-errors{margin:var(--sp-2,8px) 0 0;padding-left:1.25em;font-size:var(--fs-sm,14px)}
.demo-check-errors li{margin:var(--sp-1,4px) 0;overflow-wrap:anywhere}
.demo-ws button:focus,.demo-banner button:focus,.demo-ws summary:focus,.demo-ws [tabindex]:focus{outline:3px solid var(--accent,#2256db);outline-offset:2px}
@media (min-width:1200px){html[data-demo-mode] main{max-width:1280px}}
@media (max-width:640px){
 .demo-banner{padding:var(--sp-2,8px) var(--sp-4,16px)}
 .demo-dl,.demo-ws .demo-embedded .detail dl{grid-template-columns:minmax(0,1fr)}
 .demo-dl dd{margin-bottom:var(--sp-2,8px)}
 #demo.demo-ws{padding:var(--sp-5,20px) var(--sp-4,16px)}
 .demo-tabs button{flex:1 1 auto}
}
.demo-ws .demo-funnel{margin:var(--sp-3,12px) 0}
.demo-ws .demo-rename{font:inherit}
.demo-ws .demo-tag-other{opacity:.85}


/* SCRUM-37 dark shell overrides for Demo workspace */
.demo-banner{background:rgba(245,158,11,.16)!important;color:#FBBF24!important;border-bottom-color:rgba(245,158,11,.45)!important}
.demo-ws,.demo-ws.demo-ws,#demo.demo-ws{
  background:var(--surface,#121a2e)!important;border:1px solid var(--line-subtle,#1e2a44)!important;color:var(--ink,#E6ECF7)!important;
}
.demo-ws .demo-intro,.demo-context,.demo-filters,.demo-card,.demo-kpi{
  background:var(--surface-2,#1a2440)!important;border-color:var(--line,#26324f)!important;color:var(--ink,#E6ECF7)!important;
}
.demo-tabs button{background:var(--surface-2,#1a2440)!important;color:var(--ink,#E6ECF7)!important;border-color:var(--line,#26324f)!important}
.demo-tabs button[aria-current="page"]{background:linear-gradient(135deg,#7C5CFF,#22D3EE)!important;color:#fff!important;border:0!important}
.demo-ws input,.demo-ws select{background:var(--surface-2,#1a2440)!important;color:var(--ink,#E6ECF7)!important;border-color:var(--line,#26324f)!important}
.demo-ws table thead th{background:var(--surface-2,#1a2440)!important;color:var(--ink-soft,#93A1BD)!important}
.demo-ws tbody tr:nth-child(even){background:rgba(26,36,64,.45)}
