.lernNavi{margin:26px 0 8px;padding:clamp(20px,4vw,34px);border-radius:24px;background:linear-gradient(135deg,#173f5f 0%,#245f83 68%,#2e789b 100%);color:#fff;box-shadow:0 18px 45px #173f5f2b;position:relative;overflow:hidden}
.lernNavi::after{content:"";position:absolute;width:260px;height:260px;border:42px solid #f2c94c24;border-radius:50%;right:-115px;top:-125px;pointer-events:none}
.lernNaviTop{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:24px;align-items:center;position:relative;z-index:1}
.naviKicker{display:inline-block;color:#f7d96f;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.11em;margin-bottom:8px}
.lernNavi h2{font-size:clamp(25px,4vw,38px);line-height:1.08;margin:0;max-width:750px}.lernNaviTop p{margin:12px 0 0;color:#e6f1f7;line-height:1.55;font-size:17px;max-width:720px}
.weekCard{background:#fff;color:#173f5f;border-radius:17px;padding:16px;box-shadow:0 8px 24px #0b2a402b}.weekCard>span{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.weekCard>strong{display:block;font-size:25px;margin:3px 0 9px}.weekCard small{display:block;color:#66717c;font-size:12px;line-height:1.35;margin-top:9px}.weekDots{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.weekDot{height:10px;border-radius:99px;background:#dce7ed}.weekDot.done{background:#e0ad22}
.naviModes{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-top:23px;position:relative;z-index:1}.naviMode{min-height:126px;text-align:left!important;background:#ffffffed!important;color:#173f5f!important;border:2px solid transparent!important;border-radius:17px!important;padding:15px!important;margin:0!important;transition:transform .18s,box-shadow .18s,border-color .18s}.naviMode:hover,.naviMode:focus-visible{transform:translateY(-3px);box-shadow:0 10px 24px #0b2a4038;border-color:#f2c94c!important}.naviMode.selected{background:#fff8d8!important;border-color:#f2c94c!important}.naviMode b,.naviMode small{display:block}.naviMode b{font-size:16px;line-height:1.2;margin-top:10px}.naviMode small{font-size:13px;line-height:1.35;color:#5c6b77;margin-top:5px}.modeMark{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;background:#173f5f;color:#f7d96f;font-size:14px;font-weight:900}.parentMode .modeMark{background:#7b4b12;color:#fff1b8}
.naviPanel{position:relative;z-index:1;background:#fff;color:#17212b;border-radius:18px;padding:19px;margin-top:14px}.naviPanel[hidden],.naviResult[hidden]{display:none}.naviCopy h3{margin:0;font-size:21px;color:#173f5f}.naviCopy p{margin:6px 0 15px;color:#5d6974;line-height:1.5}.naviFields{display:grid;grid-template-columns:110px 1.2fr 1.5fr 1.35fr;gap:10px}.naviFields label{font-size:13px;font-weight:800;color:#354553}.naviFields select{width:100%;display:block;margin-top:6px;border:1px solid #cbd7de;border-radius:10px;background:#fff;padding:11px 10px;font-size:15px;color:#17212b}.naviFind{margin-top:14px!important;background:#e0ad22!important;color:#17212b!important;border:0!important;border-radius:11px!important;padding:13px 19px!important;font-size:16px!important}
.naviResult{position:relative;z-index:1;margin-top:14px;background:#fff8d8;color:#17212b;border:2px solid #f2c94c;border-radius:18px;padding:20px}.resultEyebrow{font-size:13px;font-weight:800;color:#7b4b12;text-transform:uppercase;letter-spacing:.07em}.naviResult h3{margin:6px 0;font-size:23px;color:#173f5f}.resultMeta{color:#596772;line-height:1.45}.resultWhy{margin:12px 0;padding:11px 13px;border-left:4px solid #e0ad22;background:#fff;line-height:1.45}.resultActions{display:flex;flex-wrap:wrap;gap:9px}.resultActions a,.resultActions button{display:inline-block;border-radius:11px;padding:12px 16px;font-size:15px;font-weight:800;text-decoration:none}.resultOpen{background:#173f5f;color:#fff}.resultDone{background:#fff;border:1px solid #9cb2bf;color:#173f5f}.resultAgain{background:transparent;border:0;color:#6d4a08;text-decoration:underline}.resultDone[disabled]{background:#e4eee7;color:#345c3b;border-color:#aac7af}
@media(max-width:850px){.lernNaviTop{grid-template-columns:1fr}.weekCard{max-width:350px}.naviModes{grid-template-columns:repeat(2,1fr)}.naviFields{grid-template-columns:1fr 1fr}}
@media(max-width:520px){header{padding:22px 12px}.lernNavi{margin-left:-4px;margin-right:-4px;padding:19px 15px;border-radius:19px}.naviModes,.naviFields{grid-template-columns:1fr}.naviMode{min-height:0}.weekCard{max-width:none}.resultActions>*{width:100%;text-align:center}}
@media(prefers-reduced-motion:reduce){.naviMode{transition:none}}
.smartMark{border:1px solid #9cb2bf;border-radius:11px;background:#fff;padding:12px 14px;font-size:15px}.smartMotivation{width:100%}.motivationCard{margin-top:14px;border:2px solid #e0ad22;border-radius:15px;background:#fff;padding:17px}.motivationCard>span{font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:#7b4b12}.motivationCard h4{margin:6px 0;font-size:22px;color:#173f5f}.motivationCard p{line-height:1.55}.nextGoal{border-radius:10px;background:#eef5fa;padding:11px}.adultHint{margin-top:10px;border-radius:10px;background:#fff8d8;padding:11px}.adultHint p{margin:4px 0 0;font-size:14px}.copyResult{margin-top:10px!important;background:#173f5f!important;color:#fff!important;border:0!important}.finishDock{position:fixed;z-index:1000;right:18px;bottom:18px;width:min(430px,calc(100vw - 36px));max-height:calc(100vh - 36px);overflow:auto;border:2px solid #e0ad22;border-radius:18px;background:#fff;padding:18px;box-shadow:0 18px 55px #0b2a4050;color:#17212b}.finishDock[hidden]{display:none}.finishDock>b{display:block;padding-right:28px;font-size:18px;color:#173f5f}.finishDock>p{margin:5px 0;color:#66717c}.dockClose{position:absolute;right:10px;top:8px;border:0;background:transparent;padding:4px 8px;font-size:25px;color:#66717c}.dockRow{display:flex;flex-wrap:wrap;gap:9px;margin-top:9px}.dockRow select{min-width:170px;border:1px solid #9cb2bf;border-radius:10px;background:#fff;padding:11px;font-size:15px}.dockRow button{background:#e0ad22;border:0}.dockMessage .motivationCard{padding:13px}.dockMessage .motivationCard h4{font-size:19px}@media(max-width:520px){.finishDock{right:10px;bottom:10px;width:calc(100vw - 20px)}.dockRow>*{width:100%}}
