#manual-tests-panel { max-width: 1584px; margin: 0 auto; padding: 1.5rem 2rem; box-sizing: border-box; }
.manual-tests-controls { display: flex; gap: .6rem; margin: .7rem 0 1rem; }
.manual-tests-controls button, .manual-domain-tabs button, .manual-screenshot-dialog button { border: 1px solid #bacbd1; border-radius: .35rem; background: #fff; color: #214e5c; padding: .6rem .85rem; cursor: pointer; font: inherit; }
.manual-tests-controls button:disabled { opacity: .6; cursor: wait; }
#manual-tests-panel button:focus-visible, .manual-case-picker summary:focus-visible { outline: 3px solid #17667b; outline-offset: 3px; }
.manual-domain-tabs { display: flex; flex-wrap: wrap; gap: .5rem; border-bottom: 1px solid #cbd9dd; padding-bottom: 1rem; }
.manual-domain-tabs button { display: flex; gap: .6rem; align-items: center; }
.manual-domain-tabs button[aria-selected="true"] { background: #214e5c; color: white; border-color: #214e5c; }
.manual-domain-count { font-size: .85rem; opacity: .8; }
.manual-domain-heading { margin: 1.2rem 0; font-size: 1.15rem; }
.manual-test-workspace { display: grid; grid-template-columns: minmax(220px, 290px) minmax(0, 1fr); gap: 2rem; align-items: start; }
.manual-case-picker { position: static; }
.manual-case-picker > summary { display: list-item; padding: .5rem; margin-bottom: .3rem; color: #526d78; cursor: pointer; }
.manual-case-picker nav { max-height: 65vh; overflow-y: auto; padding: .2rem .3rem; }
.manual-case-choice { display: flex; flex-direction: column; gap: .25rem; width: 100%; text-align: left; font: inherit; line-height: 1.45; padding: .8rem; border: 0; border-left: 3px solid transparent; border-bottom: 1px solid #e1e9eb; background: transparent; color: #214e5c; cursor: pointer; }
.manual-case-choice[aria-current="true"] { border-left-color: #17667b; background: #edf3f4; }
.manual-case-choice:hover { background: #f1f5f6; }
.manual-case-id, .manual-test-result, .manual-case-meta { font-size: .85rem; color: #526d78; }
.manual-test-body { min-width: 0; max-width: 1000px; padding-bottom: 2rem; }
.manual-test-body h3 { margin-top: .3rem; font-size: 1.4rem; }
.manual-test-body h4 { margin: 1.3rem 0 .4rem; }
.manual-test-body p, .manual-test-body li { line-height: 1.6; overflow-wrap: anywhere; }
.manual-test-steps { padding-left: 1.4rem; }
.manual-test-steps > li { padding: .4rem .7rem; border-bottom: 1px solid #e1e9eb; }
.manual-test-steps p { margin: .3rem 0; }
.manual-test-screenshots { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 1rem; }
.manual-test-screenshots figure { margin: 0; min-width: 0; }
.manual-screenshot-open { display: block; width: 100%; padding: 0; background: #edf3f4; border: 1px solid #cbd9dd; cursor: zoom-in; }
.manual-test-screenshots img { display: block; width: 100%; height: 190px; object-fit: contain; }
.manual-test-screenshots figcaption { font-size: .9rem; color: #526d78; padding: .5rem 0; }
.manual-screenshot-dialog { width: min(1200px, calc(100vw - 2rem)); max-width: calc(100vw - 2rem); max-height: calc(100dvh - 2rem); box-sizing: border-box; padding: 1rem; border: 1px solid #bacbd1; border-radius: .5rem; color: #214e5c; }
.manual-screenshot-dialog::backdrop { background: rgb(10 30 40 / 75%); }
.manual-screenshot-toolbar, .manual-screenshot-controls { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.manual-screenshot-dialog img { display: block; width: 100%; max-height: calc(100dvh - 13rem); object-fit: contain; margin-top: .7rem; }
.manual-screenshot-dialog p { margin: .7rem 0; line-height: 1.5; }
.manual-screenshot-dialog button:disabled { opacity: .45; cursor: default; }
@media (max-width: 700px) {
  .manual-test-workspace { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .manual-case-picker { position: static; border-bottom: 1px solid #cbd9dd; padding-bottom: .8rem; }
  .manual-case-picker > summary { display: list-item; cursor: pointer; padding: .6rem; color: #214e5c; }
  .manual-case-picker nav { max-height: 40vh; }
  .manual-domain-tabs { gap: .4rem; }
  .manual-domain-tabs button { padding: .55rem .7rem; }
}

@media (max-width: 600px) { #manual-tests-panel { padding: 1rem; } }
