.secret-library { min-width: 0; }
.secret-list-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.secret-list-heading h2 { margin: 0; font-size: 22px; letter-spacing: -0.5px; }
.secret-list-heading > span { color: var(--muted); font-size: 12px; white-space: nowrap; }
.secret-search { margin-bottom: 20px; padding-block: 8px; }
.secret-status { margin: 0 0 16px; color: var(--accent-ink); font-size: 13px; line-height: 1.7; }
.secret-status:empty { display: none; }
.secret-list { display: grid; gap: 18px; }
.secret-card { min-width: 0; padding: 26px; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); }
.secret-card[hidden], .secret-no-results[hidden] { display: none; }
.secret-card > header { display: flex; align-items: center; gap: 16px; }
.secret-card > header > div { min-width: 0; }
.secret-card .project-mark { flex-shrink: 0; }
.secret-card h3 { margin: 0 0 8px; font: 650 17px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; overflow-wrap: anywhere; }
.secret-scope { display: flex; align-items: center; gap: 8px; color: var(--accent-ink); font-size: 12px; line-height: 1.6; }
.secret-description { margin: 18px 0 0; color: var(--muted); font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.secret-value-form { display: flex; align-items: center; gap: 8px; margin-top: 22px; padding: 8px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-muted); }
.secret-value-form input[data-secret-value] { min-width: 0; flex: 1; width: 0; padding: 10px; border: 0; background: transparent; font: 14px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; }
.secret-value-form .button { min-height: 38px; padding: 8px 12px; font-size: 12px; }
.secret-card > footer { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
.secret-card > footer > span { margin-right: auto; color: var(--muted); font-size: 11px; }
.secret-card > footer .button { min-height: 38px; font-size: 12px; }
.secret-delete { position: relative; }
.secret-delete > summary { list-style: none; cursor: pointer; }
.secret-delete > summary::-webkit-details-marker { display: none; }
.secret-delete[open] > summary { color: var(--danger); }
.secret-delete > form { position: absolute; z-index: 2; top: calc(100% + 8px); right: 0; width: min(320px, 70vw); padding: 20px; border: 1px solid var(--line-strong); border-radius: 14px; background: var(--surface); box-shadow: 0 12px 32px rgb(0 0 0 / 0.12); }
.secret-delete p { margin: 0 0 16px; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.secret-guidance .project-mark { margin-bottom: 18px; }
.secret-guidance p { color: var(--muted); font-size: 12px; line-height: 1.8; margin: 0; }
.secret-guidance p + p { margin-top: 14px; }
.secret-editor-layout { display: grid; grid-template-columns: minmax(0, 760px) 300px; gap: 28px; align-items: start; }
.secret-editor { width: 100%; min-width: 0; margin: 0; }
.secret-editor .stack-form { margin-top: 24px; }
.secret-editor .validation-summary-valid { display: none; }
.secret-input-wrap { display: flex; align-items: center; gap: 10px; }
.secret-input-wrap input { flex: 1; min-width: 0; width: 0; }
.secret-input-wrap .button { margin: 0; }
.secret-no-results { padding: 28px; text-align: center; color: var(--muted); font-size: 14px; }
@media (max-width: 1100px) {
  .secret-editor-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .secret-card { padding: 20px; }
  .secret-value-form { flex-wrap: wrap; }
  .secret-value-form input[data-secret-value] { flex-basis: 100%; }
  .secret-value-form .button { flex: 1; }
  .secret-card > footer > span { flex-basis: 100%; margin-bottom: 4px; }
  .secret-list-heading h2 { font-size: 18px; }
}