/* Gestaltung der fünf ergänzten Funktionen. Farben und Maße wie im Entwurf:
   Waldgrün, Creme, Lime; Bedienflächen mindestens 44 px. */

/* ------------------------------------------------- Walze für Gewicht/Wdh. */
.pro-walze{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;max-height:44vh;overflow-y:auto;padding:4px;margin-top:6px;scroll-behavior:smooth}
.pro-wert{min-height:52px;border-radius:11px;border:1px solid #c3d0bb;background:#fffef8;color:#123122;font-size:19px;font-weight:700;display:flex;align-items:baseline;justify-content:center;gap:3px}
.pro-wert small{font-size:11px;font-weight:600;color:#5c7161}
.pro-wert.an{background:linear-gradient(105deg,var(--lime),var(--lime));border-color:#a8cf4e;box-shadow:inset 0 0 0 1px #ffffffaa}
.pro-wert:hover{background:#f2f8e2}
.stepper .number{cursor:pointer;border-radius:10px}
.stepper .number:hover{background:#ffffff14}

/* --------------------------------------------- Bewertung nach jedem Satz */
.pro-rate{border:1px solid #6d8f7d66;background:#ffffff10;border-radius:13px;padding:9px 9px 7px;margin-top:-2px}
.pro-rate-frage{font-size:12px;font-weight:700;margin:0 0 7px;text-align:center;color:#eef4e7}
.pro-rate-knoepfe{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
.pro-stufe{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:54px;padding:5px 2px;border-radius:10px;border:1px solid #7d9a8a70;background:#ffffff12;color:#f2f6ee;line-height:1.15}
.pro-stufe b{font-size:15px;font-weight:800}
.pro-stufe span{font-size:9.5px;text-align:center;hyphens:auto}
.pro-stufe.s1 b{color:#7fe3d0}.pro-stufe.s2 b{color:#9fe58f}.pro-stufe.s3 b{color:var(--lime)}.pro-stufe.s4 b{color:#f4c469}.pro-stufe.s5 b{color:#f08f8f}
.pro-stufe[aria-pressed="true"]{background:#ffffff28;border-color:#d0f76599;box-shadow:inset 0 0 0 1px rgba(var(--lime-rgb),.4)}
.pro-rate.warten .pro-stufe{animation:pro-lauf 1.9s linear infinite}
.pro-rate.warten .pro-stufe.s2{animation-delay:.12s}.pro-rate.warten .pro-stufe.s3{animation-delay:.24s}
.pro-rate.warten .pro-stufe.s4{animation-delay:.36s}.pro-rate.warten .pro-stufe.s5{animation-delay:.48s}
@keyframes pro-lauf{0%{border-color:#7d9a8a70}4%{border-color:var(--lime)}12%{border-color:#7d9a8a70}100%{border-color:#7d9a8a70}}
.pro-antwort{font-size:11.5px;margin:7px 2px 1px;text-align:center;line-height:1.4}
.pro-antwort.hoch{color:var(--lime)}.pro-antwort.gleich{color:#e7eede}.pro-antwort.runter{color:#f6b9b9}
@media(prefers-reduced-motion:reduce){.pro-rate.warten .pro-stufe{animation:none;border-color:#d0f76580}}

/* ------------------------------------------------- Einstellungsfotos */
.pro-fotos{margin-top:-2px}
.pro-fotos-titel{font-size:12px;margin:0 0 6px;color:#e9f0e3}
.pro-fotos-reihe{display:flex;gap:7px;flex-wrap:wrap;align-items:stretch}
.pro-foto{width:60px;height:60px;padding:0;border-radius:10px;overflow:hidden;border:1px solid #8aa79688;background:#0d2a20}
.pro-foto img{width:100%;height:100%;object-fit:cover;display:block}
.pro-foto-add{display:flex;align-items:center;gap:7px;min-height:60px;padding:6px 11px;border-radius:10px;border:1px dashed #9bb7a6;background:#ffffff10;color:#eaf1e4;font-size:11px;text-align:left;max-width:190px}
.pro-foto-add .icon{width:22px;height:22px;flex:none}
.pro-fotos-note{font-size:10px;color:#bacdbe;margin:6px 0 0}
.pro-foto-gross{width:100%;border-radius:12px;display:block}
.pro-foto-weg{margin-top:14px;min-height:52px}

/* ------------------------- Empfehlung, Bestleistung, Aufwärmen, Ausweis */
.pro-empf{font-size:12px;line-height:1.45;margin:-2px 2px 0;padding:8px 11px;border-radius:11px;border:1px solid #6d8f7d66;background:#ffffff10;color:#e9f1e2}
.pro-empf.steigern{border-color:#a9d45f88;background:#cdf5651a}
.pro-empf.zurueck{border-color:#e8a1a166;background:#f0a0a015}
.pro-empf.erstes{border-color:#7fc9e066;background:#7fc9e014}
.pro-warm{font-size:12px;line-height:1.45;margin:0 2px;padding:8px 11px;border-radius:11px;border:1px solid #d9b97a66;background:#f0c06b14;color:#f2e7cf}
.pro-warm b{color:#f6d79a}
.pro-best{display:block;font-size:12px;font-weight:800;text-align:center;margin:0 2px 2px;padding:7px 10px;border-radius:10px;color:#2a2205;background:linear-gradient(105deg,#f2d264,#ffe9a1);border:1px solid #f7de8d}
.pro-ausweis-wert{font-size:29px;font-weight:800;letter-spacing:2px;margin:2px 0 14px;color:#12331f}

/* ----------------------------------------------------- Trainings-Leiste */
.pro-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:0;z-index:6;width:100%;max-width:440px;background:#07281ff2;backdrop-filter:blur(7px);border-top:1px solid #6b8f7c88;padding:9px 14px calc(9px + env(safe-area-inset-bottom));color:#f1f6ec}
.pro-bar-zeile,.pro-bar-pause{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px}
.pro-bar-zeile b{font-size:15px;font-weight:800;margin-left:3px}
.pro-bar-pause b{font-size:16px;font-weight:800;color:var(--lime)}
.pro-bar-knoepfe{display:flex;gap:5px}
.pro-bar-knoepfe button{min-height:34px;padding:4px 10px;border-radius:9px;border:1px solid #7fa08e;background:#ffffff1a;color:inherit;font-size:11.5px;font-weight:700}
.pro-bar-balken{height:4px;border-radius:3px;background:#ffffff1f;margin-top:7px;overflow:hidden}
.pro-bar-balken i{display:block;height:100%;background:linear-gradient(90deg,#9fe58f,var(--lime))}
body.pro-training .app-switcher{display:none}
body.pro-training .screen{padding-bottom:92px}

/* ------------------------------------------------------------- Sprache */
.pro-lang-block .menu-heading{margin:9px 0 10px}
.pro-lang-block .feature-note{margin-top:9px}
.language-dropdown{position:relative;width:100%;color:#f3f6ec}
.language-trigger{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 15px;border:1px solid #8da87988;border-radius:13px;background:#e3f8a111;cursor:pointer;list-style:none;font-size:15px;font-weight:650;user-select:none}
.language-trigger::-webkit-details-marker{display:none}
.language-trigger:hover{background:#e3f8a11c;border-color:var(--muted)}
.language-name{flex:1;min-width:0;text-align:left}
.language-chevron{font-size:22px;line-height:1;color:#d0efaa;transform:translateY(-3px)}
.language-dropdown[open]>.language-trigger{border-color:#c8ef81}
.language-dropdown[open] .language-chevron{transform:rotate(180deg) translateY(-3px)}
.language-options{position:absolute;top:calc(100% + 7px);inset-inline:0;z-index:12;padding:6px;border:1px solid #d3dfbd;border-radius:14px;background:#f7f8ee;box-shadow:0 12px 30px #00190d40;max-height:300px;overflow-y:auto}
.language-option{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:8px 10px;border:0;border-radius:9px;background:transparent;color:#173b26;font:inherit;font-size:14px;font-weight:600;text-align:left}
.language-option:hover{background:#e8eedb}
.language-option[aria-pressed="true"]{background:#e0efc0;font-weight:800}
.language-check{width:20px;text-align:center;font-size:17px;color:#325a27}
.language-trigger:focus-visible,.language-option:focus-visible{outline:2px solid #b1dd55;outline-offset:3px}
/* Only the flag moves; labels and controls keep their position. */
.language-flag{display:inline-block;flex:none;width:34px;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:28px;line-height:1.25;transform-origin:10% 50%;animation:language-flag-wave 3.2s ease-in-out infinite;will-change:transform}
.language-option:nth-child(2) .language-flag{animation-delay:-.6s}.language-option:nth-child(3) .language-flag{animation-delay:-1.2s}.language-option:nth-child(4) .language-flag{animation-delay:-1.8s}.language-option:nth-child(5) .language-flag{animation-delay:-2.4s}
@keyframes language-flag-wave{0%,100%{transform:perspective(90px) rotateY(-14deg) skewY(-3deg) scaleX(.97)}35%{transform:perspective(90px) rotateY(12deg) skewY(4deg) scaleX(1)}70%{transform:perspective(90px) rotateY(-6deg) skewY(-2deg) scaleX(.98)}}
@media(prefers-reduced-motion:reduce){.language-flag{animation:none;will-change:auto}}
.connected-language{width:210px;max-width:100%;position:relative;z-index:15}
.connected-language .language-trigger{min-height:44px;padding:6px 12px;border-color:#9bac90;background:#f4f3e9;color:#173b26;font-size:13px}
.connected-language .language-chevron{color:#325a27}
.connected-mode .view-toolbar{display:flex;justify-content:center;margin-bottom:8px}
.bottom-nav button,.app-switcher button{min-width:0;overflow-wrap:anywhere}