.lab-page {width:min(100% - 2.25rem,60rem);margin:clamp(1.4rem,4vw,3.4rem) auto 4rem}
@media(max-width:480px){.site-header nav.lab-nav{gap:.6rem;justify-content:flex-end;flex-wrap:wrap}.site-header nav.lab-nav a{font-size:.76rem;white-space:nowrap}}
.lab-page [hidden] {display:none!important}
.lab-kicker {font:700 .72rem/1.5 var(--sans);letter-spacing:.11em;text-transform:uppercase;color:var(--berry);margin:0 0 .8rem}
.lab-page h1,.lab-directory h2,.shape-workspace h2,.lab-reading h2 {font-family:var(--serif);font-weight:400;line-height:1.05;letter-spacing:-.035em}
.lab-page h1 {font-size:clamp(2.65rem,6vw,5rem);margin:.2rem 0 1rem}
.lab-page h1 em {font-weight:400;color:var(--berry)}
.shape-intro {display:grid;grid-template-columns:minmax(0,1.6fr) minmax(12rem,1fr);align-items:center;gap:2rem}
.shape-intro p:not(.lab-kicker),.lab-reading,.lab-directory>p {max-width:62ch}
.shape-study {position:relative;display:grid;justify-items:center;align-content:center;gap:.65rem;padding:1rem;margin:0;background:#ecdfd3;color:#694b46;border-radius:3.2rem .45rem 3.2rem .45rem}
.shape-study figcaption,.frame-figure figcaption {font-size:.8rem;text-align:center}
.outline-demo {position:relative;width:5.4rem;height:6.8rem;border:2px solid #76564e;border-radius:46% 46% 42% 42% / 37% 37% 61% 61%;background:#f6ebe0}
.outline-demo:before,.outline-demo:after,.outline-demo i,.outline-demo b {position:absolute;content:"";display:block}
.outline-demo:before {inset:2% 49%;border-left:1px dashed #aa8175}
.outline-demo:after {top:48%;left:0;width:100%;border-top:2px solid #913952}
.outline-demo i {top:25%;left:6%;width:88%;border-top:1px dashed #bd9a8e}
.outline-demo b {top:74%;left:12%;width:76%;border-top:1px dashed #bd9a8e}
[data-cue="width"] .outline-demo i,[data-cue="width"] .outline-demo b,[data-cue="jaw"] .outline-demo b {border-top:2px solid #913952}
[data-cue="chin"] .outline-demo {border-bottom:5px solid #913952}
.shape-workspace {border:1px solid #d8c8bc;background:#fffaf4;padding:clamp(1rem,3vw,2.3rem);border-radius:1.1rem;margin:1.4rem 0}
.shape-field {border:0;padding:0;margin:0;min-inline-size:0}
.shape-field legend,.shape-workspace h2 {font-family:var(--serif);font-size:clamp(1.7rem,4vw,2.5rem);line-height:1.12;letter-spacing:-.025em;padding:0}
.shape-hint {margin:.6rem 0 1.1rem;color:var(--ink-soft)}
.shape-choices {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}
.shape-choices label {display:flex;align-items:center;gap:.6rem;min-height:3.25rem;border:1px solid #c8b9ae;background:var(--paper);padding:.6rem .85rem;border-radius:.65rem;cursor:pointer}
.shape-choices label:has(:checked) {background:#f5e1e6;border-color:var(--berry)}
.shape-choices label:focus-within {outline:2px solid var(--berry);outline-offset:2px}
.shape-choices input {accent-color:var(--berry);flex:none}
.shape-controls {display:flex;gap:.65rem;align-items:center;margin-top:1.1rem}
.shape-workspace h3 {margin:1.6rem 0 .7rem}
.frame-pair {display:grid;grid-template-columns:1fr 1fr;gap:.7rem;max-width:34rem}
.frame-figure {display:grid;justify-items:center;align-content:center;gap:.55rem;background:#f2e7da;min-height:6.7rem;border-radius:.6rem;margin:0;padding:.7rem}
.frame-shape {display:flex;align-items:center;height:2.5rem}
.frame-shape i {width:2.35rem;height:1.4rem;border:3px solid #573f3c;border-radius:.28rem;background:#e1d4c5}
.frame-shape b {width:.42rem;border-top:3px solid #573f3c}
.frame-round i {width:1.9rem;height:1.9rem;border-radius:50%}.frame-deep i {height:1.9rem;border-radius:40%}
.frame-uplift i {border-radius:0 45% 45% 65%;transform:rotate(6deg)}.frame-uplift i:last-child {transform:scaleX(-1) rotate(6deg)}
.lab-reading {margin:2rem 0}.lab-reading h2 {font-size:1.65rem;margin:1.5rem 0 .4rem}.lab-reading p {margin:0 0 .85rem}
.lab-directory {width:min(100% - 2.25rem,60rem);margin:2.4rem auto;padding:1.5rem 0;border-top:1px solid #cbbcaf}
.lab-page .lab-directory {width:100%}.lab-directory h2 {font-size:clamp(2.15rem,4vw,3.3rem);margin:.25rem 0 .75rem}
.lab-links {list-style:none;margin:1rem 0;padding:0;border-top:1px solid #d7c9be}.lab-links li {border-bottom:1px solid #d7c9be}
.lab-links a {display:grid;grid-template-columns:minmax(11rem,.9fr) minmax(0,1.55fr) auto;align-items:center;gap:1.1rem;color:var(--ink);text-decoration:none;padding:1.05rem .25rem}.lab-links strong {font:400 1.45rem var(--serif);line-height:1.1}
.lab-links small {color:var(--ink-soft);font-size:.92rem}.lab-links a:hover strong {color:var(--berry);text-decoration:underline}.lab-links a:focus-visible {outline:2px solid var(--berry);outline-offset:3px}
@media(max-width:640px){.shape-intro{grid-template-columns:minmax(0,1fr);gap:.35rem}.shape-study{grid-template-columns:auto 1fr;align-items:center;justify-items:start;gap:1rem;padding:.65rem 1rem;border-radius:1rem}.outline-demo{height:4.25rem;width:3.45rem}.shape-study figcaption{text-align:left}.lab-links a{grid-template-columns:1fr auto;gap:.25rem .65rem}.lab-links small{grid-column:1;grid-row:2}.lab-links a>span{grid-column:2;grid-row:1 / span 2}}
@media(max-width:430px){.shape-choices{grid-template-columns:1fr}.lab-page{width:calc(100% - 1.75rem)}.frame-shape i{width:1.8rem}.frame-round i{width:1.5rem;height:1.5rem}}
