html,body,#root{min-height:100%}*{box-sizing:border-box;margin:0;padding:0}body{color:#1f2937;background:#f4f8f1;font-family:Arial,sans-serif}.app{min-height:100vh}.navbar{background:#fff;border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;height:70px;padding:0 8%;display:flex}.logo{color:#245c35;font-size:22px;font-weight:700}.tagline{color:#6b7280;font-size:14px}.hero{justify-content:center;align-items:center;min-height:calc(100vh - 120px);padding:50px 20px;display:flex}.hero-content{text-align:center;width:100%;max-width:850px}.badge{color:#28643b;background:#e1f0df;border-radius:30px;margin-bottom:20px;padding:8px 16px;font-size:14px;display:inline-block}h1{margin-bottom:20px;font-size:58px;line-height:1.1}h1 span{color:#3c8c4a}.hero-content>p{color:#6b7280;margin-bottom:35px;font-size:18px;line-height:1.6}.card{text-align:left;background:#fff;border-radius:24px;padding:35px;box-shadow:0 15px 40px #00000014}.card h2{margin-bottom:15px;font-size:18px}.options{flex-wrap:wrap;gap:12px;margin-bottom:30px;display:flex}.option{cursor:pointer;background:#fff;border:2px solid #e5e7eb;border-radius:12px;flex:1;min-width:120px;padding:14px;font-size:15px;transition:all .2s}.option:hover{border-color:#4d9659}.option.active{color:#28643b;background:#e5f4e5;border-color:#4d9659;font-weight:600}.generate{color:#fff;cursor:pointer;background:#28643b;border:none;border-radius:14px;width:100%;padding:16px;font-size:17px;font-weight:600;transition:all .2s}.generate:hover{background:#1d4d2c;transform:translateY(-2px)}footer{text-align:center;color:#6b7280;padding:20px;font-size:14px}@media (width<=600px){h1{font-size:40px}.navbar{padding:0 20px}.tagline{display:none}.card{padding:25px 20px}}.mission-card{text-align:left;background:#f1f8ef;border:1px solid #d4e8d0;border-radius:18px;margin-top:25px;padding:25px}.mission-header{align-items:center;gap:15px;margin-bottom:20px;display:flex}.mission-icon{font-size:35px}.mission-header h2{color:#245c35;margin:0}.mission-header p{color:#6b7280;margin-top:5px;font-size:14px}.mission-content{white-space:pre-line;color:#374151;background:#fff;border-radius:14px;padding:20px;line-height:1.7}.phone-warning{text-align:center;color:#695b20;background:#fff8df;border-radius:12px;margin-top:15px;padding:14px;font-size:14px}.start-mission{color:#fff;cursor:pointer;background:#28643b;border:none;border-radius:12px;width:100%;margin-top:18px;padding:15px;font-size:17px;font-weight:600;transition:all .2s}.start-mission:hover{background:#1d4d2c;transform:translateY(-2px)}.mission-started{text-align:center;background:#eaf5e7;border-radius:20px;margin-top:25px;padding:35px 25px}.big-leaf{margin-bottom:10px;font-size:55px}.mission-started h2{color:#245c35;font-size:28px}.mission-started p{color:#4b5563;line-height:1.6}.screen-break{background:#fff;border-radius:14px;margin:25px 0;padding:20px;font-size:18px;line-height:1.8}.come-back{font-size:14px;font-style:italic}.timer{color:#28643b;letter-spacing:3px;margin:25px 0;font-size:64px;font-weight:700}.history-section{background:#fff;border-radius:18px;margin-top:30px;padding:25px;box-shadow:0 8px 25px #0000000f}.history-section h2{color:#245c35;margin-bottom:20px}.history-list{flex-direction:column;gap:12px;display:flex}.history-item{background:#f6faf4;border:1px solid #e0ebdc;border-radius:14px;align-items:center;gap:15px;padding:15px;display:flex}.history-icon{font-size:28px}.history-info{flex:1}.history-info h3{color:#245c35;margin:0;font-size:16px}.history-info p{color:#6b7280;margin:5px 0 0;font-size:14px}.history-status{color:#8a6d1d;font-size:13px}.history-status.completed{color:#24733a;font-weight:600}.progress-section{background:#fff;border-radius:18px;margin-top:30px;padding:25px;box-shadow:0 8px 25px #0000000f}.progress-section h2{color:#245c35;text-align:center;margin-bottom:20px}.progress-card{text-align:center;background:#f6faf4;border:1px solid #e0ebdc;border-radius:14px;padding:20px 10px}.progress-icon{margin-bottom:8px;font-size:28px}.progress-card h3{color:#245c35;margin:0;font-size:26px}.progress-card p{color:#6b7280;margin:6px 0 0;font-size:13px}.progress-grid{grid-template-columns:repeat(5,1fr);gap:15px;display:grid}@media (width<=700px){.progress-grid{grid-template-columns:repeat(2,1fr)}}.streak-card{position:relative;overflow:hidden}.streak-message{color:#24733a;margin-top:8px;font-size:11px;font-weight:600;display:block}