:root{color-scheme:light dark;--color-canvas: light-dark(#F5FAFC, #081018);--color-on-canvas: light-dark(#081018, #EAF6FA);--color-surface: light-dark(#FFFFFF, #101A22);--color-on-surface: light-dark(#081018, #EAF6FA);--color-on-surface-secondary: light-dark(#4D6772, #8AA3AE);--color-line: light-dark(#6A8490, #6A8490);--color-primary: light-dark(#08798A, #3AD6EC);--color-on-primary: light-dark(#FFFFFF, #042028);--color-primary-surface: light-dark(#D9F6FA, #0C2C36);--color-success: light-dark(#187A43, #5FD38A);--color-warning: light-dark(#815400, #F2B84B);--color-danger: light-dark(#B3261E, #FF8A80);--color-on-danger: light-dark(#FFFFFF, #3B0A08);--text-display-size: 56px;--text-display-weight: 700;--text-display-leading: 60px;--text-display-tracking: -1.5px;--text-title-1-size: 36px;--text-title-1-weight: 700;--text-title-1-leading: 42px;--text-title-1-tracking: -.8px;--text-title-2-size: 24px;--text-title-2-weight: 700;--text-title-2-leading: 30px;--text-title-2-tracking: -.4px;--text-headline-size: 18px;--text-headline-weight: 700;--text-headline-leading: 26px;--text-headline-tracking: 0px;--text-body-size: 17px;--text-body-weight: 400;--text-body-leading: 27px;--text-body-tracking: 0px;--text-body-emphasis-size: 17px;--text-body-emphasis-weight: 700;--text-body-emphasis-leading: 27px;--text-body-emphasis-tracking: 0px;--text-small-size: 14px;--text-small-weight: 400;--text-small-leading: 20px;--text-small-tracking: 0px;--text-caption-size: 12px;--text-caption-weight: 700;--text-caption-leading: 16px;--text-caption-tracking: .2px;--text-code-size: 14px;--text-code-weight: 400;--text-code-leading: 22px;--text-code-tracking: 0px;--font-menlo: "Menlo", system-ui, sans-serif;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--radius-none: 0px;--radius-sm: 0px;--radius-md: 0px;--radius-lg: 0px;--radius-xl: 0px;--radius-full: 0px;--shadow-0: none;--shadow-1: 0px 2px 8px rgb(8 16 24 / .08);--shadow-2: 0px 4px 12px rgb(8 16 24 / .1);--shadow-3: 0px 8px 24px rgb(8 16 24 / .14);--duration-fast: .12s;--duration-base: .2s;--duration-slow: .34s;--duration-emphasis: .48s;--ease-standard: cubic-bezier(.2,0,0,1);--ease-entrance: cubic-bezier(0,0,.2,1);--ease-exit: cubic-bezier(.4,0,1,1);--reduced-crossfade: .12s}*{box-sizing:border-box}html{background:var(--color-canvas);color:var(--color-on-canvas);font-family:var(--font-menlo);min-width:320px}body{margin:0;min-height:100vh;background:linear-gradient(var(--color-line),var(--color-line)) top / 100% 1px no-repeat,var(--color-canvas)}button,input,label{font:inherit}a{color:inherit;text-decoration-color:var(--color-primary);text-underline-offset:var(--space-1)}a:hover{color:var(--color-primary)}button:focus-visible,a:focus-visible,label:focus-within,.drop-zone:focus-visible{outline:2px solid var(--color-primary);outline-offset:var(--space-1)}.site-header{align-items:center;border-bottom:1px solid var(--color-line);display:grid;gap:var(--space-4);grid-template-columns:auto auto 1fr auto;min-height:var(--space-16);padding:0 var(--space-6)}.wordmark{font-size:var(--text-title-2-size);font-weight:var(--text-title-2-weight);letter-spacing:var(--text-title-2-tracking);text-decoration:none}.product-name,.runtime-note,.site-header nav{font-size:var(--text-small-size);line-height:var(--text-small-leading)}.product-name{color:var(--color-on-surface-secondary);padding-left:var(--space-4);border-left:1px solid var(--color-line)}.runtime-note{color:var(--color-primary);justify-self:end}.site-header nav{display:flex;gap:var(--space-4)}.workspace{display:grid;grid-template-columns:minmax(20rem,5fr) minmax(0,7fr);min-height:calc(100vh - var(--space-16) - var(--space-10))}.input-panel,.results-panel{padding:var(--space-6)}.input-panel{border-right:1px solid var(--color-line)}.results-panel{background:var(--color-surface);box-shadow:var(--shadow-1)}.section-heading{align-items:baseline;display:flex;gap:var(--space-3);margin-bottom:var(--space-5)}.section-heading>span,.fixture-heading{color:var(--color-primary);font-size:var(--text-caption-size);font-weight:var(--text-caption-weight);line-height:var(--text-caption-leading)}.section-heading h1,.section-heading h2,.section-heading p,.fixture-heading{margin:0}.section-heading h1,.section-heading h2{font-size:var(--text-headline-size);font-weight:var(--text-headline-weight);line-height:var(--text-headline-leading)}.section-heading p{color:var(--color-on-surface-secondary);font-size:var(--text-small-size);line-height:var(--text-small-leading)}.drop-zone{align-items:center;border:1px dashed var(--color-line);cursor:pointer;display:flex;flex-direction:column;gap:var(--space-2);justify-content:center;min-height:calc(var(--space-16) * 4);padding:var(--space-8);position:relative;text-align:center;transition:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}.drop-zone:hover,.drop-zone[data-dragging=true]{background:var(--color-primary-surface);border-color:var(--color-primary)}.drop-zone strong{font-size:var(--text-headline-size);line-height:var(--text-headline-leading)}.drop-zone>span:not(.crop){color:var(--color-on-surface-secondary);font-size:var(--text-small-size)}.drop-zone p{color:var(--color-primary);font-size:var(--text-small-size);margin:var(--space-3) 0 0}.crop{border-color:var(--color-primary);height:var(--space-6);pointer-events:none;position:absolute;transition:inset var(--duration-base) var(--ease-entrance);width:var(--space-6)}.crop-nw{border-left:2px solid var(--color-primary);border-top:2px solid var(--color-primary);left:var(--space-4);top:var(--space-4)}.crop-ne{border-right:2px solid var(--color-primary);border-top:2px solid var(--color-primary);right:var(--space-4);top:var(--space-4)}.crop-sw{border-bottom:2px solid var(--color-primary);border-left:2px solid var(--color-primary);bottom:var(--space-4);left:var(--space-4)}.crop-se{border-bottom:2px solid var(--color-primary);border-right:2px solid var(--color-primary);bottom:var(--space-4);right:var(--space-4)}.file-glyph{border:2px solid var(--color-on-surface-secondary);height:var(--space-12);position:relative;width:var(--space-10)}.file-glyph span{background:var(--color-primary);height:2px;left:var(--space-2);position:absolute;right:var(--space-2);top:var(--space-6)}.chooser-row{display:grid;gap:var(--space-3);grid-template-columns:1fr 1fr;margin-top:var(--space-4)}.chooser-row input{height:1px;opacity:0;overflow:hidden;position:absolute;width:1px}.button,.fixture-button{align-items:center;border:1px solid var(--color-line);cursor:pointer;display:flex;justify-content:center;min-height:44px}.button{font-size:var(--text-small-size);font-weight:var(--text-caption-weight);padding:var(--space-3)}.button.primary{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-on-primary)}.button.secondary{background:var(--color-primary-surface);color:var(--color-primary)}.fixture-heading{margin-top:var(--space-6)}.fixture-list{display:grid;gap:var(--space-2);margin-top:var(--space-3)}.fixture-button{background:transparent;color:var(--color-on-canvas);justify-content:space-between;padding:var(--space-3) var(--space-4);text-align:left;transition:background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.fixture-button:hover,.fixture-button[aria-pressed=true]{background:var(--color-primary-surface);border-left:var(--space-1) solid var(--color-primary);color:var(--color-primary)}.fixture-button small{color:var(--color-on-surface-secondary)}.fixture-button:disabled,input:disabled+.button{cursor:wait;opacity:.5}.results-body{min-height:calc(var(--space-16) * 5)}.empty-state,.loading-state,.read-error{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:calc(var(--space-16) * 5);text-align:center}.empty-state h3,.empty-state p,.read-error p{margin:var(--space-3) 0 0}.empty-state p,.loading-state span,.read-error p{color:var(--color-on-surface-secondary);font-size:var(--text-small-size);line-height:var(--text-small-leading);max-width:48ch}.empty-frame{border:1px solid var(--color-line);height:calc(var(--space-16) * 2);position:relative;width:var(--space-16)}.empty-frame:before,.empty-frame:after{background:var(--color-primary);content:"";left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.empty-frame:before{height:2px;width:var(--space-8)}.empty-frame:after{height:var(--space-8);width:2px}.loading-state{animation:inspection-enter var(--duration-base) var(--ease-entrance) both;gap:var(--space-2)}.read-error{border:1px solid var(--color-danger);color:var(--color-danger);padding:var(--space-6)}.verdict{align-items:end;border-bottom:1px solid var(--color-line);display:flex;gap:var(--space-6);justify-content:space-between;padding:var(--space-4) 0 var(--space-5)}.verdict span{color:var(--color-on-surface-secondary);font-size:var(--text-caption-size);line-height:var(--text-caption-leading)}.verdict h3{font-size:var(--text-title-2-size);line-height:var(--text-title-2-leading);margin:var(--space-1) 0 0;overflow-wrap:anywhere}.verdict-lockup{align-items:end;display:flex;flex-direction:column;text-align:right}.verdict-lockup strong{font-size:var(--text-title-1-size);letter-spacing:var(--text-title-1-tracking);line-height:var(--text-title-1-leading)}.verdict.is-fail .verdict-lockup strong{color:var(--color-danger)}.verdict.is-pass .verdict-lockup strong{color:var(--color-success)}.matrix-wrap{overflow-x:auto;padding-top:var(--space-5)}.result-matrix{border-collapse:collapse;font-size:var(--text-code-size);line-height:var(--text-code-leading);width:100%}.result-matrix th,.result-matrix td{border:1px solid var(--color-line);padding:var(--space-3);text-align:left;vertical-align:top}.result-matrix th{color:var(--color-on-surface-secondary);font-size:var(--text-caption-size)}.result-matrix code{color:var(--color-on-surface);font-family:var(--font-menlo);overflow-wrap:anywhere}.result-error{background:color-mix(in srgb,var(--color-danger) 9%,var(--color-surface))}.result-error td:first-child,.result-error code{color:var(--color-danger)}.result-warning{background:color-mix(in srgb,var(--color-warning) 9%,var(--color-surface))}.result-warning td:first-child,.result-warning code{color:var(--color-warning)}.result-info td:first-child,.result-info code{color:var(--color-primary)}.result-success td:first-child{color:var(--color-success)}.report-note{color:var(--color-on-surface-secondary);display:flex;font-size:var(--text-small-size);justify-content:space-between;padding-top:var(--space-4)}.report-note strong{color:var(--color-on-surface)}footer{align-items:center;border-top:1px solid var(--color-line);color:var(--color-on-surface-secondary);display:flex;font-size:var(--text-caption-size);justify-content:space-between;min-height:var(--space-10);padding:0 var(--space-6)}@keyframes inspection-enter{0%{opacity:0;transform:translateY(var(--space-2))}to{opacity:1;transform:translateY(0)}}@media(max-width:48rem){.site-header{grid-template-columns:1fr auto;padding:var(--space-3) var(--space-4)}.product-name,.runtime-note{display:none}.workspace{display:block}.input-panel{border-bottom:1px solid var(--color-line);border-right:0}.input-panel,.results-panel{padding:var(--space-4)}.drop-zone{min-height:calc(var(--space-16) * 3);padding:var(--space-6)}.verdict{align-items:start;flex-direction:column}.verdict-lockup{align-items:start;text-align:left}.result-matrix,.result-matrix tbody,.result-matrix tr,.result-matrix td{display:block;width:100%}.result-matrix thead{position:absolute;clip:rect(0 0 0 0)}.result-matrix td{border-bottom:0}.result-matrix td:last-child{border-bottom:1px solid var(--color-line)}.result-matrix td:before{color:var(--color-on-surface-secondary);content:attr(data-label);display:block;font-size:var(--text-caption-size)}.report-note,footer{align-items:start;flex-direction:column;gap:var(--space-2);padding-bottom:var(--space-3);padding-top:var(--space-3)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:var(--reduced-crossfade)!important;transform:none!important}.loading-state{animation:none}}
