.family-page{--accent:#dcff00}.family-page[data-font-key=niv]{--accent:#bfc8ff}.family-section{padding:70px var(--pad);border-bottom:1px solid var(--line)}.family-overline{display:flex;justify-content:space-between;gap:20px;font-size:14px;color:var(--muted)}.family-hero{background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:80px 80px}.hero-weight{min-height:380px;display:flex;align-items:center;justify-content:center;position:relative}.weight-word{font-synthesis:none;font-size:clamp(140px,24vw,350px);line-height:1.2;color:var(--accent);letter-spacing:-.025em}.weight-label{position:absolute;bottom:15px;left:0;font-family:GoogleSans;font-size:14px;direction:ltr;color:var(--muted)}.family-intro{display:grid;grid-template-columns:1fr 1fr;gap:35px;border-top:1px solid var(--line);padding-top:38px}.family-intro h1{font-size:clamp(38px,5vw,70px);line-height:1.15;letter-spacing:-.03em}.family-intro p{font-size:20px;line-height:1.7;color:var(--muted)}.family-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px;margin-top:35px}.motion-control{background:none;border:1px solid var(--line);padding:12px 18px;color:var(--white);font-size:14px}.weight-buttons{display:flex;flex-wrap:wrap;gap:8px}.weight-buttons button{background:transparent;border:1px solid var(--line);padding:12px 18px;font-size:14px}.weight-buttons button[aria-pressed=true]{background:var(--accent);color:var(--black);border-color:var(--accent)}.weight-sentence{font-family:var(--specimen-face);font-weight:300;font-size:clamp(36px,7vw,100px);letter-spacing:normal;line-height:1.3;padding:55px 0}.weight-stack>div{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:25px;border-top:1px solid var(--line);padding:25px 0}.weight-stack span{font-size:14px;direction:ltr;color:var(--muted)}.weight-stack p{font-family:var(--specimen-face);font-size:clamp(30px,5vw,70px);letter-spacing:normal;line-height:1.3}.inspector-section{background:#e8e7df;color:#202221}.inspector-section .eyebrow,.inspector-section .section-heading>p{color:#64665e}.inspector-tools{display:flex;align-items:center;gap:24px;flex-wrap:wrap;font-size:14px}.inspector-tools label{display:flex;align-items:center;gap:10px}.inspector-tools select{font-family:GoogleSans;padding:10px;background:transparent;color:inherit;border:1px solid currentColor}.inspector-tools input{accent-color:#7348ff}.inspector-tools input[type=checkbox]{width:18px;height:18px}.inspector-tools span{margin-inline-start:auto;font-size:13px}.glyph-stage{margin:26px 0;background:#f7f6ee;border:1px solid #cfcec5}.glyph-stage svg{display:block;width:100%;height:470px}.glyph-outline{fill:#202221}.glyph-guide{stroke:#c1bfb5;stroke-width:1.5;stroke-dasharray:6 7}.guide-label{font:18px GoogleSans;fill:#6d6c64}.anchor-point{fill:#7348ff;stroke:#fff;stroke-width:1.5}.control-point{fill:#dcff00;stroke:#7348ff;stroke-width:1.5}.glyph-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1px;background:#cfcec5;border:1px solid #cfcec5}.glyph-grid button{font:400 30px var(--specimen-face);min-width:0;min-height:62px;background:#f7f6ee;color:#202221;border:0}.glyph-grid button[aria-pressed=true]{background:#202221;color:#dcff00}.inspector-note{margin-top:20px;font-size:14px;color:#64665e}.kinetic-section{padding:0;background:#7348ff}.kinetic-head{padding:50px var(--pad);display:flex;flex-wrap:wrap;align-items:center;gap:24px;justify-content:space-between}.kinetic-head .eyebrow{width:100%;margin:0;color:#e1d7ff}.kinetic-head h2{font-size:36px}.kinetic-head p{font-size:15px}.kinetic-grid{display:grid;grid-template-columns:repeat(12,1fr);direction:ltr;overflow:hidden}.kinetic-grid button{font:300 clamp(35px,5vw,76px)/1 var(--specimen-face);letter-spacing:0;min-width:0;padding:18px 0;color:#f9f6e9;background:none;border:1px solid #ffffff12;transition:opacity .3s,background .25s,transform .3s;cursor:pointer}.kinetic-grid button:hover,.kinetic-grid .tile-active{background:#dcff00;color:#202221;opacity:1!important}.family-lab textarea{font-family:var(--specimen-face);font-synthesis:none;display:block;width:100%;min-height:330px;resize:vertical;line-height:1.45;letter-spacing:normal;background:none;border:0;border-bottom:1px solid var(--line);color:var(--white);padding:45px 0;margin-top:20px}.family-footer{padding:35px var(--pad);display:flex;justify-content:space-between;gap:25px;font-size:15px;flex-wrap:wrap}.family-page .section-heading>p{max-width:35ch}@media(max-width:760px){.family-section{padding:50px 24px}.hero-weight{min-height:280px}.weight-word{font-size:clamp(120px,34vw,240px)}.family-intro{grid-template-columns:1fr;gap:20px}.family-intro p{font-size:18px}.family-overline{font-size:12px}.weight-stack>div{grid-template-columns:85px 1fr;gap:14px}.weight-stack span{font-size:12px}.weight-stack p{font-size:30px}.glyph-grid{grid-template-columns:repeat(6,1fr)}.glyph-stage svg{height:360px}.inspector-tools{gap:18px}.inspector-tools span{width:100%;margin:0}.kinetic-grid{grid-template-columns:repeat(6,1fr)}.kinetic-grid button{font-size:45px}.kinetic-head{padding:35px 24px}.kinetic-head h2{font-size:29px}.family-lab textarea{min-height:280px}.family-page .header .small-button{padding-inline:12px;font-size:13px}.family-page .graffiti-logo{width:130px}.weight-sentence{font-size:38px}}

.family-mobile-nav{display:none}.family-photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:35px}.family-photo-grid figure{margin:0;min-width:0}.family-photo-grid img{width:100%;aspect-ratio:4/3;object-fit:cover}.family-photo-grid figcaption{font-size:14px;color:var(--muted);padding-top:14px}.family-examples .inspector-note{color:var(--muted)}@media(max-width:760px){.family-mobile-nav{display:flex;justify-content:space-around;gap:12px;flex-wrap:wrap;padding:15px 20px;border-bottom:1px solid var(--line);font-size:13px}.family-mobile-nav a{text-decoration:none}.family-photo-grid{grid-template-columns:1fr;gap:25px}}