:root{--bb-red: #c8102e;--bb-red-soft: rgba(200, 16, 46, .14);--bb-dark: #1a1a1a;--bb-darker: #111;--bb-card: #222;--bb-card-elevated: #282828;--bb-border: #333;--bb-border-strong: #444;--bb-text: #e0e0e0;--bb-text-dim: #888;--bb-green: #22c55e;--bb-yellow: #eab308;--bb-blue: #3b82f6;--bb-orange: #f97316;--bb-sidebar-width: 290px;--bb-shadow: 0 12px 36px rgba(0, 0, 0, .35)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{min-height:100%}body{font-family:Segoe UI,system-ui,sans-serif;background:radial-gradient(circle at top,rgba(200,16,46,.1),transparent 28%),linear-gradient(180deg,#171717,#0f0f0f);color:var(--bb-text)}button,input,select,textarea{font:inherit}.app-layout{display:flex;min-height:100vh}.sidebar{width:var(--bb-sidebar-width);background:linear-gradient(180deg,#1a1a1afa,#111111fa);border-right:1px solid var(--bb-border);display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;overflow-y:auto;z-index:100}.sidebar-header{padding:18px 16px;border-bottom:1px solid var(--bb-border);text-align:center}.sidebar-summary{padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.04)}.sidebar-summary-title{font-size:11px;color:var(--bb-text);font-weight:700;text-transform:uppercase;letter-spacing:.5px}.sidebar-summary-copy{margin-top:4px;font-size:12px;color:var(--bb-text-dim)}.sidebar-title{font-size:14px;font-weight:700;color:var(--bb-red);letter-spacing:1px;text-transform:uppercase}.sidebar-version{font-size:11px;color:var(--bb-text-dim)}.sidebar-section{padding:12px 0}.sidebar-section-title{padding:0 16px 8px;font-size:10px;font-weight:600;color:var(--bb-text-dim);text-transform:uppercase;letter-spacing:1px}.nav-btn{display:flex;align-items:center;gap:10px;width:100%;padding:10px 16px;border:none;background:transparent;color:var(--bb-text);font-size:13px;cursor:pointer;text-align:left;transition:background .15s,color .15s}.nav-btn:hover{background:#ffffff0d}.nav-btn.active{background:var(--bb-red);color:#fff;font-weight:600}.nav-icon{font-size:16px;width:20px;text-align:center}.nav-btn.nested{padding-left:20px;font-size:12px}.nav-item-left{display:flex;align-items:center;gap:10px}.sidebar-group{border-bottom:1px solid rgba(255,255,255,.04)}.sidebar-group.active{background:#ffffff04}.sidebar-group-toggle{width:100%;border:none;background:transparent;color:var(--bb-text);cursor:pointer;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left}.sidebar-group-toggle:hover{background:#ffffff0a}.sidebar-group-left,.sidebar-group-right{display:flex;align-items:center;gap:10px}.sidebar-group-icon{width:18px;text-align:center}.sidebar-group-label{font-size:13px;font-weight:700}.sidebar-group-chevron{color:var(--bb-text-dim);font-size:12px}.sidebar-group-items{padding:0 8px 10px}.status-light{display:inline-block;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 3px #ffffff08}.status-light.healthy{background:var(--bb-green)}.status-light.attention{background:var(--bb-yellow)}.status-light.warning,.status-light.offline{background:var(--bb-red)}.status-light.planned{background:var(--bb-blue)}.main-content{margin-left:var(--bb-sidebar-width);flex:1;padding:24px;min-height:100vh}.page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px}.page-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.page-title{font-size:22px;font-weight:700}.page-subtitle{font-size:12px;color:var(--bb-text-dim);margin-top:4px}.card{background:linear-gradient(180deg,#222222fa,#191919fa);border:1px solid var(--bb-border);border-radius:10px;padding:16px;margin-bottom:16px;box-shadow:var(--bb-shadow)}.card-title{font-size:13px;font-weight:600;color:var(--bb-text-dim);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px}.stats-grid,.tile-grid,.panel-grid{display:grid;gap:12px;margin-bottom:20px}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.tile-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.panel-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.split-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.stat-card{background:#222222e6;border:1px solid var(--bb-border);border-radius:8px;padding:14px}.stat-label{font-size:11px;color:var(--bb-text-dim);text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:24px;font-weight:700;margin-top:4px}.stat-value.green{color:var(--bb-green)}.stat-value.yellow{color:var(--bb-yellow)}.stat-value.red{color:var(--bb-red)}.stat-value.blue{color:var(--bb-blue)}.data-table{width:100%;border-collapse:collapse;font-size:13px}.data-table th{text-align:left;padding:8px 12px;background:var(--bb-dark);color:var(--bb-text-dim);font-size:11px;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--bb-border);position:sticky;top:0}.data-table td{padding:8px 12px;border-bottom:1px solid var(--bb-border);vertical-align:top}.data-table tr:hover td{background:#ffffff05}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;text-transform:uppercase}.badge.green{background:#22c55e26;color:var(--bb-green)}.badge.yellow{background:#eab30826;color:var(--bb-yellow)}.badge.red{background:#c8102e26;color:var(--bb-red)}.badge.blue{background:#3b82f626;color:var(--bb-blue)}.badge.gray{background:#88888826;color:var(--bb-text-dim)}.btn,.refresh-btn,.select-input,.text-input,.text-area{border-radius:6px;border:1px solid var(--bb-border)}.btn,.refresh-btn{cursor:pointer;transition:opacity .15s,border-color .15s,color .15s,background .15s}.btn{padding:8px 16px;font-size:13px;font-weight:600}.btn:hover,.refresh-btn:hover{opacity:.9}.btn:disabled,.refresh-btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--bb-red);color:#fff;border-color:var(--bb-red)}.btn-secondary{background:var(--bb-border);color:var(--bb-text)}.btn-sm{padding:5px 10px;font-size:11px}.refresh-btn{background:transparent;color:var(--bb-text-dim);padding:6px 12px;font-size:12px}.refresh-btn:hover{border-color:var(--bb-border-strong);color:var(--bb-text)}.tab-bar{display:flex;gap:6px;margin-bottom:16px;border-bottom:1px solid var(--bb-border);padding-bottom:8px;flex-wrap:wrap}.tab-btn{padding:6px 14px;border:1px solid transparent;background:transparent;color:var(--bb-text-dim);font-size:13px;cursor:pointer;border-radius:999px}.tab-btn:hover{color:var(--bb-text);border-color:var(--bb-border)}.tab-btn.active{color:#fff;background:var(--bb-red);border-color:var(--bb-red)}.json-pre{background:var(--bb-dark);padding:12px;border-radius:6px;font-size:12px;font-family:monospace;overflow-x:auto;max-height:300px;overflow-y:auto;color:var(--bb-text-dim)}.detail-row{display:grid;grid-template-columns:minmax(140px,220px) minmax(0,1fr);padding:6px 0;border-bottom:1px solid rgba(255,255,255,.03);font-size:13px;gap:12px;align-items:start}.detail-label{width:auto;min-width:0;color:var(--bb-text-dim);flex-shrink:0;overflow-wrap:anywhere}.detail-value{min-width:0;word-break:normal;overflow-wrap:break-word;white-space:normal}.detail-row>.detail-value:only-child{grid-column:1 / -1}.loading,.empty-state{color:var(--bb-text-dim);padding:20px;text-align:center}.loading{font-style:italic}.empty-state{border:1px dashed var(--bb-border);border-radius:8px}.ts{color:var(--bb-text-dim);font-size:12px;font-family:monospace}.inline-notice{padding:10px 12px;border-radius:8px;border:1px solid var(--bb-border);background:#ffffff0a;font-size:12px;margin-bottom:12px}.inline-notice.success{border-color:#22c55e73;background:#22c55e14;color:var(--bb-green)}.inline-notice.error{border-color:#c8102e73;background:#c8102e14;color:#ff9aa8}.inline-notice.warning{border-color:#eab30873;background:#eab30814;color:#f7d774}.inline-notice.info{border-color:#3b82f673;background:#3b82f614;color:#92c5ff}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.field-label{font-size:12px;color:var(--bb-text-dim)}.field-hint{font-size:11px;color:var(--bb-text-dim)}.text-input,.select-input,.text-area{width:100%;background:var(--bb-dark);color:var(--bb-text);padding:8px 10px}.text-area{min-height:100px;resize:vertical}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b8;display:flex;align-items:center;justify-content:center;z-index:1000;padding:16px}.modal-card{background:var(--bb-card-elevated);border:1px solid var(--bb-border-strong);border-radius:12px;box-shadow:var(--bb-shadow);max-width:100%}.modal-header,.modal-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px}.modal-header{border-bottom:1px solid var(--bb-border)}.modal-actions{border-top:1px solid var(--bb-border);justify-content:flex-end}.modal-title{font-size:16px;font-weight:700}.modal-body{padding:18px}.icon-btn{border:none;background:transparent;color:var(--bb-text-dim);cursor:pointer;font-size:24px;line-height:1}.launch-tile{display:block;text-decoration:none;color:inherit;background:var(--bb-dark);border:1px solid var(--bb-border);border-radius:10px;padding:16px;transition:transform .15s,border-color .15s}.launch-tile:hover{transform:translateY(-1px);border-color:var(--bb-red)}.launch-tile.disabled{opacity:.7}.launch-tile-title{font-weight:700;font-size:14px;margin-bottom:4px}.launch-tile-copy,.launch-tile-note{font-size:12px;color:var(--bb-text-dim)}.launch-tile-note{margin-top:10px}.pin-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background:radial-gradient(circle at top,rgba(200,16,46,.16),transparent 26%),var(--bb-darker)}.pin-title{font-size:18px;font-weight:700;color:var(--bb-red);margin-bottom:8px}.pin-subtitle,.pin-footnote{font-size:13px;color:var(--bb-text-dim)}.pin-subtitle{margin-bottom:24px}.pin-footnote{margin-top:16px}.pin-dots{display:flex;gap:12px;margin-bottom:24px}.pin-dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--bb-border)}.pin-dot.filled{background:var(--bb-red);border-color:var(--bb-red)}.pin-grid{display:grid;grid-template-columns:repeat(3,64px);gap:10px}.pin-key{width:64px;height:56px;border:1px solid var(--bb-border);border-radius:8px;background:var(--bb-card);color:var(--bb-text);font-size:20px;font-weight:600;cursor:pointer}.pin-key:hover{background:var(--bb-border)}.pin-error{color:#ff9aa8;font-size:13px;margin-top:16px}.bbscan-page{display:flex;flex-direction:column;gap:16px}.bbscan-feed{display:flex;flex-direction:column;gap:14px}.bbscan-attempt{padding:14px}.bbscan-attempt-header{display:grid;grid-template-columns:minmax(280px,1.6fr) minmax(220px,1fr) auto;gap:14px;align-items:start}.bbscan-attempt-summary{display:flex;gap:12px;align-items:flex-start}.bbscan-attempt-rank{min-width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#c8102e29;color:#fff;font-weight:800;border:1px solid rgba(200,16,46,.45)}.bbscan-attempt-title-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.bbscan-attempt-title{font-size:14px;font-weight:700;color:var(--bb-text)}.bbscan-attempt-subtitle{margin-top:4px;font-size:12px;color:var(--bb-text-dim)}.bbscan-attempt-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;font-size:12px}.bbscan-attempt-meta span{display:block;color:var(--bb-text-dim);font-size:10px;text-transform:uppercase;letter-spacing:.4px;margin-bottom:2px}.bbscan-attempt-meta b{color:var(--bb-text);font-weight:600}.bbscan-attempt-actions{display:flex;justify-content:flex-end}.bbscan-attempt-body{margin-top:14px;display:flex;flex-direction:column;gap:14px}.bbscan-thumb-panel{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;align-items:start}.bbscan-thumb{width:120px;height:120px;object-fit:cover;border-radius:12px;border:1px solid var(--bb-border);background:var(--bb-dark)}.bbscan-thumb-empty{display:grid;place-items:center;color:var(--bb-text-dim);font-size:11px}.bbscan-thumb-copy{min-width:0}.bbscan-thumb-title{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--bb-text-dim);margin-bottom:4px}.bbscan-thumb-text{font-size:13px;color:var(--bb-text);line-height:1.4}.bbscan-thumb-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.bbscan-lane-stack{display:flex;flex-direction:column;gap:10px}.bbscan-lane-wrap{border:1px solid var(--bb-border);border-radius:12px;background:#00000014;padding:10px 12px 12px}.bbscan-lane-title{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--bb-text-dim);margin-bottom:8px}.bbscan-lane{position:relative;min-height:56px;overflow:hidden}.bbscan-lane-track{position:absolute;left:2%;right:2%;top:27px;height:2px;background:linear-gradient(90deg,#ffffff1a,#c8102e73,#ffffff1a)}.bbscan-lane-empty{position:relative;z-index:1;color:var(--bb-text-dim);font-size:12px;padding-top:14px}.bbscan-marker{position:absolute;top:6px;z-index:2;display:flex;flex-direction:column;align-items:center;transform:translate(-50%);max-width:120px;text-align:center}.bbscan-marker-dot{width:12px;height:12px;border-radius:999px;border:2px solid rgba(255,255,255,.35);box-shadow:0 0 0 4px #ffffff08;background:var(--bb-border-strong)}.bbscan-marker-label{margin-top:4px;font-size:10px;line-height:1.2;color:var(--bb-text)}.bbscan-marker.good .bbscan-marker-dot{background:var(--bb-green)}.bbscan-marker.warn .bbscan-marker-dot{background:var(--bb-yellow)}.bbscan-marker.bad .bbscan-marker-dot{background:var(--bb-red)}.bbscan-expanded{display:flex;flex-direction:column;gap:14px}.bbscan-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.bbscan-detail-card{margin-bottom:0}.bbscan-junctures{display:flex;flex-direction:column;gap:8px}.bbscan-juncture{border:1px solid var(--bb-border);border-radius:10px;padding:8px 10px;background:#ffffff05}.bbscan-juncture.good{border-color:#22c55e59}.bbscan-juncture.warn{border-color:#eab30859}.bbscan-juncture.bad{border-color:#c8102e59}.bbscan-juncture-label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--bb-text-dim);margin-bottom:2px}.bbscan-juncture-title{display:block;font-size:12px;color:var(--bb-text);word-break:break-word}.bbscan-debug-strip{margin-bottom:0}.bbscan-debug-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.bbscan-debug-slot{min-height:100px}.bbscan-debug-image{width:100%;height:100px;object-fit:cover;border-radius:10px;border:1px solid var(--bb-border);background:var(--bb-dark)}.bbscan-debug-empty{min-height:100px;display:grid;place-items:center;border-radius:10px;border:1px dashed var(--bb-border);color:var(--bb-text-dim);font-size:11px}@media(max-width:980px){.sidebar{position:sticky;height:100vh}.main-content{padding:18px}.split-grid,.bbscan-attempt-header,.bbscan-detail-grid{grid-template-columns:1fr}.bbscan-debug-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:800px){.app-layout{flex-direction:column}.sidebar{position:static;width:100%;height:auto;max-height:none}.main-content{margin-left:0}.page-header{flex-direction:column}.page-actions{width:100%}.bbscan-thumb-panel{grid-template-columns:1fr}.bbscan-thumb{width:100%;height:180px}.bbscan-debug-grid{grid-template-columns:1fr}}.credential-detail-panel{display:flex;flex-wrap:wrap;width:100%;min-width:0;gap:16px;align-items:start}.credential-detail-panel .detail-section{min-width:0;flex:1 1 280px}.credential-detail-panel .detail-field{display:grid;grid-template-columns:minmax(140px,160px) minmax(0,1fr);gap:12px;align-items:start;margin-bottom:10px}.credential-detail-panel .detail-label{width:auto;min-width:0;flex-shrink:0;white-space:normal;overflow-wrap:anywhere}.credential-detail-panel .detail-value{min-width:0;overflow-wrap:break-word;word-break:normal;white-space:normal;line-height:1.35}.credential-detail-panel .page-subtitle{overflow-wrap:anywhere}@media(max-width:1100px){.credential-detail-panel{grid-template-columns:1fr}.credential-detail-panel .detail-field{grid-template-columns:130px minmax(0,1fr)}}