:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f6f7fb;--ink:#202124;--muted:#6f7785;--line:#dfe4ec;--green:#58cc02;--green-dark:#46a302;--blue:#1cb0f6;--yellow:#ffc800;--red:#ff4b4b;--white:#fff;--shadow:0 14px 35px #303e561f}*{box-sizing:border-box}body{min-height:100vh;color:var(--ink);background:radial-gradient(circle at 20% 0%, #1cb0f62e, transparent 28rem), linear-gradient(180deg, #fff 0%, var(--bg) 45%, #eef3f8 100%);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow-x:hidden}button{font:inherit}.app-shell{width:100%;max-width:560px;min-height:100vh;margin:0 auto;padding:16px 18px 104px;position:relative;overflow-x:hidden}.topbar{grid-template-columns:44px 1fr auto;align-items:center;gap:14px;min-height:48px;display:grid}.icon-button{width:44px;height:44px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:8px;font-size:26px}.progress-track{background:#e8edf3;border-radius:999px;height:16px;overflow:hidden}.progress-fill{border-radius:inherit;background:var(--green);width:0%;height:100%;transition:width .22s}.stat{min-width:52px;color:var(--red);align-items:center;gap:6px;font-weight:800;display:inline-flex}.heart{font-size:21px}.view{animation:.16s ease-out rise;display:none}.view-active{display:block}.course-header{padding:26px 2px 18px}.kicker,.lesson-label{color:var(--blue);letter-spacing:0;text-transform:uppercase;margin:0 0 7px;font-size:13px;font-weight:900}h1,h2,p{margin-top:0}h1{margin-bottom:8px;font-size:36px;line-height:1.05}.course-header p:last-child,#resultText{color:var(--muted);line-height:1.55}.unit-strip{color:var(--white);box-shadow:var(--shadow);background:#273043;border-radius:8px;grid-template-columns:minmax(0,auto) minmax(0,1fr);align-items:center;gap:8px 14px;margin:10px 0 22px;padding:16px 18px;display:grid}.unit-strip strong{overflow-wrap:anywhere;min-width:0}.unit-strip span{color:#c5d0df;font-size:13px;font-weight:800}.lesson-path{gap:20px;padding:4px 0 28px;display:grid}.pattern-grid{gap:24px;padding-bottom:28px;display:grid}.pattern-section{gap:12px;display:grid}.pattern-list{gap:10px;display:grid}.pattern-card{border:2px solid var(--line);background:var(--white);width:100%;min-width:0;min-height:112px;color:var(--ink);cursor:pointer;text-align:left;border-bottom-width:5px;border-radius:8px;gap:6px;padding:16px 18px;display:grid}.pattern-card:hover{border-color:var(--blue);background:#f6fcff}.pattern-card:active{border-bottom-width:2px;transform:translateY(3px)}.pattern-card span{color:var(--blue);text-transform:uppercase;font-size:12px;font-weight:900}.pattern-card strong{font-size:21px;line-height:1.15}.pattern-card small{color:var(--muted);overflow-wrap:anywhere;font-size:14px;line-height:1.38}.pattern-card em{color:#526071;background:#eef2f7;border-radius:999px;justify-self:start;padding:5px 9px;font-size:12px;font-style:normal;font-weight:900}.path-unit{border-top:1px solid var(--line);justify-content:space-between;align-items:baseline;gap:16px;padding:18px 2px 0;display:flex}.path-unit:first-child{border-top:0;padding-top:0}.path-unit span{color:var(--blue);font-size:13px;font-weight:900}.path-unit strong{font-size:18px}.lesson-node{grid-template-columns:92px 1fr;align-items:center;gap:18px;min-height:86px;display:grid}.lesson-node:nth-child(2n){grid-template-columns:1fr 92px}.lesson-node:nth-child(2n) .lesson-copy{text-align:right;order:-1}.node-button{background:var(--green);width:86px;height:86px;color:var(--white);box-shadow:0 8px 0 var(--green-dark), var(--shadow);cursor:pointer;border:0;border-radius:50%;font-size:31px;font-weight:900;transition:transform .12s,box-shadow .12s,background .12s}.node-button:active{box-shadow:0 2px 0 var(--green-dark), var(--shadow);transform:translateY(6px)}.node-button.locked{cursor:not-allowed;background:#cbd3df;box-shadow:0 8px #aab5c4}.node-button.done{background:var(--yellow);box-shadow:0 8px 0 #d9a900, var(--shadow)}.lesson-copy strong{margin-bottom:4px;font-size:17px;display:block}.lesson-copy span{color:var(--muted);font-size:14px;line-height:1.35}.lesson-panel,.result-panel{min-width:0;padding:30px 2px 0}.lesson-panel h2,.result-panel h2{margin-bottom:24px;font-size:27px;line-height:1.2}.lesson-panel h2{margin-bottom:14px}.material-tabs{gap:8px;margin:0 0 14px;padding-bottom:4px;display:flex;overflow-x:auto}.material-tab{border:1px solid var(--line);background:var(--white);min-width:72px;min-height:34px;color:var(--muted);cursor:pointer;white-space:nowrap;border-radius:999px;padding:0 12px;font-size:13px;font-weight:900}.material-tab.active{border-color:var(--blue);color:#0f82bf;background:#eaf8ff}.material-tab:disabled{cursor:not-allowed;opacity:.55}.material-card{border:2px solid var(--line);background:#ffffffeb;border-bottom-width:5px;border-radius:8px;min-width:0;margin-bottom:22px;padding:18px}.material-kicker{color:var(--blue);margin-bottom:7px;font-size:12px;font-weight:900}.material-card h3{margin:0 0 10px;font-size:21px;line-height:1.22}.material-card p,.material-card li{color:#3d4655;overflow-wrap:anywhere;line-height:1.52}.material-card strong,.flow-node strong,.flow-node span strong,.takeaway strong{color:#116e9f;font-weight:900}.material-card ul{gap:7px;margin:14px 0;padding-left:20px;display:grid}.material-card pre{color:#e5edf7;background:#1f2937;border-radius:8px;margin:14px 0;padding:14px;font-size:13px;line-height:1.5;overflow-x:auto}.material-card>pre code{white-space:pre-wrap;overflow-wrap:anywhere}.flow-diagram{background:#f3fbff;border:1px solid #cfe2ef;border-radius:8px;gap:8px;margin:16px 0;padding:14px;display:grid}.flow-step{justify-items:center;gap:8px;display:grid}.flow-node{background:var(--white);border:2px solid #a9dbf5;border-bottom-width:4px;border-radius:8px;width:100%;min-width:0;padding:14px 16px}.flow-node strong{color:#116e9f;margin-bottom:6px;font-size:16px;display:block}.flow-node span{color:#4d5968;font-size:14px;line-height:1.48;display:block}.flow-arrow{color:var(--blue);font-size:22px;font-weight:900;line-height:1}.class-diagram{background:#fafbfe;border:1px solid #d8dee8;border-radius:8px;gap:14px;min-width:0;margin:16px 0;padding:14px;display:grid}.mermaid-host{background:var(--white);border:1px solid #e2e8f0;border-radius:8px;max-width:100%;min-height:220px;padding:10px;overflow-x:auto}.mermaid-host svg{width:max-content;min-width:min(620px,100%);max-width:none;margin:0 auto;display:block}.mermaid-host pre{white-space:pre;margin:0}.diagram-heading{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.diagram-heading span{color:var(--blue);text-transform:uppercase;font-size:12px;font-weight:900}.diagram-heading strong{color:var(--ink);font-size:16px}.class-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.class-box{background:var(--white);border:2px solid #cbd5e1;border-bottom-width:4px;border-radius:8px;min-width:0;padding:12px}.class-stereotype{color:#697386;text-transform:uppercase;margin-bottom:4px;font-size:11px;font-weight:900;display:block}.class-box>strong{color:#1f2937;overflow-wrap:anywhere;font-size:15px;display:block}.class-box ul{gap:4px;margin:10px 0 0;padding-left:17px}.class-box li{overflow-wrap:anywhere;font-size:12px}.relation-list{gap:6px;padding-top:2px;display:grid}.relation-list span{color:#465365;background:#eef2f7;border-radius:8px;padding:8px 10px;font-size:12px;line-height:1.35}.takeaway{border-left:5px solid var(--yellow);background:#fff8d8;margin:14px 0 16px;padding:12px 14px;line-height:1.45;display:block}.secondary-button{width:100%;min-height:48px;color:var(--white);cursor:pointer;background:#1cb0f6;border:2px solid #139bda;border-bottom-width:5px;border-radius:8px;font-weight:900}.secondary-button:active{border-bottom-width:2px;transform:translateY(3px)}.question-heading{padding-top:4px}.hidden{display:none!important}.choice-grid{gap:12px;display:grid}.choice-button{border:2px solid var(--line);background:var(--white);width:100%;min-height:74px;color:var(--ink);cursor:pointer;text-align:left;border-bottom-width:5px;border-radius:8px;padding:14px 18px;font-weight:800;line-height:1.35;transition:border-color .12s,background .12s,transform .12s}.choice-button:hover{border-color:var(--blue);background:#f2fbff}.choice-button:active{border-bottom-width:2px;transform:translateY(3px)}.choice-button.correct{border-color:var(--green);background:#eefbe8}.choice-button.wrong{border-color:var(--red);background:#fff0f0}.unsupported-question{color:var(--muted);background:#f8fafc;border:2px dashed #b8c3d2;border-radius:8px;margin:0;padding:16px 18px;font-weight:800;line-height:1.45}.result-panel{text-align:center}.result-mark{background:var(--green);width:86px;height:86px;color:var(--white);border-radius:50%;place-items:center;margin:16px auto 20px;font-size:44px;font-weight:900;display:grid}.result-mark.wrong{background:var(--red)}.bottom-action{border-top:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffffeb;place-items:center;padding:18px;display:grid;position:fixed;bottom:0;left:0;right:0}.primary-button{background:var(--green);width:min(100%,524px);min-height:54px;color:var(--white);box-shadow:0 5px 0 var(--green-dark);cursor:pointer;border:0;border-radius:8px;font-weight:900}.primary-button:active{box-shadow:0 1px 0 var(--green-dark);transform:translateY(4px)}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (width<=420px){.app-shell{padding-inline:14px}h1{font-size:31px}.lesson-panel h2,.result-panel h2{font-size:23px}.lesson-node,.lesson-node:nth-child(2n){grid-template-columns:76px 1fr}.lesson-node:nth-child(2n) .lesson-copy{text-align:left;order:0}.node-button{width:74px;height:74px;font-size:27px}.class-grid{grid-template-columns:1fr}}html,body,#root{width:100%;max-width:100%;min-height:100vh;overflow-x:hidden}.app-shell{max-width:min(560px,100vw);padding-bottom:144px}.app-shell>*,.subject-list,.pattern-grid,.pattern-section,.pattern-list,.lesson-path,.choice-grid,.profile-card,.login-card,.profile-stats{min-width:0}.unit-strip,.subject-card,.pattern-card,.material-card,.choice-button,.profile-card,.login-card,.profile-stats{max-width:100%}.subject-hero{padding-top:18px}.subject-list{gap:14px;margin-top:34px;display:grid}.subject-card{appearance:none;color:#202124;cursor:pointer;text-align:left;background:#fff;border:2px solid #d8e1ea;border-radius:8px;gap:10px;padding:22px 20px;transition:transform .12s,box-shadow .12s,border-color .12s;display:grid;box-shadow:0 4px #d8e1ea}.subject-card:hover{border-color:#58cc02;transform:translateY(-1px);box-shadow:0 4px #46a302}.subject-card strong{overflow-wrap:anywhere;font-size:26px;line-height:1.15}.subject-card small{color:#5f6b7a;overflow-wrap:anywhere;font-size:16px;line-height:1.55}.subject-badge{color:#1cb0f6;letter-spacing:0;text-transform:uppercase;font-size:13px;font-weight:900}.subject-meta{flex-wrap:wrap;gap:8px;margin-top:4px;display:flex}.subject-meta span{color:#536171;background:#eef3f8;border-radius:999px;padding:6px 10px;font-size:13px;font-weight:800}.bottom-tabs{z-index:20;width:min(560px,100vw);padding:10px 14px calc(10px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fffffff5;border-top:1px solid #dfe4ec;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 auto;display:grid;position:fixed;bottom:0;left:max(0px,50vw - 280px);right:max(0px,50vw - 280px)}.bottom-action{right:max(0px,50vw - 280px);bottom:calc(78px + env(safe-area-inset-bottom));width:min(560px,100vw);margin:0 auto;left:max(0px,50vw - 280px)}.bottom-tab{color:#6f7785;cursor:pointer;background:0 0;border:0;border-radius:8px;justify-items:center;gap:5px;min-width:0;min-height:58px;font-size:12px;font-weight:900;display:grid}.bottom-tab.active{color:#1cb0f6;background:#eef8ff}.tab-icon{border:3px solid;border-radius:8px;width:22px;height:22px}.bottom-tab:nth-child(2) .tab-icon{border-radius:999px}.bottom-tab:nth-child(3) .tab-icon{border-radius:50% 50% 8px 8px}.profile-card,.login-card,.profile-stats{background:#fff;border:2px solid #d8e1ea;border-radius:8px;box-shadow:0 4px #d8e1ea}.profile-card{grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:14px;padding:18px;display:grid}.profile-avatar{color:#fff;background:#273043;border-radius:50%;place-items:center;width:58px;height:58px;font-size:24px;font-weight:900;display:grid}.profile-main{gap:3px;display:grid}.profile-main span,.profile-stats span,.login-card label{color:#1cb0f6;text-transform:uppercase;font-size:12px;font-weight:900}.profile-main strong{font-size:24px;line-height:1.15}.profile-main small{color:#6f7785;line-height:1.35}.login-card{gap:12px;padding:18px;display:grid}.login-card input{color:#202124;width:100%;min-height:52px;font:inherit;border:2px solid #d8e1ea;border-radius:8px;padding:0 14px;font-weight:800}.login-card input:focus{border-color:#1cb0f6;outline:3px solid #1cb0f62e}.form-error{color:#ff4b4b;margin:0;font-size:13px;font-weight:800}.profile-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:16px;display:grid;overflow:hidden}.profile-stats div{background:#fff;gap:5px;padding:16px 12px;display:grid}.profile-stats strong{font-size:22px;line-height:1.15}.compact{width:auto;min-height:42px;padding:0 14px}.pattern-card strong,.pattern-card small,.subject-card strong,.subject-card small,.profile-main strong,.profile-main small,.profile-stats strong,.material-card h3,.lesson-panel h2,.result-panel h2,.choice-button{overflow-wrap:anywhere}@media (width<=420px){.unit-strip{grid-template-columns:1fr}.profile-card{grid-template-columns:50px minmax(0,1fr)}.profile-card .compact{grid-column:1/-1;width:100%}.profile-stats{grid-template-columns:1fr}}