:root{--green:#1f8a4c;--green-dark:#126638;--green-soft:#e9f6ee;--bg:#f5f7f6;--card:#fff;--text:#17201b;--muted:#6d776f;--border:#dfe6e1;--danger:#b83b3b;--success:#187944}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input{font:inherit}button{cursor:pointer}.app-shell{width:min(100%,720px);min-height:100vh;margin:0 auto;padding-bottom:86px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:18px 18px 10px}.topbar h1{margin:0;font-size:23px}.eyebrow{margin:0 0 2px;color:var(--green);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:var(--green);color:#fff;font-weight:700}main{padding:8px 16px 24px}.card{margin-bottom:14px;padding:18px;border:1px solid var(--border);border-radius:18px;background:var(--card)}.hero-card{background:linear-gradient(145deg,var(--green),var(--green-dark));color:#fff;border:none}.hero-card p,.hero-card .muted{color:rgba(255,255,255,.82)}h2,h3,p{margin-top:0}h2{margin-bottom:8px;font-size:22px}h3{margin-bottom:8px;font-size:18px}.muted{color:var(--muted)}.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0 0}.metric{padding:12px 8px;border-radius:14px;background:var(--green-soft);text-align:center}.metric strong{display:block;font-size:20px;color:var(--green-dark)}.primary-btn,.secondary-btn,.option-btn{width:100%;border:0;border-radius:14px;padding:13px 16px}.primary-btn{background:var(--green);color:#fff;font-weight:700}.secondary-btn{background:var(--green-soft);color:var(--green-dark);font-weight:650}.option-list{display:grid;gap:10px;margin:16px 0}.option-btn{border:1px solid var(--border);background:#fff;color:var(--text);text-align:left}.option-btn.selected{border-color:var(--green);background:var(--green-soft)}.option-btn.correct{border-color:var(--success);background:#e8f7ee}.option-btn.incorrect{border-color:var(--danger);background:#fbecec}.table-wrap{overflow-x:auto;margin:14px 0}table{width:100%;border-collapse:collapse;font-size:14px}th,td{padding:9px 10px;border:1px solid var(--border);text-align:left}th{background:var(--green-soft)}.formula{overflow-x:auto;padding:12px;border-radius:12px;background:#eff2f0;font-family:Consolas,monospace;white-space:nowrap}.feedback{margin:14px 0;padding:14px;border-radius:14px}.feedback.success{background:#e8f7ee;color:var(--success)}.feedback.error{background:#fbecec;color:var(--danger)}.search-input{width:100%;margin-bottom:14px;padding:12px 14px;border:1px solid var(--border);border-radius:14px;background:#fff}.function-list{display:grid;gap:10px}.function-item{padding:15px;border:1px solid var(--border);border-radius:16px;background:#fff}.function-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.function-name{margin:0;font-weight:750}.badge{display:inline-block;margin-top:6px;padding:4px 8px;border-radius:999px;background:var(--green-soft);color:var(--green-dark);font-size:12px}.favorite-btn{width:auto;padding:7px 10px;border:0;border-radius:10px;background:#eff2f0}.bottom-nav{position:fixed;left:50%;bottom:0;z-index:10;width:min(100%,720px);transform:translateX(-50%);display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--border);background:rgba(255,255,255,.97)}.nav-btn{padding:10px 4px 9px;border:0;background:transparent;color:var(--muted)}.nav-btn span{display:block;margin-bottom:2px;font-size:18px}.nav-btn.active{color:var(--green)}.loading-screen{min-height:60vh;display:grid;place-items:center;align-content:center;color:var(--muted)}.loader{width:34px;height:34px;border:4px solid var(--border);border-top-color:var(--green);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:420px){.metric-row{grid-template-columns:1fr}}

.onboarding-mode { padding-bottom: 18px; }
.welcome-screen { max-width: 520px; margin: 22px auto 0; padding: 30px 20px; text-align: center; }
.welcome-mark { width: 76px; height: 76px; margin: 0 auto 18px; display: grid; place-items: center; border-radius: 22px; background: var(--green-soft); color: var(--green-dark); font-weight: 800; font-size: 24px; }
.welcome-screen h2 { font-size: 28px; }
.welcome-list { display: grid; gap: 10px; margin: 24px 0; text-align: left; }
.welcome-list div { display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--border); border-radius: 14px; background: white; }
.welcome-list b { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: white; }
.onboarding-card { max-width: 600px; margin: 12px auto; }
.choice-list { display: grid; gap: 10px; margin: 18px 0; }
.choice-card { width: 100%; padding: 15px; border: 1px solid var(--border); border-radius: 15px; background: white; text-align: left; color: var(--text); }
.choice-card strong, .choice-card span { display: block; }
.choice-card span { margin-top: 4px; color: var(--muted); font-size: 14px; }
.choice-card.selected { border-color: var(--green); background: var(--green-soft); box-shadow: inset 0 0 0 1px var(--green); }
.choice-list.compact .choice-card { padding: 12px 14px; }
.button-row { display: grid; grid-template-columns: 1fr 1.5fr; gap: 10px; }
.step-progress { height: 8px; margin-bottom: 7px; overflow: hidden; border-radius: 999px; background: var(--border); }
.step-progress-fill { height: 100%; border-radius: inherit; background: var(--green); }
.step-label { margin-bottom: 18px; color: var(--muted); font-size: 13px; text-align: right; }
.info-callout { display: grid; gap: 5px; margin: 22px 0; padding: 15px; border-radius: 14px; background: var(--green-soft); text-align: left; }
.info-callout span { color: var(--muted); font-size: 14px; }
.diagnostic-options { margin-top: 22px; }
@media (max-width: 420px) { .welcome-screen h2 { font-size: 24px; } .button-row { grid-template-columns: 1fr; } }

/* Макс Ячейкин */
.avatar{overflow:hidden;background:var(--green-soft);border:1px solid var(--border)}
.avatar img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;display:block}
.max-welcome{display:block;width:min(300px,72vw);height:250px;margin:0 auto 16px;object-fit:contain;object-position:center bottom;mix-blend-mode:multiply}
.max-welcome.compact{height:210px;width:min(260px,68vw)}
.max-quote{max-width:440px;margin:0 auto 12px;padding:12px 15px;border-radius:14px;background:var(--green-soft);color:var(--green-dark);font-weight:650}
.max-guide{display:flex;align-items:center;gap:12px;margin-bottom:17px;padding:10px 12px;border-radius:15px;background:var(--green-soft)}
.max-guide img{width:66px;height:66px;flex:0 0 66px;border-radius:50%;object-fit:cover;object-position:50% 18%;background:white}
.max-guide p{margin:0;display:grid;gap:3px}
.max-guide span{color:var(--muted);font-size:14px;font-weight:400}
.max-guide.small img{width:54px;height:54px;flex-basis:54px}
.result-pill{width:max-content;margin:-8px auto 12px;padding:7px 13px;border-radius:999px;background:var(--green);color:#fff;font-size:20px;font-weight:800}
.hero-with-max{display:grid;grid-template-columns:1fr 112px;align-items:end;gap:8px;overflow:hidden;padding-bottom:0}
.hero-with-max img{width:122px;height:145px;object-fit:cover;object-position:50% 10%;mix-blend-mode:screen;align-self:end}
.feedback-max{display:flex;align-items:flex-start;gap:12px}
.feedback-max img{width:72px;height:72px;flex:0 0 72px;border-radius:16px;object-fit:cover;object-position:50% 18%;background:#fff}
.feedback-max p:last-child{margin-bottom:0}
@media(max-width:420px){.max-welcome{height:210px}.max-welcome.compact{height:180px}.hero-with-max{grid-template-columns:1fr 88px}.hero-with-max img{width:100px;height:125px}.feedback-max img{width:58px;height:58px;flex-basis:58px}}

/* MVP 0.4: программа и карта навыков */
.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.text-btn{border:0;background:transparent;color:var(--green);font-weight:700;padding:4px 0}.route-mini-item{display:flex;align-items:center;gap:11px;padding:11px 0;border-top:1px solid var(--border)}.route-mini-item:first-of-type{border-top:0}.route-number{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--green-soft);color:var(--green-dark);font-weight:800}.route-mini-item div{display:grid;gap:2px}.route-mini-item small{color:var(--muted)}.skill-map{display:grid;gap:15px;margin-top:18px}.skill-row{display:grid;gap:7px}.skill-row-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.skill-track{height:10px;overflow:hidden;border-radius:999px;background:#e8ede9}.skill-fill{height:100%;border-radius:inherit}.skill-fill.confident{background:var(--success)}.skill-fill.needs_work{background:#d59a32}.skill-fill.not_checked{background:#a7b0aa}.skill-status{display:inline-block;padding:4px 8px;border-radius:999px;font-size:12px;white-space:nowrap}.skill-status.confident{background:#e8f7ee;color:var(--success)}.skill-status.needs_work{background:#fff3da;color:#94620d}.skill-status.not_checked,.skill-status.upcoming{background:#eff2f0;color:var(--muted)}.skill-status.current{background:var(--green);color:#fff}.route-preview{border-color:#b9dbc7;background:#f6fbf8}.program-list{display:grid;gap:12px}.program-module{display:grid;grid-template-columns:42px 1fr;gap:12px;padding:16px;border:1px solid var(--border);border-radius:17px;background:#fff}.program-module.current{border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}.program-module.mastered{background:#f6fbf8}.program-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--green-soft);color:var(--green-dark);font-weight:800}.program-module.current .program-icon{background:var(--green);color:#fff}.program-content h3{margin:7px 0 5px}.program-content p{margin-bottom:7px;color:var(--muted)}.program-content small{color:var(--muted)}.program-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.program-step{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.button-row.spaced{margin-top:18px}

/* Интерактивная экскурсия */
.tour-overlay{position:fixed;inset:0;z-index:1000;background:rgba(13,24,17,.64);backdrop-filter:blur(1px)}.tour-highlight{position:relative!important;z-index:1002!important;box-shadow:0 0 0 4px #fff,0 0 0 8px var(--green)!important;border-radius:16px!important}.tour-tooltip{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));z-index:1004;width:min(calc(100% - 28px),560px);max-height:calc(100vh - 36px);overflow:auto;transform:translateX(-50%);display:grid;grid-template-columns:92px 1fr;gap:12px;padding:15px;border-radius:18px;background:#fff;border:1px solid var(--border);box-shadow:0 18px 48px rgba(0,0,0,.22)}.tour-close{position:absolute;top:8px;right:10px;width:34px;height:34px;border:0;border-radius:50%;background:var(--green-soft);color:var(--green-dark);font-size:24px;line-height:1}.tour-max{height:118px;align-self:end;overflow:hidden;border-radius:14px;background:var(--green-soft)}.tour-max img{width:100%;height:100%;object-fit:cover;object-position:50% 12%}.tour-copy{padding-right:30px}.tour-copy h3{margin:3px 0 7px}.tour-copy p{margin-bottom:10px}.tour-count{font-size:12px;color:var(--green);font-weight:800}.tour-actions{display:grid;grid-template-columns:auto minmax(104px,120px);justify-content:end;align-items:center;gap:12px}.tour-skip{border:0;background:transparent;color:var(--muted);padding:10px}.tour-next{padding:10px 13px}.bottom-nav .tour-highlight{border-radius:10px!important;background:#fff!important}

@media(max-width:520px){.tour-tooltip{grid-template-columns:64px 1fr;padding:12px}.tour-max{height:88px}.tour-copy{padding-right:24px}.tour-actions{grid-template-columns:auto 104px}.skill-row-head{align-items:flex-start}.program-module{grid-template-columns:36px 1fr;padding:14px}.program-icon{width:34px;height:34px}}
.profile-actions{display:grid;gap:10px}.profile-actions .secondary-btn{margin:0}.feedback.success{margin:0 0 14px}


/* MVP 0.6 — полноценная тренировка */
.lesson-card{max-width:650px;margin:0 auto 14px}.lesson-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;color:var(--muted);font-size:13px}.syntax-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.syntax-grid div{display:grid;gap:4px;padding:13px;border:1px solid var(--border);border-radius:14px;background:#fff}.syntax-grid b{width:25px;height:25px;display:grid;place-items:center;border-radius:50%;background:var(--green);color:#fff}.syntax-grid span{font-family:Consolas,monospace;font-weight:700}.syntax-grid small{color:var(--muted)}.formula-wrap{white-space:normal;overflow-wrap:anywhere}.formula-label{display:block;margin:16px 0 7px;font-weight:700}.formula-input{width:100%;margin-bottom:12px;padding:14px;border:2px solid var(--border);border-radius:14px;background:#fff;font-family:Consolas,monospace;font-size:15px}.formula-input:focus{border-color:var(--green);outline:2px solid var(--green-soft)}.hint-btn{margin-top:10px}.lesson-result{padding-top:16px}@media(max-width:520px){.syntax-grid{grid-template-columns:1fr}.lesson-card{padding:15px}}

/* SUMIFS visual explanation */
.lesson-data-table tr{transition:background-color .35s ease,transform .35s ease,box-shadow .35s ease}
.lesson-data-table .matched-row{background:#e7f6ec;box-shadow:inset 4px 0 0 var(--green);animation:matchReveal .55s ease both}
.lesson-data-table .matched-row:nth-child(5){animation-delay:.16s}
.lesson-data-table .matched-condition{font-weight:800;color:#156b3a}
.lesson-data-table .matched-value{font-weight:900;color:#0f5f33}
.condition-row{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 18px}
.condition-row span{padding:8px 11px;border-radius:999px;background:var(--green-soft);color:var(--green-dark);font-size:14px}
.sum-visual{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:14px 0;padding:14px 16px;border-radius:16px;background:var(--green-soft);border:1px solid #cce8d6}
.sum-visual div{display:flex;align-items:center;gap:8px}.sum-visual span{padding:7px 9px;border-radius:9px;background:#fff;font-weight:800}.sum-visual b{color:var(--green)}.sum-visual>strong{font-size:20px;color:var(--green-dark)}
@keyframes matchReveal{from{opacity:.45;transform:translateX(-5px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:520px){.sum-visual{align-items:flex-start;flex-direction:column}.sum-visual>strong{align-self:flex-end}}


/* MVP 0.7 — пробный доступ и подписка */
.access-banner{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px;padding:13px 15px;border:1px solid var(--border);border-radius:16px}
.access-banner div{display:grid;gap:3px}.access-banner span{color:var(--muted);font-size:13px}
.access-banner.trial{background:#fff9e9;border-color:#ead8a4}.access-banner.active{background:#eef9f2;border-color:#b9dbc7}.access-banner.expired{background:#fff1ef;border-color:#e5c0ba}
.price-card{display:grid;gap:3px;width:min(320px,100%);margin:18px auto;padding:18px;border:1px solid var(--border);border-radius:18px;background:#fff}
.price-card strong{font-size:34px;color:var(--green-dark)}.price-card span{font-weight:700}.price-card small,.paywall-note{color:var(--muted)}
.subscription-card .primary-btn{margin-top:10px}.subscription-card .secondary-btn{margin-top:9px}.access-status{padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800}
.access-status.active{background:#e8f7ee;color:var(--success)}.access-status.trial{background:#fff3da;color:#94620d}.access-status.expired{background:#f4e7e4;color:#9d4134}
.locked-function{opacity:.92}.lock-badge{font-size:20px}.locked-preview{margin:12px 0;padding:14px;border:1px dashed var(--border);border-radius:12px;background:#f6f8f7;color:var(--muted);text-align:center}
.unlock-function{margin-top:8px}
@media(max-width:480px){.access-banner{align-items:flex-start;flex-direction:column}.access-banner .text-btn{align-self:flex-end}}


/* MVP 0.8 — темп, прогноз и напоминания */
.section-gap{margin-top:20px}
.frequency-list .choice-card{min-height:78px}
.pace-summary{display:grid;gap:4px;margin:16px 0;padding:14px 16px;border-radius:16px;background:var(--green-soft);color:var(--green-dark)}
.pace-summary span{font-size:13px;color:var(--muted)}
.reminder-choice{display:grid;gap:10px;margin:16px 0}
.field-label{display:block;margin:16px 0 7px;font-weight:700}
.time-input{width:100%;padding:13px 14px;border:1px solid var(--border);border-radius:13px;background:#fff;font:inherit}
.future-card{border-color:#b9dbc7;background:linear-gradient(180deg,#f3fbf6 0%,#fff 100%)}
.future-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.future-head h3{margin-top:2px}
.forecast-days{white-space:nowrap;padding:7px 10px;border-radius:999px;background:var(--green);color:#fff;font-size:13px;font-weight:800}
.future-list{display:grid;gap:10px;margin:18px 0;padding:0;list-style:none}
.future-list li{position:relative;padding-left:27px}
.future-list li::before{content:"✓";position:absolute;left:0;top:-1px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--green-soft);color:var(--green-dark);font-weight:900}
.forecast-pace{display:grid;gap:4px;margin:15px 0;padding:13px 15px;border-radius:14px;background:#fff;border:1px solid var(--border)}
.forecast-pace span{font-size:13px;color:var(--muted)}
.forecast-timeline{display:grid;gap:0;margin-top:14px}
.forecast-point{position:relative;display:grid;grid-template-columns:90px 1fr;gap:15px;padding:0 0 20px 19px;border-left:2px solid #c9dfd1}
.forecast-point:last-child{padding-bottom:0}
.forecast-point::before{content:"";position:absolute;left:-7px;top:3px;width:12px;height:12px;border-radius:50%;background:var(--green);border:3px solid #fff;box-shadow:0 0 0 1px var(--green)}
.forecast-point>span{font-size:13px;color:var(--green-dark);font-weight:800}
.forecast-point strong{display:block;margin-bottom:3px}
.forecast-point p{margin:0;color:var(--muted);font-size:14px}
@media(max-width:520px){
  .future-head{flex-direction:column}
  .forecast-point{grid-template-columns:74px 1fr;gap:10px}
}


/* MVP 0.9 — ник, черновик онбординга и повторения */
.review-card{border-color:#e3c875;background:#fffaf0}.review-card h3{margin-bottom:5px}
#nickname-input,#nickname-edit{font-family:inherit}.onboarding-card .formula-input{margin-bottom:8px}


/* MVP 0.9.3 — новая вкладка «Программа» */
.program-header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:14px}
.program-header h1{margin:2px 0 0}
.program-tabs{display:flex;gap:4px;padding:4px;border:1px solid var(--border);border-radius:14px;background:#fff}
.program-tab{border:0;border-radius:10px;background:transparent;padding:9px 13px;font:inherit;font-weight:700;color:var(--muted);cursor:pointer}
.program-tab.active{background:var(--green-soft);color:var(--green-dark)}
.program-summary-card{background:linear-gradient(180deg,#f3fbf6 0%,#fff 100%);border-color:#b9dbc7}
.program-summary-top,.module-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.program-summary-top h2{margin:2px 0 0}
.program-progress-chip{padding:7px 10px;border-radius:999px;background:var(--green);color:#fff;font-size:13px;font-weight:800;white-space:nowrap}
.program-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.program-summary-grid>div{display:grid;gap:4px;padding:12px 14px;border-radius:14px;background:#fff;border:1px solid var(--border)}
.program-summary-grid span{font-size:12px;color:var(--muted)}
.program-summary-grid strong{font-size:14px}
.program-progress-track{height:10px;margin-top:15px;border-radius:999px;background:#dfe9e3;overflow:hidden}
.program-progress-track span{display:block;height:100%;border-radius:inherit;background:var(--green)}
.module-status{padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800;white-space:nowrap}
.module-status.current{background:var(--green-soft);color:var(--green-dark)}
.module-status.locked{background:#f2f3f2;color:var(--muted)}
.lesson-path{display:grid;gap:0;margin-top:16px}
.lesson-path-item{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:10px;padding:13px 0;border-top:1px solid var(--border)}
.lesson-path-item:first-child{border-top:0}
.lesson-path-item>div:nth-child(2){display:grid;gap:3px}
.lesson-path-item span{font-size:13px;color:var(--muted)}
.lesson-marker{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#f0f3f1;color:var(--muted);font-weight:900}
.lesson-path-item.completed .lesson-marker{background:#e6f5ec;color:var(--success)}
.lesson-path-item.current .lesson-marker{background:var(--green);color:#fff}
.next-module-card{border-style:dashed;background:#fbfcfb}
.next-outcome{display:grid;gap:4px;margin-top:16px;padding:13px 15px;border-radius:14px;background:#f3f7f4}
.next-outcome span{font-size:14px;color:var(--muted)}
.hidden-modules-card{display:flex;align-items:center;gap:15px;background:#f7f8f7}
.hidden-modules-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#fff;border:1px solid var(--border);font-size:20px}
.hidden-modules-card h3{margin:0 0 4px}
.hidden-modules-card p{margin:0;color:var(--muted)}
.program-actions{display:flex;justify-content:center;margin:4px 0 20px}
.history-list,.review-list{display:grid;gap:0;margin-top:12px}
.history-item{display:grid;grid-template-columns:88px 1fr auto;gap:12px;align-items:center;padding:13px 0;border-top:1px solid var(--border)}
.history-item:first-child{border-top:0}
.history-date{font-size:13px;color:var(--muted)}
.history-main{display:grid;gap:3px}
.history-main span{font-size:13px;color:var(--muted)}
.history-status{color:var(--green-dark)!important;font-weight:700}
.review-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;border-top:1px solid var(--border)}
.review-row:first-child{border-top:0}
.review-row>div{display:grid;gap:3px}
.review-row span{font-size:13px;color:var(--muted)}
.modal-overlay{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px;background:rgba(18,28,22,.46)}
.modal-card{width:min(520px,100%);max-height:80vh;overflow:auto;padding:20px;border-radius:20px;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.2)}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.icon-btn{border:0;background:#f1f3f2;border-radius:10px;width:36px;height:36px;font-size:22px;cursor:pointer}
.skill-map-list{display:grid;gap:0;margin-top:14px}
.skill-map-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--border)}
.skill-map-row:first-child{border-top:0}
.skill-map-row strong{color:var(--green-dark);font-size:13px}
@media(max-width:560px){
  .program-header{align-items:stretch;flex-direction:column}
  .program-tabs{width:100%}
  .program-tab{flex:1}
  .program-summary-grid{grid-template-columns:1fr}
  .lesson-path-item{grid-template-columns:32px 1fr}
  .lesson-path-item .text-btn{grid-column:2;justify-self:start}
  .history-item{grid-template-columns:1fr auto}
  .history-date{grid-column:1/-1}
}


/* MVP 0.9.4 — удержание подписчиков */
.weekly-challenge-card{border-color:#b8d8c4;background:linear-gradient(180deg,#f4fbf6,#fff)}
.challenge-status{padding:6px 10px;border-radius:999px;background:#e4f3e9;color:var(--green-dark);font-size:12px;font-weight:800}
.challenge-meta{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.challenge-meta span{padding:6px 9px;border-radius:999px;background:#f1f4f2;color:var(--muted);font-size:12px;font-weight:700}
.challenge-benefit{display:grid;gap:4px;margin:14px 0;padding:13px;border-radius:14px;background:#f3f7f4}
.challenge-benefit span{font-size:14px;color:var(--muted)}
.max-recommendation{display:grid;grid-template-columns:92px 1fr;align-items:center;gap:15px}
.max-recommendation img{width:92px;height:92px;object-fit:contain}
.max-recommendation h3{margin:2px 0 5px}
.max-recommendation p:last-child{margin:0}
.retention-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}
.retention-grid>div{display:grid;gap:2px;text-align:center;padding:12px 8px;border-radius:14px;background:#f4f7f5}
.retention-grid strong{font-size:22px;color:var(--green-dark)}
.retention-grid span{font-size:12px;color:var(--muted)}
.monthly-tool{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:14px;border-top:1px solid var(--border)}
.monthly-tool>div{display:grid;gap:4px}
.monthly-tool small{color:var(--muted)}
.button-stack{display:grid;gap:10px;margin-top:16px}
.history-filters{display:flex;flex-wrap:wrap;gap:5px}
.history-filter{border:1px solid var(--border);background:#fff;border-radius:999px;padding:6px 9px;font:inherit;font-size:12px;cursor:pointer}
.history-filter.active{border-color:var(--green);background:var(--green-soft);color:var(--green-dark);font-weight:700}
@media(max-width:560px){
  .max-recommendation{grid-template-columns:68px 1fr}
  .max-recommendation img{width:68px;height:68px}
  .retention-grid{grid-template-columns:1fr 1fr 1fr}
  .monthly-tool{align-items:flex-start;flex-direction:column}
}


/* MVP 0.9.5 — выбор старта и видимые механики удержания */
.welcome-choice{display:grid;gap:16px}
.welcome-choice-hero{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:18px;background:linear-gradient(180deg,#f3fbf6,#fff)}
.welcome-max{width:120px;height:120px;object-fit:contain}
.welcome-choice-hero h1{margin:2px 0 8px}
.start-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.start-choice-card{display:grid;gap:8px;text-align:left;padding:20px;border:2px solid var(--border);border-radius:20px;background:#fff;font:inherit;cursor:pointer;transition:.18s ease}
.start-choice-card:hover{transform:translateY(-2px);border-color:var(--green);box-shadow:0 10px 28px rgba(29,110,65,.12)}
.start-choice-card strong{font-size:18px;color:var(--text)}
.start-choice-card span:not(.start-choice-icon){color:var(--muted);line-height:1.45}
.start-choice-card small{color:var(--green-dark);font-weight:700}
.start-choice-icon{font-size:30px}
.start-choice-note{text-align:center;color:var(--muted);font-size:13px}
.retention-week-zone{display:grid;gap:14px;margin-top:14px}
.retention-week-zone:empty{display:none}
@media(max-width:560px){
  .welcome-choice-hero{grid-template-columns:84px 1fr}
  .welcome-max{width:84px;height:84px}
  .start-choice-grid{grid-template-columns:1fr}
}


/* MVP 0.9.6 — явная маркировка версии и блоков удержания */
.build-version,.build-chip{
  display:inline-flex;align-items:center;padding:3px 7px;border-radius:999px;
  background:#e6f5ec;color:#176b3b;font-size:11px;font-weight:800;vertical-align:middle
}
.retention-section-heading{
  display:flex;align-items:flex-end;justify-content:space-between;gap:12px;
  margin:22px 2px 8px;padding-top:18px;border-top:2px solid #dce9e1
}
.retention-section-heading h2{margin:2px 0 0}
.weekly-challenge-card{box-shadow:0 8px 24px rgba(31,138,76,.08)}


/* MVP 0.9.7 — видимые этапы с последовательной блокировкой */
.route-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:22px 2px 8px}
.route-intro h2{margin:2px 0 0}
.route-intro>span{font-size:13px;color:var(--muted)}
.route-stage-list{display:grid;gap:12px}
.route-stage-card{width:100%;text-align:left}
button.route-stage-card{font:inherit;color:inherit;cursor:pointer}
.current-stage{border-color:#9dceb0;box-shadow:0 8px 24px rgba(31,138,76,.08)}
.completed-stage{background:#f7fbf8}
.module-status.completed{background:#e4f3e9;color:#176b3b}
.locked-stage{border:1px dashed #c8d0cb;background:#f8f9f8;transition:.18s ease}
.locked-stage:hover{border-color:#8aa798;background:#f4f8f5;transform:translateY(-1px)}
.locked-stage h3{color:#39433d}
.locked-stage-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding-top:12px;border-top:1px solid var(--border);font-size:13px;color:var(--muted)}
.locked-stage-arrow{font-size:24px;line-height:1}
.locked-stage-max{display:grid;grid-template-columns:82px 1fr;align-items:center;gap:14px;margin:16px 0;padding:14px;border-radius:16px;background:#f3f7f4}
.locked-stage-max img{width:82px;height:82px;object-fit:contain}
.locked-stage-max p{margin:0;line-height:1.5}
@media(max-width:560px){
  .route-intro{align-items:flex-start;flex-direction:column}
  .locked-stage-max{grid-template-columns:64px 1fr}
  .locked-stage-max img{width:64px;height:64px}
}


/* Version 0.10 — universal lesson engine */
.generic-lesson-card{display:grid;gap:18px}
.lesson-progress{display:grid;gap:8px}
.lesson-progress-head{display:flex;align-items:center;justify-content:space-between}
.lesson-data-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:14px}
.lesson-data-table{width:100%;border-collapse:collapse;min-width:430px}
.lesson-data-table th,.lesson-data-table td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left}
.lesson-data-table th{background:#f3f6f4}
.lesson-data-table tr.highlight td{background:#eaf7ef}
.generic-options{display:grid;gap:10px}
.formula-reference{display:block;padding:16px;border-radius:14px;background:#18231d;color:#f4fff8;white-space:pre-wrap;overflow-wrap:anywhere}
.formula-textarea{width:100%;box-sizing:border-box;padding:14px;border:1px solid var(--border);border-radius:14px;font:inherit;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;resize:vertical}
.generic-feedback{min-height:22px;margin:0;font-weight:700}
.generic-feedback.success{color:#176b3b}
.generic-feedback.error{color:#a23838}
.generic-feedback.hint{color:#805c10;background:#fff8df;padding:10px 12px;border-radius:12px}


/* v0.11 — flexible blocks */
.lesson-content-image{display:block;max-width:100%;height:auto;margin:auto;border-radius:16px}
.video-placeholder{display:grid;gap:14px;padding:18px;border:1px solid var(--border);border-radius:16px;background:#f7f9f7;text-align:center}
.video-placeholder img{max-width:100%;max-height:260px;object-fit:cover;border-radius:12px;margin:auto}
.lesson-video{width:100%;max-height:70vh;border-radius:14px;background:#000}
.file-download-btn{display:inline-flex;text-decoration:none;justify-content:center}


/* v0.11.1 — реальные уроки в маршруте */
.empty-module-note{display:grid;gap:4px;padding:14px;border-radius:14px;background:#f4f7f5;color:var(--muted)}
.empty-module-note strong{color:var(--text)}
.lesson-progress-actions{display:flex;align-items:center;gap:10px}


/* v0.12 — settings and launch readiness */
.settings-list{display:grid;gap:12px}
.settings-toggle,.field-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;border:1px solid var(--border);border-radius:12px}
.field-row input{max-width:180px}
.danger-zone{border-color:#efcaca;background:#fffafa}
.danger-btn{background:#a83232;color:#fff;border:0;border-radius:12px;padding:12px 16px;font-weight:700}


/* Universal fill-in-the-slots exercise */
.fill-slots-layout{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:18px 0;padding:16px;border:1px solid var(--border);border-radius:16px;background:#fafcfb;line-height:1.8}
.fill-slots-layout.paragraph{display:block;line-height:2.25}
.fill-slots-layout.vertical{display:grid;align-items:stretch}
.fill-slots-text{white-space:pre-wrap}
.fill-slot{max-width:100%;min-width:92px;padding:8px 11px;border:1px dashed #8aa99a;border-radius:11px;background:#fff;color:var(--text);font:inherit;font-weight:700;cursor:pointer}
.fill-slot.filled{border-style:solid;border-color:var(--green);background:var(--green-soft)}
.fill-slot.active{outline:3px solid rgba(29,110,65,.16);border-color:var(--green)}
.fill-slots-options{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0 18px}
.fill-option{padding:9px 12px;border:1px solid var(--border);border-radius:999px;background:#fff;color:var(--text);font:inherit;font-weight:650;cursor:pointer}
.fill-option:disabled{opacity:.38;cursor:default}
.fill-slots-actions{margin-top:8px}
.full-width-btn{width:100%;margin-top:10px}
.fill-slots-help-actions{display:grid;gap:6px;margin-top:12px;text-align:center}
.muted-action{color:var(--muted)}
@media(max-width:520px){.fill-slots-layout{padding:13px;gap:6px}.fill-slot{min-width:78px;padding:8px}.fill-option{padding:8px 10px}}


/* Excel-like учебные таблицы */
.excel-like-table-wrap {
    overflow-x: auto;
    border: 1px solid #b9c2c9;
    background: #fff;
}
.excel-like-table {
    border-collapse: collapse;
    width: 100%;
    min-width: 430px;
    table-layout: auto;
}
.excel-like-table th,
.excel-like-table td {
    border: 1px solid #cbd2d8;
}
.excel-like-table .excel-corner,
.excel-like-table .excel-column-header,
.excel-like-table .excel-row-header {
    background: #e7ecef;
    color: #34424d;
    font-weight: 600;
    text-align: center;
}
.excel-like-table .excel-corner,
.excel-like-table .excel-row-header {
    width: 34px;
    min-width: 34px;
    max-width: 34px;
    padding: 7px 4px;
}
.excel-like-table .excel-column-header {
    height: 30px;
    padding: 5px 10px;
}
.excel-like-table .excel-data-header {
    background: #f7f9fa;
    font-weight: 600;
    text-align: left;
}
.excel-like-table tbody tr.highlight td,
.excel-like-table tbody tr.matched-row td {
    position: relative;
}
@media (max-width: 520px) {
    .excel-like-table .excel-corner,
    .excel-like-table .excel-row-header {
        width: 30px;
        min-width: 30px;
        max-width: 30px;
        padding-left: 3px;
        padding-right: 3px;
    }
}

/* v0.14.2 — персональный трек */
.personal-track-list{display:grid;gap:12px}.track-lesson-card{display:flex;align-items:center;gap:12px}.track-lesson-main{flex:1;min-width:0}.track-lesson-card.completed{opacity:.72}.track-lesson-card h3{margin:4px 0}.track-lesson-card p{margin:0;color:var(--muted)}
