/* RAUMRISS · Fenster für echte App-Ansichten (FX, OS).
   Im Fenster laufen Schnappschüsse der echten Oberfläche (echt/fx, echt/os) mit Beispieldaten.
   Ab 760px Breite: App in 1440 × 900 gerendert und auf die Fensterbreite verkleinert.
   Darunter: App in echter Handybreite, also ihre eigene Mobilansicht. */
.echt{position:relative;border-radius:14px;overflow:hidden;background:#1c1c1e;box-shadow:0 40px 100px rgba(0,0,0,.45),0 0 0 .5px rgba(255,255,255,.14)}
.echt-leiste{display:flex;align-items:center;gap:7px;height:38px;padding:0 14px;background:#2a2a2c;color:#a1a1a6;font-size:12.5px}
.echt-leiste i{width:11px;height:11px;border-radius:50%;background:#ff5f57;flex:none}
.echt-leiste i:nth-child(2){background:#febc2e}.echt-leiste i:nth-child(3){background:#28c840}
.echt-leiste b{font-weight:500;margin-left:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.echt-leiste span{margin-left:auto;white-space:nowrap;font-size:11.5px;color:#8e8e93}
.echt-buehne{position:relative;overflow:hidden;background:#f5f5f5}
.echt-buehne iframe{position:absolute;left:0;top:0;border:0;display:block;transform-origin:0 0;background:#f5f5f5}
.echt-reiter{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin:0 0 18px}
.echt-reiter button{font:inherit;font-size:14px;font-weight:500;letter-spacing:-.01em;color:#d1d1d6;background:rgba(255,255,255,.08);border:0;border-radius:980px;padding:8px 16px;cursor:pointer;transition:background .2s,color .2s}
.echt-reiter button:hover{background:rgba(255,255,255,.16);color:#fff}
.echt-reiter button[aria-selected="true"]{background:#f5f5f7;color:#1d1d1f}
.echt-hinweis{margin:14px 0 0;text-align:center;font-size:13px;color:#8e8e93}
@media (max-width:759px){
  .echt{border-radius:22px}
  .echt-leiste{display:none}
  .echt-reiter{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none;margin-inline:-20px;padding-inline:20px}
  .echt-reiter::-webkit-scrollbar{display:none}
  .echt-reiter button{flex:none}
}
