/* Telegame-Flughafen (Startseite). Hallenbild austauschbar: --halle-desktop / --halle-mobil (Game Art Director), Verlauf als Rückfall. */
:root{--halle-desktop:url("/static/media/flughafen/halle-desktop.webp");--halle-mobil:url("/static/media/flughafen/halle-mobil.webp");--abflug-desktop:url("/static/media/flughafen/abflug-desktop.webp");--abflug-mobil:url("/static/media/flughafen/abflug-mobil.webp")}
.ff-fly.ff-up{background:linear-gradient(rgba(8,12,22,.35),rgba(8,12,22,.55)),var(--abflug-desktop) center/cover,#0d1424;color:#fff4d6;text-shadow:0 2px 8px #000}.ff-fly.ff-up .ff-plane{display:none}.ff-fly.ff-up{animation:ff-fade .3s ease-out both,ff-zoom 1.3s ease-in both}@keyframes ff-zoom{to{background-size:auto,115%,auto}}
@media(max-width:760px){.ff-fly.ff-up{background:linear-gradient(rgba(8,12,22,.35),rgba(8,12,22,.55)),var(--abflug-mobil) center/cover,#0d1424}}
html body.flughafen{background:linear-gradient(rgba(8,12,22,.45),rgba(8,12,22,.7)) fixed,var(--halle-desktop) center/cover fixed,linear-gradient(180deg,#0d1424 0%,#1c2740 45%,#2b2f3a 70%,#14161c 100%) fixed;background-color:#0d1424}
body.flughafen #sky,body.flughafen #outside{display:none}
.ff-hall{max-width:980px;margin:0 auto}
.ff-hall h1{font-family:system-ui,sans-serif;letter-spacing:.02em}
.ff-board{background:#101114;border:3px solid #2b2d33;border-radius:12px;padding:.8rem;box-shadow:0 18px 50px #000b,inset 0 0 0 2px #000;font-family:"Courier New",ui-monospace,monospace;color:#f7d26a}
.ff-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.4rem;font-weight:700;letter-spacing:.2em;color:#ffe08a}
.ff-row{all:unset;box-sizing:border-box;display:grid;grid-template-columns:4.2rem 1fr 9.5rem;gap:.6rem;align-items:center;width:100%;padding:.35rem .4rem;border-top:1px solid #23252b;cursor:pointer;border-left:4px solid var(--c,#555)}
.ff-row.ff-cols{cursor:default;border-left-color:transparent;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:#9a9172}
button.ff-row:hover,button.ff-row:focus-visible{background:#1b1d23;outline:2px solid #f7d26a;outline-offset:-2px}
.ff-ziel{display:flex;flex-direction:column;min-width:0}.ff-ziel small{font-size:.7rem;color:#a8a28c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ff{display:inline-flex;flex-wrap:nowrap;overflow:hidden}
.ff-c{display:inline-block;min-width:.72em;text-align:center;background:linear-gradient(#1d1f24 49%,#000 50%,#24262c 51%);color:#f7d26a;margin-right:1px;border-radius:2px;font-weight:700;line-height:1.35}
.ff-flip{animation:ff-flip .32s ease-in-out both}
@keyframes ff-flip{0%{transform:rotateX(0)}45%{transform:rotateX(90deg);opacity:.4}55%{transform:rotateX(-90deg)}100%{transform:rotateX(0)}}
.ff-row[data-st=boarding] .ff-st .ff-c{color:#7fe08a}.ff-row[data-st=laeuft] .ff-st .ff-c{color:#ffb35c}.ff-row[data-st=ruhig] .ff-st .ff-c{color:#9aa0a8}
.ff-hint{margin:.5rem 0 0;font-size:.8rem;color:#b9b091}
.ff-arr{border-left:5px solid var(--c)}.ff-gate-l{font:700 .75rem system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--c);margin:0}
.ff-story{font-size:1.08rem;line-height:1.55;max-width:60ch}
.ff-rooms{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.ff-rooms button{text-align:left;display:flex;flex-direction:column}.ff-rooms small{color:var(--muted);font-weight:400}
.ff-tables{list-style:none;padding:0;display:grid;gap:.4rem}.ff-tables button{width:100%;text-align:left}
.ff-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem}
.ff-fly{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:linear-gradient(180deg,#5c86c4,#cfe0f5);color:#0d1424;font:700 1.2rem system-ui,sans-serif;pointer-events:none;animation:ff-fade .3s ease-out both}
.ff-fly span{position:absolute;bottom:22%;left:0;right:0;text-align:center}
.ff-plane{font-style:normal;font-size:4rem;display:block}
.ff-up .ff-plane{animation:ff-up 1.3s cubic-bezier(.5,0,.8,.4) both}.ff-down .ff-plane{animation:ff-down .9s cubic-bezier(.2,.6,.4,1) both}
@keyframes ff-up{from{transform:translate(-40vw,20vh) rotate(-10deg)}to{transform:translate(45vw,-45vh) rotate(-25deg)}}
@keyframes ff-down{from{transform:translate(-45vw,-35vh) rotate(15deg)}to{transform:translate(0,0) rotate(0)}}
@keyframes ff-fade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.ff-flip,.ff-fly,.ff-plane{animation:none!important}}
@media(max-width:760px){.ff-board .ff-c{font-size:.78em;min-width:.6em}html body.flughafen{background:linear-gradient(rgba(8,12,22,.4),rgba(8,12,22,.65)),var(--halle-mobil) center/cover,linear-gradient(180deg,#0d1424,#1c2740 50%,#14161c);background-attachment:scroll}
 .ff-row{grid-template-columns:3rem 1fr 6.6rem;gap:.35rem;font-size:.82rem}.ff-rooms{grid-template-columns:1fr}.ff-board{padding:.5rem}.ff-ziel .ff{flex-wrap:wrap;row-gap:2px}}
.ff-checkin{background:#101114e6;border:1px solid #2b2d33;border-radius:12px;padding:1rem 1.2rem;margin-bottom:1rem}.ff-checkin ul{margin:.3rem 0 .6rem;padding-left:1.2rem}.ff-checkin form{display:grid;gap:.5rem;max-width:420px;margin-top:.5rem}.ff-checkin a{color:#f7d26a}

.ff-row.ff-lock{opacity:.62;cursor:not-allowed;filter:grayscale(.35)}
.ff-row.ff-lock:hover,.ff-row.ff-lock:focus-visible{background:transparent;outline-color:#ff9a8a}
.ff-sperre{margin:.7rem 0 0;padding:.7rem .9rem;border:1px solid #c07070;border-radius:10px;background:#1a1014e6;color:#ffd4cc}
.ff-sperre p{margin:0 0 .5rem}
