:root{--gray-5: #2E2E2E;--gray-4: #6B7280;--gray-3: #9CA3AF;--gray-2: #BBBBBE;--gray-1: #FFFFFF;--color-brand-ink: #21201C;--fg-1: var(--gray-5);--fg-2: var(--gray-4);--fg-3: var(--gray-3);--fg-muted: var(--gray-2);--fg-inverse: var(--gray-1);--color-page: #F5F5F5;--color-surface: #FFFFFF;--color-surface-subtle: #F3F4F6;--color-surface-pink: #FDF2F8;--color-surface-blue: #EFF6FF;--color-btn-secondary-bg: #F2F2F2;--color-border-default: #F1F3F5;--color-border-subtle: #EBEBEC;--color-overlay: rgba(0, 0, 0, .02);--color-scrim: rgba(0, 0, 0, .4);--color-success: #8AE560;--color-success-bg: rgba(138, 229, 96, .14);--color-danger: #EC7979;--color-danger-bg: rgba(236, 121, 121, .1);--color-warning: #FFBA35;--color-warning-bg: rgba(255, 186, 53, .14);--color-info: #5E85EE;--color-info-bg: rgba(94, 133, 238, .1);--color-danger-deep: #D92B2B;--color-warning-deep: #B4690E;--color-success-deep: #3B8A1B;--toast-info-bg: #1F2937;--toast-success-bg: #2EBB54;--toast-warning-bg: #FFBA35;--toast-danger-bg: #EF4444;--toast-danger-outer: rgba(239, 68, 68, .1);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--text-body: 400 14px/22px var(--font-sans);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--gap-layout: 12px;--gap-content: 20px;--sidebar-expanded: 256px;--sidebar-collapsed: 64px;--header-height: 64px;--content-width: 1028px;--content-gutter: 24px;--drawer-width: 540px;--toast-width: 400px;--radius-xs: 3px;--radius-sm: 4px;--radius-md: 8px;--radius-card: 12px;--radius-pill: 100px;--radius-avatar: 9999px;--shadow-card: 0 2px 4px rgba(0, 0, 0, .04);--shadow-toggle-btn: 0 1px 2px rgba(0, 0, 0, .05);--shadow-avatar: 0 4px 20px -2px rgba(0, 0, 0, .05);--shadow-modal: 0 16px 48px rgba(0, 0, 0, .12);--shadow-drawer: -9px 0 28px rgba(0, 0, 0, .05);--shadow-toast: 0 0 12px rgba(0, 0, 0, .06);--z-drawer: 50;--z-modal: 60;--z-toast: 100;--ease-sidebar: cubic-bezier(.4, 0, .2, 1);--dur-fast: 80ms;--dur-base: .2s;--dur-sidebar: .22s}.hb-canvas{min-height:100vh;background:var(--color-page);padding:var(--gap-layout);font:var(--text-body);font-family:var(--font-sans);color:var(--fg-1);-webkit-font-smoothing:antialiased}.t-h1{font:700 64px/80px var(--font-sans);color:var(--fg-1)}.t-h2{font:700 48px/64px var(--font-sans);color:var(--fg-1)}.t-h3{font:700 32px/48px var(--font-sans);color:var(--fg-1)}.t-h4{font:700 24px/36px var(--font-sans);color:var(--fg-1)}.t-h5{font:700 20px/30px var(--font-sans);color:var(--fg-1)}.t-hero-name{font:600 28px/36px var(--font-sans);color:var(--fg-1)}.t-16b{font:700 16px/24px var(--font-sans)}.t-16{font:400 16px/24px var(--font-sans)}.t-14b{font:700 14px/22px var(--font-sans)}.t-14{font:400 14px/22px var(--font-sans)}.t-12,.t-description{font:400 12px/16px var(--font-sans);color:var(--fg-3)}.t-id{font:400 14px/22px var(--font-sans);color:var(--fg-2)}.t-nav-group{font:600 12px/16px var(--font-sans);letter-spacing:.6px;text-transform:uppercase;color:var(--fg-3)}.hb-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:var(--radius-pill);font-family:var(--font-sans);cursor:pointer;white-space:nowrap;transition:background var(--dur-fast) ease,border-color var(--dur-fast) ease,color var(--dur-fast) ease,transform var(--dur-fast) ease}.hb-btn:active{transform:scale(.97)}.hb-btn:disabled{opacity:.4;pointer-events:none}.hb-btn--large{height:44px;padding:0 22px;font-size:16px;line-height:24px;font-weight:700}.hb-btn--small{height:34px;padding:6px 12px;font-size:14px;line-height:22px;font-weight:400}.hb-btn--primary{background:var(--gray-5);color:var(--gray-1)}.hb-btn--primary:hover{background:#1a1a1a}.hb-btn--secondary{background:var(--color-btn-secondary-bg);color:var(--gray-5)}.hb-btn--secondary:hover{background:#e5e5e5}.hb-btn--ghost{background:transparent;color:var(--gray-5);border-color:var(--color-border-default)}.hb-btn--ghost:hover{background:var(--color-surface-subtle)}.hb-btn--danger{background:transparent;color:var(--color-danger-deep);border-color:var(--color-danger-deep)}.hb-btn--danger:hover{background:#d92b2b0f}.hb-btn--warning{background:transparent;color:var(--color-warning-deep);border-color:var(--color-warning)}.hb-btn--warning:hover{background:#ffba351f}.hb-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;border-radius:6px;background:transparent;color:var(--gray-3);cursor:pointer;transition:background var(--dur-fast) ease,color var(--dur-fast) ease}.hb-icon-btn:hover{background:var(--color-surface-subtle);color:var(--gray-5)}.hb-badge{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:var(--radius-pill);font:400 14px/20px var(--font-sans)}.hb-badge--success{background:var(--color-success-bg);color:var(--color-success)}.hb-badge--info{background:var(--color-info-bg);color:var(--color-info)}.hb-badge--danger{background:var(--color-danger-bg);color:var(--color-danger)}.hb-badge--warning{background:var(--color-warning-bg);color:var(--color-warning-deep)}.hb-badge--neutral{background:var(--color-surface-subtle);color:var(--gray-4)}.hb-badge__dot{width:6px;height:6px;border-radius:var(--radius-avatar);background:currentColor}.hb-status-tag{display:inline-flex;align-items:center;gap:6px;padding:4px 6px;border-radius:6px;border:1px solid var(--color-border-default);background:var(--gray-1);color:var(--gray-3);font:400 12px/15px var(--font-sans)}.hb-status-tag__dot{width:4px;height:4px;border-radius:var(--radius-avatar)}.hb-status-tag__dot--success{background:var(--color-success)}.hb-status-tag__dot--info{background:var(--color-info)}.hb-status-tag__dot--danger{background:var(--color-danger)}.hb-status-tag__dot--warning{background:var(--color-warning)}.hb-status-tag__dot--neutral{background:var(--gray-3)}.hb-card{background:var(--color-surface);border-radius:var(--radius-card);padding:var(--gap-content)}.hb-stat-card{border-radius:var(--radius-card);padding:2px}.hb-stat-card--pink{background:var(--color-surface-pink)}.hb-stat-card--blue{background:var(--color-surface-blue)}.hb-stat-card--overlay{background:var(--color-overlay)}.hb-stat-card__inner{background:var(--color-surface);border-radius:10px;box-shadow:var(--shadow-card);padding:var(--gap-content)}.hb-input,.hb-select,.hb-textarea{width:100%;box-sizing:border-box;border:1px solid var(--color-border-default);border-radius:var(--radius-md);background:var(--color-surface);color:var(--gray-5);font:400 14px/22px var(--font-sans);transition:border-color var(--dur-fast) ease}.hb-input::placeholder,.hb-textarea::placeholder{color:var(--gray-3)}.hb-input:focus,.hb-select:focus,.hb-textarea:focus{outline:none;border-color:var(--gray-5)}.hb-input[aria-invalid=true],.hb-select[aria-invalid=true],.hb-textarea[aria-invalid=true]{border-color:var(--color-danger-deep);background:var(--color-danger-bg)}.hb-input--large{height:44px;padding:0 14px}.hb-input--small{height:34px;padding:0 12px}.hb-textarea{min-height:88px;padding:10px 14px;resize:vertical}.hb-select-shell{position:relative;display:block}.hb-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:36px}.hb-select--large{height:44px;padding-left:14px}.hb-select--small{height:34px;padding-left:12px}.hb-select-shell__chevron{position:absolute;right:12px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--gray-4)}.hb-checkbox{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font:400 14px/22px var(--font-sans);color:var(--gray-5)}.hb-checkbox input{position:absolute;width:1px;height:1px;opacity:0}.hb-checkbox__box{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border:1px solid var(--gray-2);border-radius:var(--radius-xs);background:var(--color-surface);color:var(--gray-1);transition:background var(--dur-fast) ease,border-color var(--dur-fast) ease}.hb-checkbox__box svg{opacity:0}.hb-checkbox input:checked+.hb-checkbox__box{background:var(--gray-5);border-color:var(--gray-5)}.hb-checkbox input:checked+.hb-checkbox__box svg{opacity:1}.hb-checkbox input:focus-visible+.hb-checkbox__box{border-color:var(--gray-5)}.hb-field{display:flex;flex-direction:column;gap:6px}.hb-field__label{font:500 14px/22px var(--font-sans);color:var(--gray-5)}.hb-field__helper{margin:0;font:400 12px/16px var(--font-sans);color:var(--gray-3)}.hb-field__error{margin:0;font:400 12px/16px var(--font-sans);color:var(--color-danger-deep)}.hb-pill-toggle{display:inline-flex;gap:2px;padding:2px;border-radius:var(--radius-pill);background:var(--color-overlay)}.hb-pill-toggle__item{border:none;border-radius:var(--radius-pill);padding:6px 14px;background:transparent;color:var(--gray-4);font:400 14px/22px var(--font-sans);cursor:pointer;transition:background var(--dur-fast) ease,color var(--dur-fast) ease}.hb-pill-toggle__item:active{transform:scale(.97)}.hb-pill-toggle__item.is-active{background:var(--gray-1);color:var(--gray-5);box-shadow:var(--shadow-toggle-btn)}.hb-scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-scrim)}.hb-dialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center}.hb-dialog__panel{position:relative;width:480px;max-width:calc(100vw - 48px);max-height:85vh;display:flex;flex-direction:column;background:var(--color-surface);border-radius:var(--radius-card);box-shadow:var(--shadow-modal);animation:hb-dialog-in var(--dur-base) ease-out}.hb-dialog--wide{width:600px}.hb-dialog__header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 0}.hb-dialog__header .t-h5{margin:0}.hb-dialog__subtitle{margin:4px 0 0;font:400 14px/22px var(--font-sans);color:var(--gray-4)}.hb-dialog__body{padding:12px 24px 20px;overflow-y:auto;font:400 14px/22px var(--font-sans);color:var(--gray-4)}.hb-dialog__footer{display:flex;justify-content:flex-end;gap:8px;padding:0 24px 20px}@keyframes hb-dialog-in{0%{transform:scale(.96);opacity:0}to{transform:scale(1);opacity:1}}.hb-drawer-root{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--z-drawer)}.hb-drawer{position:absolute;top:0;right:0;bottom:0;width:var(--drawer-width);max-width:100vw;display:flex;flex-direction:column;background:var(--color-surface);border-radius:var(--radius-card) 0 0 var(--radius-card);box-shadow:var(--shadow-drawer);animation:hb-drawer-in .3s ease-out}.hb-drawer__header{display:flex;align-items:center;justify-content:space-between;height:var(--header-height);box-sizing:border-box;padding:20px 24px}.hb-drawer__header .t-h5{margin:0}.hb-drawer__body{flex:1;overflow-y:auto;padding:0 24px 20px}.hb-drawer__footer{display:flex;justify-content:flex-end;gap:8px;padding:16px 24px}@keyframes hb-drawer-in{0%{transform:translate(100%)}to{transform:translate(0)}}.hb-toast-stack{position:fixed;right:24px;bottom:24px;z-index:var(--z-toast);display:flex;flex-direction:column;gap:8px}.hb-toast{display:flex;align-items:flex-start;gap:10px;width:var(--toast-width);max-width:calc(100vw - 48px);box-sizing:border-box;padding:14px 16px;background:var(--color-surface);border-radius:var(--radius-card);box-shadow:var(--shadow-toast);font:400 14px/22px var(--font-sans);color:var(--gray-5);animation:hb-toast-in var(--dur-base) ease-out}.hb-toast__message{flex:1}.hb-toast__icon{flex-shrink:0;margin-top:2px}.hb-toast__icon--success{color:var(--toast-success-bg)}.hb-toast__icon--error{color:var(--toast-danger-bg)}.hb-toast__icon--warning{color:var(--toast-warning-bg)}.hb-toast__icon--info{color:var(--toast-info-bg)}@keyframes hb-toast-in{0%{transform:translate(12px);opacity:0}to{transform:translate(0);opacity:1}}html,body,#root{height:100%;margin:0}body{background:var(--color-page);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}.portal-picks{display:flex;gap:16px;width:100%;margin-top:24px;justify-content:center}.portal-pick{position:relative;display:flex;align-items:center;justify-content:center;width:80px;height:80px;box-sizing:border-box;padding:0;border:0;border-radius:13.38px;background:none;cursor:pointer;text-align:left;overflow:visible;transition:transform .16s ease-out}.portal-pick:active{transform:scale(.97)}.portal-pick[aria-disabled=true]{cursor:default}.portal-pick[aria-disabled=true]:active{transform:none}.portal-pick.is-locked{opacity:.6}.portal-pick:focus-visible{outline:2px solid var(--gray-5);outline-offset:3px}.portal-pick-icon{flex-shrink:0;width:80px;height:80px;border-radius:13.38px;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:transform .16s ease-out,box-shadow .16s ease-out}.portal-pick:hover .portal-pick-icon,.portal-pick:focus-visible .portal-pick-icon{transform:translateY(-2px);box-shadow:0 0 0 2px var(--gray-5)}.portal-pick[aria-disabled=true]:hover .portal-pick-icon{transform:none;box-shadow:none}.portal-pick-card-wrap{position:absolute;right:calc(100% + 16px);top:0;width:240px;opacity:0;pointer-events:none;transition:opacity .12s ease}.portal-pick:hover .portal-pick-card-wrap,.portal-pick:focus-visible .portal-pick-card-wrap,.portal-pick.is-locked .portal-pick-card-wrap,.portal-pick.is-opening .portal-pick-card-wrap{opacity:1;pointer-events:auto}.portal-pick-card-back{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:12px}.portal-pick-card{position:relative;width:240px;padding:12px 16px 16px;border-radius:12px;background:var(--color-surface);box-sizing:border-box;display:flex;flex-direction:column;gap:8px;box-shadow:0 0 0 1.5px var(--gray-5)}.portal-pick-card-back{background:var(--gray-5)}.portal-pick.dev .portal-pick-card-wrap{right:auto;left:calc(100% + 16px)}.portal-pick.dev .portal-pick-card-back{transform:translate(6px,6.4px)}.portal-pick.con .portal-pick-card-back{transform:translate(-6px,6.4px)}.portal-pick-quote{display:block;width:20px;height:15.588px}.portal-pick-text{flex:0 1 auto;min-width:0;max-width:0;opacity:0;overflow:hidden;display:flex;flex-direction:column;gap:2px;transition:opacity 80ms ease,max-width .16s ease}.portal-pick:hover .portal-pick-text,.portal-pick:focus-visible .portal-pick-text,.portal-pick.is-locked .portal-pick-text,.portal-pick.is-opening .portal-pick-text{max-width:220px;opacity:1}.portal-pick-title{font:700 16px/24px var(--font-sans);color:var(--gray-5)}.portal-pick-desc{font:400 12px/16px var(--font-sans);color:var(--gray-3)}
