/* ============================================================
   SDLC AGENT  —  AI QA Governance Portal (Human-in-the-Loop)
   ============================================================ */
.sdlc-page{display:flex;flex-direction:column}

/* Header */
.sdlc-topbar{display:flex;justify-content:space-between;gap:var(--space-4);align-items:flex-start;margin-bottom:var(--space-5);flex-wrap:wrap}
.sdlc-headline{min-width:0}
.sdlc-title{font-size:var(--text-3xl);font-weight:var(--weight-bold);color:var(--text-primary);letter-spacing:-.02em;line-height:1.2;margin:0 0 4px}
.sdlc-subtitle{font-size:var(--text-base);color:var(--text-secondary);margin:0}
.sdlc-controls{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}
.sdlc-project-star{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text-secondary);cursor:pointer;transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.sdlc-project-star:hover{background:var(--surface-2);border-color:var(--border-hi);color:var(--warning)}
.sdlc-project-star--active{color:var(--warning);border-color:var(--warning-border)}
.sdlc-project-star svg{width:16px;height:16px}

/* Step rail — fixed to the right edge of the viewport, stays visible while
   scrolling. One thin line per Step; the Step currently open for human
   review renders as a longer/thicker line. Hover = tooltip (native title),
   click = jump to that Step's review section. */
.sdlc-steprail{position:fixed;top:50%;right:14px;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-end;gap:10px;z-index:40}
.sdlc-railline{width:15px;height:4px;border-radius:1px;background:var(--border-hi);cursor:pointer;transition:all var(--duration-base) var(--ease-default)}
.sdlc-railline:hover{width:20px;background:var(--brand)}
/* Whichever Step's section is scrolled into view right now, regardless of
   approval status — smaller than --open so the pending-review Step (if any)
   still reads as the "main" one when both apply. */
.sdlc-railline--inview{width:18px;background:var(--brand-dim,var(--info))}
.sdlc-railline--open{width:26px;height:3px;background:var(--brand)}

/* Buttons / inputs */
.sdlc-btn{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:8px;
  font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);cursor:pointer;white-space:nowrap;
  transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.sdlc-btn:hover{background:var(--surface-2);border-color:var(--border-hi);color:var(--text-primary)}
.sdlc-btn svg{width:15px;height:15px;flex:none}
.sdlc-btn--primary{background:var(--brand);border-color:var(--brand);color:#fff}
.sdlc-btn--primary:hover{background: var(--brand-alt);color:#fff}
.sdlc-btn--export{background:var(--text-primary);border-color:var(--text-primary);color:var(--surface)}
.sdlc-btn--export:hover{background:var(--surface);color:var(--text-primary);}
.sdlc-btn--approve{background: var(--success);color: #fff}
.sdlc-btn--approve:hover{background:#54b889;color: #fff;}
.sdlc-btn--accent{background:var(--warning);border-color:var(--warning);color:#ffffff}
.sdlc-btn--accent:hover{background: var(--brand-alt);color:#ffffff}
.sdlc-btn--danger{color:var(--error);border-color:var(--border)}
.sdlc-btn--danger:hover{background:var(--error-bg);border-color:var(--error);color:var(--error)}
.sdlc-btn--sm{height:32px;padding:0 var(--space-3);font-size:var(--text-xs)}
.sdlc-btn:disabled{opacity:.55;cursor:not-allowed;pointer-events:none}
@keyframes sdlc-spin{to{transform:rotate(360deg)}}
.sdlc-btn--busy svg{animation:sdlc-spin .9s linear infinite;transform-origin:center center}
.sdlc-generating{color:var(--info)}
.sdlc-generating svg{animation:sdlc-spin .9s linear infinite;transform-origin:center center}
.sdlc-select{height:40px;padding:0 var(--space-3);background:var(--surface);border:1px solid var(--border);border-radius:8px;font-size:var(--text-sm);color:var(--text-primary);cursor:pointer}
.sdlc-select:focus{outline:none;border-color:var(--brand)}
.sdlc-input{width:100%;min-height:40px;padding:var(--space-2) var(--space-3);background:var(--surface-0);border:1px solid var(--border);border-radius:8px;font-size:var(--text-sm);color:var(--text-primary);font-family:inherit}
.sdlc-input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-muted)}
.sdlc-textarea{resize:vertical;line-height:1.5;margin-top:var(--space-2)}
.sdlc-flabel{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em}

/* Layout grid */
.sdlc-grid{display:grid;gap:var(--space-4)}
.sdlc-grid--two{grid-template-columns:1.05fr .95fr}
.sdlc-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.sdlc-grid--four{grid-template-columns:repeat(4,minmax(0,1fr))}

/* Section chrome */
.sdlc-section{margin-top:var(--space-6)}
.sdlc-section-head{display:flex;justify-content:space-between;gap:var(--space-3);align-items:center;margin:4px 0 var(--space-3);flex-wrap:wrap}
.sdlc-section-head h3{margin:0;font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--text-primary)}
.sdlc-section-head p{margin:4px 0 0;color:var(--text-secondary);font-size:var(--text-sm)}
.sdlc-actions-inline{display:flex;gap:var(--space-2);flex-shrink:0}
.sdlc-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--space-5)}
.sdlc-cardhd{margin:0 0 var(--space-3);font-size:var(--text-md);font-weight:var(--weight-semibold);color:var(--text-primary)}
.sdlc-h4{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);margin:var(--space-4) 0 var(--space-2)}
.sdlc-mini{font-size:var(--text-xs);color:var(--text-muted);margin:var(--space-2) 0 0}
.sdlc-mini--warn{color:var(--warning)}
.sdlc-empty-inline{display:flex;align-items:center;gap:6px;padding:var(--space-4);font-size:var(--text-sm);color:var(--text-muted);justify-content:center;text-align:center}

/* Requirement Coverage check on Test Scenario Creation — computed from the
   real Requirements list, not an AI self-report. */
.sdlc-covnote{display:flex;align-items:center;gap:6px;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:var(--text-xs);font-weight:var(--weight-medium);margin-bottom:var(--space-3)}
.sdlc-covnote svg{flex:none}
.sdlc-covnote--ok{background:rgba(0,230,118,.12);color:var(--success)}
.sdlc-covnote--warn{background:var(--error-bg);color:var(--error)}

/* Step 4 sub-tabs: "Coverage Summary" vs "Black-box Techniques" — same
   artifact/data, pure client-side tab switch (no re-fetch). */
.sdlc-subtabs{display:flex;gap:var(--space-2);margin-bottom:var(--space-3);border-bottom:1px solid var(--border)}
.sdlc-subtab{padding:var(--space-2) var(--space-3);background:none;border:none;border-bottom:2px solid transparent;color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--weight-medium);cursor:pointer}
.sdlc-subtab:hover{color:var(--text-primary)}
.sdlc-subtab--active{color:var(--text-primary);border-bottom-color:var(--brand)}

/* Coverage recommendations — read-only summary at the bottom of Step 4's card */
.sdlc-recs{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--border)}
.sdlc-recs__hd{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}
.sdlc-recs__hd .sdlc-h4{margin:0}
.sdlc-recgroup{margin-top:var(--space-3)}
.sdlc-recgroup__hd{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);display:flex;align-items:center;gap:8px;margin-bottom:var(--space-2)}
.sdlc-recgroup__count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:var(--radius-full);background:var(--surface-2);color:var(--text-secondary);font-size:var(--text-xs);font-weight:var(--weight-semibold)}
.sdlc-recitem{padding:var(--space-2) var(--space-3);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-0);margin-bottom:var(--space-2)}
.sdlc-recitem b{color:var(--text-primary);margin-left:6px}
.sdlc-recitem p{margin:4px 0 0;font-size:var(--text-sm);color:var(--text-secondary);line-height:1.5}

/* Coverage Recommendations panel — interactive selector above Step 1 */
.sdlc-recgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-4);margin-bottom:var(--space-3)}
.sdlc-reccard{border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-3);background:var(--surface-0);transition:border-color var(--duration-fast,120ms),box-shadow var(--duration-fast,120ms)}
.sdlc-reccard--on{border-color:var(--brand,var(--info));box-shadow:0 0 0 1px var(--brand,var(--info)) inset}
.sdlc-reccard__hd{display:flex;align-items:center;gap:8px;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);cursor:pointer;margin-bottom:var(--space-2)}
.sdlc-reccard__hd input{width:16px;height:16px;accent-color:var(--brand,var(--info));cursor:pointer}
.sdlc-reccard__hd input:disabled{cursor:not-allowed}
.sdlc-reccard__hd>span:first-of-type{flex:1}
.sdlc-recnote{margin-top:var(--space-2)}
.sdlc-reccard--done{opacity:.72;background:var(--surface-1)}
.sdlc-reccard--done .sdlc-reccard__hd{cursor:default}
.sdlc-donetag{display:inline-flex;align-items:center;gap:4px;padding:0 8px;height:20px;border-radius:var(--radius-full);background:rgba(0,230,118,.14);color:var(--success);font-size:var(--text-xs);font-weight:var(--weight-semibold)}
.sdlc-donetag svg{flex:none}

/* Run Center */
.sdlc-modgrid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2) var(--space-4)}
.sdlc-modcheck{display:flex;align-items:center;gap:6px;font-size:var(--text-sm);color:var(--text-secondary);cursor:pointer}
.sdlc-modcheck input{width:15px;height:15px;accent-color:var(--brand,var(--info))}
.sdlc-specbox{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--border)}
.sdlc-spec-row{display:flex;align-items:center;gap:var(--space-3);margin:var(--space-2) 0}
.sdlc-spec-filename{display:inline-flex;align-items:center;gap:4px;font-size:var(--text-xs);color:var(--text-secondary)}
.sdlc-spec-filename svg{width:13px;height:13px}
.sdlc-specmulti{margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px dashed var(--border)}
.sdlc-specmulti__row{margin:var(--space-1) 0}

/* Tables */
.sdlc-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);margin-top:var(--space-2)}
.sdlc-table th,.sdlc-table td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--border);text-align:left;vertical-align:top;color:var(--text-secondary)}
.sdlc-table th{background:var(--surface-2);color:var(--text-muted);text-transform:uppercase;font-size:var(--text-xs);letter-spacing:.03em;font-weight:var(--weight-semibold)}
.sdlc-table td:first-child{color:var(--text-primary);font-weight:var(--weight-medium)}
.sdlc-table tr:last-child td{border-bottom:none}

/* Badges */
.sdlc-badge{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-semibold);white-space:nowrap}
.sdlc-badge--pending{background:var(--info-bg);color:var(--info)}
.sdlc-badge--approved{background:rgba(0,230,118,.14);color:var(--success)}
.sdlc-badge--rejected{background:var(--error-bg);color:var(--error)}
.sdlc-badge--commented{background:rgba(124,77,255,.14);color:var(--purple,#7c4dff)}
.sdlc-badge--regen{background:rgba(41,182,246,.14);color:var(--info)}
.sdlc-badge--draft{background:var(--surface-2);color:var(--text-muted)}
.sdlc-badge--ready{background:rgba(255,171,0,.14);color:var(--warning)}
.sdlc-badge--stale{background:rgba(255,171,0,.14);color:var(--warning);gap:4px;cursor:help}
.sdlc-badge--stale svg{flex-shrink:0}

/* Metrics */
.sdlc-metric{display:flex;flex-direction:column;gap:2px;background:var(--surface-0);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3)}
.sdlc-metric__label{font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em}
.sdlc-metric__val{font-size:var(--text-xl);font-weight:var(--weight-bold);color:var(--text-primary)}
.sdlc-metric--good .sdlc-metric__val{color:var(--success)}
.sdlc-metric--bad .sdlc-metric__val{color:var(--error)}
.sdlc-metric--warn .sdlc-metric__val{color:var(--warning)}

/* Review boxes (score/summary tiles inside review cards) */
.sdlc-reviewbox{background:var(--surface-0);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3)}
.sdlc-reviewbox b{display:block;font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:4px}
.sdlc-reviewbox p{margin:0;font-size:var(--text-sm);color:var(--text-secondary)}
.sdlc-value{font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--text-primary)}
.sdlc-value--sm{font-size:var(--text-lg)}
.sdlc-progress{height:8px;background:var(--surface-2);border-radius:var(--radius-full);overflow:hidden;margin-top:6px}
.sdlc-bar{height:100%;border-radius:var(--radius-full);background:linear-gradient(90deg,var(--info),var(--brand,var(--info)))}
.sdlc-bar--warn{background:linear-gradient(90deg,var(--warning),#f97316)}

/* Workflow diagram */
.sdlc-flow{display:flex;gap:var(--space-2);align-items:center;flex-wrap:wrap}
.sdlc-flowstep{border:1px solid var(--border);background:var(--surface-0);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);font-weight:var(--weight-semibold);font-size:var(--text-sm);color:var(--text-primary)}
.sdlc-arrow{color:var(--text-muted);font-weight:var(--weight-bold)}

/* Review card (2-col: artifact body | comment/approval) */
.sdlc-reviewcard{display:block}
.sdlc-artifact-hd{display:flex;justify-content:space-between;gap:var(--space-3);align-items:flex-start;border-bottom:1px solid var(--border);padding-bottom:var(--space-3);margin-bottom:var(--space-3)}
.sdlc-artifact-hd__right{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}
.sdlc-artifact-title{font-weight:var(--weight-bold);font-size:var(--text-lg);color:var(--text-primary)}
.sdlc-version{font-size:var(--text-xs);color:var(--text-muted);margin-top:2px}
.sdlc-reviewgrid{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--space-5);align-items:start}
.sdlc-code{background:var(--surface-0);color:var(--text-primary);border-radius:var(--radius-md);padding:var(--space-3);overflow:auto;font-size:var(--text-xs);line-height:1.6;border:1px solid var(--border);max-height:320px;font-family:var(--font-mono,monospace);white-space:pre}

/* AI Detailed Report (View Full Report modal) */
.sdlc-detailedreport{background:var(--surface-0);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-4);font-size:var(--text-sm);line-height:var(--leading-normal);color:var(--text-secondary);margin-bottom:var(--space-4)}
.sdlc-detailedreport p{margin:0 0 var(--space-3)}
.sdlc-detailedreport p:last-child{margin-bottom:0}
.sdlc-versionpicker{display:flex;gap:6px;margin-bottom:var(--space-3);flex-wrap:wrap}
.sdlc-verpill{height:28px;padding:0 var(--space-3);border-radius:var(--radius-full);border:1px solid var(--border);background:var(--surface);color:var(--text-secondary);font-size:var(--text-xs);font-weight:var(--weight-medium);cursor:pointer}
.sdlc-verpill:hover{border-color:var(--border-hi);color:var(--text-primary)}
.sdlc-verpill--active{background:var(--brand);border-color:var(--brand);color:#fff}

/* Comment thread */
.sdlc-commentthread{display:flex;flex-direction:column;gap:var(--space-2);max-height:260px;overflow-y:auto}
.sdlc-comment{background:var(--surface-0);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3);font-size:var(--text-sm);color:var(--text-secondary)}
.sdlc-comment strong{display:block;margin-bottom:3px;color:var(--text-primary);font-size:var(--text-xs)}
.sdlc-comment--ai{border-left:3px solid var(--info)}
.sdlc-comment--human{border-left:3px solid var(--warning)}
.sdlc-comment-input{margin-top:var(--space-3)}
.sdlc-actions{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-top:var(--space-3)}

/* Audit timeline */
.sdlc-timeline{position:relative;padding-left:var(--space-6);max-height:220px;overflow-y:auto}
.sdlc-table-scroll{max-height:220px;overflow-y:auto}
.sdlc-timeline:before{content:"";position:absolute;left:9px;top:4px;bottom:2px;width:2px;background:var(--border)}
.sdlc-event{position:relative;margin-bottom:var(--space-3)}
.sdlc-event:before{content:"";position:absolute;left:-19px;top:5px;width:9px;height:9px;border-radius:50%;background:var(--info)}
.sdlc-event strong{display:block;font-size:var(--text-sm);color:var(--text-primary)}
.sdlc-event span{font-size:var(--text-xs);color:var(--text-muted)}

/* Run Agent modal */
.sdlc-modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:450;display:flex;align-items:flex-start;justify-content:center;padding:var(--space-8) var(--space-4);overflow-y:auto}
.sdlc-modal{width:min(760px,100%);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-5);max-height:calc(100vh - var(--space-16));overflow-y:auto}
/* View Full Report only (requirement/scenario/coverage use --wide, Test
   Case's Excel table uses --xl) — wider AND taller than the base modal,
   using min()/vw/vh so it still shrinks to fit on smaller monitors instead
   of overflowing or forcing the page to scroll horizontally. */
.sdlc-modal--wide{width:min(1200px,96vw);max-height:calc(100vh - 2rem)}
.sdlc-modal--xl{width:min(1400px,96vw);max-height:calc(100vh - 2rem)}
.sdlc-table--meta{margin-bottom:var(--space-4)}
.sdlc-table--meta td:first-child,.sdlc-table--meta td:nth-child(3){width:90px;color:var(--text-muted);font-weight:var(--weight-medium)}

/* Edit Table mode (View Full Report, Steps 1-3) — every cell becomes a
   compact textarea so long values (test steps, acceptance criteria) can
   still wrap and be scrolled within the cell instead of stretching the row. */
.sdlc-table--edit td{padding:var(--space-1) var(--space-2);vertical-align:top}
.sdlc-edit-cell{min-height:44px;max-height:140px;font-size:var(--text-xs);padding:var(--space-1) var(--space-2);margin-top:0}

/* Test Case "View Full Report" — Excel-style table, 15 columns, styled to
   visually match the team's real .xlsx template (blue header #1565C0). */
.sdlc-xlwrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-md)}
.sdlc-xltable{border-collapse:collapse;font-size:var(--text-xs);white-space:nowrap;min-width:100%}
.sdlc-xltable th{background:#1565C0;color:#fff;padding:8px 10px;text-align:left;font-weight:var(--weight-semibold);position:sticky;top:0;border-right:1px solid rgba(255,255,255,.15)}
.sdlc-xltable td{padding:8px 10px;border-right:1px solid var(--border);border-bottom:1px solid var(--border);color:var(--text-secondary);white-space:normal;vertical-align:top;max-width:220px}
.sdlc-xltable tr:nth-child(even) td{background:var(--surface-0)}
.sdlc-xltable td:first-child{color:var(--text-primary);font-weight:var(--weight-medium);white-space:nowrap}
.sdlc-modal__hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3);gap:var(--space-3)}
.sdlc-modal__hd h3{margin:0;font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary)}
.sdlc-modal__hd-actions{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}
.sdlc-modal__close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-muted);cursor:pointer}
.sdlc-modal__close:hover{background:var(--surface-2);color:var(--text-primary)}

/* Test Case import-conflict strategy modal (reuses .sdlc-modal-backdrop/.sdlc-modal) */
.sdlc-strategy__options{display:flex;flex-direction:column;gap:var(--space-3);margin:var(--space-3) 0 var(--space-4)}
.sdlc-strategy__option{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:border-color .15s,background .15s}
.sdlc-strategy__option:hover{background:var(--surface-2)}
.sdlc-strategy__option:has(input:checked){border-color:var(--brand);background:var(--brand-muted)}
.sdlc-strategy__option input[type="radio"]{margin-top:3px;flex:none}
.sdlc-strategy__text{display:flex;flex-direction:column;gap:2px}
.sdlc-strategy__text strong{font-size:var(--text-base);color:var(--text-primary)}
.sdlc-strategy__text span{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.5}

/* Toast */
.sdlc-toast{position:fixed;bottom:var(--space-6);left:50%;transform:translate(-50%,20px);z-index:600;padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-medium);color:#fff;box-shadow:var(--shadow-md);opacity:0;transition:opacity var(--duration-base) var(--ease),transform var(--duration-base) var(--ease);pointer-events:none}
.sdlc-toast--show{opacity:1;transform:translate(-50%,0)}
.sdlc-toast--success{background:var(--success)}
.sdlc-toast--error{background:var(--error)}

/* Step-complete notification — top-center, held longer than the regular toast
   since it can appear while the user is on a completely different page. */
.sdlc-stepnotify{position:fixed;top:var(--space-6);left:50%;transform:translate(-50%,-20px);z-index:700;padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-semibold);color:#fff;box-shadow:var(--shadow-lg);opacity:0;transition:opacity var(--duration-base) var(--ease),transform var(--duration-base) var(--ease);pointer-events:none;max-width:min(520px,90vw);text-align:center}
.sdlc-stepnotify--show{opacity:1;transform:translate(-50%,0)}
.sdlc-stepnotify--success{background:var(--success)}
.sdlc-stepnotify--error{background:var(--error)}

@media(max-width:1150px){
  .sdlc-grid--two,.sdlc-grid--three,.sdlc-grid--four{grid-template-columns:1fr}
  .sdlc-reviewgrid{grid-template-columns:1fr}
  .sdlc-modgrid{grid-template-columns:1fr}
}