:root{--bg:#f5f3eb;--paper:#fffef9;--ink:#112e37;--text:#24434a;--soft:#52676b;--line:#d8ded4;--teal:#006554;--teal-bg:#dff1e6;--coral:#9a4829;--coral-bg:#f6e7d9;--purple:#634283;--purple-bg:#eee7f5;--radius:18px;--shell:1190px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--bg);font:16px/1.58 "Segoe UI",system-ui,sans-serif}a{color:var(--teal);text-underline-offset:.2em}a:hover{text-decoration-thickness:2px}button,input,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #bd6b43;outline-offset:4px}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.15}h1{font-size:clamp(2.05rem,4.7vw,4.7rem);letter-spacing:-.06em}h2{font-size:clamp(1.55rem,3vw,2.32rem);letter-spacing:-.045em}h3{font-size:1.16rem;letter-spacing:-.015em}p+p{margin-top:.65rem}
.shell{width:min(var(--shell),calc(100% - 64px));margin:auto}.skip{position:fixed;left:12px;top:12px;transform:translateY(-180%);z-index:10;background:#fff;padding:10px}.skip:focus{transform:none}.mast{background:var(--paper);border-bottom:1px solid var(--line)}.bar{min-height:75px;width:min(var(--shell),calc(100% - 64px));margin:auto;display:flex;align-items:center;gap:32px;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;white-space:nowrap;font-size:.59rem;font-weight:800;letter-spacing:.13em;line-height:1.23}.brand strong{display:block;font-size:1.05rem;letter-spacing:-.04em;margin-top:2px}.mainnav{display:flex;gap:6px;flex-wrap:wrap}.mainnav a,.pdfnav{text-decoration:none;color:var(--ink);font-weight:650;padding:8px 12px;border-radius:9px}.mainnav a:hover,.mainnav a[aria-current],.pdfnav{background:var(--teal-bg);color:var(--teal)}.pdfnav{white-space:nowrap}.foot{margin-top:58px;border-top:1px solid var(--line);color:var(--soft)}.foot>.shell{padding:25px 0;display:flex;gap:18px;flex-wrap:wrap;justify-content:space-between;font-size:.84rem}.foot span{font-weight:750;letter-spacing:.10em}.foot b{color:var(--teal)}
#workspace{min-height:58vh;padding:32px 0 0;outline:none}.kicker{font-size:.72rem;font-weight:800;letter-spacing:.115em;text-transform:uppercase;color:var(--teal)}.sub{display:block;color:var(--soft);font-size:clamp(.96rem,1.55vw,1.16rem);margin-top:10px;line-height:1.45}.muted{color:var(--soft)}.lead{max-width:60ch;color:var(--text);font-size:1.05rem}.hero{background:#102d37;color:#f6f6e8;min-height:435px;border-radius:27px;display:grid;grid-template-columns:1.14fr .86fr;position:relative;overflow:hidden;box-shadow:0 16px 38px #1b39351a}.herotext{position:relative;z-index:1;padding:clamp(30px,5vw,64px);align-self:center}.hero h1{max-width:12ch;margin:13px 0}.hero .kicker{color:#9ce4cb}.hero .sub{color:#a9d1cc;margin:0 0 16px}.hero .lead{color:#e3ebe3}.hero-art{width:100%;height:100%;object-fit:cover;align-self:stretch}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;align-items:center}.btn{display:inline-flex;gap:8px;align-items:center;justify-content:center;border:1px solid transparent;background:var(--teal);color:white;padding:10px 15px;border-radius:10px;text-decoration:none;font-weight:700;line-height:1.35;min-height:43px}.btn:hover{background:#004f41;color:white}.btn.light{background:#a6e6cc;color:#112e37}.btn.light:hover{background:#c7f0dd}.btn.ghost{background:transparent;color:var(--teal);border-color:var(--line)}.btn.ghost:hover{background:var(--teal-bg);color:var(--teal)}.hero .btn.ghost{color:#ecf4e8;border-color:#52727a}.hero .btn.ghost:hover{background:#24464c}.btn:disabled{opacity:.5;cursor:default}.meterbar{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:15px;overflow:hidden;margin-top:18px}.metric{background:var(--paper);padding:16px 18px;display:flex;align-items:center;gap:12px}.metric b{font-size:1.85rem;line-height:1;letter-spacing:-.07em}.metric span{font-size:.79rem;color:var(--soft);line-height:1.23}
.section{margin-top:36px}.sectionhead{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:0 0 16px}.sectionhead .kicker{margin-bottom:6px}.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.tile,.panel,.lesson{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius)}.tile{display:block;padding:18px;text-decoration:none;color:var(--ink);position:relative;transition:transform .14s,border-color .14s}.tile:hover{transform:translateY(-2px);border-color:var(--teal);text-decoration:none}.tile svg{display:block;width:50px;height:50px;margin-bottom:18px}.tile h3{padding-right:10px}.tile .sub{font-size:.86rem;margin-top:4px}.tile p{font-size:.87rem;color:var(--soft);margin-top:12px}.tile .arrow{position:absolute;top:21px;right:18px;color:var(--teal)}.panel{padding:clamp(15px,2.6vw,27px)}.route{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.route article{border-top:2px solid #a4cbbc;padding:14px 4px}.route article b{font-size:.78rem;color:var(--teal);letter-spacing:.08em}.route article h3{margin:7px 0 5px}.route article p{font-size:.91rem;color:var(--soft)}
.crumb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:.86rem;color:var(--soft);margin-bottom:15px}.crumb a{font-weight:650}.pagetitle{margin-bottom:18px}.pagetitle h1{font-size:clamp(2.05rem,4vw,3.65rem);margin-top:6px}.filters{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin:15px 0}.search{flex:1 1 230px;min-width:0;background:var(--paper);border:1px solid var(--line);padding:11px 13px;border-radius:10px;color:var(--ink)}.filters select{padding:11px;border:1px solid var(--line);border-radius:10px;color:var(--ink);background:var(--paper)}.badge{display:inline-flex;gap:5px;align-items:center;padding:3px 8px;border-radius:6px;font-size:.69rem;font-weight:800;letter-spacing:.045em;text-transform:uppercase;background:var(--teal-bg);color:var(--teal);white-space:nowrap}.badge.chem{background:var(--coral-bg);color:var(--coral)}.badge.lang{background:var(--purple-bg);color:var(--purple)}.lessonlist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.lesson{display:grid;grid-template-columns:50px 1fr auto;gap:11px;padding:14px 16px;align-items:center;color:var(--ink);text-decoration:none}.lesson:hover{border-color:var(--teal);text-decoration:none}.lesson .serial{width:44px;height:44px;background:#e7efe8;color:#205c53;border-radius:10px;display:grid;place-items:center;font-weight:750;font-variant-numeric:tabular-nums}.lesson .sub{font-size:.82rem;margin:3px 0 0}.lesson .readflag{color:var(--teal);font-size:.95rem;font-weight:700}
.reader{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:18px;align-items:start}.reader>div,.reader aside{min-width:0}.reader aside{position:sticky;top:15px;display:grid;gap:12px}.reader aside h3{margin-bottom:10px}.reader aside p{font-size:.88rem}.reader aside .stack{display:grid;gap:8px;margin-top:10px}.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}.tabs button{min-height:41px;border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--ink);padding:7px 11px;font-weight:700}.tabs button[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}.pairs{display:grid;gap:0}.pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;border-bottom:1px solid var(--line)}.pair:last-child{border-bottom:0}.pair>div{min-width:0;padding:12px 13px;overflow-wrap:anywhere}.pair>div+div{border-left:1px solid var(--line);color:#24515f}.pair:nth-child(even){background:#f4f7ef}.pair .langhead{font-size:.69rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800;color:var(--teal);padding-top:8px;padding-bottom:8px}.pairs[data-language=uk] .pair,.pairs[data-language=en] .pair{grid-template-columns:1fr}.pairs[data-language=uk] .pair>div[lang=en],.pairs[data-language=en] .pair>div[lang=uk]{display:none}.pairs[data-language=en] .pair>div+div{border-left:0}.topic-panel .kicker{margin:0 0 8px}.topic-panel{margin-bottom:13px}.topic-panel h2{font-size:1.43rem;margin:0 0 12px}.figure{margin:0}.figure img{width:100%;height:auto;display:block;border-radius:13px;background:#eaf3ed}.figure figcaption{font-size:.81rem;color:var(--soft);margin:8px 0 0}.fold{border:1px solid var(--line);border-radius:10px;padding:9px 12px;margin-top:9px;background:#f5f7ef}.fold summary{cursor:pointer;font-weight:700;color:var(--teal)}.fold[open] summary{margin-bottom:8px}.topic-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:space-between;margin-top:16px}.callout{padding:13px 15px;background:var(--teal-bg);border-left:3px solid var(--teal);border-radius:0 9px 9px 0;margin-bottom:13px}.callout small{display:block;margin-top:4px;color:#2f5a53}
.langgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}.langgrid .panel h2{font-size:1.62rem}.langgrid .panel p{margin-top:9px}.flash{margin-top:14px;display:grid;gap:10px}.flash input{width:100%}.term{font-size:clamp(1.35rem,3vw,2.05rem);font-weight:760;letter-spacing:-.045em}.flash .answer{background:#e6f1e7;padding:12px;border-radius:10px}.resultline{display:flex;gap:8px;flex-wrap:wrap;margin:11px 0}.resultline span{padding:5px 8px;border-radius:8px;background:var(--teal-bg);font-weight:700}.quiztop{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.timer{font-variant-numeric:tabular-nums;background:#e4efe7;border-radius:8px;padding:5px 10px;font-weight:800}.timer.low{background:#f7dfd6;color:#862f20}progress{width:100%;accent-color:var(--teal);height:9px}.question h2{font-size:clamp(1.35rem,3vw,2rem);margin:14px 0 8px}.choices{border:0;padding:0;margin:15px 0;display:grid;gap:8px}.choice{display:flex;align-items:flex-start;gap:9px;border:1px solid var(--line);border-radius:10px;padding:11px;cursor:pointer}.choice:has(input:checked){background:var(--teal-bg);border-color:var(--teal)}.choice input{accent-color:var(--teal);margin-top:6px}.choice small{display:block;color:var(--soft);margin-top:3px}.sources{display:grid;gap:10px}.source a{font-size:1.06rem;font-weight:750}.source p{color:var(--soft);margin-top:5px}
@media(max-width:900px){.shell,.bar{width:calc(100% - 36px)}.bar{gap:12px}.tiles{grid-template-columns:repeat(2,1fr)}.reader{grid-template-columns:minmax(0,1fr) 225px}.hero{min-height:340px}.hero h1{font-size:clamp(2.2rem,6vw,3.75rem)}}
@media(max-width:680px){.shell,.bar{width:calc(100% - 24px)}.bar{min-height:65px;flex-wrap:wrap;padding:8px 0}.mainnav{order:3;flex:1 0 100%;justify-content:space-between;gap:2px}.mainnav a{padding:5px 8px;font-size:.87rem}.pdfnav{padding:6px 10px}.hero{grid-template-columns:1fr;min-height:0}.herotext{padding:26px 22px 12px}.hero-art{height:182px;object-position:center 46%}.hero h1{margin:10px 0}.hero .lead{font-size:.93rem}.metric{padding:11px 8px;display:block}.metric b{display:block;font-size:1.52rem;margin-bottom:5px}.metric span{font-size:.69rem}.route,.lessonlist,.reader,.langgrid{grid-template-columns:1fr}.reader aside{position:static;grid-row:2}.tile{padding:13px}.tile svg{width:40px;height:40px;margin-bottom:10px}.tile p{font-size:.81rem}.section{margin-top:27px}#workspace{padding-top:18px}.pair{grid-template-columns:1fr}.pair>div+div{border-left:0;border-top:1px dashed var(--line);padding-top:8px}.pair>div{padding:9px 8px}.pair .langhead[lang=en]{display:none}.pairs[data-language=en] .pair .langhead[lang=en]{display:block}.panel{padding:13px}.figure figcaption{font-size:.77rem}.foot>.shell{padding:16px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.tile{transition:none}}
@media print{.mast,.foot,.tabs,.actions,.topic-controls,.reader aside,.crumb{display:none!important}body{background:white}.reader{display:block}.shell{width:100%}.panel{border:0;padding:0}.pair{break-inside:avoid}.figure{break-inside:avoid}.topic-panel h2{break-after:avoid}.figure img{max-height:250px;object-fit:contain}}

.molecule{display:block;width:100%;height:auto;margin:14px 0 0;touch-action:none;cursor:grab}.molecule:active{cursor:grabbing}.molecule:focus-visible{outline:3px solid #bd6b43;outline-offset:4px}.figure+.figure{margin-top:15px}.lessonlist{margin-top:8px}