/* Gym Spiegel (Phase 1–4). Gleiche Farben/Schriften wie gym.html (--ink/--paper/--amber). */
:root{--ink:#0A0A0A;--ink-2:#141210;--paper:#F5F3EE;--paper-dim:#B8B4A8;--amber:#C9A227;--ember:#8c2f1b;--cyan:#4FC3E8;--warn:#FF8A3D;--ok:#6FCF97;--line:rgba(245,243,238,.14);--line-strong:rgba(245,243,238,.3)}
*{box-sizing:border-box}
body{margin:0;background:var(--ink);color:var(--paper);font-family:'Archivo',sans-serif;-webkit-font-smoothing:antialiased;line-height:1.5}
h1,h2,h3{font-family:'Unbounded',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;margin:0}
.gs{max-width:1100px;margin:0 auto;padding:28px 20px 80px}
.gs-kopf{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end;justify-content:space-between;margin-bottom:14px}
.gs-kopf h1{font-size:clamp(1.6rem,4.5vw,2.6rem)}
.gs-kopf h1 span{color:var(--amber)}
.gs-zurueck{color:var(--paper-dim);text-decoration:none;font-size:.9rem;border:1px solid var(--line);padding:8px 14px;border-radius:999px}
.gs-zurueck:hover{border-color:var(--amber);color:var(--paper)}
.gs-privat{display:flex;gap:10px;align-items:flex-start;background:rgba(111,207,151,.08);border:1px solid rgba(111,207,151,.35);border-radius:12px;padding:12px 16px;margin:10px 0;font-size:.92rem}
.gs-hinweis{font-size:.82rem;color:var(--paper-dim);margin:6px 0 18px}
.gs-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.gs-tab{font-family:'Unbounded',sans-serif;font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;background:transparent;color:var(--paper-dim);border:1px solid var(--line);border-radius:999px;padding:11px 18px;cursor:pointer}
.gs-tab.aktiv{background:var(--amber);color:var(--ink);border-color:var(--amber)}
.gs-tab:focus-visible,.gs-btn:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.gs-box{background:var(--ink-2);border:1px solid var(--line);border-radius:16px;padding:18px;margin-bottom:18px}
.gs-box h2{font-size:1.05rem;margin-bottom:10px}
.gs-box h3{font-size:.85rem;margin:14px 0 6px;color:var(--amber)}
.gs-zeile{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.gs-btn{font-family:'Archivo',sans-serif;font-weight:700;font-size:.92rem;background:transparent;color:var(--paper);border:1px solid var(--line-strong);border-radius:10px;padding:10px 16px;cursor:pointer;min-height:44px}
.gs-btn:hover:not(:disabled){border-color:var(--amber)}
.gs-btn:disabled{opacity:.4;cursor:not-allowed}
.gs-btn.haupt{background:var(--amber);color:var(--ink);border-color:var(--amber)}
.gs-btn.rec{background:#c0392b;border-color:#c0392b;color:#fff}
.gs-btn.klein{min-height:36px;padding:6px 12px;font-size:.84rem}
.gs-btn.an{background:rgba(201,162,39,.22);border-color:var(--amber)}
.gs-feld{background:var(--ink);color:var(--paper);border:1px solid var(--line-strong);border-radius:10px;padding:10px 12px;font:inherit;min-height:44px}
.gs-klein{font-size:.84rem;color:var(--paper-dim)}
.gs-status{font-size:.9rem;padding:10px 14px;border-radius:10px;border:1px solid var(--line);margin-top:10px}
.gs-status.ok{border-color:rgba(111,207,151,.5);color:var(--ok)}
.gs-status.warn{border-color:var(--warn);color:var(--warn);background:rgba(255,138,61,.08)}
.gs-status.fehler{border-color:#e74c3c;color:#ff8c80;background:rgba(231,76,60,.08)}
.gs-tipps{margin:8px 0 0;padding-left:20px;font-size:.9rem;color:var(--paper-dim)}
.gs-tipps li{margin:3px 0}
.gs-kamera{position:relative;background:#000;border-radius:14px;overflow:hidden;aspect-ratio:16/9;max-height:70vh;margin:12px 0}
.gs-kamera video{width:100%;height:100%;object-fit:contain;display:block}
.gs-kamera video.spiegel{transform:scaleX(-1)}
.gs-kamera .leer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--paper-dim);text-align:center;padding:20px}
.gs-countdown{position:absolute;inset:0;display:none;align-items:center;justify-content:center;font-family:'Unbounded',sans-serif;font-weight:800;font-size:clamp(5rem,22vw,12rem);color:var(--amber);background:rgba(0,0,0,.45)}
.gs-recpunkt{position:absolute;top:12px;left:14px;display:none;align-items:center;gap:8px;background:rgba(0,0,0,.6);border-radius:999px;padding:5px 12px;font-family:'JetBrains Mono',monospace;font-size:.85rem}
.gs-recpunkt::before{content:'';width:10px;height:10px;border-radius:50%;background:#e74c3c;animation:gsblink 1s infinite}
@keyframes gsblink{50%{opacity:.25}}
.gs-liste{display:grid;gap:10px}
.gs-eintrag{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--ink)}
.gs-eintrag b{display:block;word-break:break-all}
.gs-eintrag .meta{font-size:.82rem;color:var(--paper-dim)}
.gs-eintrag .aktionen{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.gs-badge{display:inline-block;font-size:.7rem;border:1px solid var(--ok);color:var(--ok);border-radius:999px;padding:1px 8px;margin-left:6px;vertical-align:middle}
.gs-buehne{--ar:1.7778;position:relative;width:min(100%,calc(75vh * var(--ar)));width:min(100%,calc(75dvh * var(--ar)));aspect-ratio:var(--ar);background:#000;border-radius:14px;overflow:hidden;margin:0 auto}
.gs-buehne video,.gs-buehne canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.gs-buehne video{object-fit:contain}
.gs-buehne canvas{pointer-events:none}
.gs-steuer{margin-top:12px;display:grid;gap:12px}
.gs-timeline{position:relative;padding:6px 0}
.gs-timeline input[type=range]{width:100%;margin:0}
.gs-band{position:absolute;top:2px;height:8px;border-radius:4px;background:rgba(79,195,232,.45);pointer-events:none;display:none}
.gs-band.aktiv{background:rgba(201,162,39,.7)}
.gs-zeittext{font-family:'JetBrains Mono',monospace;font-size:.82rem;color:var(--paper-dim)}
.gs-ebenen{display:flex;flex-wrap:wrap;gap:6px 16px}
.gs-ebenen label{display:flex;gap:6px;align-items:center;font-size:.9rem;cursor:pointer}
.gs-ebenen label.aus{opacity:.45;cursor:not-allowed}
.gs-ebenen input{width:18px;height:18px;accent-color:var(--amber)}
.gs-fortschritt{height:10px;border-radius:5px;background:var(--line);overflow:hidden;margin-top:10px}
.gs-fortschritt>i{display:block;height:100%;width:0;background:var(--amber);transition:width .15s}
.gs-details summary{cursor:pointer;font-weight:700}
.gs-details ul{padding-left:20px;color:var(--paper-dim);font-size:.9rem}
.gs-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media (max-width:640px){.gs{padding:18px 16px 70px}.gs-eintrag{grid-template-columns:1fr}.gs-eintrag .aktionen{justify-content:flex-start}}

/* Phase 5/6 */
.gs-chartbox{background:var(--ink);border:1px solid var(--line);border-radius:12px;padding:6px;touch-action:none}
.gs-chartbox canvas{display:block;cursor:crosshair}
.gs-chip{display:inline-flex;gap:6px;align-items:center;font-size:.85rem;cursor:pointer;border:1px solid var(--line);border-radius:999px;padding:3px 10px}
.gs-chip i{width:12px;height:12px;border-radius:50%;display:inline-block}
.gs-chip.aus{opacity:.4}
.gs-chip input{display:none}
.gs-tab-tabelle{width:100%;border-collapse:collapse;font-size:.85rem}
.gs-tab-tabelle th,.gs-tab-tabelle td{border-bottom:1px solid var(--line);padding:6px 8px;text-align:left;vertical-align:top}
.gs-tab-tabelle th{color:var(--paper-dim);font-weight:600}
.gs-gut{color:var(--ok)}.gs-schwach{color:var(--warn)}
.gs-steuer{grid-template-columns:minmax(0,1fr)}
.gs-steuer>*{min-width:0}
.gs-zeittext{overflow-wrap:anywhere}
.gs-tab-tabelle{display:block;overflow-x:auto}
.gs-feld{max-width:100%}

/* Phase 7 */
.gs-vergleich{margin-top:12px;display:grid;grid-template-columns:minmax(0,1fr);gap:8px;position:relative}
.gs-vergleich.neben.aktiv{grid-template-columns:repeat(2,minmax(0,1fr))}
.gs-vergleich.ueber.aktiv>#gsBuehne2{position:absolute;top:0;left:50%;transform:translateX(-50%);background:transparent;opacity:var(--deck,.5);pointer-events:none}
.gs-vergleich.ueber.aktiv>#gsBuehne2 video{mix-blend-mode:normal}
@media (max-width:640px){.gs-vergleich.neben.aktiv{grid-template-columns:minmax(0,1fr)}}
.gs-tab-tabelle td.num{text-align:right;font-family:'JetBrains Mono',monospace}

/* Video hochladen / Drag & Drop */
.gs-drop{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;border:2px dashed var(--line-strong);border-radius:14px;padding:16px;background:var(--ink);margin-bottom:12px;cursor:pointer}
.gs-drop:hover,.gs-drop:focus-visible{border-color:var(--amber);outline:none}
.gs-drop-ico{font-size:1.8rem;color:var(--amber)}
@media (max-width:640px){.gs-drop{grid-template-columns:1fr;text-align:left}.gs-drop-ico{display:none}}
.gs-dropoverlay{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;background:rgba(10,10,10,.82);border:4px dashed var(--amber);pointer-events:none}
.gs-dropoverlay div{font-family:'Unbounded',sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(1.2rem,4vw,2rem);color:var(--amber)}
body.gs-ziehen .gs-dropoverlay{display:flex}
body.gs-ziehen .gs-drop{border-color:var(--amber);background:rgba(201,162,39,.12)}

/* Vollbild: Bühne füllt den Bildschirm, das Videorechteck (contain) bestimmt die Zeichenfläche */
.gs-buehne:fullscreen{width:100vw;height:100vh;aspect-ratio:auto;border-radius:0;max-width:none}
.gs-buehne:-webkit-full-screen{width:100vw;height:100vh;aspect-ratio:auto;border-radius:0;max-width:none}
.gs-qual{margin-top:8px;font-size:.9rem}
.gs-qual b{color:var(--amber)}

/* Sport-Auswertung: Muskelgruppen je Phase */
.gs-muskeln{margin-top:6px}
.gs-phase{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:8px 0;background:var(--ink)}
.gs-phase-kopf{margin-bottom:4px;color:var(--paper)}
.gs-rolle{margin:4px 0}
.gs-rollenname{color:var(--amber);font-weight:700;font-size:.82rem}
.gs-rolle ul{margin:2px 0 0;padding-left:18px}
.gs-rolle li{margin:2px 0;color:var(--paper)}

/* Training: Freiheitsgrade, Befunde, Übungen */
.gs-h3{margin:14px 0 6px;font-size:.85rem;color:var(--amber)}
.gs-ziel{display:inline-block;font-size:.7rem;font-weight:700;border-radius:999px;padding:1px 8px;border:1px solid var(--line-strong);color:var(--paper-dim);margin-right:2px}
.gs-ziel-explosivitaet{border-color:#FF8A3D;color:#FF8A3D}
.gs-ziel-stabilitaet{border-color:#4FC3E8;color:#4FC3E8}
.gs-ziel-kraft{border-color:#E8B84A;color:#E8B84A}
.gs-ziel-beweglichkeit{border-color:#6FCF97;color:#6FCF97}
.gs-ziel-technik{border-color:#C792EA;color:#C792EA}
.gs-prio{color:var(--amber);font-size:.78rem;font-weight:700}