:root{
  --ink:#093e4b;--muted:#6b7d83;--bg:#f7f8f8;--white:#fff;--coral:#ff5c55;--orange:#ff9d45;
  --teal:#0d7893;--teal-dark:#075467;--lime:#a9d317;--yellow:#ffbf24;--purple:#7741d9;--line:#dce5e7;
  --shadow:0 12px 28px rgba(9,62,75,.12);--radius:24px;
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#eaf0f1;color:var(--ink)}
body{display:flex;justify-content:center}.app-shell{width:100%;max-width:480px;min-height:100dvh;background:var(--bg);box-shadow:0 0 60px rgba(0,0,0,.08);position:relative;overflow-x:hidden}.hidden{display:none!important}
button,input,textarea{font:inherit}.content{padding-bottom:100px;min-height:100dvh}.login-view{min-height:100dvh;display:grid;place-items:center;padding:28px;background:linear-gradient(150deg,#0c6e87,#16a0b9 45%,#ff7a55)}.login-card{width:100%;background:#fff;border-radius:30px;padding:34px 28px;box-shadow:0 25px 70px rgba(0,0,0,.2);text-align:center}.login-logo{width:100px;height:100px;border-radius:25px;box-shadow:var(--shadow);margin-bottom:18px}.login-card h1{font-size:30px;margin:6px 0}.login-card p{color:var(--muted)}.launch-note{display:grid;gap:5px;margin:20px 0;padding:14px 16px;border-radius:17px;background:#fff5d9;color:var(--teal-dark);text-align:left;font-size:13px;line-height:1.4}.launch-note span{color:#526a71}.legal-links{display:flex;justify-content:center;gap:20px;margin-top:22px;font-size:12px}.legal-links a{color:var(--teal-dark);font-weight:800;text-underline-offset:3px}label{display:block;text-align:left;font-size:13px;font-weight:800;margin:18px 0 7px}.password-row{display:flex;gap:8px}.password-row input,.form-grid input,.card input{width:100%;border:1px solid var(--line);border-radius:15px;padding:14px;background:#fbfcfc;color:var(--ink)}.icon-btn{border:0;border-radius:15px;background:#edf4f5;padding:0 16px}.form-error{min-height:20px;color:#d43f39;font-size:13px}.full{width:100%}.primary-btn,.ghost-btn,.mini-btn{border:0;border-radius:16px;font-weight:900;cursor:pointer}.primary-btn{background:linear-gradient(135deg,var(--coral),#ff7264);color:white;padding:14px 22px;box-shadow:0 9px 18px rgba(255,92,85,.22)}.ghost-btn{background:#eef5f6;color:var(--teal-dark);padding:13px 18px}.mini-btn{background:rgba(255,255,255,.13);color:#fff;padding:10px 16px}.main-view{min-height:100dvh}
.home-hero{height:318px;padding:40px 24px 0;position:relative;overflow:hidden;color:white;background:linear-gradient(145deg,#0c83c6 0%,#1496cf 55%,#ff7b59 125%)}.home-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 15% 30%,rgba(255,255,255,.18),transparent 28%),linear-gradient(to top,rgba(255,116,83,.34),transparent 40%);pointer-events:none}.home-hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:54px;background:linear-gradient(to top,rgba(255,137,98,.42),transparent)}.hero-copy{position:relative;z-index:4;width:55%;padding-top:8px}.hero-copy h1{font-family:"Segoe Print","Bradley Hand",cursive;font-size:43px;line-height:.92;margin:8px 0 14px;transform:rotate(-2deg);text-shadow:0 2px 10px rgba(0,0,0,.14);letter-spacing:-1.2px}.hero-copy h1:after{content:"";display:block;width:128px;height:6px;background:#ffc928;border-radius:10px;margin:8px 0 0 30px;transform:rotate(-4deg)}.hero-copy p{font-size:15.5px;line-height:1.45;margin:0;opacity:.98;text-shadow:0 1px 5px rgba(0,0,0,.12)}.hero-moki{position:absolute;z-index:3;right:42px;bottom:0;width:178px;height:278px;object-fit:cover;object-position:center bottom;border-radius:0;filter:drop-shadow(0 10px 16px rgba(0,0,0,.18));animation:mokiFloat 4s ease-in-out infinite}.hero-badges{position:absolute;z-index:6;right:14px;top:31px;display:grid;gap:9px}.hero-badge{min-width:68px;background:#fff;color:var(--teal-dark);border-radius:22px;padding:8px 9px;font-size:11px;font-weight:900;box-shadow:0 8px 18px rgba(0,0,0,.13);text-align:center}.hero-badge span{display:block;font-size:18px;margin-bottom:1px}.progress-card{position:relative;z-index:10;margin:-30px 20px 16px;background:linear-gradient(135deg,#075467,#0c6f84);color:#fff;border-radius:24px;padding:20px;box-shadow:var(--shadow)}.progress-card h2{font-size:20px;margin:0 0 18px}.level-row{display:grid;grid-template-columns:34px 1fr 34px;gap:8px;align-items:center;font-weight:900;font-size:18px}.level-track{height:14px;background:rgba(255,255,255,.25);border-radius:20px;position:relative}.level-fill{height:100%;background:linear-gradient(90deg,#bdd817,#80c71f);border-radius:20px;transition:width .5s ease}.level-pill{position:absolute;top:50%;transform:translate(-50%,-50%);background:#b9d71a;color:#17414a;padding:8px 12px;border-radius:18px;font-size:14px;min-width:54px;text-align:center}.progress-foot{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:18px;font-size:13px}.daily-card{margin:0 20px 16px;background:linear-gradient(135deg,#fff8ed,#fff2d9);border-radius:24px;padding:22px;box-shadow:var(--shadow);display:grid;grid-template-columns:1.4fr .8fr;gap:10px;align-items:center}.daily-card h2{font-size:25px;line-height:1.06;margin:7px 0}.daily-card p{color:var(--muted);margin:0}.section-label{color:var(--coral);font-size:14px;font-weight:900}.headphones{font-size:75px;text-align:center;filter:drop-shadow(0 8px 10px rgba(0,0,0,.08))}.skill-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:0 20px 16px}.skill-card{border-radius:21px;padding:15px 8px 13px;text-align:center;min-height:170px;display:flex;flex-direction:column;align-items:center;box-shadow:0 8px 18px rgba(9,62,75,.08)}.skill-card:nth-child(1){background:#e7f5ea}.skill-card:nth-child(2){background:#fff0c8}.skill-card:nth-child(3){background:#eee3ff}.skill-card:nth-child(4){background:#dff1f4}.skill-icon{font-size:28px;margin-bottom:8px}.skill-card strong{font-size:12px}.skill-card small{display:block;font-size:10px;line-height:1.3;margin-top:6px;color:#36525a}.tiny-track{width:100%;height:6px;border-radius:10px;background:rgba(0,0,0,.08);margin-top:auto}.tiny-fill{height:100%;border-radius:10px;background:var(--lime)}.skill-card:nth-child(2) .tiny-fill{background:var(--yellow)}.skill-card:nth-child(3) .tiny-fill{background:var(--purple)}.skill-card:nth-child(4) .tiny-fill{background:#2b9ba7}.review-card,.quote-card{margin:0 20px 16px;border-radius:22px;box-shadow:0 7px 18px rgba(9,62,75,.07)}.review-card{background:#e9f4f3;padding:17px;display:flex;align-items:center;gap:14px;cursor:pointer}.review-card strong{font-size:12px}.round{font-size:34px}.quote-card{background:linear-gradient(135deg,#fff7e7,#fff1cf);min-height:104px;display:grid;grid-template-columns:128px minmax(0,1fr);overflow:hidden;align-items:center;position:relative}.quote-card img{width:122px;height:104px;object-fit:cover;object-position:50% 30%;align-self:end;border-radius:0}.quote-card>div{min-width:0;padding:12px 12px 12px 2px}.quote-card strong{display:block;font-size:15px;line-height:1.22}.quote-card em{display:block;color:var(--coral);font-style:normal;font-weight:900;margin-top:6px;font-size:17px}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(480px,100%);height:82px;background:rgba(255,255,255,.96);backdrop-filter:blur(20px);display:grid;grid-template-columns:repeat(5,1fr);z-index:50;border-top:1px solid rgba(9,62,75,.08);padding-bottom:max(env(safe-area-inset-bottom),6px)}.nav-item{border:0;background:none;color:#76868b;display:grid;place-items:center;padding:9px 2px 6px}.nav-item span{font-size:23px;line-height:1}.nav-item small{font-size:10px;font-weight:800}.nav-item.active{color:var(--coral)}.section-title{padding:28px 22px 12px;background:linear-gradient(135deg,#075467,#0d7893);color:#fff}.section-title h2{margin:0;font-size:26px}.lesson-list,.grid-2{padding:18px 20px}.lesson-card{display:grid;grid-template-columns:64px 1fr 30px;align-items:center;gap:12px;background:#fff;border-radius:20px;padding:13px;margin-bottom:12px;box-shadow:0 8px 18px rgba(9,62,75,.08)}.lesson-icon{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;font-size:28px}.lesson-card h4{margin:0 0 5px}.lesson-card p{margin:0;color:var(--muted);font-size:12px}.lesson-card button{border:0;background:none;font-size:28px;color:var(--teal)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.topic-card,.card{background:#fff;border-radius:22px;box-shadow:var(--shadow);padding:20px;margin-bottom:16px}.topic-card h3{margin:10px 0 5px}.topic-card p,.muted{color:var(--muted)}.center{text-align:center}.profile-card{text-align:center;margin:20px}.profile-avatar{width:96px;height:96px;border-radius:50%;object-fit:cover;object-position:50% 18%;border:5px solid #fff;box-shadow:var(--shadow)}.form-grid{display:grid;gap:4px}.card{margin:16px 20px}.card h3{margin-top:0}.prompt-box{background:#eef5f6;border-radius:18px;padding:18px;line-height:1.5;margin:15px 0}.option-btn{display:block;width:100%;text-align:left;border:1px solid var(--line);background:#fff;border-radius:15px;padding:14px;margin:9px 0}.option-btn.correct{border-color:#75b929;background:#eff9e6}.option-btn.wrong{border-color:#e65d55;background:#fff0ee}.feedback{margin-top:12px;padding:13px;border-radius:14px;background:#eef5f6}.mic-btn{width:78px;height:78px;border-radius:50%;border:0;background:linear-gradient(135deg,var(--coral),#ff7862);color:#fff;font-size:30px;box-shadow:0 12px 30px rgba(255,92,85,.35)}.small{font-size:12px}.toast{position:fixed;left:50%;bottom:100px;transform:translate(-50%,18px);opacity:0;background:#073e4d;color:#fff;padding:12px 18px;border-radius:16px;z-index:100;transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes mokiFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(1deg)}}
@media(max-width:390px){.hero-copy h1{font-size:37px}.hero-copy{width:53%}.hero-moki{right:36px;width:164px;height:260px}.hero-badges{right:10px}.skill-card{min-height:158px}.skill-card strong{font-size:11px}.daily-card h2{font-size:22px}.quote-card{grid-template-columns:116px minmax(0,1fr)}.quote-card img{width:112px}.quote-card strong{font-size:14px}}

button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid rgba(13,120,147,.35);outline-offset:2px}
button.skill-card{border:0;color:var(--ink);font:inherit;cursor:pointer;width:100%;transition:transform .16s ease,box-shadow .16s ease}button.skill-card:active{transform:scale(.97)}.skill-count{display:block;font-size:9px;color:var(--muted);margin-top:5px}.skill-section-title{min-height:100px;padding:max(24px,env(safe-area-inset-top)) 20px 16px;background:linear-gradient(135deg,#075467,#0d7893);color:#fff;display:grid;grid-template-columns:42px 36px 1fr;align-items:center;gap:10px}.skill-section-title>span{font-size:26px}.skill-section-title h2{margin:0;font-size:25px}
button:disabled{cursor:default}.review-button{width:calc(100% - 40px);border:0;color:var(--ink);font:inherit;text-align:left}.review-button>span:last-child{display:grid;gap:3px}.review-button strong{display:block}.skill-value{font-size:11px;font-weight:900;margin:7px 0 4px}.lesson-status{display:block;color:var(--teal);font-size:11px;font-weight:800;margin-top:5px}.lesson-header{min-height:100px;padding:max(24px,env(safe-area-inset-top)) 20px 16px;background:linear-gradient(135deg,#075467,#0d7893);color:#fff;display:flex;align-items:center;gap:14px}.lesson-header h2{font-size:23px;margin:3px 0 0}.lesson-header small{opacity:.8;font-weight:700}.back-button{width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:32px;line-height:1}.lesson-progress{height:7px;background:#dbe8e9}.lesson-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--lime),#78c726);border-radius:0 10px 10px 0;transition:width .3s ease}.lesson-stage{margin-top:20px}.audio-button{width:100%;border:0;border-radius:18px;background:linear-gradient(135deg,#e3f6f9,#eff9f6);color:var(--teal-dark);font-weight:900;padding:17px}.choice-list{display:grid;gap:10px}.option-btn{display:flex;align-items:center;gap:12px;min-height:54px;margin:0;font-weight:700;transition:.18s}.option-btn span{display:grid;place-items:center;flex:0 0 30px;height:30px;border-radius:50%;background:#edf4f5;color:var(--teal);font-weight:900}.option-btn.correct{border-color:#75b929;background:#eff9e6}.option-btn.correct span{background:#75b929;color:#fff}.option-btn.wrong{border-color:#e65d55;background:#fff0ee}.option-btn.wrong span{background:#e65d55;color:#fff}.option-btn:disabled{opacity:1;color:var(--ink)}.answer-hint{text-align:center;color:var(--muted);font-size:12px;margin:17px 0 0}.feedback.success{background:#eff9e6}.feedback.retry{background:#fff3e8}.feedback strong{font-size:18px}.feedback p{margin:7px 0 0;line-height:1.45}.lesson-actions,.rating-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}.lesson-actions button,.rating-actions button{padding-left:10px;padding-right:10px}.speaking-moki{width:130px;height:150px;object-fit:cover;object-position:center top;border-radius:65px 65px 28px 28px;animation:mokiFloat 4s ease-in-out infinite}.microphone-wrap{margin:18px}.speech-label{text-align:left;margin:0 0 7px}.speech-text{display:block;width:100%;min-height:110px;border:1px solid var(--line);border-radius:16px;padding:13px;resize:vertical;color:var(--ink);background:#fbfcfc}.self-check{text-align:center;font-weight:800;line-height:1.45}.completion-card{margin-top:24px;overflow:hidden;position:relative}.completion-moki{width:120px;height:120px;border-radius:50%;object-fit:cover}.completion-icon{font-size:34px}.completion-card h2{margin:5px 0}.review-entry{position:relative;padding-top:22px}.review-due{position:absolute;z-index:2;top:4px;left:14px;padding:5px 10px;border-radius:12px;background:#e9f0f1;color:var(--muted);font-size:10px;font-weight:900}.review-due.due{background:#fff0ee;color:#d43f39}.empty-icon{font-size:42px;color:#75b929}.big-score{font-size:52px;font-weight:900;margin:8px}.stat-row{margin:16px 0}.stat-row>div:first-child{display:flex;justify-content:space-between;gap:12px;font-size:13px}.stat-track{height:9px;border-radius:10px;background:#e6edef;margin-top:7px;overflow:hidden}.stat-track>div{height:100%;border-radius:10px;background:linear-gradient(90deg,var(--lime),#77c82a)}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;text-align:center}.stats-grid div{display:grid;gap:3px;padding:14px;border-radius:16px;background:#f0f6f6}.stats-grid strong{font-size:25px}.stats-grid span{font-size:11px;color:var(--muted)}.logout-btn{width:calc(100% - 40px);margin:0 20px 20px}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

.level-selector{border:0;border-top:1px solid var(--line);margin:24px 0 4px;padding:20px 0 0}.level-selector legend{font-size:17px;font-weight:900;padding:0 10px 0 0}.range-heading{display:flex;align-items:center;justify-content:space-between;margin-top:8px}.range-heading label{margin:12px 0 5px}.range-heading output{min-width:44px;padding:6px 10px;border-radius:13px;background:var(--teal);color:#fff;font-weight:900;text-align:center}.level-selector input[type=range]{appearance:none;width:100%;height:8px;padding:0;border:0;border-radius:10px;background:linear-gradient(90deg,#a9d317,#0d7893);cursor:pointer}.level-selector input[type=range]::-webkit-slider-thumb{appearance:none;width:25px;height:25px;border:4px solid #fff;border-radius:50%;background:var(--coral);box-shadow:0 3px 10px rgba(9,62,75,.25)}.level-selector input[type=range]::-moz-range-thumb{width:18px;height:18px;border:4px solid #fff;border-radius:50%;background:var(--coral);box-shadow:0 3px 10px rgba(9,62,75,.25)}.range-scale{display:flex;justify-content:space-between;margin-top:8px;color:var(--muted);font-size:10px;font-weight:800}.account-preview{border:1px dashed #a9c5ca;background:#f8fcfc}.in-app-legal{margin:4px 20px 20px}

.legal-page{display:block;min-height:100dvh;background:#edf3f4;padding:28px 16px}.legal-document{width:min(820px,100%);margin:0 auto;background:#fff;border-radius:28px;padding:clamp(24px,5vw,54px);box-shadow:var(--shadow);line-height:1.62}.legal-document h1{margin-top:0;font-size:clamp(30px,5vw,44px)}.legal-document h2{margin-top:32px;font-size:21px}.legal-document h3{margin-top:24px}.legal-document a{color:var(--teal-dark)}.legal-document address{font-style:normal}.legal-document .back-link{display:inline-flex;margin-bottom:22px;font-weight:900;text-decoration:none}.legal-draft{padding:14px 16px;border-left:5px solid var(--yellow);border-radius:10px;background:#fff7df;color:#594b24}.legal-meta{color:var(--muted);font-size:13px}

@media(min-width:900px){
  body{align-items:flex-start;background:linear-gradient(135deg,#e6f1f2,#fff4e9)}
  .app-shell{max-width:1200px;min-height:100dvh}
  .login-card{max-width:560px;padding:44px 48px}
  .main-view{display:grid;grid-template-columns:220px minmax(0,1fr);align-items:start}
  .content{grid-column:2;grid-row:1;max-width:930px;width:100%;margin:0 auto;padding-bottom:40px}
  .bottom-nav{position:sticky;grid-column:1;grid-row:1;top:0;left:auto;bottom:auto;transform:none;width:220px;height:100dvh;display:flex;flex-direction:column;gap:8px;padding:30px 18px;background:linear-gradient(180deg,#075467,#0d7893);border:0}
  .bottom-nav:before{content:"¡Habla! Español";display:block;margin:4px 10px 30px;color:#fff;font-family:"Segoe Print","Bradley Hand",cursive;font-size:26px;font-weight:900;line-height:1.15}
  .nav-item{display:grid;grid-template-columns:34px 1fr;place-items:center start;min-height:54px;border-radius:16px;color:rgba(255,255,255,.72);padding:10px 14px}
  .nav-item small{font-size:13px}
  .nav-item.active{color:#fff;background:rgba(255,255,255,.15)}
  .home-hero{height:370px;border-radius:0 0 30px 30px}
  .hero-copy{padding-top:38px}.hero-copy h1{font-size:55px}.hero-copy p{font-size:18px}
  .hero-moki{right:95px;width:245px;height:340px}.hero-badges{right:25px;top:38px}
  .progress-card,.daily-card,.review-card,.quote-card{margin-left:34px;margin-right:34px}
  .skill-grid{margin-left:34px;margin-right:34px;gap:16px}.skill-card{min-height:190px;padding:22px 14px}
  .lesson-list,.grid-2{padding-left:34px;padding-right:34px}.card{margin-left:34px;margin-right:34px}
  .logout-btn{width:calc(100% - 68px);margin-left:34px;margin-right:34px}.in-app-legal{margin-left:34px;margin-right:34px}
}

/* Verbindliches Layout ab Version 1.4.8 */
:root{--coral:#ff3944;--ink:#063f56;--teal:#087a91;--teal-dark:#00566e;--lime:#86d500;--canvas:#f8faf9;--soft:#eef5f6;--shadow:0 10px 28px rgba(4,60,78,.10)}
.app-shell{background:var(--canvas)}
.login-view{background:linear-gradient(135deg,rgba(0,103,151,.78),rgba(13,160,187,.62) 45%,rgba(255,115,78,.68)),url("assets/login-background.png?v=1.4.11") center/cover}
.nav-brand,.nav-motivation,.desktop-hero{display:none}
.bottom-nav .nav-item img{width:25px;height:25px;object-fit:contain}.bottom-nav .nav-item span{display:none}.nav-item{cursor:pointer}.nav-item.active{color:var(--coral)}
.home-hero{height:315px;padding:36px 24px 0;background-image:linear-gradient(90deg,rgba(0,76,132,.30),rgba(0,0,0,0) 58%),url("assets/design/hero-coast.png?v=1.4.11");background-size:cover;background-position:58% center}.home-hero:before,.home-hero:after{display:none}.hero-copy{width:58%;padding-top:18px}.hero-copy h1{font-size:42px}.hero-copy p{font-size:15px}.hero-badges{top:34px}.hero-badge{display:flex;align-items:center;gap:5px}.hero-badge img{width:24px;height:24px;object-fit:contain}.hero-badge span{display:none}
.home-primary-grid,.home-secondary-grid{display:grid;gap:14px}.home-primary-grid{margin-top:-30px;position:relative;z-index:8}.home-primary-grid .progress-card,.home-primary-grid .daily-card{margin-top:0}.progress-card{margin-bottom:0}.progress-card h2{font-size:18px}.daily-card{position:relative;overflow:hidden;min-height:190px;grid-template-columns:1.25fr .75fr;margin-bottom:0}.daily-card h2{font-size:23px}.daily-card .primary-btn{margin-top:14px;padding:12px 20px}.daily-moki{position:absolute;right:-12px;bottom:-55px;width:190px;height:230px;object-fit:contain;filter:drop-shadow(0 10px 12px rgba(0,0,0,.12))}
.skill-grid{margin-top:15px}.skill-card{position:relative;display:grid;grid-template-rows:42px auto 1fr auto auto;justify-items:center;min-height:180px;padding:13px 7px}.skill-icon{width:40px;height:40px;object-fit:contain;margin:0}.skill-copy{display:contents}.skill-card strong{font-size:11px}.skill-card small{font-size:9px}.skill-count{font-size:8px}.skill-value{font-size:10px}.tiny-track{margin-top:3px}.home-secondary-grid{margin:0 20px 16px}.home-secondary-grid .review-card,.home-secondary-grid .quote-card{margin:0;width:100%}.review-card{min-height:82px}.review-button{display:grid;grid-template-columns:auto 1fr auto}.review-button>span:nth-child(2){text-align:left}.review-button>b{font-size:30px}.quote-card img{width:120px;height:110px;object-fit:contain;object-position:center bottom}.quote-card em{position:absolute;right:18px;bottom:12px;font-size:38px}
.section-title{min-height:92px;padding:max(34px,env(safe-area-inset-top)) 22px 18px;text-align:center;background:linear-gradient(135deg,#005c73,#078aa1)}.section-title h2{font-size:24px}.page-wrap{padding:17px 20px 98px}.section-tabs{display:grid;grid-template-columns:repeat(3,1fr);padding:4px;border-radius:25px;background:#eef1f2;margin-bottom:18px}.section-tabs button{border:0;border-radius:22px;background:transparent;color:var(--ink);padding:11px 5px;font-size:12px;cursor:pointer}.section-tabs button.active{background:linear-gradient(135deg,var(--coral),#ff5c57);color:#fff;font-weight:900;box-shadow:0 6px 14px rgba(255,57,68,.2)}.list-heading{font-size:20px;margin:20px 2px 12px}.page-wrap .lesson-list{padding:0}.lesson-card{width:100%;border:0;text-align:left;color:var(--ink);cursor:pointer}.lesson-card:active{transform:scale(.985)}.lesson-arrow{font-size:29px;color:var(--teal);text-align:center}.lesson-preview{display:none}
.skill-section-title>img{width:34px;height:34px;object-fit:contain}.skill-section-title>span{display:none}
.stats-page{padding-top:0}.stats-top-grid{display:grid}.progress-overview{text-align:left;background:linear-gradient(135deg,#f1f8f8,#fff)}.progress-overview h3,.skill-rings h3,.streak-card h3{font-size:21px}.progress-overview p{color:#62bc14;font-weight:900}.progress-overview p span{color:var(--ink);font-weight:500}.skill-rings>div{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.skill-ring{margin:0;text-align:center}.skill-ring>div{--value:0;--ring:#ff4149;width:66px;height:66px;max-width:100%;margin:auto;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#fff 55%,transparent 57%),conic-gradient(var(--ring) calc(var(--value)*1%),#e7ecee 0)}.skill-ring img{width:30px;height:30px;object-fit:contain}.skill-ring strong{display:block;margin-top:7px;font-size:17px}.skill-ring figcaption{font-size:9px}.streak-card{display:grid;gap:18px}.streak-card>div:first-child strong{display:flex;align-items:center;gap:10px;font-size:18px}.streak-card>div:first-child img{width:54px;height:54px;object-fit:contain}.week-row{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.week-row span{display:grid;place-items:center;gap:5px;font-size:11px}.week-row i{display:grid;place-items:center;width:28px;height:28px;border:3px solid #c8d1d4;border-radius:50%;font-style:normal;color:#fff}.week-row .done i{border-color:#6dca11;background:#6dca11}.streak-card>p{margin:0;padding:14px;border-radius:15px;background:#eff8ec}
.profile-avatar{width:115px;height:115px;object-fit:contain;object-position:center;border-radius:50%;background:linear-gradient(#e9f6f2,#fff)}
.practice-companion{display:grid;grid-template-columns:88px 1fr;align-items:center;gap:12px;margin:16px 20px 0;padding:12px 18px;border-radius:22px;background:linear-gradient(135deg,#fff6df,#eaf7f7);box-shadow:var(--shadow)}.practice-companion img{width:92px;height:90px;object-fit:contain;object-position:center bottom}.practice-companion div{display:grid;gap:5px}.practice-companion span{color:var(--muted);font-size:12px}
.lesson-header{position:relative;z-index:3}.speaking-scene{position:relative;height:420px;overflow:hidden;background:url("assets/design/hero-coast.png?v=1.4.11") left center/cover}.speaking-scene .speaking-moki{position:absolute;left:-12px;bottom:-85px;width:68%;height:430px;object-fit:contain;object-position:center bottom;border-radius:0;animation:mokiFloat 4s ease-in-out infinite}.speech-bubble{position:absolute;z-index:2;right:18px;top:105px;width:52%;padding:16px;border-radius:22px;background:#fff;box-shadow:var(--shadow);display:flex;gap:8px;align-items:flex-start;font-size:15px;font-weight:900;line-height:1.35}.speech-bubble:before{content:"";position:absolute;left:-16px;top:45%;border:10px solid transparent;border-right-color:#fff}.speech-bubble button{border:0;background:none;color:var(--teal);font-size:21px;cursor:pointer}.speaking-stage{margin-top:-16px;position:relative;z-index:5;border-radius:28px 28px 22px 22px}.microphone-wrap{display:flex;align-items:center;justify-content:center;gap:6px}.mic-btn{width:94px;height:94px;padding:0;border:7px solid #fff}.mic-btn img{width:100%;height:100%;object-fit:contain}.hint-btn{width:48px;height:48px;border:0;border-radius:50%;background:var(--teal-dark);color:#fff}.waveform{width:34px;height:35px;background:repeating-linear-gradient(90deg,transparent 0 3px,var(--coral) 3px 5px,transparent 5px 8px);mask:linear-gradient(to bottom,transparent,black 25% 75%,transparent)}.speech-label.center{text-align:center;font-size:15px}.finish-btn{border:3px solid var(--teal-dark);border-radius:24px;background:#fff;color:var(--ink);font-weight:900;padding:13px 25px;min-width:72%}.feedback-hero{height:360px;position:relative;overflow:hidden;background:linear-gradient(180deg,#006d9b,#009bc0 65%,#ff9271)}.feedback-hero img{position:absolute;left:50%;bottom:-110px;transform:translateX(-50%);width:82%;height:420px;object-fit:contain}.feedback-hero span{position:absolute;right:22px;top:68px;padding:16px 21px;border-radius:50%;background:#fff;color:#f12632;font-family:"Segoe Print",cursive;font-size:27px;font-weight:900;transform:rotate(-5deg)}.completion-card{margin-top:-28px;z-index:3;border-radius:28px}.feedback-scores{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:20px 0}.feedback-scores>div{display:grid;place-items:center;gap:4px;min-height:125px;border-radius:18px;background:#eef7f0;padding:10px}.feedback-scores>div:nth-child(2){background:#f2ecff}.feedback-scores img,.feedback-scores b{width:46px;height:46px;object-fit:contain;font-size:35px;color:#5fc800}.feedback-scores span{font-size:11px}.feedback-scores strong{font-size:17px}.feedback-tip{display:flex;align-items:center;gap:12px;border-radius:18px;background:#eaf5f7;padding:12px;text-align:left}.feedback-tip img{width:60px;height:60px;object-fit:contain}.feedback-tip p{margin:0;font-size:12px}

@media(max-width:899px){.main-view.lesson-mode .bottom-nav{display:none}.main-view.lesson-mode .content{padding-bottom:24px}}

@media(min-width:900px){
  body{background:#f5f5f4;padding:48px 24px}
  .app-shell{max-width:1280px;min-height:760px;border:1px solid #e3e8e9;border-radius:14px;box-shadow:0 20px 60px rgba(31,45,50,.10);overflow:hidden}
  .main-view{grid-template-columns:210px minmax(0,1fr);min-height:760px}
  .bottom-nav{position:sticky;grid-column:1;grid-row:1;top:0;width:210px;height:100vh;min-height:760px;padding:28px 18px;background:#fff;border-right:1px solid #e7ebec;gap:5px}
  .bottom-nav:before{display:none}.nav-brand{display:grid;margin:2px 16px 27px;color:var(--teal-dark);line-height:1}.nav-brand b{font-family:"Segoe Print","Bradley Hand",cursive;font-size:27px;transform:rotate(-4deg)}.nav-brand span{color:#f4b300;font-size:10px;font-weight:900;letter-spacing:3px;text-align:center;margin-top:4px}
  .nav-item{grid-template-columns:28px 1fr;min-height:48px;color:#5e697a;border-radius:10px;padding:9px 13px}.nav-item img{width:22px!important;height:22px!important}.nav-item.active{background:#fff0ed;color:var(--coral)}.nav-item small{font-size:13px}
  .nav-motivation{display:grid;grid-template-columns:62px 1fr;align-items:end;margin:auto 8px 8px;padding:8px;border-radius:14px;background:#fff7eb;color:var(--ink);font-size:12px;font-weight:900}.nav-motivation img{width:70px;height:86px;object-fit:contain;object-position:center bottom;margin-left:-10px}
  .content{grid-column:2;max-width:none;padding:0 0 34px;overflow:hidden}
  .home-hero{height:235px;border-radius:0;background-position:center 42%;padding:30px 36px}.hero-copy{padding-top:0;width:45%}.hero-copy h1{font-size:45px}.hero-copy p{font-size:16px}.hero-badges{right:30px;top:25px}.hero-badge{min-width:92px}
  .home-primary-grid{grid-template-columns:1fr 1.05fr;margin:16px 18px 0}.home-primary-grid .progress-card,.home-primary-grid .daily-card{margin:0;min-height:165px}.daily-moki{width:220px;height:250px;right:2px;bottom:-72px}.daily-card{padding:20px}.daily-card h2{font-size:22px;max-width:55%}
  .skill-grid{margin:14px 18px;gap:12px}.skill-card{min-height:130px;display:grid;grid-template-columns:58px 1fr;grid-template-rows:auto auto auto;text-align:left;justify-items:start;padding:14px 16px}.skill-icon{grid-row:1/4;width:50px;height:50px;align-self:center}.skill-copy{display:grid;grid-column:2}.skill-card strong{font-size:13px}.skill-card small{font-size:10px;margin-top:2px}.skill-count{font-size:9px;margin-top:8px}.skill-value{display:none}.tiny-track{grid-column:1/3;width:100%;margin-top:8px}
  .home-secondary-grid{grid-template-columns:1fr 1.05fr;margin:0 18px}.home-secondary-grid .review-card,.home-secondary-grid .quote-card{min-height:92px}.quote-card{grid-template-columns:120px 1fr}.quote-card img{height:96px}
  .desktop-hero{display:flex;align-items:center;justify-content:space-between;height:190px;padding:25px 38px;background:linear-gradient(90deg,rgba(0,70,130,.26),transparent 50%),url("assets/design/hero-coast.png?v=1.4.11") center 43%/cover;color:#fff}.desktop-hero>div:first-child{display:grid;gap:9px}.desktop-hero>div:first-child strong{font-family:"Segoe Print",cursive;font-size:37px;line-height:1}.desktop-hero>div:first-child span{font-size:14px}.desktop-hero-badges{display:grid;gap:8px;margin-right:10px}.desktop-hero-badges b{display:flex;align-items:center;gap:7px;padding:8px 13px;border-radius:20px;background:#fff;color:var(--ink);font-size:12px}.desktop-hero-badges img{width:25px;height:25px;object-fit:contain}
  .section-title{min-height:auto;padding:18px 34px 8px;text-align:left;background:#fff;color:var(--ink)}.section-title h2{font-size:27px}.page-wrap{padding:10px 34px 25px}.section-tabs{max-width:430px;margin-bottom:16px}.desktop-lesson-layout{display:grid;grid-template-columns:340px 1fr;gap:28px}.desktop-lesson-layout .lesson-list{padding:0}.lesson-card{grid-template-columns:62px 1fr 28px;padding:10px;margin-bottom:9px}.lesson-preview{display:grid;grid-template-columns:42% 1fr;min-height:390px;border:1px solid #e0e6e8;border-radius:18px;background:#fff;overflow:hidden;box-shadow:var(--shadow)}.lesson-preview-image{background:url("assets/design/hero-coast.png?v=1.4.11") 73% center/cover}.lesson-preview>div:last-child{padding:28px;display:flex;flex-direction:column}.lesson-preview h2{font-size:31px;margin:12px 0 5px}.lesson-preview p{color:var(--muted);line-height:1.5}.current-label{align-self:flex-start;color:var(--coral);border:1px solid var(--coral);border-radius:5px;padding:4px 6px;font-size:9px;font-weight:900}.preview-progress{margin-top:auto;display:grid;grid-template-columns:1fr auto;gap:8px;font-size:11px}.preview-progress>div{grid-column:1/3;height:8px;border-radius:10px;background:#e8edef;overflow:hidden}.preview-progress i{display:block;height:100%;background:var(--lime)}
  .stats-page{padding-top:10px}.stats-top-grid{grid-template-columns:.85fr 1.15fr;gap:20px}.stats-top-grid .card{margin:0}.skill-rings>div{gap:14px}.skill-ring>div{width:78px;height:78px}.streak-card{grid-template-columns:160px 1fr 210px;align-items:center;margin:20px 0}.streak-card h3{margin-top:0}.streak-card>p{font-size:12px}.profile-card{display:grid;grid-template-columns:130px 1fr;align-items:center;text-align:left}.profile-card img{grid-row:1/3}.profile-card h2,.profile-card p{margin:0}.practice-companion{margin:16px 34px 0}
  .lesson-header{height:66px;padding:10px 28px}.lesson-progress{position:absolute;z-index:4;top:28px;left:42%;right:45px;background:rgba(0,0,0,.15);border-radius:10px}.speaking-scene{height:390px;background-size:240% auto;background-position:left center}.speaking-scene .speaking-moki{left:18%;bottom:-145px;width:42%;height:500px}.speech-bubble{right:19%;top:90px;width:28%;font-size:18px}.speaking-stage{margin:-35px 24px 0;padding:22px 90px}.speech-text{max-width:620px;margin:10px auto}.finish-btn{min-width:250px}.feedback-hero{height:340px}.feedback-hero img{width:48%;height:430px;bottom:-120px}.feedback-hero span{right:24%;top:55px}.completion-card{max-width:900px;margin:-35px auto 20px}.feedback-scores{gap:24px}.feedback-scores>div{min-height:140px}.feedback-tip{justify-content:center}.feedback-tip img{width:75px;height:75px}
}

@media(max-width:389px){.skill-card{padding-left:4px;padding-right:4px}.skill-icon{width:34px;height:34px}.skill-card strong{font-size:10px}.daily-moki{opacity:.72}.hero-copy h1{font-size:36px}}

/* Rechtliche Links und Datenschutz-Hinweis ab Version 1.4.8 */
.legal-links{flex-wrap:wrap;row-gap:8px}.legal-links button,.persistent-legal button{border:0;padding:0;background:none;color:var(--teal-dark);font:inherit;font-weight:800;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.persistent-legal{position:fixed;z-index:49;left:50%;bottom:82px;transform:translateX(-50%);width:min(480px,100%);min-height:24px;display:flex;align-items:center;justify-content:center;gap:15px;padding:5px 10px calc(5px + env(safe-area-inset-bottom));background:rgba(248,250,249,.94);border-top:1px solid rgba(9,62,75,.07);font-size:10px;backdrop-filter:blur(12px)}.persistent-legal a{color:var(--teal-dark);font-weight:800;text-underline-offset:2px}.persistent-legal button{font-size:10px}.content{padding-bottom:128px}.main-view.lesson-mode .persistent-legal{bottom:0}
.consent-layer{position:fixed;z-index:300;inset:0;display:flex;align-items:flex-end;justify-content:center;padding:18px;background:rgba(2,37,48,.35);backdrop-filter:blur(3px)}.consent-card{width:min(720px,100%);display:grid;grid-template-columns:48px 1fr;gap:10px 14px;padding:20px;border:1px solid rgba(255,255,255,.55);border-radius:24px;background:rgba(255,255,255,.98);box-shadow:0 22px 70px rgba(0,42,55,.28)}.consent-mark{grid-row:1/3;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,var(--lime),#56b827);color:#fff;font-size:24px;font-weight:900}.consent-copy h2{margin:0 0 7px;font-size:20px}.consent-copy>p{margin:0;color:var(--muted);font-size:12px;line-height:1.48}.consent-essential{display:flex;justify-content:space-between;gap:14px;margin-top:12px!important;padding:9px 12px;border-radius:12px;background:#eef7f2;color:var(--ink)!important}.consent-essential span{color:#4e9b22;font-weight:900}.consent-links{display:flex;gap:16px;margin-top:10px;font-size:11px}.consent-links a{color:var(--teal-dark);font-weight:800}.consent-confirm{grid-column:2;justify-self:end;min-width:150px;padding:11px 20px}
.legal-document-footer{display:flex;gap:22px;margin-top:32px;padding-top:18px;border-top:1px solid var(--line);font-size:13px;font-weight:800}
@media(max-width:480px){.consent-layer{padding:10px}.consent-card{grid-template-columns:36px 1fr;padding:16px 15px;border-radius:21px}.consent-mark{width:34px;height:34px;font-size:19px}.consent-copy h2{font-size:17px}.consent-confirm{grid-column:1/3;width:100%}}
@media(min-width:900px){.persistent-legal{position:sticky;grid-column:1;grid-row:1;align-self:end;left:auto;bottom:10px;transform:none;width:174px;min-height:0;margin:0 18px 14px;padding:8px 2px;gap:9px;border:0;border-radius:10px;background:rgba(255,255,255,.92);font-size:9px}.persistent-legal button{font-size:9px}.content{padding-bottom:52px}.nav-motivation{margin-bottom:58px}.consent-layer{padding:28px}.consent-card{align-items:center;grid-template-columns:52px 1fr auto}.consent-mark{grid-row:1}.consent-confirm{grid-column:3;grid-row:1}.consent-copy h2{font-size:22px}}
@media(min-width:900px){.persistent-legal{position:fixed;left:max(42px,calc(50% - 622px));bottom:18px;transform:none;margin:0}}

/* Neue SVG-Wortmarke ab Version 1.4.8 */
.login-logo{width:min(290px,88%);height:auto;border-radius:0;box-shadow:none;margin:0 auto 14px;object-fit:contain}
@media(min-width:900px){.nav-brand{display:flex;align-items:center;justify-content:center;margin:0 8px 28px}.nav-brand img{display:block;width:158px;height:auto}}

/* Erweiterte Profildaten und sichere Passworteingabe ab Version 1.4.8 */
.optional-label{margin-left:5px;color:var(--muted);font-size:10px;font-weight:700}.password-change-card .profile-password-row{margin-top:9px}.profile-password-row input{min-width:0}.password-eye{flex:0 0 52px;display:grid;place-items:center;cursor:pointer;color:var(--teal-dark)}.password-eye svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.password-eye[aria-pressed="true"]{background:#dceef0;color:var(--coral)}.password-change-card .small{line-height:1.45;margin:12px 2px}.password-change-card>.ghost-btn{margin-top:4px}
