/* GermanFlight Virtual */
.va { display: grid; gap: 16px; }
.va .panel + .panel { margin-top: 0; }
.va-hero { position: relative; overflow: hidden; padding: clamp(18px, 3vw, 34px); border: 1px solid var(--line); border-radius: 18px;
  background: radial-gradient(700px 280px at 85% -20%, #5a2bbd66, transparent 70%), radial-gradient(600px 260px at 0% 120%, #1fa7e655, transparent 70%), linear-gradient(180deg, #121852, #0a0f33); }
.va-hero h1 { font-size: clamp(2rem, 6vw, 3.4rem); margin: .1em 0 .3em; letter-spacing: .02em; }
.va-hero p { color: var(--muted); max-width: 66ch; margin: 0 0 18px; }
.va-eyebrow { color: var(--pink); letter-spacing: .3em; text-transform: uppercase; font-size: .72rem; }
.grad { background: linear-gradient(90deg, var(--cyan2), var(--violet), var(--pink)); -webkit-background-clip: text; background-clip: text; color: transparent; }

.va-steps { list-style: none; counter-reset: s; margin: 0; padding: 0; display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.va-steps li { counter-increment: s; position: relative; padding: 14px 14px 14px 52px; border: 1px solid var(--line); border-radius: 12px; background: #0a0f33; display: grid; gap: 2px; }
.va-steps li::before { content: counter(s); position: absolute; left: 12px; top: 12px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; background: linear-gradient(135deg, #1fa7e6, #6a35e0); }
.va-steps span { color: var(--muted); font-size: .88rem; }

.va-ladder { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); }
.va-step { padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: #0a0f33; display: grid; gap: 2px; opacity: .6; }
.va-step span { color: var(--muted); font-size: .8rem; }
.va-step.done { opacity: 1; border-color: #2a6f93; }
.va-step.here { opacity: 1; border-color: var(--cyan); box-shadow: 0 0 16px #38c8ff55; background: linear-gradient(135deg, #14246f, #2b1a78); }

.va-two { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.va-feed { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.va-feed li { display: grid; gap: 1px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; background: #0a0f33; }
.va-feed span { color: var(--muted); font-size: .84rem; }

.va-rules { color: var(--muted); padding-left: 20px; margin: 0 0 12px; display: grid; gap: 4px; }
.va-join { border-color: #3a46a8; }

.va-pilot { display: grid; gap: 14px; }
.va-id { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.va-id > div:last-child { display: grid; gap: 2px; }
.va-call { font-size: clamp(1.7rem, 5vw, 2.6rem); font-weight: 800; letter-spacing: .08em; padding: 6px 16px; border-radius: 14px; border: 1px solid var(--cyan); background: #0a0f33; box-shadow: 0 0 18px #38c8ff44; }
.va-rank { display: inline-block; margin-left: 8px; padding: 2px 10px; border-radius: 999px; font-size: .78rem; background: linear-gradient(135deg, #1fa7e6, #6a35e0); }
.va-prog-head { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; color: var(--muted); font-size: .88rem; margin-bottom: 6px; }
.va-prog-head span:first-child { color: #fff; font-weight: 600; }

.va-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.va-ofp { margin-top: 14px; }
.va-plan { display: grid; gap: 10px; border: 1px solid #2a6f93; border-radius: 14px; padding: 14px; background: linear-gradient(180deg, #0f1a5c, #0a0f33); }
.va-route { display: flex; align-items: center; gap: 12px; font-size: 1.8rem; font-weight: 800; letter-spacing: .06em; }
.va-route i { color: var(--pink); font-style: normal; font-size: 1.3rem; }
.va-route em { font-style: normal; font-weight: 400; font-size: .85rem; color: var(--muted); letter-spacing: 0; }
.va-route.small { font-size: 1.15rem; }
.va-dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px 16px; margin: 0; }
.va-dl dt { color: var(--muted); font-size: .85rem; }
.va-dl dd { margin: 0; word-break: break-word; }
.va-form { display: grid; gap: 10px; margin-top: 8px; padding-top: 12px; border-top: 1px dashed var(--line); }
.va-gap { margin-top: 6px; }
.va-time { display: flex; align-items: center; gap: 6px; }
.va-time input { width: 5.5em; }
.va-manual { margin-top: 14px; border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; background: #0a0f33; }
.va-manual summary { cursor: pointer; color: var(--cyan2); }

.va-chip { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: .76rem; border: 1px solid var(--line); }
.va-chip.ok { color: #aef0d1; border-color: #1d7a52; background: #07261a; }
.va-chip.wait { color: #ffd9a0; border-color: #8a5a22; background: #2a1c08; }
.va-chip.no { color: #ff9aae; border-color: #7a2038; background: #3a0f1c; }
.va-note { display: block; color: var(--muted); font-size: .76rem; margin-top: 2px; max-width: 28ch; }

.va-badges { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.va-badge { display: grid; gap: 2px; justify-items: center; text-align: center; padding: 12px 8px; border: 1px dashed var(--line); border-radius: 12px; background: #0a0f33; opacity: .5; }
.va-badge b { font-size: 1.6rem; color: var(--muted); }
.va-badge small { color: var(--muted); font-size: .72rem; }
.va-badge.on { opacity: 1; border-style: solid; border-color: #8a7422; background: linear-gradient(180deg, #2a2208, #0a0f33); box-shadow: 0 0 14px #ffd23f33; }
.va-badge.on b { color: #ffd23f; text-shadow: 0 0 10px #ffd23f88; }

.va-cc { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; border-color: #2a6f93; }
.va-cc h2 { margin-bottom: .2em; }
.va-cc p { margin: 0; max-width: 62ch; }

.va-queue { display: grid; gap: 10px; }
.va-q { display: grid; gap: 4px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: #0a0f33; }
.va-flag { color: #ffd9a0; font-size: .86rem; }

@media (max-width: 720px) {
  .va-route { font-size: 1.4rem; }
  .va-dl { grid-template-columns: 1fr; }
  .va-dl dt { margin-top: 6px; }
}