.sg-content{gap:48px}.sg-content,.sg-section{display:grid;min-width:0}.sg-section{gap:20px}.sg-body-copy{margin:0;color:var(--text-secondary);font-size:var(--text-sm);line-height:20px}.sg-section-title{font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:.08em;text-transform:uppercase;color:var(--text-tertiary);padding-bottom:10px;border-bottom:1px solid var(--border-strong);margin:0}.sg-token-table{display:grid;gap:0;border:1px solid var(--border-strong);border-radius:8px;overflow:hidden;min-width:0}.sg-token-row{display:grid;grid-template-columns:minmax(0,220px) minmax(0,120px) minmax(0,1fr);align-items:center;gap:16px;padding:10px 14px;border-bottom:1px solid var(--border-strong);background:var(--surface-top);min-width:0}.sg-token-row:last-child{border-bottom:none}.sg-token-name{font-weight:var(--weight-semibold);color:var(--text-primary)}.sg-token-name,.sg-token-value{font-size:12px;font-family:monospace;overflow-wrap:break-word}.sg-token-value{color:var(--text-tertiary)}.sg-token-preview{display:flex;align-items:center;gap:8px;min-width:0}.sg-token-row.sg-prop-row{grid-template-columns:minmax(0,160px) minmax(0,1fr) minmax(0,1fr)}.sg-demo-canvas{overflow-x:auto;overflow-y:hidden}.sg-demo-canvas>*{max-width:100%}@media (max-width:768px){.sg-token-row.sg-prop-row{grid-template-columns:minmax(0,1fr)}.sg-token-row{grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:8px 16px;align-items:start}.sg-token-row .sg-token-name{grid-column:1/-1}.sg-token-row .sg-token-value{grid-column:1}.sg-token-row .sg-token-preview{grid-column:2}}.sg-type-scale-meta .sg-token-name,.sg-type-scale-meta .sg-token-value{white-space:nowrap}.sg-type-scale-meta .sg-token-value{text-align:right}.sg-demo{display:grid;gap:8px}.sg-demo-label{font-weight:var(--weight-semibold);letter-spacing:.05em;text-transform:uppercase;display:flex;align-items:baseline;gap:8px}.sg-demo-label,.sg-demo-note{font-size:var(--text-xs);color:var(--text-tertiary)}.sg-demo-note{font-weight:var(--weight-regular);text-transform:none;letter-spacing:0}.sg-demo-canvas{padding:24px;background:var(--surface-top);border:1px solid var(--border-strong);border-radius:8px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}.sg-demo-canvas--stack{flex-direction:column;align-items:stretch;gap:0}.sg-demo-canvas--inset{background:var(--surface-inset)}.sg-demo-canvas--dark{background:var(--brand-main)}.sg-demo-canvas--narrow{min-width:280px}.sg-demo-canvas--wide{max-width:none}.sg-demo-group{display:grid;gap:16px}.sg-btn-playground{display:flex;flex-direction:column;gap:0;border:1px solid var(--border-strong);border-radius:10px;overflow:hidden}@media (min-width:768px){.sg-btn-playground{flex-direction:row;align-items:stretch}.sg-btn-playground-preview{flex:0 0 280px;border-bottom:none;border-right:1px solid var(--border-strong);min-height:160px}.sg-btn-playground-controls{flex:1 1 0;border-top:none;border-left:none;justify-content:center}}.sg-btn-playground-preview{display:flex;align-items:center;justify-content:center;padding:40px 24px;background:var(--surface-top);min-height:120px;border-bottom:1px solid var(--border-strong);transition:background .2s}.sg-btn-playground-preview--dark{background:var(--color-brand-dark,#1a1a2e)}.sg-btn-playground-controls{display:flex;flex-direction:column;gap:12px;padding:16px 20px;background:var(--surface-base)}.sg-btn-ctrl-group{display:flex;align-items:flex-start;gap:12px}.sg-btn-ctrl-label{font-size:11px;font-weight:var(--weight-semibold);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.06em;min-width:72px;padding-top:5px;flex-shrink:0}.sg-btn-ctrl-pills{display:flex;flex-wrap:wrap;gap:6px}.sg-btn-ctrl-pill{padding:3px 10px;border-radius:999px;border:1px solid var(--border-strong);background:transparent;color:var(--text-secondary);font-size:12px;font-family:var(--font-mono,monospace);cursor:pointer;line-height:1.5;transition:color .1s,border-color .1s}.sg-btn-ctrl-pill:hover{border-color:var(--text-secondary);color:var(--text-primary)}.sg-btn-ctrl-pill.active{border-color:var(--text-primary);color:var(--text-primary);font-weight:var(--weight-semibold)}.sg-demo-group--row{gap:24px}@media (min-width:600px){.sg-demo-group--row{grid-template-columns:repeat(2,1fr)}.sg-demo-group--row>.sg-demo{display:grid;grid-template-rows:auto 1fr}.sg-demo-group--row>.sg-demo>.sg-demo-canvas{height:100%}}.sgd-checker{background-image:linear-gradient(45deg,var(--surface-gray) 25%,transparent 25%),linear-gradient(-45deg,var(--surface-gray) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--surface-gray) 75%),linear-gradient(-45deg,transparent 75%,var(--surface-gray) 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0}