.brand-page{padding-bottom:40px}.brand-intro{padding-block:72px 48px}.brand-intro h1{font-size:clamp(40px,5vw,64px)}.spec-nav{color:var(--accent);flex-wrap:wrap;gap:24px;margin-top:32px;font-size:13px;display:flex}.spec-section{border-top:1px solid var(--line);padding-block:48px;scroll-margin-top:24px}.spec-heading{max-width:650px;margin-bottom:28px}.spec-heading .eyebrow{margin-bottom:8px}.spec-heading h2{letter-spacing:-1px;margin-bottom:14px;font-size:clamp(24px,3vw,32px)}.spec-heading>p:last-child,.spec-panel p,.motion-demo p{color:var(--muted);font-size:13px;line-height:1.9}.identity-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}.logo-board{background:var(--surface);border-radius:var(--radius-lg);flex-direction:column;justify-content:center;align-items:center;gap:20px;min-height:320px;display:flex}.logo-board-blue{background:var(--accent);color:var(--on-accent)}.logo-board strong{letter-spacing:-1px;font-size:32px}.logo-board>span{font-size:12px}.logo-sizes{align-items:center;gap:24px;min-height:40px;display:flex}.asset-actions{flex-wrap:wrap;gap:10px;margin-block:20px;display:flex}.spec-note{color:var(--muted);margin-top:18px;font-size:12px;line-height:1.9}.token-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:36px;display:grid}.swatch{border-radius:var(--radius);flex-direction:column;justify-content:space-between;min-height:120px;padding:20px;display:flex}.swatch strong{font-size:13px;font-weight:500}.swatch span{font-size:12px}.swatch-blue{background:var(--accent);color:var(--on-accent)}.swatch-ink{background:var(--ink);color:var(--bg)}.swatch-surface{background:var(--surface)}.swatch-white{background:var(--bg);border:1px solid var(--line)}.type-spec{border-top:1px solid var(--line);grid-template-columns:1fr 1fr;gap:40px;margin-top:36px;padding-top:28px;display:grid}.type-spec span{color:var(--faint);font-size:11px}.type-spec p{margin-block:14px}.type-display{letter-spacing:-1px;font-size:clamp(24px,3vw,34px);font-weight:650}.type-spec code,.motion-demo code{color:var(--accent);overflow-wrap:anywhere;font-size:12px}.page-map{border:1px solid var(--line);border-radius:var(--radius-lg);grid-template-columns:repeat(4,minmax(0,1fr));display:grid;overflow:hidden}.page-map a{flex-direction:column;align-items:start;gap:14px;padding:24px;display:flex}.page-map a+a{border-left:1px solid var(--line)}.page-map a:hover{background:var(--surface)}.page-map span{color:var(--muted);font-size:11px}.page-map strong{font-size:17px;font-weight:600}.page-map p{color:var(--muted);flex:1;font-size:12px}.page-map small{color:var(--accent)}.component-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}.spec-panel{border:1px solid var(--line);border-radius:var(--radius-lg);min-width:0;padding:24px}.spec-panel h3{margin-bottom:20px;font-size:16px}.spec-panel p{margin-block:18px}.spec-panel>a:not(.button){color:var(--accent);font-size:12px}.button:disabled{opacity:.5;cursor:not-allowed;transform:none}.motion-demo{grid-template-columns:1fr 1fr;align-items:center;gap:48px;display:grid}.motion-tile{background:var(--surface);border-radius:var(--radius-lg);justify-content:center;align-items:center;gap:24px;min-height:240px;display:flex}.motion-tile:hover{background:var(--brand-tint)}.motion-tile:active{transform:scale(.98)}.motion-demo h3{margin-bottom:14px;font-size:24px}.motion-demo code{margin-top:20px;display:block}.spec-footer{border-top:1px solid var(--line);color:var(--muted);justify-content:space-between;gap:24px;padding-top:28px;font-size:12px;display:flex}.spec-footer a{color:var(--accent)}@media (width<=1000px){.page-map{grid-template-columns:1fr 1fr}.page-map a:nth-child(3){border-left:0}.page-map a:nth-child(n+3){border-top:1px solid var(--line)}.motion-demo{gap:24px}}@media (width<=640px){.brand-intro{padding-block:40px}.spec-section{padding-block:32px}.identity-grid,.type-spec,.component-grid,.motion-demo,.page-map{grid-template-columns:1fr}.logo-board{min-height:280px}.token-grid{grid-template-columns:1fr 1fr}.swatch{padding:16px}.page-map a+a{border-left:0;border-top:1px solid var(--line)}.spec-footer{flex-direction:column;gap:12px}}@media (prefers-reduced-motion:reduce){.motion-tile:active{transform:none}}
