/* A little repair theatre. Scoped to the aside so existing UI stays untouched. */
.repair-ballet { --rb-ink:#e8eef6; --rb-muted:#99a8bc; --rb-blue:#a9c9f4; position:relative; isolation:isolate; scroll-margin-top:85px; max-width:1200px; margin:28px auto 65px; min-height:520px; color:var(--rb-ink); overflow:hidden; background:#0d1117; border-block:1px solid #b9d1f018; }
.repair-ballet *, .repair-ballet *::before, .repair-ballet *::after { box-sizing:border-box; }
.rb-copy { position:absolute; z-index:2; left:44px; top:50%; transform:translateY(-54%); width:225px; pointer-events:none; }
.rb-copy .rb-kicker { display:block; color:var(--rb-blue); font:600 9px/1.6 Inter,sans-serif; letter-spacing:.19em; text-transform:uppercase; margin-bottom:20px; }
.rb-copy h2 { font-family:MuseoModerno,Inter,sans-serif !important; font-size:42px !important; font-weight:400 !important; line-height:1.14; letter-spacing:-.05em; color:var(--rb-ink); margin:0 0 18px; }
.rb-copy p { font:400 12px/1.8 Inter,sans-serif; color:var(--rb-muted); margin:0; max-width:180px; }
.rb-stage { position:relative; margin-left:240px; height:465px; }
.rb-stage canvas { display:block; width:100%; height:100%; touch-action:pan-y; }
.rb-fallback { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:28px; transition:opacity .5s; }
.repair-ballet[data-rendered="true"] .rb-fallback { opacity:0; pointer-events:none; }
.rb-caption { display:flex; align-items:center; gap:8px; position:absolute; top:28px; right:32px; color:#8595aa; font:500 8px/1.4 Inter,sans-serif; letter-spacing:.16em; text-transform:uppercase; pointer-events:none; }
.rb-caption::before { content:''; width:4px; height:4px; border-radius:50%; background:#a9c9f4; }
.rb-controls { display:flex; align-items:center; gap:20px; margin:0 36px 26px 284px; padding-top:18px; border-top:1px solid #b9d1f01a; }
.rb-transport { display:flex; gap:6px; flex-shrink:0; }
.rb-controls button { display:grid; place-items:center; width:38px; height:38px; padding:0; border:1px solid #b9d1f029; border-radius:50%; background:transparent; color:#c5d7ed; cursor:pointer; transition:background .2s,border-color .2s; }
.rb-controls button:hover { background:#a9c9f414; border-color:#b9d1f050; }
.rb-controls button svg { width:13px; height:13px; fill:currentColor; }
.rb-controls button:disabled { opacity:.4; cursor:default; }
.rb-scrubber { display:flex; flex:1; align-items:center; gap:12px; min-width:0; }
.rb-scrubber span { font:500 9px/1.4 Inter,sans-serif; color:var(--rb-muted); }
.rb-scrubber span:last-child { color:var(--rb-blue); }
.rb-scrubber input { --rb-fill:0%; appearance:none; -webkit-appearance:none; height:32px; width:100%; min-width:40px; cursor:ew-resize; background:transparent; border:0; margin:0; padding:0; accent-color:#b9d5f8; }
.rb-scrubber input::-webkit-slider-runnable-track { height:2px; background:linear-gradient(to right,#a9c9f4 var(--rb-fill),#ffffff20 var(--rb-fill)); border-radius:2px; }
.rb-scrubber input::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:12px; height:12px; margin-top:-5px; background:#d6e7fe; border:2px solid #9abbe6; border-radius:50%; }
.rb-scrubber input::-moz-range-track { height:2px; background:#ffffff20; border-radius:2px; }
.rb-scrubber input::-moz-range-progress { height:2px; background:#a9c9f4; }
.rb-scrubber input::-moz-range-thumb { width:9px; height:9px; background:#d6e7fe; border:2px solid #9abbe6; border-radius:50%; }
.rb-scrubber input:disabled { cursor:default; opacity:.4; }
.rb-phase { position:absolute; left:44px; bottom:33px; color:#72849b; font:400 9px/1.5 Inter,sans-serif; letter-spacing:.015em; }
.rb-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.repair-ballet[data-state="unavailable"] .rb-controls, .repair-ballet[data-state="unavailable"] .rb-caption { display:none; }
@media(max-width:900px) {
 .repair-ballet { margin-inline:24px; }
 .rb-copy { left:24px; width:190px; }
 .rb-copy h2 { font-size:34px !important; }
 .rb-stage { margin-left:190px; }
 .rb-controls { margin-left:215px; margin-right:24px; gap:12px; }
 .rb-phase { left:24px; max-width:170px; }
}
@media(max-width:600px) {
 .repair-ballet { min-height:540px; margin:20px 20px 45px; }
 .rb-copy { position:relative; top:auto; left:auto; transform:none; padding:28px 20px 0; width:auto; }
 .rb-copy .rb-kicker { font-size:8px; margin-bottom:12px; }
 .rb-copy h2 { font-size:30px !important; margin-bottom:8px; }
 .rb-copy h2 br { display:none; }
 .rb-copy p { max-width:100%; font-size:11px; }
 .rb-stage { margin-left:0; height:335px; }
 .rb-caption { top:15px; right:20px; font-size:7px; }
 .rb-controls { margin:0 20px 46px; gap:10px; padding-top:10px; }
 .rb-controls button { width:36px; height:36px; }
 .rb-scrubber { gap:6px; }
 .rb-scrubber span { font-size:8px; }
 .rb-phase { bottom:19px; left:20px; max-width:none; font-size:8px; }
}
@media(prefers-reduced-motion:reduce) { .repair-ballet * { transition:none !important; } }

/* Use the browser keyboard indicator instead of the site-wide decorative ring. */
.rb-controls :focus-visible { outline:revert; box-shadow:none; }
@media(max-width:360px) { .rb-controls { margin-inline:12px; } .rb-transport { gap:4px; } .rb-controls button { width:32px; height:32px; } .rb-scrubber span { font-size:7px; } }

/* The quiet caption is also the keyboard-accessible entrance to inspection. */
button.rb-caption { border:0; padding:10px 0 10px 10px; background:transparent; cursor:pointer; pointer-events:auto; transition:color .2s; }
button.rb-caption:hover { color:#d6e7fe; }
button.rb-caption:disabled { visibility:hidden; }
.rb-stage canvas { cursor:zoom-in; }
.rb-inspector { --rb-muted:#99a8bc; --rb-blue:#a9c9f4; width:min(1200px,calc(100vw - 48px)); height:min(900px,calc(100dvh - 48px)); max-width:none; max-height:none; margin:auto; padding:0; border:1px solid #b9d1f028; border-radius:16px; background:#0d1117; color:#e8eef6; box-shadow:0 30px 120px #0009; overflow:hidden; }
.rb-inspector[open] { display:grid; grid-template-rows:auto minmax(0,1fr) auto; }
.rb-inspector::backdrop { background:#06090fde; backdrop-filter:blur(12px); }
.rb-inspector * { box-sizing:border-box; }
.rb-inspector button { color:inherit; font-family:Inter,sans-serif; cursor:pointer; }
.rb-inspector :focus-visible, button.rb-caption:focus-visible { outline:revert; box-shadow:none; }
.rbi-header { display:flex; align-items:center; justify-content:space-between; padding:23px 28px 18px; border-bottom:1px solid #b9d1f014; }
.rbi-kicker { display:block; font:500 8px/1.5 Inter,sans-serif; letter-spacing:.18em; text-transform:uppercase; color:#a9c9f4; margin-bottom:6px; }
.rbi-header h2 { font:400 26px/1.2 MuseoModerno,Inter,sans-serif; letter-spacing:-.04em; margin:0; }
.rbi-close { width:44px; height:44px; border:1px solid #b9d1f02b; border-radius:50%; background:transparent; font-size:27px; font-weight:300; }
.rbi-close:hover { background:#a9c9f415; }
.rbi-viewport { position:relative; min-height:0; overflow:hidden; background:radial-gradient(ellipse at 50% 45%,#131c2a 0%,#0d1117 65%); }
.rb-inspector .rb-stage { width:100%; height:100%; margin:0; }
.rb-inspector .rb-stage canvas { cursor:grab; touch-action:none; }
.rb-inspector .rb-stage canvas:active { cursor:grabbing; }
.rb-inspector .rb-caption { display:none; }
.rbi-hint { position:absolute; left:28px; top:17px; margin:0; pointer-events:none; font:400 10px/1.5 Inter,sans-serif; color:#72849b; }
.rbi-tools { position:absolute; right:22px; bottom:16px; display:flex; gap:5px; padding:4px; border:1px solid #b9d1f018; border-radius:30px; background:#0d1117dc; }
.rbi-tools button { border:0; border-radius:50%; width:36px; height:36px; background:transparent; font-size:21px; }
.rbi-tools button:hover { background:#a9c9f416; }
.rbi-footer { padding:0 28px 22px; border-top:1px solid #b9d1f018; }
.rbi-parts { display:flex; gap:21px; overflow-x:auto; padding:16px 0 14px; scrollbar-width:thin; scrollbar-color:#344152 transparent; }
.rbi-parts button { flex-shrink:0; position:relative; padding:5px 0 8px; border:0; background:transparent; font:500 11px/1.4 Inter,sans-serif; color:#8c9caf; white-space:nowrap; }
.rbi-parts button[aria-pressed="true"] { color:#d6e7fe; }
.rbi-parts button[aria-pressed="true"]::after { content:''; position:absolute; bottom:0; left:0; right:0; height:1px; background:#a9c9f4; }
.rbi-parts button:hover { color:#d6e7fe; }
.rbi-bottom { display:flex; align-items:center; gap:32px; justify-content:space-between; }
.rbi-description { flex:1; min-height:62px; max-width:440px; }
.rbi-description h3 { font:500 13px/1.5 Inter,sans-serif; color:#e8eef6; margin:0 0 3px; }
.rbi-description p { font:400 11px/1.7 Inter,sans-serif; color:#8c9caf; margin:0; }
.rbi-scrubber { flex:0 1 330px; }
@media(max-width:600px) {
 .rb-inspector { width:100vw; height:100dvh; border:0; border-radius:0; }
 .rbi-header { padding:calc(16px + env(safe-area-inset-top)) 20px 14px; }
 .rbi-header h2 { font-size:22px; }
 .rbi-hint { left:20px; top:12px; font-size:9px; }
 .rbi-tools { right:15px; bottom:10px; }
 .rbi-tools button { width:40px; height:40px; }
 .rbi-footer { padding:0 20px calc(16px + env(safe-area-inset-bottom)); }
 .rbi-parts { gap:20px; padding:12px 0; }
 .rbi-bottom { display:block; }
 .rbi-description { min-height:63px; }
 .rbi-scrubber { margin-top:9px; }
}
@media(max-height:600px) and (min-width:601px) {
 .rb-inspector { width:100vw; height:100dvh; border-radius:0; }
 .rbi-header { padding:10px 22px; }
 .rbi-kicker { display:none; }
 .rbi-header h2 { font-size:21px; }
 .rbi-footer { padding-bottom:12px; }
 .rbi-description { min-height:0; }
}
@media(prefers-reduced-motion:reduce) { .rb-inspector * { transition:none !important; } }
.rb-inspector .rb-fallback { display:none; }
/* Keep the horizontal component strip inside the modal's grid track on phones. */
.rb-inspector[open] { grid-template-columns:minmax(0,1fr); }
.rbi-header, .rbi-viewport, .rbi-footer, .rbi-parts { min-width:0; }
.rbi-parts { max-width:100%; }

.rbi-touch-hint { display:none; }
@media(pointer:coarse) { .rbi-touch-hint { display:inline; } .rbi-desktop-hint { display:none; } }
@media(max-height:450px) and (min-width:601px) {
 .rbi-parts { padding:5px 0; }
 .rbi-description p { display:none; }
 .rbi-header { padding-block:5px; }
}