:root{--green:#2d6a4f;--green-light:#40916c;--green-pale:#d8f3dc;--orange:#e76f51;--orange-light:#f4a261;--blue:#264653;--blue-light:#2a9d8f;--sand:#faf3e0;--white:#fff;--gray:#6b7280;--gray-light:#e5e7eb;--radius:16px;--radius-sm:10px;--shadow:0 4px 24px #00000014;--shadow-lg:0 8px 40px #0000001f}*{box-sizing:border-box;margin:0;padding:0}body{background:#f0f4f0;justify-content:center;align-items:flex-start;min-height:100dvh;padding:16px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;display:flex}#root{justify-content:center;width:100%;display:flex}.phone{background:var(--sand);width:100%;max-width:390px;min-height:750px;box-shadow:var(--shadow-lg);border-radius:40px;position:relative;overflow:hidden}.screen{flex-direction:column;min-height:750px;animation:.3s fadeIn;display:flex;position:relative}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.btn{cursor:pointer;-webkit-tap-highlight-color:transparent;border:none;border-radius:50px;justify-content:center;align-items:center;gap:8px;padding:16px 32px;font-size:16px;font-weight:700;transition:all .2s;display:inline-flex}.btn:active{transform:scale(.96)}.btn-primary{background:var(--white);color:var(--green)}.btn-primary:hover{background:var(--green-pale)}.btn-orange{background:var(--orange);color:var(--white)}.btn-orange:hover{background:var(--orange-light)}.btn-outline{color:var(--white);background:0 0;border:2px solid #fff6}.home{background:linear-gradient(160deg, var(--green) 0%, var(--green-light) 50%, var(--blue-light) 100%);color:var(--white);text-align:center;justify-content:center;align-items:center;gap:24px;padding:48px 32px}.home-logo{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff26;border:2px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:120px;height:120px;font-size:56px;display:flex}.home h1{letter-spacing:-.5px;font-size:28px;font-weight:800}.home p{opacity:.85;max-width:280px;font-size:15px;line-height:1.5}.streak-badge{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff26;border-radius:50px;align-items:center;gap:6px;padding:8px 16px;font-size:13px;display:inline-flex}.levels{background:var(--sand);padding:0}.levels-header{background:linear-gradient(135deg, var(--green) 0%, var(--green-light) 100%);color:var(--white);border-radius:0 0 28px 28px;padding:48px 24px 32px}.levels-header .back{color:var(--white);cursor:pointer;opacity:.8;background:0 0;border:none;align-items:center;gap:4px;margin-bottom:12px;font-size:15px;display:flex}.levels-header h2{font-size:24px;font-weight:800}.levels-header p{opacity:.8;margin-top:4px;font-size:14px}.levels-list{flex-direction:column;flex:1;gap:12px;padding:20px;display:flex;overflow-y:auto}.level-card{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);cursor:pointer;border:2px solid #0000;align-items:center;gap:16px;padding:20px;transition:all .2s;display:flex}.level-card:hover{border-color:var(--green-light)}.level-card.locked{opacity:.5;pointer-events:none}.level-icon{border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:52px;height:52px;font-size:24px;display:flex}.level-icon.l1{background:var(--green-pale)}.level-icon.l2{background:#fde8d0}.level-icon.l3{background:#dbeafe}.level-icon.l4{background:#ede9fe}.level-info{flex:1}.level-info h3{color:var(--blue);font-size:16px;font-weight:700}.level-info p{color:var(--gray);margin-top:2px;font-size:13px}.level-badge{color:var(--white);border-radius:50px;flex-shrink:0;padding:4px 10px;font-size:11px;font-weight:700}.level-badge.new{background:var(--green-light)}.level-badge.lock{background:var(--gray-light);color:var(--gray)}.session{background:var(--sand);padding:0}.session-top{justify-content:space-between;align-items:center;padding:44px 20px 16px;display:flex}.session-top .back{cursor:pointer;color:var(--gray);background:0 0;border:none;align-items:center;gap:4px;font-size:14px;display:flex}.session-timer{color:var(--blue);background:var(--white);border-radius:50px;padding:6px 14px;font-size:15px;font-weight:700;box-shadow:0 2px 8px #0000000f}.progress-bar{background:var(--gray-light);border-radius:4px;height:4px;margin:0 20px;overflow:hidden}.progress-bar-fill{background:linear-gradient(90deg, var(--green-light), var(--blue-light));border-radius:4px;height:100%;transition:width .5s}.exercise-card-wrapper{flex-direction:column;flex:1;justify-content:center;gap:16px;padding:24px 20px;display:flex}.exercise-phase{text-align:center;text-transform:uppercase;letter-spacing:1.5px;font-size:12px;font-weight:700}.exercise-phase.dog{color:var(--orange)}.exercise-phase.human{color:var(--green)}.exercise-main{background:var(--white);text-align:center;box-shadow:var(--shadow);border-radius:24px;padding:32px 24px;position:relative;overflow:hidden}.exercise-main.dog-border{border-top:4px solid var(--orange)}.exercise-main.human-border{border-top:4px solid var(--green)}.exercise-emoji{margin-bottom:16px;font-size:56px}.exercise-name{color:var(--blue);margin-bottom:8px;font-size:22px;font-weight:800}.exercise-desc{color:var(--gray);margin-bottom:16px;font-size:14px;line-height:1.5}.exercise-reps{background:var(--green-pale);color:var(--green);border-radius:50px;align-items:center;gap:6px;padding:8px 16px;font-size:14px;font-weight:600;display:inline-flex}.exercise-reps.dog-reps{color:var(--orange);background:#fde8d0}.session-btns{gap:12px;padding:0 20px 32px;display:flex}.session-btns .btn{flex:1}.btn-next{background:var(--green);color:var(--white);border-radius:16px;padding:16px}.btn-next:hover{background:var(--green-light)}.btn-next.dog-next{background:var(--orange)}.btn-next.dog-next:hover{background:var(--orange-light)}.btn-skip{background:var(--gray-light);color:var(--gray);border-radius:16px;padding:16px;flex:.4!important}.knowledge-card{text-align:center;color:var(--white);box-shadow:var(--shadow);background:linear-gradient(135deg,#264653 0%,#2a9d8f 100%);border-radius:24px;padding:28px 24px}.knowledge-card .kc-label{text-transform:uppercase;letter-spacing:1.5px;opacity:.7;margin-bottom:12px;font-size:11px}.knowledge-card .kc-icon{margin-bottom:12px;font-size:36px}.knowledge-card h3{margin-bottom:8px;font-size:18px;font-weight:700}.knowledge-card p{opacity:.9;font-size:14px;line-height:1.5}.walk-card{background:linear-gradient(135deg, var(--green-pale) 0%, #b7e4c7 100%);text-align:center;box-shadow:var(--shadow);border-radius:24px;padding:32px 24px}.walk-card .walk-emoji{margin-bottom:12px;font-size:48px}.walk-card h3{color:var(--green);font-size:20px;font-weight:700}.walk-card p{color:var(--green-light);margin-top:6px;font-size:14px}.music-moment{text-align:center;color:var(--white);box-shadow:var(--shadow);background:linear-gradient(135deg,#7c3aed,#a78bfa);border-radius:24px;padding:24px}.music-moment .mm-icon{margin-bottom:8px;font-size:40px}.music-moment h3{font-size:16px;font-weight:700}.music-moment p{opacity:.8;margin-top:4px;font-size:13px}.complete{background:linear-gradient(160deg, var(--green) 0%, var(--blue-light) 100%);color:var(--white);text-align:center;justify-content:center;align-items:center;gap:20px;padding:48px 32px}.complete-icon{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff26;border-radius:50%;justify-content:center;align-items:center;width:100px;height:100px;font-size:48px;display:flex}.complete h2{font-size:26px;font-weight:800}.complete p{opacity:.85;font-size:15px;line-height:1.5}.stats-row{gap:16px;margin:8px 0;display:flex}.stat-box{border-radius:var(--radius);text-align:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff1f;flex:1;padding:16px 20px}.stat-box .stat-val{font-size:24px;font-weight:800}.stat-box .stat-label{opacity:.7;text-transform:uppercase;letter-spacing:.5px;margin-top:4px;font-size:11px}.complete-actions{flex-direction:column;gap:10px;width:100%;margin-top:8px;display:flex}.complete-actions .btn{width:100%}@media (width<=420px){body{padding:0}.phone{border-radius:0;min-height:100dvh}}