@import url("lesson-5.css");

.weather-lesson-body{font-family:"Fredoka",sans-serif}
.floating-weather-one{top:17%;left:5%;transform:rotate(-7deg)}
.floating-weather-two{top:44%;right:5%;transform:rotate(7deg)}
.floating-weather-three{bottom:12%;left:8%;transform:rotate(-5deg)}

.weather-intro-page .story-book-icon{width:116px;height:116px;margin:0 auto 22px;display:flex;align-items:center;justify-content:center;border-radius:34px;background:linear-gradient(145deg,#e7f6ff,#d7ecf8);border:2px solid rgba(93,169,210,.16);box-shadow:0 15px 30px rgba(78,132,165,.09);font-size:61px}
.weather-intro-page .mission-icon{background:linear-gradient(145deg,#fff6d9,#f8e9b9)}
.weather-map-page{position:relative}

.weather-progress-card{width:min(720px,100%);margin:0 auto 30px;padding:23px 24px;border-radius:26px;background:linear-gradient(180deg,#fffefd,#f2f9fd);border:2px solid #d8e8f0;border-bottom:7px solid #bfd3de;box-shadow:0 12px 28px rgba(63,104,127,.07);text-align:center}
.weather-progress-icons{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:20px}
.weather-progress-icon{width:96px;min-height:92px;padding:12px 7px;display:flex;align-items:center;justify-content:center;border-radius:22px;background:linear-gradient(145deg,#eef2f4,#e7ecef);border:2px solid #d6e0e5;opacity:.46;filter:grayscale(.5);font-size:39px;transition:transform .3s ease,opacity .3s ease,filter .3s ease,background .3s ease,border .3s ease,box-shadow .3s ease}
.weather-progress-icon.completed{opacity:1;filter:none;transform:translateY(-3px);box-shadow:0 9px 18px rgba(82,123,144,.09)}
.weather-progress-icon:nth-child(1).completed{background:linear-gradient(145deg,#e7f6ff,#d7ebf6);border-color:#b9d8e8}
.weather-progress-icon:nth-child(2).completed{background:linear-gradient(145deg,#fff2dc,#f3e4bd);border-color:#e4d3a4}
.weather-progress-icon:nth-child(3).completed{background:linear-gradient(145deg,#f1edfb,#e5ddf3);border-color:#d1c4e5}

.rainbow-progress-information{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;color:#71828c;font-size:12px}
.rainbow-progress-information strong{color:#5b7280}
.weather-overall-track{width:100%;height:10px;margin-top:14px;overflow:hidden;border-radius:999px;background:#e3edf2}
.weather-overall-fill{width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8fc9e7,#f0c96f,#bdaae0);transition:width .4s ease}
.weather-progress-card .rainbow-progress-message{margin:13px 0 0;color:#79868d;font-size:12px}

.lesson-parts-map{width:min(920px,100%);margin:28px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
.weather-part-card{width:100%;min-height:345px;padding:24px 22px 20px;display:flex;flex-direction:column;align-items:center;border:2px solid #dce8ee;border-bottom:7px solid #c7d6dd;border-radius:27px;color:inherit;text-align:center;cursor:pointer;box-shadow:0 12px 28px rgba(63,98,118,.07);transition:transform .22s ease,box-shadow .22s ease,opacity .22s ease}
.weather-part-card:nth-child(1){background:linear-gradient(145deg,#e7f6ff,#f4fbff);border-color:#d3e7f1;border-bottom-color:#b8d3e0}
.weather-part-card:nth-child(2){background:linear-gradient(145deg,#fff3df,#fffaf2);border-color:#efe1bd;border-bottom-color:#dcc89a}
.weather-part-card:nth-child(3){background:linear-gradient(145deg,#f1edfb,#fffafd);border-color:#e2d9ee;border-bottom-color:#cabce0}
.weather-part-card:not(:disabled):hover{transform:translateY(-5px);box-shadow:0 17px 34px rgba(63,94,112,.11)}
.weather-part-card .part-card-label{min-height:28px;padding:6px 11px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:rgba(255,255,255,.72);color:#728591;font-size:9px;font-weight:700;letter-spacing:.8px}
.weather-part-card .part-card-icon{width:74px;height:74px;margin:18px auto 15px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;border-radius:23px;background:rgba(255,255,255,.78);box-shadow:0 8px 18px rgba(66,95,111,.07);font-size:39px}
.weather-part-card h3{width:100%;min-height:58px;margin:0 0 8px;display:flex;align-items:center;justify-content:center;color:#4f5d64;font-size:24px;font-weight:700;line-height:1.18;text-align:center}
.weather-part-card>p{width:100%;min-height:68px;margin:0 auto 16px;display:flex;align-items:flex-start;justify-content:center;color:#758188;font-size:13px;line-height:1.45;text-align:center}
.weather-part-card .part-card-footer{width:100%;margin-top:auto;padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:2px solid rgba(198,212,219,.72);color:#7b888f;font-size:10px}
.weather-part-card .part-card-footer strong{color:#607580;font-size:11px}
.weather-part-card.locked-part{opacity:.46;filter:grayscale(.18);cursor:not-allowed}
.weather-part-card.completed-part{border-color:#c8dabf;border-bottom-color:#afc09f}
.weather-part-card.completed-part .part-card-label{background:#edf4e8;color:#68765b}

.weather-learning-page{max-width:900px}
.weather-learning-page .active-part-heading{max-width:690px;margin:0 auto 27px;text-align:center}
.weather-learning-page .active-part-icon{width:84px;height:84px;margin:0 auto 17px;display:flex;align-items:center;justify-content:center;border-radius:26px;background:linear-gradient(145deg,#e7f6ff,#d7ecf7);border:2px solid #cce1eb;font-size:44px}
.weather-learning-page .active-part-heading h2{margin:4px 0 10px;color:#4f5a60;font-size:36px}

.weather-part-progress-card{width:min(620px,100%);margin:0 auto 22px;padding:16px 19px;border-radius:19px;background:rgba(255,255,255,.77);border:2px solid #dce9ef;box-shadow:0 8px 20px rgba(63,101,121,.05)}
.weather-part-progress-info{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;color:#74838b;font-size:12px}
.weather-part-progress-info strong{color:#5a7280}
.weather-part-progress-track{width:100%;height:9px;overflow:hidden;border-radius:999px;background:#e4edf2}
.weather-part-progress-fill{width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8fc9e7,#f1cf78);transition:width .35s ease}

.weather-learning-card{width:min(610px,100%);min-height:490px;margin:0 auto 20px;padding:25px 27px 28px;border:2px solid #dce8ee;border-bottom:7px solid #c5d5dd;border-radius:30px;background:linear-gradient(180deg,#fffefd,#f2f9fd);box-shadow:0 14px 30px rgba(62,98,118,.07);text-align:center}
.weather-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#89969c;font-size:11px}
.weather-status{padding:7px 11px;border-radius:999px;background:#e6f3fa;color:#5f8195;font-size:9px;font-weight:700;letter-spacing:.7px}

.weather-demo{width:290px;height:180px;margin:24px auto 17px;position:relative;overflow:hidden;border-radius:29px;background:linear-gradient(180deg,#cceeff,#ecf8ff 70%,#b7d69e 70%,#9bc781 100%);border:2px solid #cfe3ed;border-bottom:6px solid #b9ccd5;box-shadow:0 10px 22px rgba(65,102,121,.07)}
.weather-learning-card .color-learning-main{margin:4px 0 3px;color:#4f6875;font-size:38px;font-weight:700}
.weather-learning-card .color-learning-translation{margin-bottom:11px;color:#87949a;font-size:14px}
.weather-example{width:fit-content;max-width:100%;margin:0 auto 18px;padding:10px 16px;border-radius:14px;background:rgba(255,255,255,.8);border:2px solid #e1eaef;color:#65757d;font-size:13px;font-weight:600}
.weather-learned-message{margin:15px auto 0;color:#687d5b;font-size:12px;font-weight:600}
.weather-navigation{width:min(610px,100%);margin:0 auto;display:flex;align-items:center;justify-content:center;gap:12px}
.weather-navigation .letter-navigation-button{width:48px;height:48px;border-radius:15px}
.weather-navigation .next-letter-button{min-width:150px}
.weather-part-hint{margin:16px auto 0;color:#7e8a90;font-size:12px;text-align:center}

.seasons-page{max-width:900px}
.season-info-card{width:min(560px,100%);margin:0 auto 20px;padding:21px 22px;border-radius:23px;background:linear-gradient(180deg,#fffefd,#f6f9fb);border:2px solid #dfe8ec;border-bottom:6px solid #c9d6dc;text-align:center}
.season-info-card h3{margin:4px 0 3px;color:#52626b;font-size:31px}
.season-info-card>p{margin:0 0 13px;color:#879198;font-size:14px}
.season-weather-example{width:fit-content;margin:0 auto 16px;padding:10px 15px;border-radius:14px;background:#f7fafc;border:2px solid #e2eaee;color:#65747c;font-size:13px;font-weight:600}
.season-progress-message{margin:17px auto 0;color:#7d898f;font-size:12px;text-align:center}

.weather-question-page{max-width:900px}
.weather-rule-card{width:min(670px,100%);margin:0 auto 18px;padding:24px 25px;border-radius:25px;background:linear-gradient(180deg,#fffefd,#f2f8fb);border:2px solid #dce7ed;border-bottom:6px solid #c4d4dc;box-shadow:0 10px 24px rgba(65,89,102,.06);text-align:center}
.rule-small-label{display:inline-block;margin-bottom:15px;color:#748791;font-size:9px;font-weight:700;letter-spacing:1.2px}
.weather-question-formula{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px}
.weather-question-formula span{min-height:43px;padding:9px 13px;display:flex;align-items:center;justify-content:center;border-radius:13px;background:#fff;border:2px solid #e0e8ec;color:#596970;font-size:13px;font-weight:700}
.weather-question-formula .formula-main{background:#e5f3fa;border-color:#cadee8;color:#58758a}
.weather-question-formula .formula-weather{background:#fff4d7;border-color:#ecdcae;color:#836e3d}
.weather-rule-card>p{margin:17px 0 0;color:#758188;font-size:13px;line-height:1.6}
.answer-rule-card{background:linear-gradient(180deg,#fffefd,#fff8e5);border-color:#ede1bc;border-bottom-color:#d8c79b}

.weather-question-challenge{width:min(620px,100%);margin:24px auto 0;padding:24px 25px 27px;border-radius:28px;background:linear-gradient(180deg,#fffefd,#f2f8fb);border:2px solid #dce7ed;border-bottom:7px solid #c4d4dc;box-shadow:0 12px 27px rgba(64,89,102,.06);text-align:center}
.weather-question-top{display:flex;align-items:center;justify-content:space-between;color:#738690;font-size:10px;font-weight:700;letter-spacing:.8px}
.weather-question-scene{width:120px;height:120px;margin:22px auto 15px;display:grid;place-items:center;border-radius:31px;background:linear-gradient(145deg,#e7f6ff,#fff7d8);border:2px solid #d5e5ec;font-size:62px}
.weather-question-challenge h3{margin:0 0 18px;color:#52616a;font-size:22px}
.weather-question-answer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.weather-question-complete{width:min(560px,100%);margin:24px auto 0;padding:25px;border-radius:25px;background:linear-gradient(145deg,#f0f7ea,#fbfcf8);border:2px solid #d8e4ce;border-bottom:6px solid #becfaf;text-align:center}
.weather-question-complete>div{font-size:46px}
.weather-question-complete h3{margin:5px 0 7px;color:#596651;font-size:27px}

.weather-station-unlocked-page{text-align:center}
.weather-station-unlock-icon{width:132px;height:132px;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;border-radius:39px;background:linear-gradient(145deg,#e4f5ff,#cde7f3);border:2px solid #b7d7e6;box-shadow:0 14px 30px rgba(64,104,126,.1);font-size:71px}
.weather-reporter-badge{width:min(430px,100%);margin:22px auto 27px;padding:17px 20px;display:flex;align-items:center;justify-content:center;gap:14px;border-radius:20px;background:linear-gradient(145deg,#fff7d9,#f5f8eb);border:2px solid #e7dfbd;border-bottom:5px solid #d0c49e;text-align:left}
.weather-reporter-badge>span{font-size:37px}
.weather-reporter-badge>div{display:flex;flex-direction:column;gap:3px}
.weather-reporter-badge small{color:#91825d;font-size:9px;font-weight:700;letter-spacing:1px}
.weather-reporter-badge strong{color:#625d4d;font-size:15px}
.weather-station-progress{margin:17px auto 0;color:#7c898f;font-size:12px;text-align:center}

.reporter-page{max-width:900px}
.reporter-challenge-card{width:min(620px,100%);margin:0 auto;padding:24px 25px 27px;border-radius:28px;background:linear-gradient(180deg,#fffefd,#f2f8fb);border:2px solid #dce7ed;border-bottom:7px solid #c4d4dc;box-shadow:0 12px 27px rgba(64,89,102,.07);text-align:center}
.reporter-top{display:flex;align-items:center;justify-content:space-between;color:#72848e;font-size:10px;font-weight:700;letter-spacing:.8px}
.reporter-weather-scene{width:140px;height:140px;margin:22px auto 16px;display:grid;place-items:center;border-radius:35px;background:linear-gradient(145deg,#e5f4ff,#fff5d6);border:2px solid #d3e4eb;font-size:72px}
.reporter-challenge-card h3{margin:0 0 18px;color:#52616a;font-size:22px}
.reporter-answer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.reporter-answer-button{min-height:54px;padding:11px 13px;border:2px solid #dbe6eb;border-bottom:5px solid #c6d3d9;border-radius:16px;background:linear-gradient(180deg,#fffefd,#f2f8fa);color:#576870;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer}
.reporter-complete-card{width:min(560px,100%);margin:24px auto 0;padding:25px;border-radius:25px;background:linear-gradient(145deg,#f0f7ea,#fbfcf8);border:2px solid #d7e3cc;border-bottom:6px solid #bdceae;text-align:center}
.reporter-complete-card>div{font-size:47px}
.reporter-complete-card h3{margin:5px 0 7px;color:#596651;font-size:27px}

.season-machine-page{max-width:900px}
.season-machine-top{display:flex;align-items:center;justify-content:space-between;color:#8b7b58;font-size:10px;font-weight:700;letter-spacing:.8px}
.season-machine-complete{width:min(560px,100%);margin:24px auto 0;padding:25px;border-radius:25px;background:linear-gradient(145deg,#f3f0fb,#fff8e7);border:2px solid #e1d8ec;border-bottom:6px solid #cabbe0;text-align:center}
.season-machine-complete>div{font-size:48px}
.season-machine-complete h3{margin:5px 0 7px;color:#655b72;font-size:27px}

.weather-lesson-body .practice-heading-icon{background:linear-gradient(145deg,#e5f5ff,#fff3d5);border-color:#d5e3e6;border-bottom-color:#bdcdd2}
.weather-lesson-body .active-practice-level{border-color:#cfdfe7;border-bottom-color:#b7cad4;background:linear-gradient(145deg,#edf8ff,#fff)}
.weather-lesson-body .game-feedback{min-height:24px;margin-top:14px;font-size:13px;font-weight:600}
.weather-lesson-body .correct-feedback{color:#687a58}
.weather-lesson-body .wrong-feedback{color:#966b62}

.weather-lesson-body .finish-main-icon{background:linear-gradient(145deg,#e4f5ff,#fff4d0)}
.weather-lesson-body .finish-badge{background:linear-gradient(145deg,#e9f6ff,#fff6d8)}

.days-lesson-body .chapter-number,
.days-lesson-body .screen-label{color:#6877a9}

.days-lesson-body .story-book-icon,
.days-lesson-body .parts-heading-icon,
.days-lesson-body .active-part-icon,
.days-lesson-body .practice-heading-icon{background:linear-gradient(145deg,#e8edff,#fff1cf);border-color:#d4dcf1;border-bottom-color:#b9c5df}

.days-lesson-body .weather-overall-fill,
.days-lesson-body .weather-part-progress-fill{background:linear-gradient(90deg,#8fa9e7,#ebc765,#b6a6df)}

.day-card-demo{background:linear-gradient(180deg,#dfe8ff 0%,#f7f9ff 70%,#d9dff2 70%,#bdc8e4 100%)}
.day-number{position:absolute;top:18px;left:24px;width:54px;height:54px;display:grid;place-items:center;border-radius:18px;background:rgba(255,255,255,.88);border:2px solid #cbd5ec;color:#6878a6;font-size:25px;font-weight:700;z-index:5}
.day-demo-icon{position:absolute;left:50%;top:51%;transform:translate(-50%,-50%);font-size:92px;filter:drop-shadow(0 10px 10px rgba(65,78,117,.14))}

.week-order-stage{width:min(680px,100%);height:330px;margin:0 auto 22px;position:relative;overflow:hidden;border-radius:30px;background:linear-gradient(145deg,#e5ebff,#fff5d9);border:2px solid #d5ddef;border-bottom:7px solid #bcc7df;box-shadow:0 13px 28px rgba(65,78,115,.08)}
.week-orbit{position:absolute;width:420px;height:420px;left:50%;top:52%;transform:translate(-50%,-50%);border:3px dashed rgba(111,127,174,.22);border-radius:50%;animation:weekOrbitSpin 22s linear infinite}
.week-orbit::before,
.week-orbit::after{content:"✦";position:absolute;color:#91a2d2;font-size:30px}
.week-orbit::before{left:22px;top:92px}
.week-orbit::after{right:25px;bottom:95px}

@keyframes weekOrbitSpin{
    to{transform:translate(-50%,-50%) rotate(360deg)}
}

.week-order-number{position:absolute;left:50%;top:28px;transform:translateX(-50%);width:66px;height:66px;display:grid;place-items:center;border-radius:22px;background:#fff;border:3px solid #cbd5ed;color:#6878a7;font-size:31px;font-weight:700;z-index:4}
.week-order-day{position:absolute;left:50%;top:124px;transform:translateX(-50%);color:#56668f;font-size:42px;font-weight:700;z-index:4}
.week-order-icon{position:absolute;left:50%;top:190px;transform:translateX(-50%);font-size:75px;z-index:4}
.week-order-buttons{width:min(780px,100%);margin:0 auto 18px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.week-order-button{min-height:58px;padding:10px;border:2px solid #d8dfed;border-bottom:5px solid #bec8dc;border-radius:17px;background:linear-gradient(180deg,#fff,#f2f5fb);color:#5e6b8b;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.week-order-button:hover,
.week-order-button.active{transform:translateY(-2px);background:linear-gradient(145deg,#e8edff,#fff3d5);border-color:#cbd4e8;border-bottom-color:#aebbd7;box-shadow:0 7px 14px rgba(66,78,112,.08)}

.weekly-planner-page{max-width:980px}
.planner-layout{width:min(900px,100%);margin:0 auto 20px;display:grid;grid-template-columns:1.25fr .75fr;gap:20px;align-items:stretch}
.planner-controls,
.planner-preview{padding:23px;border-radius:28px;background:linear-gradient(180deg,#fffefd,#f3f6fd);border:2px solid #dbe2ef;border-bottom:7px solid #c2ccdf;box-shadow:0 12px 26px rgba(62,76,111,.07)}
.planner-step{margin-bottom:12px;display:flex;align-items:center;gap:9px;color:#596889}
.planner-step span{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:#e7ecfa;color:#6979a4;font-weight:700}
.planner-day-grid{margin-bottom:20px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.planner-day-button,
.planner-activity-button{min-height:46px;padding:8px;border:2px solid #dce2ec;border-bottom:4px solid #c4ccdc;border-radius:14px;background:#fff;color:#61708e;font-family:inherit;font-size:11px;font-weight:600;cursor:pointer}
.planner-day-button.active,
.planner-activity-button.active{background:linear-gradient(145deg,#e6ecff,#fff3d3);border-color:#c9d2e7;border-bottom-color:#aebbd5;transform:translateY(-1px)}
.planner-activity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.planner-activity-button{min-height:70px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.planner-activity-button span{font-size:27px}
.planner-preview{text-align:center}
.planner-preview-icon{width:130px;height:130px;margin:19px auto 13px;display:grid;place-items:center;border-radius:34px;background:linear-gradient(145deg,#e6ecff,#fff2d1);border:2px solid #d4dced;font-size:68px}
.planner-preview h3{min-height:58px;margin:0 0 14px;color:#566587;font-size:21px}
.planner-add-button{margin-top:13px;font-size:12px}

.saved-plans{width:min(900px,100%);min-height:90px;margin:0 auto 15px;padding:13px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;border-radius:21px;background:rgba(255,255,255,.65);border:2px dashed #ccd5e6}
.saved-plans>p{grid-column:1/-1;align-self:center;margin:0;color:#8490a8;text-align:center;font-size:12px}
.saved-plan-card{padding:12px 9px;border-radius:15px;background:linear-gradient(145deg,#eef2ff,#fff7e5);border:2px solid #dae1ee;text-align:center}
.saved-plan-card span{font-size:29px}
.saved-plan-card strong{display:block;margin-top:4px;color:#5c6a8a;font-size:12px}

.week-train-card{width:min(860px,100%);margin:0 auto;padding:24px;border-radius:29px;background:linear-gradient(180deg,#fffefd,#f2f5fc);border:2px solid #d9e0ee;border-bottom:7px solid #bec9de;box-shadow:0 12px 27px rgba(64,76,107,.07);text-align:center}
.week-train-track{min-height:180px;margin:20px 0 17px;padding:28px 15px 35px;display:flex;align-items:flex-end;gap:7px;overflow-x:auto;border-radius:24px;background:linear-gradient(180deg,#dfe9ff 0%,#f8fbff 72%,#c7d0dc 72%,#aeb9c8 100%)}
.train-engine{flex:0 0 auto;font-size:69px}
.train-carriages{display:flex;align-items:flex-end;gap:6px}
.train-carriage{width:84px;min-height:61px;padding:9px 5px;display:grid;place-items:center;border-radius:16px 16px 9px 9px;background:linear-gradient(145deg,#92a9df,#728bc7);border:2px solid #6d82b4;border-bottom:6px solid #566b9f;color:#fff;font-size:10px;font-weight:700;animation:carriagePop .3s ease}

@keyframes carriagePop{
    from{transform:scale(.7) translateY(-15px);opacity:0}
    to{transform:scale(1) translateY(0);opacity:1}
}

.week-train-question{color:#596786;font-size:16px;font-weight:600}
.week-train-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.week-train-option{min-height:55px;padding:9px;border:2px solid #d8dfec;border-bottom:5px solid #bdc7da;border-radius:16px;background:#fff;color:#5c6a88;font-family:inherit;font-size:12px;font-weight:600;cursor:pointer}

.weather-answer-button,
.game-answer-button,
.week-train-option{min-height:58px;padding:14px 18px;border:2px solid rgba(105,86,150,.16);border-radius:18px;background:#fff;color:#403257;font:inherit;font-weight:700;cursor:pointer;box-shadow:0 8px 18px rgba(72,54,112,.08);transition:transform .2s ease,border-color .2s ease,background .2s ease}
.weather-answer-button:hover,
.game-answer-button:hover,
.week-train-option:hover{transform:translateY(-2px);border-color:#8065c9}
.correct-answer{border-color:#49bd83!important;background:#e9fff3!important;color:#16744a!important;animation:dayCorrectPop .35s ease}
.wrong-answer{border-color:#ed6f78!important;background:#fff0f1!important;color:#aa2e3a!important;animation:dayWrongShake .35s ease}

@keyframes dayCorrectPop{
    50%{transform:scale(1.045)}
}

@keyframes dayWrongShake{
    25%{transform:translateX(-7px)}
    75%{transform:translateX(7px)}
}

.practice-question-card{max-width:720px;margin:0 auto;padding:clamp(24px,5vw,48px);border:1px solid rgba(105,86,150,.14);border-radius:30px;background:rgba(255,255,255,.96);text-align:center;box-shadow:0 22px 55px rgba(78,57,122,.12)}
.practice-question-card h3{margin:12px 0 24px;color:#392b50;font-size:clamp(23px,4vw,34px)}
.game-question-progress{color:#8065c9;font-size:13px;font-weight:800;letter-spacing:.12em}
.game-question-icon{margin-top:20px;font-size:clamp(54px,10vw,86px)}
.game-answer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.game-complete-card{max-width:620px;margin:0 auto;padding:42px 28px;border-radius:30px;background:linear-gradient(145deg,#fff,#f3efff);text-align:center;box-shadow:0 22px 55px rgba(78,57,122,.12)}
.game-complete-icon{font-size:76px}

.lesson-sparkle,
.lesson-confetti{position:fixed;pointer-events:none;z-index:10000;animation:daySparkleAway 2.1s ease forwards}
.lesson-confetti{top:-30px!important;animation:dayConfettiFall 2.2s ease-in forwards}

@keyframes daySparkleAway{
    from{opacity:1;transform:translateY(0) rotate(0deg) scale(1)}
    to{opacity:0;transform:translateY(-85px) rotate(120deg) scale(.35)}
}

@keyframes dayConfettiFall{
    from{opacity:1;transform:translateY(0) rotate(0)}
    to{opacity:0;transform:translateY(110vh) rotate(620deg)}
}

@media(max-width:850px){
    .lesson-parts-map{grid-template-columns:1fr;max-width:520px}
    .weather-part-card{min-height:auto}
    .weather-part-card h3,
    .weather-part-card>p{min-height:auto}
    .planner-layout{grid-template-columns:1fr}
    .week-order-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}
    .week-train-options{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
    .weather-question-answer-grid,
    .reporter-answer-grid{grid-template-columns:1fr}
}

@media(max-width:620px){
    .weather-progress-card{padding:20px 14px}
    .weather-progress-icons{gap:8px}
    .weather-progress-icon{width:83px;min-height:83px;font-size:31px}
    .weather-learning-card{min-height:auto;padding:21px 17px 24px}
    .weather-demo{width:245px;height:160px}
    .weather-question-challenge,
    .weather-rule-card,
    .reporter-challenge-card{padding:21px 16px 24px}
    .week-order-stage{height:280px}
    .week-order-day{top:108px;font-size:34px}
    .week-order-icon{top:165px;font-size:64px}
    .planner-day-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .planner-activity-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .saved-plans{grid-template-columns:1fr}
    .train-carriage{width:70px;font-size:9px}
    .game-answer-grid{grid-template-columns:1fr}
}

[hidden] {
    display: none !important;
}

/* Нормальный размер надписей "1 день", "2 день" и т.д. */

.days-lesson-body .weather-question-scene {
    font-size: 24px;
    font-weight: 700;
    color: #6878a7;
    line-height: 1.2;
}

.game-question-icon.day-text-label {
    font-size: 24px;
    font-weight: 700;
    color: #6878a7;
    line-height: 1.2;
}