/* SPDX-License-Identifier: Apache-2.0 */
/* LindiSims Rally Drawer concept component. Standalone, no dependencies. */
.ls-rally-drawer {
  --rally-text: #f3f8ff;
  --rally-focus: #a0e9ff;
  --rally-muted: #b9cee0;
  --rally-panel: #07192a;
  --rally-handle-text: #343b40;
  --rally-handle-fill: #f4e6a2;
  width: min(360px, calc(100vw - 24px));
  max-width: 100%;
  position: relative;
  z-index: 5;
  color: var(--rally-text);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.ls-rally-drawer > summary {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  padding: 0 24px 6px;
  box-sizing: border-box;
  border: 0;
  background: transparent url("/assets/rally-drawer-shell.svg") center 1px / 100% calc(100% - 4px) no-repeat;
  color: var(--rally-handle-text);
  font-size: 13.5px;
  font-weight: 720;
  letter-spacing: -.15px;
  line-height: 1.15;
  white-space: nowrap;
  cursor: pointer;
  list-style: none;
  text-shadow: none;
  filter: drop-shadow(0 3px 5px rgb(0 0 0 / 20%));
  transition: filter 160ms ease;
}
.ls-rally-drawer > summary::-webkit-details-marker {display:none;}
.ls-rally-drawer > summary::marker {content:"";}
.ls-rally-drawer > summary:hover {filter: drop-shadow(0 4px 6px rgb(0 0 0 / 26%));}
.ls-rally-drawer > summary:focus-visible {
  outline: 3px solid var(--rally-focus);
  outline-offset: 3px;
  border-radius: 0 0 26px 26px;
}
.ls-rally-drawer__flag {width: 22px;height: 22px;flex: 0 0 22px;object-fit:contain;}
.ls-rally-drawer__divider {display: block;width: 1px;height: 19px;flex: 0 0 1px;background: linear-gradient(to bottom, transparent, #71adb4 40%, #71adb4 60%, transparent);opacity:.45;}
.ls-rally-drawer__label {min-width:0;flex: 0 1 auto;white-space:normal;}
.ls-rally-drawer__chevron {width: 14px;height: 14px;flex:0 0 14px; margin-left: auto;transition:transform 160ms ease;}
.ls-rally-drawer[open] .ls-rally-drawer__chevron {transform:rotate(180deg);}
.ls-rally-drawer__panel {
  margin: -2px 14px 0;
  padding: 18px 18px 16px;
  background: linear-gradient(160deg, #0c2940, var(--rally-panel));
  border: 1px solid #24618a;
  border-top-color: #1b4964;
  border-radius: 0 0 14px 14px;
  box-shadow: 0 12px 28px #010813c9, inset 0 1px 0 #67d9ff27;
  font-size: 13px;
  line-height: 1.48;
}
.ls-rally-drawer__panel p {margin:0;color:var(--rally-muted);}
.ls-rally-drawer__panel a {color:#86dbff;text-decoration:underline;text-underline-offset:3px;}
.ls-rally-drawer__panel a:focus-visible {outline:3px solid var(--rally-focus);outline-offset:3px;}
@media (max-width: 620px) {
  .ls-rally-drawer > summary {min-height:48px;padding:0 24px 6px;gap:10px;font-size:13.5px;}
}
@media (prefers-reduced-motion: reduce) {
  .ls-rally-drawer > summary, .ls-rally-drawer__chevron {transition:none;}
}

/* Site integration preserves the supplied shell; the handle follows the lower edge. */
.ls-rally-drawer{width:100%;position:relative;z-index:25}
.ls-rally-drawer>summary{width:min(280px,calc(100% - 24px));margin-inline:auto}
.ls-rally-drawer:not([open])>summary{position:absolute;top:0;left:50%;transform:translateX(-50%)}
.ls-rally-drawer[open]{display:flex;flex-direction:column}
.ls-rally-drawer[open]>summary{order:2}
.ls-rally-drawer__panel{order:1;width:min(1282px,calc(100% - 48px));margin:0 auto;padding:0;background:#07192a;border-radius:0}
.rally-viewport{position:relative;aspect-ratio:16/9;width:100%;background:#030b13}
.rally-viewport:has(.rally-welcome:not([hidden])){aspect-ratio:auto}
.rally-frame-host{position:absolute;inset:0}
.rally-frame-host,.rally-frame-host iframe{width:100%;height:100%}
.rally-frame-host iframe{display:block;border:0}
.rally-welcome{position:relative;width:100%;aspect-ratio:16/9;min-height:240px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:24px;gap:15px;background:linear-gradient(145deg,#0c2940,#07192a)}
.rally-welcome[hidden]{display:none}
.rally-welcome h2{margin:0;font-size:clamp(20px,3vw,34px)}
.rally-start{border:1px solid #4dd8ff;border-radius:7px;background:#086c91;color:#f3f8ff;font-weight:700;min-height:44px;padding:10px 24px;cursor:pointer}
.rally-info{padding:14px 18px;display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;align-items:center;font-size:13px;line-height:1.5}
.rally-status{margin:0;flex:1 1 280px;color:#c7dcec}
.rally-controls-note{padding:0 18px 14px;color:#b9cee0;font-size:13px;line-height:1.5}
.rally-close{border:1px solid #386889;background:#0b1b2c;color:#e6eaf0;padding:8px 14px;min-height:44px;border-radius:7px;cursor:pointer}
@media(max-width:980px){.ls-rally-drawer:not([open])>summary{position:relative;left:auto;transform:none}.ls-rally-drawer__panel{width:calc(100% - 24px)}}
@media(prefers-reduced-motion:reduce){.ls-rally-drawer *{animation:none!important;transition:none!important}}

.rally-control-shelf{display:grid;grid-template-columns:1fr minmax(110px,190px) 1fr;align-items:center;justify-items:center;gap:22px;padding:28px clamp(16px,6vw,100px);border-top:1px solid #294258;background:linear-gradient(160deg,#103149,#061421);animation:rally-assemble .35s ease-out both}
.rally-control-shelf[hidden]{display:none}
.rally-pedal{width:min(100%,120px);height:140px;border:1px solid #457491;border-bottom:6px solid #09243a;border-radius:12px;background:linear-gradient(125deg,#33546c,#122b40 45%,#0a1c2b);color:#e6eaf0;font-weight:700;font-size:15px;box-shadow:inset 2px 2px 0 #789caf55,0 9px 15px #0006;display:flex;align-items:center;justify-content:center;gap:12px;flex-direction:column;touch-action:none;user-select:none;cursor:pointer}
.rally-pedal span{font-size:50px;color:#86afc7;line-height:1}.rally-pedal[aria-pressed="true"]{border-color:#22d3ee;background:#0e4562;transform:translateY(4px)}
.rally-wheel{width:100%;aspect-ratio:1;touch-action:none;user-select:none;cursor:grab;outline-offset:7px;border-radius:50%}
.rally-wheel-ring{position:relative;display:block;width:100%;height:100%;border:clamp(10px,1.5vw,18px) solid #152b3c;border-radius:50%;background:radial-gradient(circle,#0c2032 0%,#06121d 70%);box-shadow:inset 1px 2px 4px #91abc866,1px 3px 0 #010c16,0 10px 20px #0007;transform:rotate(var(--wheel-angle,0deg))}
.rally-wheel-dot{position:absolute;width:12px;height:12px;border-radius:50%;background:#22d3ee;top:-13px;left:calc(50% - 6px);box-shadow:0 0 6px #22d3ee55}
.rally-wheel-hub{position:absolute;width:36%;height:36%;border:1px solid #365875;background:linear-gradient(140deg,#34516b,#091b2d);border-radius:50%;top:32%;left:32%;box-shadow:inset 1px 1px 0 #83abc544}
.rally-wheel-spoke{position:absolute;height:10%;width:42%;top:45%;left:8%;background:linear-gradient(#4d6e89,#102b40);transform-origin:right center}.spoke-right{left:50%;transform-origin:left center}.spoke-bottom{left:8%;transform:rotate(-90deg)}
@keyframes rally-assemble{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:620px){.rally-control-shelf{gap:12px;padding:20px 12px;grid-template-columns:1fr minmax(96px,136px) 1fr}.rally-pedal{height:104px;font-size:14px}.rally-pedal span{font-size:34px}.rally-wheel-dot{top:-11px}}

/* Reserve the hanging tab's visual space without covering the three hero labels. */
@media(min-width:981px){.ls-rally-drawer:not([open])+main .hero .pane-top{top:76px}}

.rally-wheel:focus-visible{outline:3px solid #a0e9ff;outline-offset:7px}