.nmr{--ink:#193b39;--teal:#087f79;--line:#d5e4df;color:var(--ink);background:#f8faf6;padding:clamp(16px,3vw,32px);border-radius:24px;font:16px/1.55 Helvetica,Arial,sans-serif}.nmr *{box-sizing:border-box}.nmr h2{font-size:clamp(26px,4vw,38px);letter-spacing:-.035em;margin:4px 0 8px}.nmr h3{font-size:20px;margin:0 0 12px}.nmr p{margin:8px 0 16px}.nmr small,.nmr .muted{color:#536b68}.nmr-kicker{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:var(--teal)}.nmr-layout{display:grid;grid-template-columns:minmax(250px,.8fr) minmax(0,1.6fr);gap:18px;margin-top:20px}.nmr-card{padding:22px;background:white;border:1px solid var(--line);border-radius:18px;min-width:0}.nmr label{display:block;font-weight:700}.nmr select,.nmr button,.nmr a.nmr-link{font:inherit;min-height:44px;border:1px solid #bed4cd;border-radius:10px;background:#fff;color:var(--ink);padding:9px 13px}.nmr select{width:100%;margin:8px 0 18px}.nmr button{cursor:pointer}.nmr button:disabled{opacity:.45;cursor:default}.nmr button:focus-visible,.nmr select:focus-visible,.nmr input:focus-visible{outline:3px solid #eaad47;outline-offset:3px}.nmr button.active,.nmr button.primary{background:var(--teal);color:white;border-color:var(--teal)}.nmr-structure{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin:18px 0}.nmr-structure button{font-size:23px;font-weight:700;border-bottom:4px solid var(--group)}.nmr-groups{display:grid;gap:8px}.nmr-groups button{text-align:left;border-left:5px solid var(--group)}.nmr-groups small{display:block}.nmr-groups button.active small{color:#e2f3ef}.nmr-controls{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:14px 0}.nmr-controls label{display:flex;align-items:center;gap:8px;font-size:14px}.nmr-controls select{width:auto;margin:0}.nmr svg{display:block;width:100%;height:auto;overflow:visible}.nmr-spectrum{overflow-x:auto}.nmr-spectrum svg{min-width:560px}.nmr svg text{font-family:Helvetica,Arial,sans-serif;fill:#355551}.nmr-steps{display:flex;gap:6px;margin:12px 0;flex-wrap:wrap}.nmr-steps span{padding:5px 10px;border-radius:20px;background:#edf2ee;font-size:13px}.nmr-steps span.active{background:#d5eee5;color:#075b53;font-weight:700}.nmr-caption{min-height:104px;padding:14px;border-radius:12px;background:#edf6f1}.nmr-caption p{margin:0}.nmr-caption small{display:block;margin-top:7px}.nmr-note{padding:14px 18px;border-left:3px solid #d5a145;background:#fff9ea;margin:18px 0}.nmr input[type=range]{width:100%;accent-color:var(--teal);min-height:30px}.nmr-table-scroll{overflow:auto}.nmr table{width:100%;border-collapse:collapse;font-size:15px}.nmr th,.nmr td{padding:12px;text-align:left;border-bottom:1px solid var(--line)}.nmr th{background:#edf4ef}.nmr a{color:#006d66}.nmr details{margin-top:18px}.nmr summary{cursor:pointer;font-weight:700;min-height:44px}.nmr-ref-chart{display:grid;gap:9px;margin:20px 0}.nmr-range{display:grid;grid-template-columns:180px 1fr 100px;gap:12px;align-items:center;font-size:14px}.nmr-track{height:13px;background:#eef1ec;position:relative;border-radius:5px}.nmr-track i{position:absolute;height:100%;background:#3a9587;border-radius:5px}.chem-reference-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}.nmr-check{display:flex;gap:8px;flex-wrap:wrap}.nmr-check button{min-width:48px}@media(max-width:760px){.nmr-layout{grid-template-columns:1fr}.nmr-card{padding:16px}.nmr-range{grid-template-columns:120px 1fr 80px;gap:6px;font-size:12px}.chem-reference-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.nmr-caption{min-height:120px}}
.nmr .nmr-spectrum svg{min-width:0}.nmr-spectrum{margin-top:14px}

/* Focus the lesson around a readable branching diagram and selectable steps. */
#nmr-lab{background:linear-gradient(140deg,#f7faf6,#eef5f1);border:1px solid #deebe4}
#nmr-lab>header{background:transparent;padding:0 0 18px;border-bottom:1px solid #d7e5dc}
#nmr-lab>header p{font-style:normal;color:#59736c;max-width:740px}
#nmr-lab .nmr-layout{align-items:start;grid-template-columns:minmax(250px,.75fr) minmax(0,1.7fr)}
#nmr-lab .nmr-card{box-shadow:0 8px 25px #244c3d06;border-radius:20px}
#nmr-lab .nmr-structure{padding:16px 10px;background:#f2f7f2;border-radius:14px;gap:4px}
#nmr-lab .nmr-structure button{padding:8px 10px;font-size:21px}
#nmr-lab .nmr-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
#nmr-lab .nmr-steps button{padding:8px 5px;font-size:12px;min-height:48px;background:#f2f6f2;border:1px solid #d9e6df;border-radius:10px}
#nmr-lab .nmr-steps button.active{background:#19796d;border-color:#19796d;color:#fff}
.nmr-split-viewport{overflow-x:auto;border-radius:16px;margin:16px 0;overscroll-behavior-x:contain}
#nmr-lab #nmr-split{min-width:560px}
.nmr-spin-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:8px;margin:12px 0}
.nmr-spin-card{background:#f4f8f4;border:1px solid #dbe9e0;padding:12px 9px;border-radius:12px;text-align:center}
.nmr-spin-card strong{display:block;font-size:20px;letter-spacing:.03em;color:#237e70}
.nmr-spin-card span{display:block;font-size:13px;margin:3px 0}
.nmr-spin-card small{font-size:11px}
#nmr-lab .nmr-ensemble-note{font-size:12px;line-height:1.55;color:#62776b}
#nmr-lab .nmr-caption{border-left:3px solid #5d9f82;border-radius:0 12px 12px 0;background:#edf6ee;padding:16px}
#nmr-lab .nmr-caption p{margin:6px 0;font-size:15px}
#nmr-lab .nmr-controls button{font-size:14px}
.nmr-booklet{margin-top:20px}.nmr-reference-values{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}
.nmr-reference-values>div{padding:16px;border:1px solid #d9e6df;border-radius:12px;background:#f6f9f4}
.nmr-reference-values strong{display:block;font-size:28px;font-weight:700;color:#267b69;margin:6px 0}
.nmr-reference-values em{font-size:12px;font-style:normal}.nmr-reference-values span{display:block;font-size:13px}
.nmr-mobile-hint{display:none}
.nmr-coupling-summary{display:grid;gap:7px;font-size:13px;margin:12px 0}.nmr-coupling-summary i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px}.nmr-observed-key{background:#187a6c}.nmr-neighbour-key{background:#ce9635}#nmr-lab .nmr-structure button.is-observed{background:#187a6c;color:white;border-color:#187a6c}#nmr-lab .nmr-structure button.is-neighbour{box-shadow:0 0 0 2px #dab46a;background:#fff8e9}
@media(max-width:850px){#nmr-lab .nmr-layout{grid-template-columns:1fr}.nmr-reference-values{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){#nmr-lab{padding:14px}#nmr-lab .nmr-card{padding:14px}#nmr-lab .nmr-steps{grid-template-columns:repeat(2,1fr)}.nmr-mobile-hint{display:block;font-size:12px;color:#547b69}.nmr-spin-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.nmr-reference-values>div{padding:12px}}
/* Interactive Pascal lesson and aligned integration lane. */
#nmr-lab .nmr-pascal-lab{margin-top:20px;scroll-margin-top:90px}
#nmr-lab .nmr-pascal{max-width:640px;margin:24px auto}
#nmr-lab .nmr-pascal-row{display:flex;align-items:center;gap:8px;margin:7px 0}
#nmr-lab .nmr-pascal-row>span{width:34px;flex-shrink:0;font-size:13px;color:#657a73}
#nmr-lab .nmr-pascal-row>div{display:flex;justify-content:center;gap:10px;flex:1}
#nmr-lab .nmr-pascal-row button{width:46px;height:44px;padding:0;border-radius:12px;background:#f1f5f2;border:1px solid #d8e5df;font-size:18px;font-weight:700;color:#405c50}
#nmr-lab .nmr-pascal-row button.current{background:#e0f0e9;border-color:#8fb9a6}
#nmr-lab .nmr-pascal-row button.parent{background:#fff0d4;border-color:#c18d37;color:#825718}
#nmr-lab .nmr-pascal-row button.chosen{background:#087f79;color:white;border-color:#087f79;box-shadow:0 0 0 3px #c7e8dd}
#nmr-lab .nmr-pascal-explain{display:flex;flex-direction:column;gap:8px;padding:20px;background:#edf5ef;border-radius:16px;text-align:center}
#nmr-lab .nmr-pascal-explain>strong{font-size:32px;color:#087f79}
#nmr-lab .nmr-pascal-peaks{display:flex;justify-content:center;gap:18px;margin:22px auto 10px;height:130px}
#nmr-lab .nmr-pascal-peaks button{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:10px;min-width:36px;padding:8px;background:transparent;border:0;border-bottom:2px solid #bfd3c9}
#nmr-lab .nmr-pascal-peaks i{display:block;width:5px;background:#93b9ab;border-radius:4px;transition:height .25s}
#nmr-lab .nmr-pascal-peaks .chosen{background:#e8f3ef;border-radius:8px}
#nmr-lab .nmr-pascal-peaks .chosen i{background:#087f79}
#nmr-lab .nmr-area-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
#nmr-lab .nmr-area-card{display:flex;flex-direction:column;gap:10px;text-align:left;background:#f8faf7;padding:18px;border:1px solid #dce6df;border-radius:14px;color:#314b40}
#nmr-lab .nmr-area-card.active{border:2px solid var(--area-color);background:#eef5ef}
#nmr-lab .nmr-area-card strong{color:var(--area-color);font-size:21px}
#nmr-lab .nmr-area-track{height:10px;background:#e1e9e3;display:block;border-radius:8px;overflow:hidden;width:100%}
#nmr-lab .nmr-area-track i{height:100%;display:block;background:var(--area-color)}
@media(max-width:600px){#nmr-lab .nmr-pascal-row>div{gap:3px}#nmr-lab .nmr-pascal-row>span{width:25px;font-size:11px}#nmr-lab .nmr-pascal-row button{width:32px;min-width:0;height:44px;font-size:15px}#nmr-lab .nmr-pascal-peaks{gap:3px}#nmr-lab .nmr-spectrum svg{min-width:650px}#nmr-lab .nmr-spectrum{overflow-x:auto}}
/* A persistent molecule and three focused study views. */
#nmr-lab .nmr-workspace{display:grid;grid-template-columns:280px minmax(0,1fr);gap:22px;margin-top:22px;align-items:start}
#nmr-lab .nmr-molecule-panel{position:sticky;top:18px;padding:18px}
#nmr-lab .nmr-study{min-width:0}
#nmr-lab [role=tabpanel][hidden]{display:none!important}
#nmr-lab .nmr-selection-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}
#nmr-lab .nmr-selection-heading>span:last-child{color:#648078;font-size:12px}
#nmr-lab .nmr-clues{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#nmr-lab .nmr-clues>div{padding:16px;background:#fffefb;border:1px solid #d2e5dc;border-radius:15px}
#nmr-lab .nmr-clues small{font-size:10px;letter-spacing:.06em;font-weight:800;color:#52746a}
#nmr-lab .nmr-clues strong{display:block;margin:7px 0;font-size:25px;line-height:1.15;color:#147a69;letter-spacing:-.025em}
#nmr-lab .nmr-clues em{font-size:13px;font-style:normal}
#nmr-lab .nmr-clues p{font-size:12px;line-height:1.5;margin:0;color:#526d63}
#nmr-lab .nmr-selected-reason{background:#e6f2e9;border-radius:12px;padding:12px 15px;margin:12px 0 20px;font-size:14px;line-height:1.55;color:#325f50}
#nmr-lab .nmr-study-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;background:#e6eee7;padding:5px;border-radius:13px;margin-bottom:15px}
#nmr-lab .nmr-study-tabs button{font-size:13px;font-weight:750;border:0;background:transparent;min-height:48px;padding:8px}
#nmr-lab .nmr-study-tabs button[aria-selected=true]{background:#fff;box-shadow:0 3px 10px #274d3510;color:#067363}
#nmr-lab .nmr-disclosure{padding:14px 16px;border:1px solid #d6e4db;border-radius:14px;background:#fffdf9;margin-top:15px}
#nmr-lab .nmr-disclosure>summary{min-height:26px;font-size:14px;color:#306457}
#nmr-lab .nmr-reference-drawer{margin-top:25px}
#nmr-lab .nmr-disclosure .nmr-card{box-shadow:none}
#nmr-lab .nmr-practice-layout{grid-template-columns:1fr;margin-top:0}
#nmr-lab .nmr-area-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
#nmr-lab .nmr-area-card{padding:12px;gap:7px;font-size:13px}
#nmr-lab .nmr-area-card strong{font-size:18px}
#nmr-lab #nmr-area-cards>p{font-size:13px;line-height:1.5}
#nmr-lab .nmr-spectrum-target{cursor:pointer;outline:none}
#nmr-lab .nmr-spectrum-target:hover rect,#nmr-lab .nmr-spectrum-target:focus rect{fill:#4d9d781a;stroke:#358d6b;stroke-width:1}
#nmr-lab .nmr-explain-link{margin-top:18px;background:#147d6d;color:white;font-weight:700}
#nmr-lab .nmr-check button[aria-pressed=true]{background:#d6eee2;border-color:#4b9976}
@media(max-width:1050px){#nmr-lab .nmr-workspace{grid-template-columns:235px minmax(0,1fr);gap:15px}#nmr-lab .nmr-clues strong{font-size:21px}#nmr-lab .nmr-clues>div{padding:12px}}
@media(max-width:800px){#nmr-lab .nmr-workspace{grid-template-columns:1fr}#nmr-lab .nmr-molecule-panel{position:static}#nmr-lab .nmr-groups{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}#nmr-lab .nmr-structure{margin:10px 0}#nmr-lab .nmr-molecule-panel select{margin-bottom:8px}}
@media(max-width:480px){#nmr-lab .nmr-clues{grid-template-columns:1fr}#nmr-lab .nmr-clues>div{display:grid;grid-template-columns:1fr 1fr;gap:4px 10px;padding:12px}#nmr-lab .nmr-clues strong{grid-column:2;grid-row:1 / 3;margin:0;align-self:center;text-align:right}#nmr-lab .nmr-clues p{grid-column:1}#nmr-lab .nmr-study-tabs button{font-size:11px}#nmr-lab .nmr-selection-heading{align-items:flex-start}#nmr-lab .nmr-area-grid{grid-template-columns:1fr}}
@media(max-width:600px){#nmr-lab .nmr-spectrum #nmr-spectrum{min-width:0}}
#nmr-lab #nmr-selected-summary{margin:20px 0}
#nmr-lab #nmr-view-explain,#nmr-lab #nmr-view-practise{margin-top:24px;scroll-margin-top:20px}
#nmr-lab #nmr-view-read{scroll-margin-top:20px}
#nmr-lab .nmr-study-tabs{position:static}
#nmr-lab .nmr-study-tabs button{background:transparent;color:#29675c;font-weight:700}
#nmr-lab .nmr-study-tabs button:hover,#nmr-lab .nmr-study-tabs button:focus-visible{background:#fff}
.nmr-spin-explorer{padding:16px 18px;background:#f5faf6;border:1px solid #d9e8de;border-radius:16px}
.nmr-spin-explorer>p{font-size:14px;line-height:1.5;margin:0 0 8px}.nmr-spin-zh{color:#347a69}
.nmr-spin-chooser{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}
#nmr-lab .nmr-spin-chooser button{display:grid;justify-items:center;gap:2px;min-width:82px;background:#fff;border:1px solid #a9cfbd;border-radius:13px;padding:8px 10px}
.nmr-spin-chooser small{font-size:11px}.nmr-spin-chooser strong{font-size:26px;line-height:1;color:#147e6e}.nmr-spin-chooser span{font-size:14px;color:#506b5f}
#nmr-lab .nmr-spin-chooser button[aria-pressed=true]{background:#fff0e0;border-color:#cf9250}#nmr-lab .nmr-spin-chooser button[aria-pressed=true] strong{color:#a7642c}
.nmr-spin-current{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 14px;margin:12px 0;background:#e6f3e9;border-radius:10px;font-size:14px}.nmr-spin-current strong{color:#157666}
.nmr-spin-table{border:1px solid #d8e7de;border-radius:12px;overflow:hidden;background:white}
.nmr-spin-row{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(95px,.6fr) minmax(48px,.4fr);gap:8px;align-items:center;padding:8px 12px;border-bottom:1px solid #e4eee7;font-size:14px;min-height:50px}
.nmr-spin-row:last-child{border-bottom:0}.nmr-spin-row.is-selected{background:#e4f3e9;box-shadow:inset 4px 0 #168b75}.nmr-spin-head{background:#e9f2eb;font-size:12px;font-weight:700;color:#58776b;min-height:36px}.nmr-spin-row small{display:block;color:#6f8178;font-size:11px;line-height:1.35}.nmr-spin-row [role=cell]:last-child{display:flex;justify-content:center;align-items:end;height:72px}.nmr-spin-row i{display:block;width:8px;background:#188775;border-radius:5px 5px 0 0}.nmr-spin-row.is-selected i{background:#bb7134}
.nmr-spin-conclusion{display:grid;gap:5px;margin-top:14px;padding:13px 15px;background:#e7f4e9;border-radius:12px;font-size:14px}.nmr-spin-conclusion>b{color:#167b68}.nmr-spin-conclusion small{font-size:12px;color:#536d61}
#nmr-lab .nmr-tree-disclosure{margin-top:15px}#nmr-lab .nmr-tree-disclosure>summary{font-weight:750}
@media(max-width:480px){.nmr-spin-row{grid-template-columns:minmax(0,1.3fr) 82px 35px;font-size:12px;gap:4px;padding:7px 9px}.nmr-spin-chooser{gap:5px}#nmr-lab .nmr-spin-chooser button{min-width:64px;padding:7px}.nmr-spin-chooser strong{font-size:22px}.nmr-spin-current{font-size:12px}}
