@media (width<=767px){.pupil-demo{flex-direction:column;min-width:0;height:auto;display:flex}.pupil-demo>.pupil-metrics,.pupil-demo>.pupil-controls{width:calc(100% - 1.5rem);max-width:none;margin:.75rem;position:relative;inset:auto;transform:none}.pupil-demo>.pupil-metrics{order:1}.pupil-demo>.pupil-controls{order:3}.pupil-demo>.pupil-scene{aspect-ratio:1;flex:none;order:2;width:100%;height:auto;max-height:360px;position:relative;inset:auto}.pupil-demo>.pupil-stream-graph{flex:none;order:3;position:relative;inset:auto}.pupil-demo button,.pupil-demo select,.pupil-demo input[type=text]{min-height:44px}.pupil-demo select,.pupil-demo input[type=text]{max-width:100%;font-size:16px}.pupil-demo input[type=range]{box-sizing:content-box;background-clip:padding-box;border-block:12px solid #0000;flex-shrink:1;min-width:0}.pupil-demo canvas,.pupil-demo .pupil-canvas{touch-action:pan-y!important}}.pupil-readouts>div{box-shadow:none;backdrop-filter:none;background:0 0;border:0;border-radius:0;padding:.25rem .5rem}.pupil-readouts{gap:.5rem}.pupil-readouts .uppercase{text-transform:none;letter-spacing:normal;font-weight:500}.pupil-settings{z-index:20;border:1px solid var(--border);background:color-mix(in srgb, var(--card) 94%, transparent);backdrop-filter:blur(16px);border-radius:8px;margin:0;position:absolute;bottom:1rem;left:1rem;right:1rem}.pupil-settings>summary{cursor:pointer;align-items:center;gap:.6rem;min-height:44px;padding:.5rem 1rem;font-size:.8rem;list-style:none;display:flex}.pupil-settings>summary::-webkit-details-marker{display:none}.eye-settings-inline>summary::-webkit-details-marker{display:none}.pupil-settings>summary svg:last-child{margin-left:auto;transition:transform .15s}.pupil-settings[open]>summary svg:last-child{transform:rotate(180deg)}.pupil-settings-body{flex-direction:column;gap:.75rem;max-height:320px;padding:.25rem 1rem 1rem;display:flex;overflow:auto}.pupil-settings-body .uppercase{text-transform:none;letter-spacing:normal}.pupil-settings-body .animate-pulse{animation:none}.pupil-settings-body .bg-background\/50{background:0 0;border:0;border-radius:0;padding:0}.pupil-settings-body select,.iris-caption select{color:var(--foreground);background:var(--card);border:1px solid var(--border);border-radius:4px;padding:.3rem .5rem}.pupil-settings-body button{font-weight:500}.iris-caption{border-bottom:1px solid var(--border);margin:1rem 1.25rem 0;padding:.75rem 0;font-size:.8rem;line-height:1.5}.iris-caption strong{font-weight:500}.iris-caption p{color:var(--muted-foreground);margin:.35rem 0}.eye-settings-inline summary{cursor:pointer;color:var(--primary);padding:.5rem 0;font-size:.75rem}.eye-settings-inline[open]{max-width:30rem}.eye-setting-row{display:block}.eye-setting-row>span{justify-content:space-between;gap:1rem;display:flex}.eye-checkbox{align-items:center;gap:.5rem;padding-top:.5rem;display:flex}.eye-checkbox input{accent-color:var(--primary)}.iris-comparison{width:100%;height:420px;position:relative;overflow:hidden}.comparison-labels{pointer-events:none;color:var(--muted-foreground);justify-content:space-between;font-size:.7rem;display:flex;position:absolute;inset:.75rem 1.25rem auto}.muscle-divider{cursor:ew-resize;touch-action:none;background:0 0;border:0;width:44px;padding:0;position:absolute;top:0;bottom:0;transform:translate(-50%)}.muscle-divider:before{content:"";background:color-mix(in srgb, var(--foreground) 40%, transparent);pointer-events:none;width:1px;position:absolute;top:2rem;bottom:1rem;left:50%}.muscle-divider>span{background:var(--card);border:1px solid var(--border);width:28px;height:28px;color:var(--foreground);place-items:center;font-size:15px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.muscle-divider:focus-visible{outline:1px solid var(--primary);outline-offset:-2px}.comparison-note{color:var(--muted-foreground);margin:0 1.25rem 1rem;font-size:.7rem;line-height:1.5}@media (width<=767px){.pupil-demo>.pupil-settings{order:3;width:calc(100% - 1.5rem);margin:.75rem;position:relative;inset:auto;transform:none}.pupil-settings-body{max-height:none}.iris-comparison{aspect-ratio:1;height:auto}.pupil-readouts{grid-template-columns:repeat(2,minmax(0,1fr))}.pupil-readouts>div{padding:.25rem 0}}.pupil-settings-body .parameter-control:has(input[type=range]){flex:1;width:100%}@media (width>=768px){.pupil-demo:has(>.pupil-settings){flex-direction:column;height:auto;display:flex}.pupil-demo:has(>.pupil-settings)>.pupil-scene{order:1;height:480px;position:relative;inset:auto}.pupil-demo>.pupil-settings{order:2;width:calc(100% - 2rem);margin:0 1rem 1rem;position:relative;inset:auto}}