/* Presentation foundation and cascade overrides. */
@layer foundation {
  .scenario-desktop-launcher {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    padding: 0 8px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text);
    font: 800 8px var(--font-label);
    letter-spacing: .04em;
    text-transform: uppercase;
  }
  .scenario-desktop-launcher b {
    display: grid;
    place-items: center;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    border-radius: var(--radius-md);
    background: color-mix(in srgb,var(--text) 8%,transparent);
    font: 700 8px var(--font-num);
  }
  .scenario-desktop-launcher:hover {
    background: color-mix(in srgb,var(--text) 4%,transparent);
  }
  .scenario-fab {
    display: none;
    position: fixed;
    right: 14px;
    bottom: max(14px,env(safe-area-inset-bottom));
    z-index: 920;
    height: 38px;
    padding: 0 13px;
    border: 1px solid var(--border);
    border-radius: 19px;
    background: var(--surface);
    color: var(--text);
    font: 800 9px var(--font-label);
    box-shadow: 0 8px 24px rgba(0,0,0,.14);
  }
  .scenario-backdrop {
    position: fixed;
    inset: 0;
    z-index: 998;
    background: rgba(0,0,0,.32);
  }
  .scenario-panel {
    position: fixed;
    right: 16px;
    top: 74px;
    z-index: 1000;
    width: min(390px,calc(100vw - 32px));
    max-height: calc(100vh - 90px);
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--surface);
    color: var(--text);
    box-shadow: 0 18px 50px rgba(0,0,0,.2);
    opacity: 0;
    transform: translateY(-5px) scale(.99);
    pointer-events: none;
    transition: opacity .16s ease,transform .16s ease;
  }
  .scenario-panel.is-open {
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
  .scenario-panel-head {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto auto auto;
    gap: 6px;
    align-items: center;
    padding: 8px;
    border-bottom: 1px solid var(--border);
  }
  .scenario-title-input {
    min-width: 0;
    height: 29px;
    border: 0;
    background: transparent;
    color: var(--text);
    padding: 0;
    font: 800 12px var(--font-num);
  }
  .scenario-title-input:focus {
    outline: none;
  }
  .scenario-count {
    display: grid;
    place-items: center;
    min-width: 22px;
    height: 22px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font: 700 8px var(--font-num);
  }
  .scenario-window-btn {
    display: grid;
    place-items: center;
    width: 29px;
    height: 29px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text);
    font: 800 12px var(--font-num);
    cursor: pointer;
  }
  .scenario-more-menu {
    position: relative;
  }
  .scenario-more-menu>summary {
    list-style: none;
  }
  .scenario-more-menu>summary::-webkit-details-marker {
    display: none;
  }
  .scenario-more-popover {
    position: absolute;
    right: 0;
    top: 34px;
    z-index: 4;
    width: 132px;
    padding: 5px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--surface);
    box-shadow: 0 10px 24px rgba(0,0,0,.16);
  }
  .scenario-more-popover button {
    display: block;
    width: 100%;
    height: 28px;
    border: 0;
    background: transparent;
    color: var(--text);
    text-align: left;
    padding: 0 7px;
    font: 8px var(--font-label);
  }
  .scenario-more-popover button:hover {
    background: color-mix(in srgb,var(--text) 5%,transparent);
  }
  .scenario-panel-content {
    max-height: calc(100vh - 145px);
    overflow: auto;
    padding: 9px;
  }
  .scenario-readonly-note {
    display: flex;
    gap: 7px;
    align-items: baseline;
    margin-bottom: 8px;
    padding: 7px 8px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: color-mix(in srgb,var(--surface) 85%,var(--bg));
    font: 8px/1.35 var(--font-num);
  }
  .scenario-readonly-note strong {
    font: 800 7px var(--font-label);
    letter-spacing: .04em;
    text-transform: uppercase;
  }
  .scenario-readonly-note span {
    color: var(--muted);
  }
  .scenario-assumption-list {
    display: grid;
    gap: 6px;
  }
  .scenario-assumption {
    display: grid;
    grid-template-columns: minmax(0,1fr) 28px;
    gap: 7px;
    align-items: center;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: color-mix(in srgb,var(--surface) 84%,var(--bg));
  }
  .scenario-assumption span,.scenario-assumption strong,.scenario-assumption small {
    display: block;
  }
  .scenario-assumption strong {
    font: 700 8px/1.35 var(--font-num);
  }
  .scenario-assumption small {
    margin-top: 2px;
    color: var(--muted);
    font: 7px var(--font-num);
  }
  .scenario-assumption button {
    width: 27px;
    height: 27px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--muted);
    font: 800 12px var(--font-num);
  }
  .scenario-assumption button:hover {
    color: var(--text);
  }
  .scenario-jump-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    margin-top: 9px;
    padding-top: 9px;
    border-top: 1px solid var(--border);
  }
  .scenario-jump-grid button {
    min-height: 58px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text);
    padding: 8px;
    text-align: left;
  }
  .scenario-jump-grid button:hover {
    background: color-mix(in srgb,var(--text) 4%,transparent);
  }
  .scenario-jump-grid strong,.scenario-jump-grid span {
    display: block;
  }
  .scenario-jump-grid strong {
    font: 800 8px var(--font-label);
    letter-spacing: .04em;
    text-transform: uppercase;
  }
  .scenario-jump-grid span {
    margin-top: 4px;
    color: var(--muted);
    font: 7px var(--font-num);
  }
  @media (max-width:760px) {
    .scenario-fab {
      display: block;
    }
    .scenario-panel {
      left: 8px;
      right: 8px;
      top: auto;
      bottom: max(8px,env(safe-area-inset-bottom));
      width: auto;
      max-height: 82vh;
      border-radius: var(--radius-md);
    }
    .scenario-panel-content {
      max-height: calc(82vh - 52px);
    }
    .scenario-jump-grid {
      grid-template-columns: 1fr 1fr;
    }
  }
}
@layer overrides {
  .scenario-backdrop[hidden] {
    display: none;
  }
  @media (max-width:760px) {
    .scenario-desktop-launcher {
      display: none;
    }
  }
}