:root{color-scheme:light;font:16px/1.5 system-ui,sans-serif;background:#f4f5f8;color:#172338}
*{box-sizing:border-box}body{margin:0}main{max-width:1190px;margin:auto;padding:24px}
header a{color:#24518d;text-decoration:none}header h1{font-size:1.9rem;line-height:1.2;margin:16px 0 6px}
header p,.browser-heading p{color:#526076;margin:0 0 18px}
.status,.browser,.details{background:#fff;border:1px solid #dbe1e9;border-radius:12px;padding:18px;margin:14px 0}
.status{white-space:pre-wrap;min-height:60px}.status.error{border-color:#c64b4b;color:#912b2b}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
button{padding:10px 15px;border-radius:8px;background:#fff;border:1px solid #9dacbf;color:#172338;font:inherit;cursor:pointer}
button:hover:not(:disabled){background:#eaf0f8}button:disabled{opacity:.48;cursor:not-allowed}
button#resume,button#start{background:#225b99;color:#fff;border-color:#225b99}
.browser-heading h2,.details h2{margin:0 0 8px;font-size:1.2rem}
.surface{background:#e6e9ef;min-height:180px;display:flex;align-items:flex-start;justify-content:center;border-radius:8px;overflow:hidden}
.surface img{display:block;width:min(100%,1100px);height:auto;user-select:none;touch-action:none;cursor:crosshair}
.surface img[hidden]{display:none}
#typeForm{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
input{font:inherit;padding:9px;border:1px solid #9dacbf;border-radius:7px;min-width:180px;flex:1}
dl{display:grid;grid-template-columns:180px 1fr;gap:6px 12px;margin:0}
dt{color:#5a6678}dd{margin:0;overflow-wrap:anywhere}
@media(max-width:600px){main{padding:12px}dl{grid-template-columns:1fr}dt{font-weight:600}dd{margin-bottom:9px}}