.system-lab{margin-top:var(--motif-space-source-700);padding:clamp(var(--guide-space-22),4vw,var(--guide-control-min));border:var(--guide-border-hairline) solid var(--guide-border-strong);background:var(--motif-color-surface-raised)}.system-lab-heading{justify-content:space-between;align-items:flex-start;gap:var(--motif-space-source-400);display:flex}.system-lab-heading p{margin:0 0 var(--guide-space-6);font-size:var(--guide-label-xs);letter-spacing:.1em;text-transform:uppercase;font-weight:800}.system-lab-heading h3{max-width:720px;font-family:var(--motif-font-family-editorial);margin:0;font-size:clamp(2rem,4vw,3.8rem);font-weight:400;line-height:1}.system-lab>p{max-width:760px;line-height:1.55}.system-lab-controls{gap:var(--motif-space-source-400);margin:var(--motif-space-source-500) 0;padding:var(--motif-space-source-400);background:var(--motif-color-surface-ground);flex-wrap:wrap;display:flex}.system-lab-controls>label,.system-lab-controls fieldset{border:0;min-width:min(100%,220px);margin:0}.system-lab-controls>label{gap:8px;font-weight:800;display:grid}.system-lab-controls select{min-height:var(--guide-control-min);padding:var(--motif-space-source-200) 36px var(--motif-space-source-200) var(--guide-inset-compact);border:var(--guide-border-hairline) solid var(--motif-color-border);border-radius:var(--guide-radius-control);background:var(--motif-color-surface-raised);color:var(--motif-color-text-primary);font:inherit}.system-lab-controls legend{margin-bottom:8px;font-weight:800}.system-lab-controls fieldset label{align-items:center;gap:7px;margin:0 16px 8px 0;display:inline-flex}.system-lab-controls input{width:20px;height:20px;accent-color:var(--motif-color-action-primary)}.system-lab :is(button,input,textarea,select,summary):focus-visible{outline:var(--motif-border-focus-width) solid var(--motif-color-focus);outline-offset:var(--motif-border-focus-offset)}.token-inspector-mode{border-bottom:1px solid var(--guide-border-strong);text-transform:capitalize;justify-content:space-between;gap:16px;padding:12px 0;display:flex}.token-inspector-chain{background:var(--guide-border-strong);grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:0;padding:1px;list-style:none;display:grid}.token-inspector-chain li{min-width:0;padding:var(--motif-space-source-400);background:var(--motif-color-surface-raised);position:relative}.token-inspector-chain li:not(:last-child):after{content:"→";z-index:1;background:var(--motif-color-source-coral);border-radius:50%;place-items:center;width:26px;height:26px;font-weight:800;display:grid;position:absolute;top:24px;right:-13px}.token-inspector-chain li>span{letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px;font-size:.7rem;font-weight:800;display:block}.token-inspector-chain code{overflow-wrap:anywhere;font-size:.8rem;font-weight:800;display:block}.token-inspector-chain p{min-height:4.5em;line-height:1.45}.token-inspector-chain small{overflow-wrap:anywhere;color:var(--guide-muted);margin-bottom:14px;display:block}.token-inspector-result{margin:var(--motif-space-source-400) 0 0;grid-template-columns:repeat(3,1fr);display:grid}.token-inspector-result>div{padding:var(--motif-space-source-300);border:1px solid var(--guide-border-subtle)}.token-inspector-result dt{margin-bottom:8px;font-weight:800}.token-inspector-result dd{overflow-wrap:anywhere;margin:0;line-height:1.45}.token-inspector-prohibited{margin-top:var(--motif-space-source-300);padding:var(--motif-space-source-400);border-left:6px solid var(--motif-color-source-coral);background:var(--motif-color-surface-ground)}.token-inspector-prohibited p{margin:6px 0 0;line-height:1.5}.system-lab-specimen{border:var(--guide-border-hairline) solid var(--guide-border-strong);background:var(--motif-color-surface-ground);width:100%;max-width:100%;transition:width var(--motif-motion-duration-functional) var(--motif-motion-ease-functional);margin-inline:auto;container-type:inline-size}.system-lab-specimen--320{width:320px}.system-lab-specimen--768{width:768px}.system-lab-specimen--fallback-font,.system-lab-specimen--fallback-font *{font-family:Arial,sans-serif!important}.component-lab-art{background:var(--motif-color-source-lilac);height:100px;overflow:hidden}.component-lab-art span{background:var(--motif-color-source-coral);border-radius:50%;width:120%;height:34px;margin:34px -10%;display:block;transform:rotate(-4deg)}.system-lab-specimen--no-image .component-lab-art{display:none}.component-lab form{gap:12px;padding:clamp(18px,4vw,40px);display:grid}.component-lab-status{border-bottom:1px solid var(--guide-border-subtle);justify-content:space-between;gap:12px;padding-bottom:12px;display:flex}.component-lab-status span{font-weight:800}.component-lab-status code{overflow-wrap:anywhere}.component-lab-measure{margin:0 0 var(--motif-space-source-200);font-size:.85rem}.component-lab-status small{text-align:right}.component-lab form>label,.component-lab-consent legend{margin-top:8px;font-weight:800}.component-lab input:not([type=checkbox]),.component-lab textarea{width:100%;min-height:var(--guide-control-min-roomy);padding:var(--motif-space-source-300) var(--guide-inset-balanced);border:var(--guide-border-hairline) solid var(--motif-component-field-border);border-radius:var(--guide-radius-control);background:var(--motif-component-field-surface);color:var(--motif-component-field-text);font:1rem var(--motif-font-family-operational)}.component-lab textarea{resize:vertical;line-height:1.5}.component-lab [aria-invalid=true]{border:var(--guide-error-border) solid var(--motif-component-feedback-error)}.component-lab-help,.component-lab-inline-error{margin:0;font-size:.88rem;line-height:1.45}.component-lab-inline-error{font-weight:800}.component-lab details{border-block:1px solid var(--guide-border-strong);margin:10px 0}.component-lab summary{min-height:var(--guide-control-min-roomy);padding:var(--guide-inset-balanced) 0;cursor:pointer;font-weight:800}.component-lab details p{margin:0 0 16px;line-height:1.5}.component-lab-consent{border:0;border-top:1px solid var(--guide-border-subtle);gap:12px;margin:8px 0;padding:18px 0;display:grid}.component-lab-consent label{align-items:flex-start;gap:10px;line-height:1.4;display:flex}.component-lab-consent input{width:22px;height:22px;accent-color:var(--motif-component-checkbox-checked);flex:none;margin:0}.component-lab-message{padding:var(--motif-space-source-400);border:2px solid var(--motif-component-feedback-error);background:var(--motif-color-surface-raised)}.component-lab-message--confirmed{border-color:var(--motif-component-feedback-success)}.component-lab-message p{margin:6px 0 0;line-height:1.45}.component-lab-message ul{margin:12px 0 0;padding-left:20px}.component-lab-message li+li{margin-top:6px}.component-lab-message a{color:inherit;text-underline-offset:3px;font-weight:800}.component-lab-actions{flex-wrap:wrap;gap:12px;margin-top:8px;display:flex}.component-lab-actions button{min-height:var(--guide-control-min-roomy);padding:var(--motif-space-source-300) var(--guide-space-20);border:var(--guide-border-emphasis) solid var(--motif-component-action-container-color-default);border-radius:var(--guide-radius-pill);background:var(--motif-component-action-container-color-default);color:var(--motif-component-action-label-color);font:var(--motif-font-weight-label) 1rem var(--motif-font-family-operational);cursor:pointer;transition:transform var(--guide-hover-duration) var(--guide-hover-ease),background-color var(--guide-hover-duration) var(--guide-hover-ease),border-color var(--guide-hover-duration) var(--guide-hover-ease),box-shadow var(--guide-hover-duration) var(--guide-hover-ease)}.component-lab-actions button.secondary{color:var(--motif-color-text-primary);background:0 0}.component-lab-actions button:disabled{cursor:wait;opacity:.65}@media (hover:hover) and (pointer:fine){.component-lab-actions button:hover:not(:disabled){transform:var(--guide-hover-rise);border-color:var(--guide-hover-edge);box-shadow:0 var(--motif-space-source-100) 0 var(--guide-hover-edge)}.component-lab-actions button.secondary:hover{background:var(--guide-hover-wash)}.system-lab-controls label:hover{color:var(--motif-color-action-primary)}}@media (max-width:700px){.system-lab{padding:20px}.system-lab-heading{flex-direction:column}.token-inspector-chain,.token-inspector-result{grid-template-columns:1fr}.token-inspector-chain li:not(:last-child):after{content:"↓";inset:auto auto -13px 24px}.system-lab-specimen--768,.component-lab-actions button{width:100%}}@media (prefers-reduced-motion:reduce){.system-lab-specimen{transition:none}}@media (forced-colors:active){.system-lab,.system-lab-controls,.token-inspector-chain li,.component-lab-message{color:canvastext;background:canvas;border:1px solid canvastext}.component-lab-art{display:none}.token-inspector-chain li:not(:last-child):after{color:canvastext;background:canvas;border:1px solid canvastext}}@container (width<=559px){.component-lab form{padding:var(--motif-space-source-300)}.component-lab-actions{display:grid}.component-lab-actions button{width:100%}.component-lab-status{display:grid}.component-lab-status small{text-align:left}}.visually-hidden{clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}
