.hb-sg{background:var(--hb-paper);color:var(--hb-ink);font-family:var(--hb-font-ui)}.hb-sg__inner{max-width:1180px;margin:0 auto;padding:40px var(--hb-gutter) 48px}.hb-sg__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:18px;border-bottom:2px solid var(--hb-ink);margin-bottom:28px}.hb-sg__eyebrow{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--hb-ink-soft)}.hb-sg .hb-sg__title{font-family:var(--hb-font-title);font-size:clamp(30px,4.4vw,44px);font-weight:600;letter-spacing:.01em;line-height:1.02;text-transform:uppercase;margin:8px 0 0}.hb-sg__file{display:inline-flex;align-items:center;padding:3px 7px;background:var(--hb-ink);color:var(--hb-gold);font-family:var(--hb-font-mono);font-size:9px}.hb-sg__group{display:flex;flex-direction:column;gap:14px;margin-bottom:34px}.hb-sg__group-title{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.hb-sg .hb-sg__note{max-width:760px;font-family:var(--hb-font-body);font-size:11.5px;font-weight:400;line-height:1.55;letter-spacing:0;text-transform:none;color:var(--hb-ink-soft)}.hb-sg .hb-sg__note code{padding:1px 4px;background:var(--hb-paper-deep);font-family:var(--hb-font-mono);font-size:10.5px}.hb-sg__demo{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:22px 24px;border:2px solid var(--hb-ink);background:var(--hb-panel)}.hb-sg__demo--dark{background:var(--hb-night)}.hb-sg__demo--paper{background:var(--hb-paper-deep)}.hb-sg__demo--stack{flex-direction:column;align-items:stretch}.hb-sg__cell{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.hb-sg__spec{font-family:var(--hb-font-mono);font-size:9px;letter-spacing:0;text-transform:none;color:var(--hb-ink-soft)}.hb-sg__demo--dark .hb-sg__spec{color:var(--hb-ink-dim)}.hb-sg__swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}.hb-sg__swatch{border:2px solid var(--hb-ink);background:var(--hb-panel);cursor:copy}.hb-sg__swatch-chip{height:62px;border-bottom:1px solid var(--hb-rule-soft)}.hb-sg__swatch-body{padding:8px 10px 9px}.hb-sg__swatch-name{font-family:var(--hb-font-mono);font-size:10px;letter-spacing:0;text-transform:none;color:var(--hb-ink);word-break:break-all}.hb-sg__swatch-value{margin-top:3px;font-family:var(--hb-font-mono);font-size:10px;color:var(--hb-ink-soft)}.hb-sg__swatch-desc{margin-top:4px;font-family:var(--hb-font-body);font-size:10px;line-height:1.4;text-transform:none;letter-spacing:0;color:var(--hb-ink-soft)}.hb-sg__tokens{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:0;border:2px solid var(--hb-ink);background:var(--hb-panel)}.hb-sg__token{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:7px 12px;border-bottom:1px solid var(--hb-rule-soft);cursor:copy}.hb-sg__token:hover{background:var(--hb-paper)}.hb-sg__token-name,.hb-sg__token-value{font-family:var(--hb-font-mono);font-size:10px;letter-spacing:0;text-transform:none}.hb-sg__token-name{color:var(--hb-ink)}.hb-sg__token-value{color:var(--hb-ink-soft);text-align:right;word-break:break-all}.hb-sg__realms{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.hb-sg__realm{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border:1.5px solid var(--hb-ink);font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.hb-sg__realm small{font-family:var(--hb-font-mono);font-size:9px;font-weight:400;letter-spacing:0;text-transform:none;opacity:.75}.hb-sg__toast-rail{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.hb-sg__copied{position:fixed;left:50%;bottom:24px;transform:translate(-50%);z-index:20;padding:8px 14px;background:var(--hb-ink);color:var(--hb-gold);font-family:var(--hb-font-mono);font-size:11px;pointer-events:none;opacity:0;transition:opacity var(--hb-dur-ui) var(--hb-ease)}.hb-sg__copied[data-visible=true]{opacity:1}@media screen and (max-width:768px){.hb-sg__inner{padding:28px var(--hb-gutter-mobile) 34px}.hb-sg__demo{padding:16px}}
/*# sourceMappingURL=/cdn/shop/t/23/assets/hb-styleguide.css.map */