@font-face{font-family:Manrope;src:url('/vendor/fonts/manrope-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url('/vendor/fonts/manrope-latin-600-normal.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:Manrope;src:url('/vendor/fonts/manrope-latin-700-normal.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Manrope;src:url('/vendor/fonts/manrope-cyrillic-400-normal.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0400-052F,U+2116}
@font-face{font-family:Manrope;src:url('/vendor/fonts/manrope-cyrillic-600-normal.woff2') format('woff2');font-weight:600;font-display:swap;unicode-range:U+0400-052F,U+2116}
@font-face{font-family:Manrope;src:url('/vendor/fonts/manrope-cyrillic-700-normal.woff2') format('woff2');font-weight:700;font-display:swap;unicode-range:U+0400-052F,U+2116}
:root{--ink:#152a35;--muted:#5a6c74;--blue:#176b78;--teal:#137a70;--orange:#ad6638;--line:#d9e3e2;--wash:#f2f7f5;--paper:#fcfdfb;--serif:Manrope,Arial,sans-serif;font-family:Manrope,Arial,sans-serif}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{background:#f7faf8}
.top{height:74px;background:#fcfdfbef;backdrop-filter:blur(16px);padding:0 clamp(16px,3vw,42px)}
.brandmark{border-radius:12px;background:#176b78;color:#fff;font-family:Manrope;font-weight:600;font-style:normal}
.brand strong{font:700 1.25rem Manrope,Arial,sans-serif;letter-spacing:-.04em}
.brand small{font-size:.75rem}
.shell{max-width:1600px;grid-template-columns:268px minmax(0,1fr)}
.side{top:74px;height:calc(100vh - 74px);background:#f4f8f6;padding-top:32px}
.main{max-width:1180px;padding-top:42px}
h1,h2,h3{font-family:Manrope,Arial,sans-serif;letter-spacing:-.045em;color:#15323c}
h1{font-size:clamp(2rem,3.4vw,3.5rem);font-weight:700;line-height:1.15}
h2{font-size:clamp(1.45rem,2vw,2rem);font-weight:700;line-height:1.25}
h3{letter-spacing:-.025em}
.lead{color:#4c666b;line-height:1.65}
p{line-height:1.7}
button{border-radius:11px;transition:background .15s,border-color .15s,transform .15s;letter-spacing:-.01em}
button:hover:not(:disabled){transform:translateY(-1px)}
button.primary{background:#176b78;border-color:#176b78}
button.primary:hover{background:#135863;border-color:#135863}
button.soft{background:#e9f4f1;color:#176b78}
.navitem.active{background:#e3f1ec;color:#165e64}
.steplink.active{background:#176b78}
.progress i{background:#20a18e}
.box,.task,.example,.figure,.privacy-note{border-radius:18px;box-shadow:0 8px 32px rgba(23,65,72,.035)}
.equation{font-family:Manrope,Arial,sans-serif;font-size:1.2rem;line-height:1.6;border-left:0;border-radius:16px;background:#ecf5f2;padding:25px 28px;color:#153d43}
.equation .katex{font-size:1.07em}.katex{font-size:1.02em;color:inherit}.katex .mathnormal,.katex .mord.mathnormal,.katex .mord.text,.katex .mop,.katex .mathrm,.katex .text{font-family:Manrope,Arial,sans-serif!important;font-style:normal!important}
sub,sup{font-size:.7em;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.3em}sup{top:-.55em}
input[type=text],input[type=number],textarea,select{border-radius:10px;border:1px solid #cbd9d7;background:white;max-width:100%}
input:focus,textarea:focus,select:focus{border-color:#176b78;box-shadow:0 0 0 3px #176b7822}
.choice{border:1px solid #d6e2e0;border-radius:10px;padding:13px 15px;margin:7px 0;transition:.15s;cursor:pointer}.choice:hover{border-color:#86b9b2;background:#f4faf7}.choice:has(input:checked){border-color:#168676;background:#e9f6f1}
.choice input{accent-color:#168676}
.custom-select{position:relative;display:block;margin-top:7px}.custom-select-trigger{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;background:white;border:1px solid #cbd9d7;font-weight:600}.custom-select-trigger:after{content:'⌄';font-size:1.3em;color:#176b78;margin-left:12px}.custom-select-menu{position:absolute;z-index:35;top:calc(100% + 5px);left:0;right:0;max-height:270px;overflow:auto;background:white;border:1px solid #bcd4d0;border-radius:12px;box-shadow:0 14px 32px #15323c25;padding:5px}.custom-select-menu[hidden]{display:none}.custom-select-option{display:block;width:100%;border:0;text-align:left;font-weight:500;padding:10px 12px}.custom-select-option[aria-selected=true]{background:#e8f5f0;color:#145d63;font-weight:700}
.visually-hidden-select{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.flow-banner{background:#173a44;color:white;border-radius:18px;padding:18px 22px;margin-bottom:25px;display:flex;align-items:center;justify-content:space-between;gap:16px}.flow-banner strong{display:block;font-size:1rem}.flow-banner span{font-size:.88rem;color:#d1e6e2}.flow-banner button{background:#fff;color:#176b78;border-color:#fff;white-space:nowrap}
.report-cta{background:#eaf5f1;border:1px solid #c9e4db;border-radius:16px;padding:20px;margin-bottom:24px}.report-cta strong{display:block;margin-bottom:6px}.report-cta p{margin-bottom:12px}
@media(max-width:700px){.top{height:auto;min-height:64px;padding:9px 14px}.top-actions{gap:4px}.top-actions button{padding:7px 8px;font-size:.8rem}.brand small{display:none}.main{padding:26px 16px 50px}.flow-banner{display:block}.flow-banner button{margin-top:12px}.equation{padding:20px 14px;font-size:1rem}.grid{display:block}}

.brandmark{width:58px;height:58px;object-fit:contain;border:0;border-radius:0;background:none;display:block;flex:none}.brand{gap:9px}.flow-banner span{display:block;margin-top:5px;line-height:1.5}.top{min-height:78px}

/* Clear sequence and consistent controls across the learning widgets. */
.route-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:10px}
.route-switch button{min-height:54px;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.3;padding:10px 15px}
.route-switch button{white-space:nowrap;font-size:clamp(.83rem,1.4vw,.97rem)}
.flow-banner button{display:inline-flex;align-items:center;justify-content:center;gap:12px;line-height:1.2;min-height:48px}
.flow-banner button span{display:inline;margin:0;color:inherit;font-size:inherit;line-height:1.2}
.figure{margin:24px 0;box-shadow:none}
.figure button{padding:0;display:block;line-height:0;background:white}
.figure button:hover{background:white;transform:none}
.figure img{display:block;width:100%;height:auto}
.figure-static{border:0;margin:20px 0 0;box-shadow:none}
.inline-equation{display:inline-block;white-space:nowrap;vertical-align:middle;margin:0 .12em}
.ref-detail{line-height:1.65}
.ref-detail p{margin:10px 0}
.ref-detail .inline-equation{display:block;width:100%;margin:10px 0 14px;padding:12px 10px;border-radius:10px;background:#f2f8f5;text-align:center;font-size:1.25rem;white-space:normal;overflow-x:auto}
.widget .formgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));align-items:end;gap:18px;margin:24px 0}
.widget .formgrid>.field{min-width:0;display:grid;grid-template-rows:minmax(2.9em,auto) 48px;gap:8px;align-items:end;font-size:.88rem;line-height:1.35}
.widget .formgrid>.field>input[type=number],.widget .formgrid>.field>.custom-select{height:48px;margin:0}
.widget .formgrid>.field>input[type=number]{padding:8px 13px}
.widget input[type=range]{height:48px;margin:0;padding:0;border:0;box-shadow:none;appearance:none;background:transparent;cursor:pointer;align-self:end}
.widget input[type=range]::-webkit-slider-runnable-track{height:7px;border-radius:10px;background:#bcd9d3}
.widget input[type=range]::-webkit-slider-thumb{appearance:none;width:22px;height:22px;margin-top:-7.5px;border-radius:50%;background:#176b78;border:3px solid white;box-shadow:0 0 0 1px #176b78,0 2px 5px #15323c2b}
.widget input[type=range]::-moz-range-track{height:7px;border-radius:10px;background:#bcd9d3}
.widget input[type=range]::-moz-range-thumb{width:17px;height:17px;border-radius:50%;background:#176b78;border:3px solid white;box-shadow:0 0 0 1px #176b78}
.widget .custom-select-trigger{height:48px}
.widget .formgrid>.field>.custom-select .custom-select-trigger{height:48px}
.widget-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.widget-toolbar .label{margin:0}
.widget-expand{display:none}
.no-break{white-space:nowrap}
.widget .plot{background:#fff}
.widget .legend{gap:7px 14px;font-size:.82rem;line-height:1.35;padding:8px 12px}
.widget .legend span{display:inline-flex;align-items:baseline;gap:5px}
.widget .legend i{flex:none;margin:0}
.menu-backdrop{display:none}
body.widget-is-expanded{overflow:hidden}
.widget.is-expanded{position:fixed;inset:0;z-index:80;width:100vw;height:100dvh;max-width:none;overflow:auto;margin:0;padding:14px 16px 32px;border:0;border-radius:0;background:#f7fbf9;box-shadow:none}
.widget.is-expanded .widget-toolbar{position:sticky;top:-14px;z-index:3;margin:-14px -16px 14px;padding:14px 16px;background:#f7fbf9;border-bottom:1px solid #d5e5df}
.widget.is-expanded .widget-expand{display:inline-flex}
.widget.is-expanded .plot{overflow-x:auto;overscroll-behavior-inline:contain}
.widget.is-expanded .plot svg{width:max(700px,100%);max-width:none}
@media(max-width:700px){.widget{padding:17px 13px}.widget-expand{display:inline-flex;padding:7px 10px;font-size:.78rem;white-space:nowrap}.widget .plot{margin:17px -6px;padding:4px}.widget .widget-stats{padding:15px 14px;font-size:.94rem;line-height:1.6}}
dialog{max-width:min(900px,calc(100vw - 28px));max-height:calc(100dvh - 28px);border-radius:18px}
.dialoghead{padding:14px 22px;background:#fcfdfb}
.dialogbody{padding:24px 28px 30px}
.dialogbody details{margin-top:18px}
.dialogbody .figure img{width:100%}
.plot svg text{font-family:Manrope,Arial,sans-serif}
@media(max-width:700px){.route-switch button{min-height:58px;padding:9px}.widget .formgrid{grid-template-columns:1fr;gap:12px}.widget .formgrid>.field{grid-template-rows:auto 48px;gap:5px}.dialoghead{padding:12px 16px}.dialogbody{padding:18px 16px 24px}.flow-banner button{width:100%}}

/* The learning sequence is a single timeline, not a row of competing cards. */
.process-flow{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin:24px 0 26px;padding:0}
.process-flow::before{content:"";position:absolute;left:22px;right:calc(20% - 22px);top:21px;height:2px;background:#b8d8cf}
.process-flow li{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:11px;min-height:0;padding:0 8px 0 0;border:0;border-radius:0;background:transparent;box-shadow:none}
.process-flow li span{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:50%;border:2px solid #a5d2c5;background:#edf8f3;color:#176b78;font-size:.81rem;line-height:1;font-weight:700}
.process-flow li strong{font-size:.91rem;line-height:1.32;letter-spacing:-.02em;font-weight:600;max-width:125px}
.ref-detail .inline-equation .katex{font-size:1.27em}
@media(max-width:700px){.process-flow{grid-template-columns:1fr;gap:0;margin:22px 0}.process-flow::before{left:21px;right:auto;top:22px;bottom:22px;width:2px;height:auto}.process-flow li{min-height:62px;flex-direction:row;align-items:center;gap:15px;padding:5px 0}.process-flow li strong{max-width:none;font-size:.98rem}}
.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.two>.box{min-width:0}
.btnrow button{max-width:100%;white-space:normal}
input[type=file]{max-width:100%;min-width:0}
@media(max-width:1100px){.two{grid-template-columns:minmax(0,1fr)}}

/* The steps belong to the first navigation section. */
.viewnav{gap:4px}
.learn-nav{margin:0 0 4px}
.learn-module-trigger{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;border:0;border-radius:8px;background:transparent;text-align:left;font-size:.9rem;font-weight:600;min-height:44px}
.learn-module-trigger.active{background:#e3f1ec;color:#165e64}
.learn-module-trigger strong{font-weight:700;flex:1}
.learn-toggle-icon{position:relative;display:block;flex:none;width:28px;height:28px;border:1px solid #9dc6bd;border-radius:9px;background:#f7fcf9}
.learn-toggle-face{position:absolute;inset:0;border-radius:inherit}
.learn-toggle-face::before,.learn-toggle-face::after{content:"";position:absolute;left:50%;top:50%;display:block;background:#176b78;border-radius:2px;transform:translate(-50%,-50%)}
.learn-toggle-face::before{width:11px;height:1.5px}
.learn-toggle-face::after{width:1.5px;height:11px;transition:height .22s cubic-bezier(.2,.7,.2,1),opacity .22s}
.learn-module-trigger[aria-expanded="true"] .learn-toggle-face::after{height:0;opacity:0}
.learn-nav-body{display:grid;grid-template-rows:1fr;opacity:1;margin:0 0 4px;transition:grid-template-rows .28s cubic-bezier(.22,.7,.2,1),opacity .22s ease}
.learn-nav-body[data-open="false"]{grid-template-rows:0fr;opacity:0;pointer-events:none}
.learn-nav-inner{min-height:0;overflow:hidden}
.learn-nav-content{padding:8px 0 5px}
.learn-progress{display:flex;justify-content:space-between;gap:8px;margin:0 7px 5px;color:#59716f;font-size:.72rem}
.learn-nav .progress{margin:0 7px 8px}
.learn-nav .stepnav{gap:1px}
.learn-nav .steplink{width:100%;padding:8px 9px;border-radius:8px;font-size:.78rem;line-height:1.35}
.learn-nav .steplink.active{background:#176b78;color:#fff}
.learn-nav .steplink.active span{color:#c8eae0}
@media(prefers-reduced-motion:reduce){.learn-nav-body,.learn-toggle-face::after{transition:none}}
.viewnav>.navitem{font-size:.9rem}
.viewnav>.navitem:first-of-type{font-weight:700;color:#176b78}
.workspace-link{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 25px;padding:16px 18px;border:1px solid #c9e1d8;border-radius:14px;background:#edf6f1}
.workspace-link strong,.workspace-link span{display:block}
.workspace-link strong{font-size:.93rem;color:#143b3b}
.workspace-link div>span{font-size:.84rem;color:#58716e;margin-top:3px;line-height:1.4}
.workspace-link button{flex:none;background:#176b78;color:#fff;border-color:#176b78;display:inline-flex;align-items:center;gap:10px}
.workspace-link button span{display:inline;line-height:1}
@media(max-width:760px){.menu-backdrop.open{display:block;position:fixed;inset:68px 0 0;z-index:18;background:rgba(21,42,53,.28)}}
@media(max-width:700px){.workspace-link{display:block}.workspace-link button{margin-top:12px;width:100%;justify-content:center}.process-flow::before{right:auto}.top{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fcfdfb}}
.lab-intro{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:12px 24px;align-items:start;padding:19px 22px;margin-bottom:24px;border:1px solid #cfe4dc;border-radius:16px;background:#eef7f2}
.lab-intro h2{font-size:1.38rem;margin:5px 0 6px}
.lab-intro p{font-size:.9rem;color:#536e69;margin-bottom:0}
.lab-intro .field{margin:0;min-width:0}
.lab-intro textarea{min-height:75px;max-height:170px;resize:vertical}
.lab-intro .btnrow{grid-column:1/-1;margin:0}
@media(max-width:700px){.lab-intro{grid-template-columns:1fr;padding:17px}.lab-intro .btnrow{display:flex;flex-wrap:wrap}.lab-intro .btnrow button{flex:1 1 150px}}
