body.hui{margin:0;background:var(--hui-color-surface-canvas)}.gallery-header{min-height:72px;padding:16px 32px;background:var(--hui-color-surface-panel);display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--hui-color-border-subtle)}.gallery-logo{display:flex;align-items:center;gap:8px;font-size:26px;font-weight:700;text-decoration:none;letter-spacing:-1px}.gallery-logo>span:first-child{display:grid;place-items:center;width:30px;height:30px;border-radius:6px;background:var(--hui-color-brand-primary);color:var(--hui-color-brand-on-primary);font-size:24px}.gallery-logo-separator{color:var(--hui-color-border-control);font-weight:400;line-height:1;margin:0 6px}.gallery-logo strong{font-weight:500}.gallery-header-right{display:flex;align-items:center;gap:20px;font-size:12px}.gallery-header-right>a{text-decoration:none;font-weight:500}.gallery-version{display:inline-flex;align-items:center;padding:4px 9px;border-radius:999px;background:var(--hui-color-feedback-warning-surface);color:var(--hui-color-feedback-warning-text);font-size:11px;font-weight:600}.gallery-nav{display:flex;gap:8px;padding:0 24px;background:var(--hui-color-surface-panel);border-bottom:1px solid var(--hui-color-border-subtle);overflow-x:auto}.gallery-nav a{display:flex;align-items:center;gap:8px;min-height:52px;padding:12px 16px;white-space:nowrap;text-decoration:none;font-size:13px;color:var(--hui-color-text-secondary);border-bottom:2px solid transparent}.gallery-nav a[aria-current=page]{color:var(--hui-color-brand-primary);border-bottom-color:var(--hui-color-brand-primary);font-weight:600}.gallery-nav a span{font-size:10px;line-height:18px;padding:0 4px;border:1px solid var(--hui-color-border-subtle);border-radius:4px}.gallery-main{max-width:1352px;margin:auto;padding:40px 32px 48px;min-height:70vh}.gallery-eyebrow{font-size:11px;font-weight:600;letter-spacing:.1em;line-height:16px;color:var(--hui-color-text-secondary);margin-bottom:12px!important}.gallery-intro{margin:8px 0 32px}.gallery-intro .hui-title{font-size:36px;line-height:44px}.gallery-lead{font-size:16px;line-height:26px;color:var(--hui-color-text-secondary);margin-top:16px!important}.gallery-intro-meta{display:flex;align-items:center;gap:16px;font-size:12px;color:var(--hui-color-text-secondary);margin-top:20px}.gallery-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px}.gallery-card{display:flex;flex-direction:column;min-width:0}.gallery-card-title{display:flex;align-items:center;gap:12px;margin-bottom:24px}.gallery-card-title p{margin-top:4px}.gallery-pattern{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--hui-color-border-subtle);border-radius:8px;color:var(--hui-color-brand-primary);font-weight:600;background:var(--hui-color-surface-subtle);flex-shrink:0}.gallery-mini{padding:20px;border:1px solid var(--hui-color-border-subtle);border-radius:8px;background:var(--hui-color-surface-canvas);margin-bottom:24px}.gallery-mini-list{margin-bottom:24px;border:1px solid var(--hui-color-border-subtle);border-radius:8px;overflow:hidden}.gallery-card-bottom{margin-top:auto;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-direction:column}.gallery-foundation{display:flex;align-items:center;gap:24px;margin-top:24px;flex-wrap:wrap}.gallery-foundation>div:first-child{flex:1;min-width:270px}.gallery-foundation p.hui-muted{margin-top:8px;font-size:13px;max-width:400px}.gallery-palette-mini{display:flex;gap:12px}.gallery-palette-mini>div{width:72px}.gallery-palette-mini span{display:block;height:36px;border-radius:4px}.gallery-palette-mini small{font-size:10px;color:var(--hui-color-text-secondary);display:block;line-height:14px;margin-top:6px}.gallery-boundary{margin-top:32px;border-top:1px solid var(--hui-color-border-subtle);padding-top:24px}.gallery-boundary p{margin-top:8px!important;color:var(--hui-color-text-secondary);font-size:13px;max-width:760px}.gallery-page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:24px}.gallery-page-heading .hui-muted{margin-top:8px}.gallery-state-control{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--hui-color-text-secondary);flex-shrink:0}.gallery-state-control .hui-select{width:160px}.gallery-metrics{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}.gallery-metrics span{padding:4px 8px;font-size:11px;border:1px solid var(--hui-color-border-subtle);border-radius:4px;background:var(--hui-color-surface-panel);color:var(--hui-color-text-secondary)}.gallery-demo-canvas{padding:32px;background:var(--hui-color-surface-canvas);border:1px solid var(--hui-color-border-subtle);border-radius:8px;min-width:0}.gallery-example-heading{margin-bottom:24px}.gallery-example-heading>.hui-muted,.gallery-example-heading>div>.hui-muted{margin-top:8px}.gallery-breadcrumb{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--hui-color-text-secondary);margin-bottom:16px!important}.gallery-example-heading--actions{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.gallery-story{max-width:var(--hui-layout-form-simple-max)}.gallery-aligned-switch{padding-top:25px}.gallery-demo-note{margin-top:16px!important}.gallery-contract{margin-top:24px;padding:20px 0;border-bottom:1px solid var(--hui-color-border-subtle);font-size:13px;max-width:980px}.gallery-contract summary{font-weight:600;cursor:pointer}.gallery-contract ul,.gallery-contract p{margin:16px 0;color:var(--hui-color-text-secondary);line-height:22px}.gallery-contract a{color:var(--hui-color-brand-primary);font-size:12px}.gallery-swatches{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.gallery-swatch{display:block;height:72px;border:1px solid #00000012;border-radius:8px;margin-bottom:8px}.gallery-swatches strong{font-size:12px;font-weight:500;display:block}.gallery-swatches code{font-size:11px;color:var(--hui-color-text-secondary);display:block;margin-top:4px}.gallery-token-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}.gallery-token-values{margin:0}.gallery-token-values>div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--hui-color-border-subtle);font-size:13px}.gallery-token-values>div:last-child{border:0}.gallery-token-values dd{margin:0;white-space:nowrap;font-variant-numeric:tabular-nums}.gallery-token-values dt{color:var(--hui-color-text-secondary)}.gallery-action-samples{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.gallery-feedback{margin-top:24px}.gallery-footnote{margin-top:24px!important;color:var(--hui-color-text-secondary);font-size:12px}.gallery-guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:24px}.gallery-guide-grid p,.gallery-guide-grid li{font-size:13px;line-height:22px}.gallery-guide-grid ul,.gallery-guide-grid ol{padding-left:20px;margin:16px 0}.gallery-code{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--hui-color-surface-subtle);padding:24px;border:1px solid var(--hui-color-border-subtle);border-radius:8px;font-size:12px;line-height:22px;margin:0 0 16px}.gallery-guide-links{display:flex;flex-wrap:wrap;gap:24px;margin-top:24px;font-size:12px}.gallery-guide-links a{color:var(--hui-color-brand-primary)}.gallery-footer{max-width:1352px;margin:auto;padding:24px 32px;border-top:1px solid var(--hui-color-border-subtle);display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--hui-color-text-secondary);font-size:11px}.gallery-footer code{background:var(--hui-color-border-subtle);padding:2px 5px;border-radius:3px}.gallery-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);z-index:70;padding:14px 20px;background:var(--hui-color-feedback-success-surface);color:var(--hui-color-feedback-success-text);border:1px solid var(--hui-color-feedback-success-text);border-radius:8px;box-shadow:var(--hui-shadow-panel-simple);font-size:13px}.gallery-skip{position:absolute;top:-100px;left:16px;background:var(--hui-color-surface-panel);padding:12px;z-index:100}.gallery-skip:focus{top:12px}.hui-list{overflow:visible}
@media(max-width:960px){.gallery-cards,.gallery-guide-grid{grid-template-columns:1fr}.gallery-header-right>.hui-small{display:none}.gallery-example-heading--actions{flex-wrap:wrap}}
@media(max-width:767px){.gallery-main{padding:28px 20px 36px}.gallery-demo-canvas{padding:24px 16px}.gallery-page-heading{flex-wrap:wrap}.gallery-aligned-switch{padding-top:0}.gallery-token-columns{grid-template-columns:1fr}.gallery-swatches{grid-template-columns:1fr 1fr}.gallery-intro .hui-title{font-size:30px;line-height:36px}.gallery-mini-list .hui-table{min-width:0}.gallery-header{padding:16px 20px}.gallery-nav{padding:0 8px;gap:0}.gallery-nav a{padding:12px}.gallery-header-right{gap:12px}.gallery-header-right>a{font-size:11px}.gallery-footer{padding:24px 20px}.gallery-state-control{width:100%;justify-content:space-between}.gallery-lead{font-size:14px;line-height:23px}.gallery-lead br{display:none}.gallery-intro-meta{gap:12px;flex-wrap:wrap}.gallery-foundation>div:first-child{min-width:100%}.gallery-palette-mini{width:100%;justify-content:space-between}.gallery-page-heading>.hui-button{width:100%}.gallery-example-heading--actions>.hui-button{width:100%}.gallery-token-values>div{align-items:flex-start}.gallery-token-values dd{white-space:normal;text-align:right}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.gallery-candidate{display:flex;gap:16px;flex-wrap:wrap;padding:12px 32px;background:var(--hui-color-feedback-warning-surface);color:var(--hui-color-feedback-warning-text);font-size:12px}.gallery-next-patterns{margin-top:24px}.gallery-next-patterns .gallery-card-bottom{margin-top:24px}.gallery-preview-label{color:var(--hui-color-text-secondary);font-size:12px}.gallery-preview-amount{font-size:var(--hui-type-amount-size);line-height:var(--hui-type-amount-lineHeight);font-weight:var(--hui-type-amount-weight);margin:8px 0 16px!important;font-variant-numeric:tabular-nums}.hui-form-summary .gallery-token-values>div{align-items:flex-start}.hui-form-summary .gallery-token-values dd{white-space:normal;text-align:right;overflow-wrap:anywhere;max-width:65%}.hui-form-summary .hui-panel{position:sticky;top:24px}

.gallery-candidate span{overflow-wrap:anywhere}

.gallery-r2-card{display:flex;align-items:center;justify-content:space-between;gap:var(--hui-space-24);margin-top:var(--hui-space-24);flex-wrap:wrap}.gallery-r2-card p.hui-muted{margin-top:var(--hui-space-8);max-width:680px}