:root{--bg:#fff8f1;--card:#fff;--ink:#2b2340;--muted:#7a7090;--line:#eadfd6;--rose:#e2557b;--rose-dark:#c23d63;--navy:#2f3e7a;--gold:#e8b04b;--ok:#2e9e6a;--ok-bg:#e5f6ee;--bad:#d64545;--bad-bg:#fdeaea;--warn-bg:#fff4d6;--radius:18px;--shadow:0 6px 20px #2b234014;--font:"Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;--display:"Playfair Display", Georgia, serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-tap-highlight-color:transparent;margin:0;font-size:17px;line-height:1.4}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}h1,h2,h3{margin:0;line-height:1.2}h2{font-family:var(--display);font-size:1.6rem}h3{font-size:1.1rem}p{margin:0}.screen{max-width:720px;padding:max(12px, env(safe-area-inset-top)) 16px calc(24px + env(safe-area-inset-bottom));flex-direction:column;gap:14px;min-height:100dvh;margin:0 auto;display:flex}.screen.center{text-align:center;justify-content:center;align-items:stretch}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}.stack{flex-direction:column;gap:12px;display:flex}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.row.between{justify-content:space-between}.row.center{justify-content:center}.row.gap{gap:10px}.muted{color:var(--muted)}.small{font-size:.85rem}.center-text{text-align:center}.error{color:var(--bad);font-weight:600}.btn{background:#f1e8e1;border:none;border-radius:999px;padding:12px 22px;font-size:1rem;font-weight:800;transition:transform 80ms,filter .15s}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.5}.btn.primary{background:var(--rose);color:#fff;box-shadow:0 4px 0 var(--rose-dark)}.btn.gold{background:var(--gold);color:var(--ink);box-shadow:0 4px #b9831f}.btn.ghost{border:2px solid var(--line);background:0 0}.btn.danger{background:var(--bad-bg);color:var(--bad)}.btn.big{width:100%;padding:16px 22px;font-size:1.1rem}.btn.small{align-self:flex-start;padding:6px 14px;font-size:.85rem}.btn.pulse{animation:1.6s ease-in-out infinite pulse}@keyframes pulse{50%{filter:brightness(1.08);transform:scale(1.03)}}.icon-btn,.back{background:#f1e8e1;border:none;border-radius:50%;place-items:center;width:40px;height:40px;font-size:1.2rem;display:grid}.back.floating{top:max(12px, env(safe-area-inset-top));position:absolute;left:16px}.speaker{vertical-align:middle;background:#fbe3ea;border:none;border-radius:50%;flex:none;width:36px;height:36px;font-size:1rem}.topbar{grid-template-columns:40px 1fr auto;align-items:center;gap:10px;min-height:44px;display:grid}.topbar h1{font-family:var(--display);text-align:center;font-size:1.3rem}.topbar-right{justify-content:flex-end;min-width:40px;display:flex}.logo{font-family:var(--display);color:var(--rose);flex-direction:column;align-items:center;margin-bottom:8px;line-height:1;display:flex}.logo span{font-size:2.6rem;font-style:italic}.logo small{color:var(--navy);letter-spacing:.2em;text-transform:uppercase;font-size:1.2rem}.welcome p{color:var(--muted)}.text-input{font:inherit;border:2px solid var(--line);border-radius:12px;width:100%;padding:12px 14px;font-size:18px}.text-input:focus{border-color:var(--rose);outline:none}label{text-align:left;font-weight:700}.profile-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;display:grid}.profile-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);border:none;flex-direction:column;align-items:center;gap:6px;padding:12px;font-weight:800;display:flex}.profile-avatar{width:90px;height:140px}.profile-card.add{border:2px dashed var(--line);box-shadow:none;background:0 0;justify-content:center;min-height:190px}.plus{color:var(--rose);font-size:2.2rem}.pin-dots{justify-content:center;gap:14px;margin:10px 0;display:flex}.pin-dots span{border:3px solid var(--rose);border-radius:50%;width:18px;height:18px}.pin-dots span.on{background:var(--rose)}.pinpad{grid-template-columns:repeat(3,76px);justify-content:center;gap:12px;display:grid}.pinpad button{background:var(--card);height:76px;box-shadow:var(--shadow);border:none;border-radius:50%;font-size:1.6rem;font-weight:800}.pinpad button:active{background:#fbe3ea}.create-layout{grid-template-columns:1fr;gap:12px;display:grid}.create-preview{justify-content:center;display:flex}.avatar-lg{height:260px}.avatar-md{height:200px}@media (width>=640px){.create-layout{grid-template-columns:220px 1fr;align-items:start}}.look-editor{text-align:left;flex-direction:column;gap:10px;display:flex}.look-label{color:var(--muted);font-size:.85rem;font-weight:700}.look-options{flex-wrap:wrap;gap:6px;margin-top:4px;display:flex}.look-opt{border:2px solid var(--line);background:#fff;border-radius:12px;min-height:38px;padding:6px 10px;font-size:.85rem;font-weight:700}.look-opt.on{border-color:var(--rose);background:#fde9ef}.swatch{border:2px solid #00000026;border-radius:50%;width:24px;height:24px;display:block}.home-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.hello{font-family:var(--display);font-size:clamp(1.2rem,5vw,1.6rem)}.level-tag{color:var(--navy);font-size:.9rem;font-weight:700}.home-stats{align-items:center;gap:10px;display:flex}.streak b,.spool b{font-weight:800}.spool{box-shadow:var(--shadow);background:#fff;border-radius:999px;align-items:center;gap:4px;padding:4px 10px 4px 6px;display:inline-flex}.sync-dot{background:var(--ok);border-radius:50%;width:10px;height:10px}.sync-dot.pending{background:var(--gold)}.sync-dot.offline{background:#bbb}.stage{border-radius:var(--radius);height:min(42vh,380px);box-shadow:var(--shadow);cursor:pointer;position:relative;overflow:hidden}.stage.small{cursor:default;height:min(36vh,300px)}.stage-bg{width:100%;height:100%;position:absolute;inset:0}.stage-avatar{filter:drop-shadow(0 8px 6px #0003);height:88%;position:absolute;bottom:4%;left:50%;transform:translate(-50%)}.stage-avatar.idle{transform-origin:50% 100%;animation:4s ease-in-out infinite sway}@keyframes sway{0%,to{transform:translate(-50%)rotate(-1.2deg)}50%{transform:translate(-50%)rotate(1.2deg)}}.twinkle{animation:1.8s ease-in-out infinite twinkle}@keyframes twinkle{50%{opacity:.25}}.progress-card{flex-direction:column;gap:8px;display:flex}.progress{background:#f1e8e1;border-radius:999px;height:12px;overflow:hidden}.progress div{background:linear-gradient(90deg, var(--rose), var(--gold));border-radius:999px;height:100%;transition:width .4s}.home-nav{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.tile{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);border:none;flex-direction:column;align-items:center;gap:4px;padding:14px 6px;font-size:.85rem;font-weight:700;display:flex}.tile-icon{font-size:1.7rem}.learn .task{flex-direction:column;gap:16px;display:flex}.badge{color:var(--rose-dark);background:#fde9ef;border-radius:999px;align-self:flex-start;padding:4px 12px;font-size:.8rem;font-weight:800}.prompt-fr{font-family:var(--display);color:var(--navy);word-break:break-word;align-items:center;gap:10px;font-size:1.9rem;font-weight:700;display:flex}.prompt-de{font-size:1.5rem;font-weight:800}.prompt-hint{color:var(--muted);margin-top:4px;font-size:.9rem}.example{background:#f8f3ff;border-radius:12px;flex-direction:column;gap:4px;padding:12px;display:flex}.note{background:var(--warn-bg);border-radius:12px;padding:10px 12px;font-size:.92rem}.choices{grid-template-columns:1fr;gap:10px;display:grid}@media (width>=560px){.choices{grid-template-columns:1fr 1fr}}.choice{border:2px solid var(--line);text-align:left;background:#fff;border-radius:14px;min-height:56px;padding:14px;font-weight:700}.choice.ok{border-color:var(--ok);background:var(--ok-bg)}.choice.bad{border-color:var(--bad);background:var(--bad-bg)}.answer{flex-direction:column;gap:8px;display:flex}.answer-input{font:inherit;border:2px solid var(--line);background:#fff;border-radius:14px;width:100%;padding:14px;font-size:20px}.answer-input:focus{border-color:var(--rose);outline:none}.answer-input.bad{border-color:var(--bad);animation:.3s shake}@keyframes shake{25%{transform:translate(-6px)}75%{transform:translate(6px)}}.accents{flex-wrap:wrap;gap:6px;display:flex}.accents button{background:#f1e8e1;border:none;border-radius:10px;min-width:40px;height:40px;font-size:1.1rem;font-weight:700}.accents button:active{background:#fbe3ea}.feedback{border-radius:14px;flex-direction:column;gap:8px;padding:14px;display:flex}.feedback.ok{background:var(--ok-bg)}.feedback.bad{background:var(--bad-bg)}.feedback.warn{background:var(--warn-bg)}.big-mark{font-size:1.15rem;font-weight:800}.feedback.ok .big-mark{color:var(--ok)}.feedback.bad .big-mark{color:var(--bad)}.solution{font-family:var(--display);color:var(--navy);flex-wrap:wrap;align-items:center;gap:8px;font-size:1.35rem;display:flex}.diff{letter-spacing:.02em;font-family:ui-monospace,Menlo,monospace;font-size:1.2rem}.diff-same{color:var(--ink)}.diff-missing{color:var(--ink);background:#ffe08a;border-radius:4px;padding:0 2px;text-decoration:underline}.diff-extra{color:var(--bad);text-decoration:line-through}.retype-label{font-weight:700}.score{color:var(--navy);font-size:1.4rem;font-weight:800}.fils-earned{color:var(--rose-dark);font-weight:800}.defile-hint{background:#fff4d6;border-radius:12px;padding:10px;font-weight:700}.wobbly{text-align:left;background:#faf6f2;border-radius:12px;padding:12px}.wobbly ul{margin:6px 0 0;padding-left:18px}.tabs{gap:6px;padding-bottom:4px;display:flex;overflow-x:auto}.tab{width:44px;height:44px;box-shadow:var(--shadow);background:#fff;border:none;border-radius:50%;flex:none;font-weight:800}.tab.on{background:var(--rose);color:#fff}.tab.locked{opacity:.6}.collection-title{text-align:center;flex-direction:column;display:flex}.collection-title small{font-family:var(--font);color:var(--muted);font-size:.9rem}.item-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;display:grid}.item-card{border-radius:var(--radius);box-shadow:var(--shadow);text-align:center;background:#fff;border:2px solid #0000;flex-direction:column;align-items:center;gap:2px;padding:10px;display:flex}.item-card.worn{border-color:var(--rose)}.item-card.locked,.item-card.poor{opacity:.55}.item-img{width:auto;height:130px}.item-img.big{align-self:center;height:200px}.item-fr{font-size:.9rem;font-weight:800}.item-de{color:var(--muted);font-size:.75rem}.item-cost{color:var(--rose-dark);margin-top:4px;font-size:.8rem;font-weight:800}.modal{z-index:10;background:#2b234073;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal .card{width:100%;max-width:420px;max-height:90dvh;overflow:auto}.runway-stage{border-radius:var(--radius);height:60vh;box-shadow:var(--shadow);position:relative;overflow:hidden}.runway{clip-path:polygon(38% 0,62% 0,100% 100%,0 100%);opacity:.9;background:linear-gradient(#f3d9e3,#e2557b);width:70%;height:55%;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.runway-avatar{transform-origin:50% 100%;filter:drop-shadow(0 10px 8px #0000004d);height:80%;animation:3.2s ease-out forwards walk;position:absolute;bottom:2%;left:50%}@keyframes walk{0%{transform:translate(-50%)translateY(-38%)scale(.35)}15%,35%,55%,75%{transform:translateX(-50%) translateY(var(--ty,-20%)) scale(var(--s,.6)) rotate(-2deg)}to{transform:translate(-50%)translateY(0)scale(1)rotate(0)}}.flashes span{opacity:0;background:radial-gradient(#fff,#fff0);border-radius:50%;width:40px;height:40px;animation:2s infinite flash;position:absolute;top:8%}@keyframes flash{0%,90%,to{opacity:0}94%{opacity:1}}.confetti span{border-radius:2px;width:8px;height:14px;animation:3s linear infinite fall;position:absolute;top:-10px}@keyframes fall{to{transform:translateY(70vh)rotate(540deg)}}.lesson{flex-direction:column;gap:10px;display:flex}.word-list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.word-list li button{border:none;border-top:1px solid var(--line);text-align:left;background:0 0;grid-template-columns:1fr 1fr auto;align-items:center;gap:8px;width:100%;padding:10px 2px;display:grid}.word-list li.new button{opacity:.55}.word-list span[lang=fr]{color:var(--navy);font-weight:700}.stars span{color:#e3d8cf}.stars span.on{color:var(--gold)}.chip-row{flex-wrap:wrap;gap:8px;display:flex}.chip{border:2px solid var(--line);background:#fff;border-radius:999px;padding:8px 14px;font-weight:700}.chip.strong{border-color:var(--rose);color:var(--rose-dark)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}.runway-avatar{transform:translate(-50%)}}