/* Signed-in working surfaces. Loaded after each page's legacy styles. */
.secure-app {
  background:radial-gradient(circle at 92% 4%,rgba(167,255,79,.15),transparent 30rem),var(--color-bg);
  color:var(--color-text);
  font-size:16px;
}
.secure-app .page { max-width:1440px; width:100%; padding:24px clamp(16px,3vw,40px) 64px; }
.secure-app .page > header {
  display:flex; align-items:flex-start; justify-content:space-between;
  flex-wrap:wrap; gap:16px; padding:22px 0; margin:0;
  background:transparent; border:0; box-shadow:none;
}
.secure-app h1 { font-size:clamp(28px,3vw,40px); letter-spacing:-.035em; line-height:1.18; }
.secure-app h2 { font-size:21px; letter-spacing:-.02em; line-height:1.3; }
.secure-app h3 { font-size:17px; line-height:1.4; }
.secure-app header > p { flex-basis:100%; max-width:800px; font-size:16px; line-height:1.6; }
.secure-app .eyebrow { font-size:12px; letter-spacing:.08em; }
.secure-app :is(.card,.panel,.flow-panel,.proof-card,fieldset,.system-card) {
  border:1px solid #d7d5c9; border-radius:16px; background:#fff;
  padding:22px; box-shadow:0 3px 14px rgba(22,34,61,.035); min-width:0;
}
.secure-app :is(.card,.panel,fieldset) + :is(.card,.panel,fieldset) { margin-top:16px; }
.secure-app :is(.grid,.cards,.metrics,.flow-grid,.proof-metrics) > * { margin-top:0; min-width:0; }
.secure-app :is(.actions,.action-row,.toolbar,.flow-actions) { gap:10px; flex-wrap:wrap; }
.secure-app :is(button,.button) { min-height:44px; font-size:14px; font-weight:650; border-radius:10px; }
.secure-app :is(button.primary,.button.primary) { background:#0c1714; border-color:#0c1714; color:#fff; }
.secure-app :is(button.primary,.button.primary):hover { background:#20312b; }
.secure-app button:disabled { transform:none; box-shadow:none; }
.secure-app label { font-size:14px; line-height:1.5; }
.secure-app input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]),
.secure-app select,.secure-app textarea {
  font:inherit; font-size:16px; min-height:44px; min-width:0; max-width:100%;
  padding:10px 12px; border:1px solid #b9beb6; border-radius:9px; background:#fff; color:#0c1714;
}
.secure-app textarea { min-height:112px; resize:vertical; }
.secure-app :is(input[type=checkbox],input[type=radio]) { min-height:0; width:18px; height:18px; accent-color:#0c1714; }
.secure-app :is(pre,code) { font-size:13px; }

.secure-app :is(.note,.notice,.warning,.banner,.flow-message) { padding:14px 16px; border-radius:12px; line-height:1.6; }
.secure-app :is(.muted,.flow-muted,.small,small) { font-size:13px; line-height:1.5; }
.secure-app :is(.empty,.empty-state) { padding:32px 24px; border:1px dashed #aeb4ac; border-radius:14px; background:#faf9f3; }
.secure-app details > summary { min-height:44px; padding:12px 0; font-size:14px; font-weight:650; }
.secure-app :is(.tabs,.view-tabs,.settings-shortcuts) { display:flex; gap:8px; overflow-x:auto; padding:8px 0; max-width:100%; }
.secure-app :is(.tabs,.view-tabs,.settings-shortcuts) > * { flex-shrink:0; }
.secure-app table { font-size:14px; }
.secure-app th { background:#efede4; color:#52605a; font-size:12px; letter-spacing:.025em; }
.secure-app :is(th,td) { padding:14px 12px; line-height:1.5; }
.secure-app tbody tr:hover { background:#faf9f3; }
.secure-app .secure-table { width:100%; overflow-x:auto; border:1px solid #d7d5c9; border-radius:12px; margin:16px 0; }
.secure-app .secure-table > table { min-width:680px; margin:0; }
.secure-app .secure-table:focus-visible { outline:3px solid #0c1714; outline-offset:3px; }
.secure-context-nav {
  display:flex; align-items:center; flex-wrap:wrap; gap:6px; padding:10px 12px;
  margin:4px 0 22px; border:1px solid #d7d5c9; border-radius:12px; background:#fff;
}
.secure-context-nav > span { font-size:12px; font-weight:750; color:#66706c; padding:8px; }
.secure-context-nav a { padding:9px 12px; min-height:40px; border-radius:8px; text-decoration:none; color:#43504b; font-size:14px; }
.secure-context-nav a:hover { background:#efffe3; color:#20312b; }
.secure-context-nav a[aria-current=page] { background:#0c1714; color:#a7ff4f; }
.secure-app .shell-context { min-height:0; padding:12px 16px; }
.secure-app .setup-readiness { padding:12px 16px; }
.secure-app .delivery-guide { display:flex; justify-content:space-between; gap:18px; align-items:center; margin:14px 0 0; padding:16px; border:1px solid #b9d99c; border-radius:12px; background:#f4ffeb; color:#20312b; }
.secure-app .delivery-guide strong { display:block; margin:3px 0 6px; font-size:15px; }
.secure-app .delivery-guide p { margin:0; color:#52605a; font-size:13px; line-height:1.45; }
.secure-app .delivery-guide-actions { display:flex; flex-wrap:wrap; gap:7px; min-width:max-content; }
.secure-app .delivery-guide-actions a { padding:8px 10px; border:1px solid #b6c9ad; border-radius:8px; background:#fff; color:#20312b; font-size:13px; font-weight:700; text-decoration:none; }
.secure-app .delivery-guide-actions a:hover { background:#0c1714; border-color:#0c1714; color:#c8ff89; }
.secure-app .nav-primary a { font-size:13px; }
.secure-app .nav-menu a { font-size:14px; min-height:44px; }
.secure-app .nav-menu-label { font-size:12px; }
.secure-app .brand-copy small { font-size:10px; }
@media (max-width:760px) { .secure-app .delivery-guide { align-items:flex-start; flex-direction:column; } .secure-app .delivery-guide-actions { min-width:0; } }
.secure-app .secure-section-index { display:flex; gap:8px; flex-wrap:wrap; margin:12px 0 20px; }
.secure-section-index a { padding:8px 12px; border:1px solid #d7d5c9; border-radius:24px; background:#fff; text-decoration:none; font-size:14px; }
.secure-app [id] { scroll-margin-top:104px; }
.secure-app .secure-destination { margin:14px 0; padding:0 18px; border:1px solid #d7d5c9; border-radius:14px; background:#fff; }
.secure-app .secure-destination > summary { padding:16px 0; font-size:16px; color:#0c1714; }
.secure-app .secure-destination > fieldset { border:0; box-shadow:none; padding:0 0 18px; margin:0; }
.secure-app .secure-destination > fieldset > legend { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.secure-app .secure-savebar { position:sticky; bottom:12px; z-index:15; padding:12px 16px; border:1px solid #c9c8bd; border-radius:14px; background:rgba(255,255,255,.97); box-shadow:0 8px 30px #0c171418; }
.secure-app[data-page=explorer] .page,.secure-app[data-page=filters] .page { max-width:1600px; }
.secure-app[data-page=project] .page { max-width:1200px; }
.secure-app[data-page=settings] #settings-form { max-width:1000px; margin-inline:auto; }
.secure-app[data-page=settings] .settings-shortcuts { flex-wrap:wrap; }
.secure-app[data-page=journeys] .journey-head { gap:16px; flex-wrap:wrap; }
.secure-app[data-page=live-events] .flow-card { min-height:200px; }
.secure-app[data-page=connections] .platform-actions { display:flex; gap:8px; flex-wrap:wrap; }
.secure-app[data-page=guide] .page > section { margin-block:24px; }
.secure-app[data-page=plan] table { table-layout:auto; }
.secure-app[data-page=catalog] .event { margin-block:18px; }
.secure-app[data-page=monitoring] :is(.metrics,.grid),.secure-app[data-page=implementation_health] .metrics { gap:16px; }
/* Brand palette: ink surfaces, cream canvas and lime evidence signals. */
.secure-app[data-page=journeys] .hero,
.secure-app[data-page=setup] .hero {
  border-color:#0c1714;
  background:linear-gradient(135deg,#0c1714 0%,#173228 62%,#28533f 100%);
  box-shadow:0 20px 54px rgba(12,23,20,.18);
}
.secure-app[data-page=journeys] .hero :is(.eyebrow,.hero-flow b),
.secure-app[data-page=setup] .hero .eyebrow { color:#0c1714; }
.secure-app[data-page=journeys] .hero .eyebrow,
.secure-app[data-page=setup] .hero .eyebrow { color:#a7ff4f; }
.secure-app[data-page=journeys] .hero p,
.secure-app[data-page=setup] .hero p { color:#d9ffd0; }
.secure-app[data-page=journeys] .hero-flow b { background:#a7ff4f; color:#0c1714; }
.secure-app[data-page=workspace] .home-hero {
  border:1px solid #0c1714;
  background:radial-gradient(circle at 84% 0,rgba(167,255,79,.17),transparent 34%),linear-gradient(125deg,#0c1714,#173228 58%,#244c3e);
  box-shadow:0 24px 62px rgba(12,23,20,.22);
}
.secure-app[data-page=workspace] .home-hero .hero-kicker,
.secure-app[data-page=workspace] .home-hero .next-label { color:#a7ff4f; }
.secure-app[data-page=workspace] .home-hero p,
.secure-app[data-page=workspace] .home-hero .next-card span { color:#d9e6df; }
.secure-app[data-page=workspace] .home-hero .button.primary {
  border-color:#a7ff4f;
  background:#a7ff4f;
  color:#0c1714;
  box-shadow:4px 4px 0 #ffffff;
}
.secure-app[data-page=workspace] .next-card {
  border-color:rgba(167,255,79,.38);
  background:linear-gradient(145deg,rgba(167,255,79,.12),rgba(255,255,255,.05));
}
.secure-app[data-page=live-events] .flow-card:before { background:linear-gradient(90deg,#0c1714,#a7ff4f); }
.secure-app[data-page=live-events] .flow-item[aria-pressed=true],
.secure-app[data-page=live-events] .flow-good {
  border-color:#8fb875;
  background:#efffe3;
  color:#285b32;
  box-shadow:0 0 0 2px rgba(167,255,79,.18);
}

@media(min-width:1100px) {
  .secure-app .secure-context-nav { position:relative; }
  .secure-app[data-page=live-events] #flow-inspector { align-self:start; }
}
@media(max-width:900px) {
  .secure-app .page { padding:16px 16px 48px; }
  .secure-app :is(.grid,.two-col,.two-column,.split,.columns,.hero-grid) { grid-template-columns:minmax(0,1fr); }
  .secure-app :is(.card,.panel,fieldset,.flow-panel) { padding:18px; }
  .secure-app .secure-context-nav { flex-wrap:nowrap; overflow:auto; }
  .secure-context-nav > * { flex-shrink:0; white-space:nowrap; }
}
@media(max-width:600px) {
  .secure-app { font-size:16px; }
  .secure-app .page { padding:12px 12px 40px; }
  .secure-app h1 { font-size:28px; }
  .secure-app h2 { font-size:20px; }
  .secure-app :is(.metrics,.cards,.proof-metrics,.stats) { grid-template-columns:minmax(0,1fr); }
  .secure-app :is(.actions,.action-row) > :is(button,.button) { flex:1 1 100%; justify-content:center; }
  .secure-app :is(.toolbar,.filters-row) > label { flex:1 1 100%; }
  .secure-app .secure-savebar { bottom:8px; }
  .secure-app .secure-destination { padding-inline:14px; }
  .secure-app .shell-context-actions { gap:8px; }
  .secure-app :is(.card,.panel,.flow-panel) { border-radius:12px; }
}
@media(prefers-reduced-motion:no-preference) {
  .secure-app .secure-context-nav a { transition:background .16s ease,color .16s ease; }
}

/* Final visual contract: this file is loaded after individual page styles, so
   older screens cannot reintroduce competing card, code or action palettes. */
.secure-app :is(.card,.panel,.flow-panel,.proof-card,.system-card,.setup-step,.install-card,.metric,.finding,.connection,.event,.destination,.journey-card) {
  color:var(--color-text);
  border-color:var(--color-border);
  background:var(--color-surface);
}
.secure-app :is(.muted,.hint,.help,.note,.small,.flow-muted,.status-line) { color:var(--color-text-muted); }
.secure-app :is(.notice,.warning,.info-note,.safety-note,.limitations,.rule) {
  color:var(--color-text);
  border-color:var(--color-accent-border);
  background:var(--color-accent-bg);
}
.secure-app :is(pre,.contract,.code-wrap pre,.proof-output,.code-output) {
  color:var(--color-code-text)!important;
  border:1px solid var(--color-code-border)!important;
  background:var(--color-code-bg)!important;
  box-shadow:none!important;
}
.secure-app :is(pre,.contract,.code-wrap pre,.proof-output,.code-output) :is(code,span) { color:inherit; }
.secure-app code:not(pre code) {
  color:var(--color-inline-code-text);
  border:1px solid var(--color-accent-border);
  background:var(--color-inline-code-bg);
}
.secure-app :is(.button,button):not(.nav-mobile-toggle):not(.nav-help):not(.nav-signout) {
  color:var(--color-text);
  border-color:var(--color-border-strong);
  background:var(--color-surface);
}
.secure-app :is(.button.primary,button.primary,.button[data-variant=primary],button[data-variant=primary]) {
  color:var(--color-primary-contrast)!important;
  border-color:var(--color-primary)!important;
  background:var(--color-primary)!important;
}
.secure-app :is(.button,button):hover:not(:disabled) { border-color:var(--color-accent-border); background:var(--color-accent-bg); }
.secure-app :is(.button.primary,button.primary,.button[data-variant=primary],button[data-variant=primary]):hover:not(:disabled) { background:var(--color-primary-hover)!important; }


/* Secure visual contract v3 — final shared layer for signed-in pages.
   Keep public styling separate and use one restrained palette across workspace families. */
body.secure-app{
  background:
    radial-gradient(circle at 100% 0,rgba(40,91,50,.07),transparent 31rem),
    linear-gradient(180deg,#faf9f4 0,var(--color-bg) 34rem);
  color:var(--color-text);
}
body.secure-app .topnav{
  border-color:var(--color-border);
  background:rgba(255,255,255,.96);
  box-shadow:0 10px 32px rgba(16,32,25,.07);
}
body.secure-app .nav-brand,
body.secure-app .brand-copy strong{color:var(--color-text)}
body.secure-app .brand-copy small{color:var(--color-text-muted)}
body.secure-app .nav-primary a,
body.secure-app .nav-more summary,
body.secure-app .topnav>.nav-help,
body.secure-app .topnav>.nav-signout{color:#526159}
body.secure-app .nav-primary a:hover,
body.secure-app .nav-more summary:hover{background:var(--color-accent-bg);border-color:var(--color-accent-border);color:var(--color-text)}
body.secure-app .nav-primary a[aria-current="page"]{
  background:var(--color-primary);
  border-color:var(--color-primary);
  color:#fff;
  box-shadow:none;
}
body.secure-app .nav-menu{
  border-color:var(--color-border);
  background:#fff;
  box-shadow:0 18px 42px rgba(16,32,25,.13);
}
body.secure-app .shell-context{
  border-color:var(--color-border);
  background:linear-gradient(135deg,#fff 0,#f8faf6 72%,#eef8e8 100%);
  box-shadow:0 8px 28px rgba(16,32,25,.055);
}
body.secure-app .shell-workspace select{
  border-color:#c4ccc5;
  background:#fff;
  color:var(--color-text);
  box-shadow:none;
}
body.secure-app .shell-context-actions>a,
body.secure-app .shell-context-actions>span{
  border-color:var(--color-border);
  background:#fff;
  color:#56655d;
}
body.secure-app .shell-context-actions :is(.shell-new-project,.shell-control-link){
  border-color:var(--color-accent-border);
  background:var(--color-accent-bg);
  color:#234d32;
}
body.secure-app .shell-page-guide{
  border-color:#cbd8c5;
  background:linear-gradient(100deg,#f5faef,#fff 78%);
  box-shadow:none;
}
body.secure-app .shell-guide-icon{background:var(--color-primary);color:#fff}
body.secure-app :is(.card,.panel,.flow-panel,.flow-card,.proof-card,fieldset,.system-card,.secure-context-nav){
  border-color:var(--color-border);
  background:#fff;
  color:var(--color-text);
}
body.secure-app :is(.card,.panel,.flow-panel,.flow-card,.proof-card,fieldset,.system-card){
  box-shadow:0 5px 20px rgba(16,32,25,.045);
}
body.secure-app :is(.card,.panel,.flow-panel,.flow-card,.proof-card,fieldset,.system-card):hover{
  border-color:#c6d2c5;
}
body.secure-app .eyebrow{color:#3d6d4c}
body.secure-app .ac-surface-dark :is(h1,h2,h3,h4,strong,label,summary):not(.button *,button *){color:#fff!important}
body.secure-app .ac-surface-dark :is(p,small,.muted,.small,.hint,.help,.flow-muted,.status-line){color:var(--color-on-dark-muted)!important}
body.secure-app .ac-surface-dark :is(.eyebrow,.hero-kicker,.next-label){color:var(--ac-lime)!important}
body.secure-app :is(.note,.empty,.empty-state){
  border-color:var(--color-border);
  background:#f8f9f5;
  color:var(--color-text-muted);
}
body.secure-app :is(button,.button):not(.ac-surface-dark *){
  border-color:#b8c2ba;
  background:#fff;
  color:var(--color-text);
  box-shadow:none;
}
body.secure-app :is(button,.button):not(.ac-surface-dark *):hover:not(:disabled){
  border-color:#8ca292;
  box-shadow:0 7px 18px rgba(16,32,25,.07);
}
body.secure-app :is(button.primary,.button.primary){
  border-color:var(--color-primary);
  background:var(--color-primary);
  color:#fff;
}
body.secure-app :is(button.primary,.button.primary):hover{
  border-color:var(--color-primary-hover);
  background:var(--color-primary-hover);
}
body.secure-app .secure-context-nav a{color:#516159}
body.secure-app .secure-context-nav a:hover{background:var(--color-accent-bg);color:var(--color-text)}
body.secure-app .secure-context-nav a[aria-current="page"]{background:var(--color-primary);color:#dfffc7}
body.secure-app table th{background:#f0f2ed;color:#5b6962}
body.secure-app tbody tr:hover{background:#f7f9f5}
body.secure-app ::selection{background:#dfffc7;color:#102019}

@media(max-width:760px){
  body.secure-app .page{padding-inline:14px}
  body.secure-app .topnav{border-radius:14px}
  body.secure-app .shell-context{border-radius:14px}
}


/* Pro suite badge in the secure navigation keeps the paid tier visible without adding another colour system. */
body.secure-app .nav-primary a[href="/pro-tools"]::after{
  content:"PRO";
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:18px;
  padding:2px 6px;
  border:1px solid #bfd6b5;
  border-radius:999px;
  background:#eef8e8;
  color:#2f6e45;
  font-size:9px;
  font-weight:850;
  letter-spacing:.07em;
  line-height:1;
}
body.secure-app .nav-primary a[href="/pro-tools"][aria-current="page"]::after{
  border-color:rgba(255,255,255,.28);
  background:rgba(255,255,255,.12);
  color:#dfffc7;
}


/* Action contrast contract at every viewport. Semantic states own foreground
   and background together; dark panels are explicit exceptions. */
  body.secure-app :is(
    .actions,.action-row,.flow-actions,.button-row,.review-actions,.collector-actions,
    .hero-actions,.destination-state-side
  ) :is(button,.button,a.button):not(.primary):not([data-variant="primary"]):not(.danger):not([aria-pressed="true"]):not([aria-selected="true"]){
    border-color:#b8c2ba;
    background:#fff;
    color:var(--color-text);
    box-shadow:none;
  }

  body.secure-app :is(
    .actions,.action-row,.flow-actions,.button-row,.review-actions,.collector-actions,
    .hero-actions,.destination-state-side
  ) :is(button.primary,.button.primary,a.button.primary,button[data-variant="primary"],.button[data-variant="primary"]){
    border-color:var(--color-primary)!important;
    background:var(--color-primary)!important;
    color:var(--color-primary-contrast)!important;
  }

  body.secure-app :is(button.danger,.button.danger,a.button.danger){
    border-color:var(--color-danger)!important;
    background:#fff!important;
    color:var(--color-danger)!important;
  }
  body.secure-app :is(button.danger,.button.danger,a.button.danger):hover:not(:disabled),
  body.secure-app :is(button.danger,.button.danger,a.button.danger):focus-visible{
    border-color:var(--color-danger)!important;
    background:var(--color-danger-bg)!important;
    color:var(--color-danger)!important;
  }

  body.secure-app :is(button[aria-pressed="true"],button[aria-selected="true"],.button[aria-pressed="true"],.button[aria-selected="true"]){
    border-color:var(--color-primary)!important;
    background:var(--color-primary)!important;
    color:var(--color-primary-contrast)!important;
  }
  /* Selected controls retain a complete colour pair during pointer and keyboard
     interaction. A generic mint hover must not leave a white selected label. */
  body.secure-app :is(button[aria-pressed="true"],button[aria-selected="true"],.button[aria-pressed="true"],.button[aria-selected="true"]):is(:hover,:focus-visible){
    border-color:var(--color-primary)!important;
    background:var(--color-primary)!important;
    color:var(--color-primary-contrast)!important;
  }
  body.secure-app :is(button.primary,.button.primary,button[data-variant="primary"],.button[data-variant="primary"],button.danger,.button.danger,button[aria-pressed="true"],button[aria-selected="true"],.button[aria-pressed="true"],.button[aria-selected="true"]) :is(strong,span,small){
    color:inherit!important;
  }
  /* Event chips are separate light surfaces, not labels on the selected button.
     Own both colours so the selected parent's white label cannot leak in. */
  body.secure-app[data-page="live-events"] .flow-item .flow-group-count,
  body.secure-app[data-page="live-events"] .flow-item .flow-group-pages span{
    background:#efffe3!important;
    color:#20312b!important;
  }

  body.secure-app :is(
    .ac-surface-dark,.home-hero,.setup-hero,.install-command,.setup-decision-action,
    .pro-preview,.preview-stage,.pro-investigator-hero,.pro-summary,.pro-studio-sources,
    .import-panel,.offer
  ) :is(button,.button,a.button):not(.primary):not([data-variant="primary"]):not(.danger):not([aria-pressed="true"]):not([aria-selected="true"]){
    border-color:rgba(255,255,255,.42)!important;
    background:rgba(255,255,255,.10)!important;
    color:#fff!important;
    box-shadow:none!important;
  }

  body.secure-app :is(
    .ac-surface-dark,.home-hero,.setup-hero,.install-command,.setup-decision-action,
    .pro-preview,.preview-stage,.pro-investigator-hero,.pro-summary,.pro-studio-sources,
    .import-panel,.offer
  ) :is(button.primary,.button.primary,a.button.primary,button[data-variant="primary"],.button[data-variant="primary"]){
    border-color:var(--ac-lime)!important;
    background:var(--ac-lime)!important;
    color:var(--ac-ink)!important;
    box-shadow:none!important;
  }
  body.secure-app :is(
    .ac-surface-dark,.home-hero,.setup-hero,.install-command,.setup-decision-action,
    .pro-preview,.preview-stage,.pro-investigator-hero,.pro-summary,.pro-studio-sources,
    .import-panel,.offer
  ) :is(button.primary,.button.primary,button[data-variant="primary"],.button[data-variant="primary"]):hover:not(:disabled){
    background:var(--ac-mint)!important;
    color:var(--ac-ink)!important;
  }

  body.secure-app :is(
    .ac-surface-dark,.home-hero,.setup-hero,.install-command,.setup-decision-action,
    .pro-preview,.preview-stage,.pro-investigator-hero,.pro-summary,.pro-studio-sources,
    .import-panel,.offer
  ) :is(button.danger,.button.danger,a.button.danger){
    border-color:#f0b8b5!important;
    background:rgba(255,240,239,.10)!important;
    color:#ffe3e1!important;
  }

  body.secure-app :is(
    .ac-surface-dark,.home-hero,.setup-hero,.install-command,.setup-decision-action,
    .pro-preview,.preview-stage,.pro-investigator-hero,.pro-summary,.pro-studio-sources,
    .import-panel,.offer
  ) :is(button[aria-pressed="true"],button[aria-selected="true"],.button[aria-pressed="true"],.button[aria-selected="true"]){
    border-color:var(--ac-lime)!important;
    background:var(--ac-lime)!important;
    color:var(--ac-ink)!important;
  }

/* Optional source/Pro routes are available before capture installation. */
body.secure-app .analysis-options{margin:16px 0;padding:18px;border:1px solid var(--color-border);border-radius:14px;background:var(--color-surface)}
body.secure-app .analysis-options h2{margin:0 0 7px;font-size:20px}
body.secure-app .analysis-options p{margin:0 0 12px;color:var(--color-text-muted)}
body.secure-app .analysis-options nav{display:flex;flex-wrap:wrap;gap:8px}
body.secure-app .analysis-options nav a{min-height:44px;max-width:100%;white-space:normal;overflow-wrap:anywhere}
@media(max-width:560px){body.secure-app .analysis-options nav{display:grid;grid-template-columns:minmax(0,1fr)}}


/* ========================================================================== */
/* Final authenticated responsive geometry contract                           */
/* ========================================================================== */
/* secure-product.css is deliberately the last stylesheet on signed-in routes.
   Keep viewport safety here as well as in the shared design layer so no older
   secure page rule can reintroduce fixed-width overflow. */
body.secure-app :where(
  main,.page,header,footer,section,article,aside,nav,form,fieldset,details,
  div,ol,ul,li,label
){
  min-width:0;
}
body.secure-app :where(img,picture,svg,canvas,video,iframe){
  max-width:100%;
}
body.secure-app :where(img,video,canvas){height:auto}
body.secure-app iframe{width:100%}
body.secure-app :where(
  input[type="text"],input[type="password"],input[type="number"],input[type="email"],
  input[type="url"],input[type="search"],input[type="date"],input[type="datetime-local"],
  input[type="time"],select,textarea
){
  min-width:0;
  max-width:100%;
}
body.secure-app :where(
  .table-wrap,.table-scroll,.responsive-table,.secure-table,pre,.contract,.proof-output
){
  max-width:100%;
}
body.secure-app :where(
  .secure-context-nav,.section-navigation,.tabs,.tab-list,.toolbar,.filters,
  .lab-nav,.module-filters
){
  max-width:100%;
}
body.secure-app :where(
  .actions,.action-row,.hero-actions,.button-row,.review-actions,.collector-actions,
  .billing-links,.pro-source-actions,.flow-actions,.destination-actions
){
  max-width:100%;
  flex-wrap:wrap;
}

@media(max-width:900px){
  body.secure-app :where(
    .auth-layout,.hero-grid,.content-grid,.main-grid,.split-layout,.two-column,
    .two-col,.page-layout,.panel-layout,.workspace-layout,.overview-layout
  ){
    grid-template-columns:minmax(0,1fr)!important;
  }
  body.secure-app :where(
    .section-head,.panel-head,.card-head,.monitor-head,.pro-value-head,
    .readiness-head,.destination-head,.workspace-head
  ){
    flex-wrap:wrap;
  }
}

@media(max-width:700px){
  body.secure-app :where(
    [class$="-grid"],[class*="-grid "]
  ):not(.mobile-quicknav):not(.route-grid):not(.viz-grid):not(.chart-grid):not(.heatmap-grid){
    grid-template-columns:minmax(0,1fr)!important;
  }
  body.secure-app :where(
    .secure-context-nav,.section-navigation,.tabs,.tab-list,.toolbar,.filters,
    .lab-nav,.module-filters
  ){
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:thin;
    -webkit-overflow-scrolling:touch;
  }
}

@media(max-width:520px){
  body.secure-app .page{
    max-width:100%;
    padding-left:max(12px,env(safe-area-inset-left));
    padding-right:max(12px,env(safe-area-inset-right));
  }
  body.secure-app :where(
    .actions,.action-row,.hero-actions,.button-row,.review-actions,.collector-actions,
    .billing-links,.pro-source-actions,.flow-actions,.destination-actions
  ){
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-items:stretch!important;
  }
  body.secure-app :where(
    .actions,.action-row,.hero-actions,.button-row,.review-actions,.collector-actions,
    .billing-links,.pro-source-actions,.flow-actions,.destination-actions
  ) > :where(button,.button,a.button){
    width:100%;
    min-width:0;
    max-width:100%;
    justify-content:center;
  }
}