.bb-shell{display:flex;flex-direction:column;height:100%;min-height:calc(100vh - 44px);overflow:hidden}.bb-tab-bar{display:flex;align-items:center;gap:4px;padding:0 22px;border-bottom:1px solid var(--bs-color-border-subtle);background:var(--bs-color-surface)}.bb-tab{display:inline-flex;align-items:center;gap:7px;padding:12px 14px 11px;border:none;border-bottom:2px solid transparent;background:transparent;color:var(--bs-color-text-muted);font-family:var(--bs-font-mono);font-size:.82rem;font-weight:500;letter-spacing:-.01em;cursor:pointer;transition:color .14s ease,border-color .14s ease;white-space:nowrap}.bb-tab svg{width:14px;height:14px;flex-shrink:0}.bb-tab:hover{color:var(--bs-color-text-heading)}.bb-tab.is-active{color:var(--bs-color-pill-active);border-bottom-color:var(--bs-color-pill-active)}.bb-tab-spacer{flex:1}.bb-workspace{display:grid;grid-template-columns:240px 1fr 280px;flex:1;min-height:0;overflow:hidden}.bb-library{display:flex;flex-direction:column;border-right:1px solid var(--bs-color-border-subtle);background:color-mix(in srgb,var(--bs-color-surface) 96%,var(--bs-color-canvas));overflow:hidden}.bb-panel-header{padding:14px 16px 10px;border-bottom:1px solid var(--bs-color-border-subtle);flex-shrink:0}.bb-panel-title{margin:0;color:var(--bs-color-text-heading);font-family:var(--bs-font-mono);font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.bb-panel-subtitle{margin:4px 0 0;color:var(--bs-color-text-muted);font-size:.78rem;line-height:1.5}.bb-library-scroll{flex:1;overflow-y:auto;padding:12px 0 16px;position:relative}.bb-lib-section{margin-bottom:4px}.bb-lib-section-header{display:flex;align-items:center;justify-content:space-between;padding:8px 16px 6px;cursor:pointer;-webkit-user-select:none;user-select:none}.bb-lib-section-header:hover .bb-lib-section-label{color:var(--bs-color-text-heading)}.bb-lib-section-label{color:var(--bs-color-text-muted);font-family:var(--bs-font-mono);font-size:.74rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;transition:color .14s ease}.bb-lib-section-toggle{width:14px;height:14px;color:var(--bs-color-text-muted);transition:transform .18s ease}.bb-lib-section.is-collapsed .bb-lib-section-toggle{transform:rotate(-90deg)}.bb-lib-section.is-collapsed .bb-lib-items{display:none}.bb-lib-items{display:grid;gap:4px;padding:2px 10px 8px}.bb-lib-tile{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--bs-color-border-subtle);border-radius:var(--bs-radius-panel);background:var(--bs-color-surface);color:var(--bs-color-text-primary);font-size:.84rem;cursor:grab;transition:box-shadow .14s ease,border-color .14s ease,transform .12s ease;-webkit-user-select:none;user-select:none}.bb-lib-tile:hover{border-color:var(--bs-color-pill-active);box-shadow:var(--bs-shadow-panel);transform:translateY(-1px)}.bb-lib-tile:active{cursor:grabbing;transform:scale(.98)}.bb-lib-tile svg{width:15px;height:15px;color:var(--bs-color-text-muted);flex-shrink:0}.bb-lib-tile-label{font-family:var(--bs-font-sans);font-size:.83rem;line-height:1}.bb-canvas-area{display:flex;flex-direction:column;align-items:center;background:var(--bs-color-canvas);overflow:auto;padding:24px;gap:0}.bb-canvas-toolbar{display:flex;align-items:center;gap:10px;width:100%;max-width:960px;margin-bottom:16px;flex-shrink:0}.bb-canvas-label{color:var(--bs-color-text-muted);font-family:var(--bs-font-mono);font-size:.78rem;text-transform:uppercase;letter-spacing:.07em;flex:1}.bb-canvas-frame{width:100%;max-width:960px;min-height:520px;border:1.5px solid var(--bs-color-border-subtle);border-radius:var(--bs-radius-modal);background:var(--bs-color-surface);box-shadow:var(--bs-shadow-elevated);position:relative;overflow:hidden;transition:max-width .22s ease}.bb-canvas-frame.is-dragover{border-color:var(--bs-color-pill-active);box-shadow:0 0 0 3px color-mix(in srgb,var(--bs-color-pill-active) 14%,transparent),var(--bs-shadow-elevated)}.bb-canvas-drop-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:60px 40px;min-height:520px;color:var(--bs-color-text-muted);text-align:center;background-image:radial-gradient(circle,var(--bs-color-border-subtle) 1px,transparent 1px);background-size:20px 20px;transition:background-color .14s ease}.bb-canvas-drop-zone.has-items{display:none}.bb-canvas-drop-icon{width:40px;height:40px;color:color-mix(in srgb,var(--bs-color-text-muted) 40%,transparent)}.bb-canvas-drop-hint{margin:0;font-family:var(--bs-font-mono);font-size:.82rem;max-width:26ch;line-height:1.6}.bb-canvas-items{display:flex;flex-direction:column;gap:0;padding:16px}.bb-canvas-item{position:relative;border-radius:var(--bs-radius-panel);padding:16px;transition:outline .1s ease;cursor:pointer}.bb-canvas-item:hover{outline:1.5px dashed var(--bs-color-border-subtle)}.bb-canvas-item.is-selected{outline:2px solid var(--bs-color-pill-active)}.bb-canvas-item-actions{position:absolute;top:-1px;right:-1px;display:none;gap:4px;background:var(--bs-color-pill-active);border-radius:0 var(--bs-radius-panel) 0 var(--bs-radius-panel);padding:3px 6px}.bb-canvas-item.is-selected .bb-canvas-item-actions{display:flex}.bb-canvas-item-action{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border:none;background:transparent;color:var(--bs-color-pill-active-contrast);cursor:pointer;opacity:.75;border-radius:3px;transition:opacity .12s ease}.bb-canvas-item-action:hover{opacity:1}.bb-canvas-item-action svg{width:13px;height:13px}.bb-inspector{display:flex;flex-direction:column;border-left:1px solid var(--bs-color-border-subtle);background:color-mix(in srgb,var(--bs-color-surface) 96%,var(--bs-color-canvas));overflow:hidden}.bb-inspector-tabs{display:flex;border-bottom:1px solid var(--bs-color-border-subtle);flex-shrink:0}.bb-inspector-tab{flex:1;padding:10px 6px;border:none;border-bottom:2px solid transparent;background:transparent;color:var(--bs-color-text-muted);font-family:var(--bs-font-mono);font-size:.76rem;font-weight:500;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;transition:color .14s ease,border-color .14s ease}.bb-inspector-tab.is-active{color:var(--bs-color-pill-active);border-bottom-color:var(--bs-color-pill-active)}.bb-inspector-scroll{flex:1;overflow-y:auto;position:relative}.bb-inspector-panel{display:none;padding:16px}.bb-inspector-panel.is-active{display:block}.bb-theme-grid{display:grid;gap:10px}.bb-theme-option{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1.5px solid var(--bs-color-border-subtle);border-radius:var(--bs-radius-panel);background:var(--bs-color-surface);cursor:pointer;transition:border-color .14s ease,box-shadow .14s ease;text-align:left;width:100%}.bb-theme-option:hover{border-color:var(--bs-color-pill-active)}.bb-theme-option.is-active{border-color:var(--bs-color-pill-active);box-shadow:0 0 0 3px color-mix(in srgb,var(--bs-color-pill-active) 12%,transparent)}.bb-theme-swatches{display:flex;gap:3px;flex-shrink:0}.bb-theme-swatch{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.08)}.bb-theme-name{color:var(--bs-color-text-heading);font-family:var(--bs-font-mono);font-size:.82rem;font-weight:600;display:block}.bb-theme-desc{color:var(--bs-color-text-muted);font-size:.75rem;margin-top:2px;display:block}.bb-active-theme-badge{margin-left:auto;flex-shrink:0}.bb-inspect-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:40px 16px;color:var(--bs-color-text-muted);text-align:center}.bb-inspect-empty svg{width:28px;height:28px;opacity:.4}.bb-inspect-empty p{margin:0;font-family:var(--bs-font-mono);font-size:.78rem;max-width:20ch;line-height:1.6}.bb-prop-group{margin-bottom:18px}.bb-prop-group-label{margin:0 0 8px;color:var(--bs-color-text-muted);font-family:var(--bs-font-mono);font-size:.72rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase}.bb-prop-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 0;border-bottom:1px solid var(--bs-color-border-subtle)}.bb-prop-row:last-child{border-bottom:none}.bb-prop-key{color:var(--bs-color-text-muted);font-family:var(--bs-font-mono);font-size:.78rem}.bb-prop-value{color:var(--bs-color-text-heading);font-family:var(--bs-font-mono);font-size:.78rem;font-weight:500}.bb-responsive-options{display:grid;gap:8px}.bb-viewport-btn{display:flex;align-items:center;gap:12px;padding:11px 14px;border:1.5px solid var(--bs-color-border-subtle);border-radius:var(--bs-radius-panel);background:var(--bs-color-surface);cursor:pointer;transition:border-color .14s ease,box-shadow .14s ease;text-align:left;width:100%}.bb-viewport-btn:hover{border-color:var(--bs-color-pill-active)}.bb-viewport-btn.is-active{border-color:var(--bs-color-pill-active);box-shadow:0 0 0 3px color-mix(in srgb,var(--bs-color-pill-active) 12%,transparent)}.bb-viewport-btn svg{width:16px;height:16px;color:var(--bs-color-text-muted);flex-shrink:0}.bb-viewport-label{color:var(--bs-color-text-heading);font-family:var(--bs-font-mono);font-size:.82rem;font-weight:600;display:block}.bb-viewport-size{color:var(--bs-color-text-muted);font-size:.75rem}.bb-section-divider{margin:16px 0 12px;padding-bottom:6px;border-bottom:1px solid var(--bs-color-border-subtle);color:var(--bs-color-text-muted);font-family:var(--bs-font-mono);font-size:.72rem;letter-spacing:.07em;text-transform:uppercase}.theme-forest{--bs-color-accent: #2d5a27;--bs-color-accent-hover: #1f3f1c;--bs-color-accent-soft: #eef5ec;--bs-color-chrome: #1e3320;--bs-color-chrome-strong: #122014;--bs-color-frame-bg: #1a2e1c;--bs-color-frame-border: #2e4a30;--bs-color-canvas: #f4f7f2;--bs-color-surface: #ffffff;--bs-color-surface-muted: #eef5ec;--bs-color-table-hover: #edf4eb;--bs-color-pill-active: #2d5a27;--bs-color-pill-active-contrast: #f8faf7;--bs-color-text-primary: #334a2f;--bs-color-text-heading: #122014;--bs-color-text-muted: #6a856a;--bs-color-text-inverse: #f8faf7;--bs-color-border-subtle: #cdddc9}.theme-ocean{--bs-color-accent: #1a4a7a;--bs-color-accent-hover: #0f3260;--bs-color-accent-soft: #eaf1fa;--bs-color-chrome: #1a2f4a;--bs-color-chrome-strong: #0e1f33;--bs-color-frame-bg: #101e30;--bs-color-frame-border: #1f3450;--bs-color-canvas: #f2f6fa;--bs-color-surface: #ffffff;--bs-color-surface-muted: #eaf1fa;--bs-color-table-hover: #e9f0f8;--bs-color-pill-active: #1a4a7a;--bs-color-pill-active-contrast: #f0f6ff;--bs-color-text-primary: #2d3f55;--bs-color-text-heading: #0e1f33;--bs-color-text-muted: #5a7394;--bs-color-text-inverse: #f0f6ff;--bs-color-border-subtle: #c8d9ec}.theme-ember{--bs-color-accent: #8c3a1a;--bs-color-accent-hover: #6b2c12;--bs-color-accent-soft: #faf0ea;--bs-color-chrome: #2e1a10;--bs-color-chrome-strong: #1c0f08;--bs-color-frame-bg: #26150c;--bs-color-frame-border: #40231a;--bs-color-canvas: #faf6f2;--bs-color-surface: #ffffff;--bs-color-surface-muted: #faf0ea;--bs-color-table-hover: #f8ede3;--bs-color-pill-active: #8c3a1a;--bs-color-pill-active-contrast: #fdf8f5;--bs-color-text-primary: #4a2e1e;--bs-color-text-heading: #1c0f08;--bs-color-text-muted: #8c6050;--bs-color-text-inverse: #fdf8f5;--bs-color-border-subtle: #e8cfc0}.dark.theme-forest,.dark .theme-forest{--bs-color-frame-bg: #0d1a0f;--bs-color-frame-border: #253c27;--bs-color-canvas: #0f1f12;--bs-color-surface: #16281a;--bs-color-surface-muted: #1d3322;--bs-color-table-hover: #1b3020;--bs-color-pill-active: #d4edcf;--bs-color-pill-active-contrast: #0d1a0f;--bs-color-text-primary: #c8ddc4;--bs-color-text-heading: #edf5eb;--bs-color-text-muted: #7aaa78;--bs-color-border-subtle: #2a4a2e}.dark.theme-ocean,.dark .theme-ocean{--bs-color-frame-bg: #080f1a;--bs-color-frame-border: #172840;--bs-color-canvas: #0c1524;--bs-color-surface: #121e30;--bs-color-surface-muted: #182438;--bs-color-table-hover: #172337;--bs-color-pill-active: #c8dff5;--bs-color-pill-active-contrast: #080f1a;--bs-color-text-primary: #c0d4e8;--bs-color-text-heading: #e8f1fa;--bs-color-text-muted: #6a90b8;--bs-color-border-subtle: #1e3050}.dark.theme-ember,.dark .theme-ember{--bs-color-frame-bg: #120800;--bs-color-frame-border: #2e1406;--bs-color-canvas: #160a02;--bs-color-surface: #1e0f06;--bs-color-surface-muted: #28160a;--bs-color-table-hover: #241308;--bs-color-pill-active: #f5c4a6;--bs-color-pill-active-contrast: #120800;--bs-color-text-primary: #ddc0ad;--bs-color-text-heading: #faf0e8;--bs-color-text-muted: #b08060;--bs-color-border-subtle: #3a1a0a}.bb-view{display:none;flex:1;overflow:auto}.bb-view.is-active{display:flex;flex-direction:column}.bb-themes-view{padding:32px}.bb-themes-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:900px}.bb-theme-card{border:1.5px solid var(--bs-color-border-subtle);border-radius:var(--bs-radius-modal);background:var(--bs-color-surface);overflow:hidden;box-shadow:var(--bs-shadow-panel);cursor:pointer;transition:box-shadow .18s ease,transform .18s ease,border-color .18s ease}.bb-theme-card:hover{box-shadow:var(--bs-shadow-elevated);transform:translateY(-2px)}.bb-theme-card.is-active{border-color:var(--bs-color-pill-active);box-shadow:0 0 0 3px color-mix(in srgb,var(--bs-color-pill-active) 14%,transparent)}.bb-theme-preview{height:130px;padding:16px;display:flex;flex-direction:column;gap:10px}.bb-theme-preview-bar{height:10px;border-radius:999px;opacity:.85}.bb-theme-preview-btn{align-self:flex-start;height:24px;width:72px;border-radius:5px;opacity:.9}.bb-theme-preview-text{height:8px;border-radius:999px;opacity:.3;width:80%}.bb-theme-preview-text-sm{height:8px;border-radius:999px;opacity:.2;width:55%}.bb-theme-card-meta{padding:14px 16px;border-top:1px solid var(--bs-color-border-subtle);background:color-mix(in srgb,var(--bs-color-surface) 92%,var(--bs-color-canvas));display:flex;align-items:center;justify-content:space-between;gap:12px}.bb-theme-card-name{color:var(--bs-color-text-heading);font-family:var(--bs-font-mono);font-size:.88rem;font-weight:600}.bb-theme-card-tag{color:var(--bs-color-text-muted);font-family:var(--bs-font-mono);font-size:.74rem}.bb-kitchen-view{padding:32px;overflow:auto}.bb-kitchen-stack{display:grid;gap:24px;max-width:820px}.bb-preview-view{padding:24px;align-items:center;overflow:auto;background:var(--bs-color-canvas)}.bb-preview-frame{width:100%;max-width:960px;border:1.5px solid var(--bs-color-border-subtle);border-radius:var(--bs-radius-modal);background:var(--bs-color-surface);box-shadow:var(--bs-shadow-elevated);overflow:hidden;transition:max-width .22s ease}.bb-preview-content{padding:32px;display:grid;gap:24px}@media(max-width:1100px){.bb-workspace{grid-template-columns:200px 1fr 240px}}@media(max-width:860px){.bb-workspace{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.bb-library,.bb-inspector{border:none;border-bottom:1px solid var(--bs-color-border-subtle)}}