/* XEN-STUDIO-004: scoped interaction styling, inherits the public design tokens. */
.automation-lab{--lab-blue:var(--blue,#236c80);--lab-line:var(--line,#c4d1d5);margin:0 0 60px;min-width:0;scroll-margin-top:20px}.automation-lab h2{font-size:clamp(30px,3.2vw,46px)}.automation-lab h3{font-size:26px}.automation-lab h4{font-size:16px;margin:24px 0 12px}.lab-heading,.lab-title{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}.lab-heading p,.lab-title p{max-width:670px;margin-bottom:20px}.lab-local{border-left:2px solid var(--brand-gold,#f2bf3f);padding-left:14px;white-space:nowrap;font-size:12px;color:var(--muted,#4c626c)}.lab-router{background:var(--surface,#fff);border:1px solid var(--lab-line);padding:20px;margin:10px 0 24px}.automation-lab summary{cursor:pointer;font-weight:600;padding:10px 0}.automation-lab label,.automation-lab legend{font-size:14px;font-weight:600}.automation-lab label{display:block;margin:12px 0}.automation-lab input:not([type=checkbox]),.automation-lab select,.automation-lab textarea{display:block;width:100%;min-width:0;border:1px solid var(--lab-line);background:var(--surface,#fff);color:var(--text,#142a34);border-radius:var(--radius,3px);padding:10px 12px;margin:7px 0;font-size:15px;line-height:1.5}.automation-lab textarea{resize:vertical;font-family:var(--mono,monospace)}.automation-lab input[type=checkbox]{width:18px;height:18px;accent-color:var(--lab-blue);vertical-align:middle;margin:0 8px 0 0;flex-shrink:0}.lab-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.lab-tabs button{background:var(--surface,#fff);color:var(--text,#142a34);border:1px solid var(--lab-line);font-size:14px;padding:13px 17px}.lab-tabs button[aria-pressed=true]{background:var(--brand-blue,#71c3d9);border-color:var(--lab-blue);color:#00141c;box-shadow:inset 0 -3px var(--lab-blue)}.lab-project{display:flex;align-items:center;flex-wrap:wrap;gap:12px;border-block:1px solid var(--lab-line);margin:24px 0;padding:12px 0}.lab-project label{flex:1;min-width:150px}.lab-project button,.lab-project .lab-file{font-size:12px}.lab-project input[type=file]{max-width:240px;font-size:12px}.lab-input{padding:20px 0}.lab-title button{flex-shrink:0;font-size:13px}.automation-lab fieldset{border:1px solid var(--lab-line);padding:16px 20px;margin:24px 0;min-width:0}.automation-lab legend{padding:0 8px}.lab-rules{display:grid;grid-template-columns:1fr 1fr;gap:5px 20px}.lab-rules label{display:flex;align-items:center;font-weight:400}.lab-two{display:grid;grid-template-columns:1fr 1fr;gap:20px}.lab-runbar{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:24px 0}.lab-runbar span{font-size:13px;flex:1;min-width:180px}#lab-error{padding:16px;border:2px solid var(--gold,#755411);background:var(--surface,#fff);font-weight:600}.lab-stages{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:25px 0;padding:0;list-style:none}.lab-stages li{padding:15px 12px;background:var(--raised,#e4eef1);border-top:3px solid var(--lab-blue);font-size:12px}.lab-stages strong,.lab-stages span{display:block}.lab-stages strong:before{content:'✓ ';color:var(--lab-blue)}.lab-stages span{margin-top:8px;color:var(--muted,#4c626c)}#lab-results{border-top:1px solid var(--lab-line);padding-top:30px}.lab-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin:16px 0 25px}.lab-metrics>div{padding:16px;border-left:2px solid var(--brand-gold,#f2bf3f);background:var(--surface,#fff)}.lab-metrics strong,.lab-metrics span{display:block}.lab-metrics strong{font-size:28px;font-weight:500;line-height:1.2}.lab-metrics span{font-size:12px;color:var(--muted,#4c626c);margin-top:10px}.lab-table-wrap{overflow:auto;max-height:470px;max-width:100%;margin:15px 0;border:1px solid var(--lab-line)}.automation-lab table{width:100%;border-collapse:collapse;font-size:13px;line-height:1.5}.automation-lab th,.automation-lab td{padding:12px;text-align:left;border-bottom:1px solid var(--lab-line);vertical-align:top;min-width:110px;max-width:400px;overflow-wrap:anywhere;white-space:pre-wrap}.automation-lab th{position:sticky;top:0;background:var(--raised,#e4eef1);font-size:12px}.automation-lab td{background:var(--surface,#fff)}.lab-pager,.lab-exports{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}.lab-pager button,.lab-exports button{font-size:13px;padding:12px 16px}.automation-lab details:not(.lab-router){border-bottom:1px solid var(--lab-line);padding:10px 0}.lab-branches{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;border-block:1px solid var(--lab-line);padding:22px 0;margin:25px 0}.lab-branch{padding:18px;border:1px dashed var(--lab-line);font-size:13px}.lab-branch.active{border:1px solid var(--lab-blue);background:var(--raised,#e4eef1)}.lab-branch strong,.lab-branch span{display:block}.lab-branch strong{font-size:25px}.lab-conclusion{border-left:3px solid var(--brand-gold,#f2bf3f);padding:20px;background:var(--surface,#fff);color:var(--text,#142a34)}#lab-log{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px}.lab-history{margin-top:25px}.lab-history li{margin:10px 0}.lab-history button{text-align:left;justify-content:flex-start;font-size:12px}.lab-preview{padding:32px;background:var(--surface,#fff);border:1px solid var(--line,#c4d1d5);margin:25px 0 65px}.lab-preview h3{font-size:28px}.lab-preview label{display:flex;align-items:center;gap:10px;font-size:14px;margin:15px 0}.lab-preview input{width:18px;height:18px;accent-color:var(--blue,#236c80)}.lab-preview-output{border-left:3px solid var(--brand-gold,#f2bf3f);padding:15px 20px;margin:20px 0;color:var(--text,#142a34)}.lab-preview-output p{margin:8px 0;font-size:14px}.lab-preview .lab-stages{grid-template-columns:repeat(3,1fr);font-size:13px}.existing-experiments{margin:45px 0}.existing-experiments>summary{font-size:20px;cursor:pointer;padding:20px 0;border-block:1px solid var(--line)}
@media(max-width:800px){.lab-heading,.lab-title{flex-direction:column;gap:10px}.lab-local{white-space:normal}.lab-two,.lab-rules{grid-template-columns:1fr;gap:5px}.lab-stages{grid-template-columns:1fr 1fr}.lab-branches{grid-template-columns:1fr}.lab-project{align-items:stretch}.lab-project>button{flex:1}.lab-tabs button{flex:1 1 140px}.lab-preview{padding:22px}.lab-title button{width:100%}.automation-lab fieldset{padding:12px}.lab-exports button{flex:1 1 180px}}
@media(prefers-reduced-motion:reduce){.automation-lab *{scroll-behavior:auto!important;transition:none!important}}