:root{--paper:#f7f4eb;--paper-deep:#eeeadd;--ink:#354438;--muted:#72796b;--green:#3d5944;--line:#d9ddcf;--accent:#a88a54;--serif:'Songti SC','STSong','Noto Serif CJK SC','Noto Serif SC',Georgia,serif;--sans:-apple-system,BlinkMacSystemFont,'PingFang SC','Noto Sans CJK SC','Microsoft YaHei',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:auto;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.8;-webkit-font-smoothing:antialiased}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.4}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,summary,input,select{-webkit-tap-highlight-color:transparent}button,a,summary{touch-action:manipulation}button{cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #b0884f;outline-offset:5px}button:disabled{cursor:default;opacity:.45}img{display:block;max-width:100%;height:auto}i{font-style:normal}button{color:inherit}::selection{background:#d5dfc8}section,li[id]{scroll-margin-top:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:fixed;z-index:20;left:20px;top:-80px;padding:10px 18px;background:var(--green);color:#fff}.skip:focus{top:10px}
.site-header{height:86px;display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 5.3%;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;font-family:Georgia,serif;font-size:20px;white-space:nowrap}.brand em{font-size:14px;font-weight:normal}.brand-flower{font-size:33px;color:#6f8159;line-height:1}.site-header nav{display:flex;gap:35px;font-size:13px}.site-header nav a{position:relative;padding:12px 0}.site-header nav a:after{content:'';position:absolute;bottom:5px;height:1px;width:0;left:0;background:var(--green);transition:width .2s}.site-header nav a:hover:after{width:100%}.header-end{font-size:12px;color:#68725f}.header-end span{margin-left:10px}.eyebrow{font-size:10px;letter-spacing:.15em;font-weight:500;line-height:1.6}.eyebrow span{margin:0 10px}.hero{text-align:center;padding-top:55px;overflow:hidden}.hero>.eyebrow{color:#7c836e}.hero h1{font-size:clamp(35px,4.1vw,60px);line-height:1.35;margin:20px auto 16px;letter-spacing:-.045em}.hero h1 span{color:#6c7f56}.hero-intro{font-size:14px;line-height:1.9;color:#747a6b}.button{display:inline-flex;align-items:center;justify-content:center;gap:25px;min-height:46px;padding:11px 23px;border-radius:3px;border:1px solid var(--green);background:var(--green);color:#fffef8;font-size:12px;line-height:1.5;letter-spacing:.025em;transition:background .18s,transform .18s;white-space:nowrap}.button:hover{background:#2c4433}.button:active{transform:translateY(2px) scale(.98)}.button span{font-size:17px}.hero>.button{margin-top:25px}.hero-art{width:min(900px,88vw);margin:8px auto 0;position:relative}.hero-art img{width:100%;mix-blend-mode:multiply;mask-image:linear-gradient(to bottom,transparent 0%,#000 7%,#000 90%,transparent 100%)}.hero-art figcaption{position:absolute;bottom:22px;width:100%;display:flex;justify-content:space-between;align-items:center;color:#727964;font-size:8px;letter-spacing:.12em}.handwritten{font-family:var(--serif);font-size:17px;letter-spacing:.04em;font-style:italic}.hero-art .handwritten{font-size:16px;letter-spacing:.03em}.chapter-index{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);text-align:left;padding:23px 0}.chapter-index a{display:flex;gap:18px;align-items:center;padding:0 32px;font-size:13px;border-right:1px solid var(--line)}.chapter-index a:last-child{border:0}.chapter-index span{font-family:Georgia,serif;font-style:italic;color:#939b80;font-size:19px}.chapter-index i{margin-left:auto;color:#8a9677;transition:transform .2s}.chapter-index a:hover i{transform:translate(2px,-2px)}.hero-entrance{animation:paper-in .6s ease-out both}.hero h1{animation-delay:.06s}.hero-intro{animation-delay:.12s}.hero>.button{animation-delay:.18s}.hero-art{animation-delay:.22s}@keyframes paper-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.section-wrap{max-width:1100px;margin:auto}.section-kicker{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:9px;letter-spacing:.13em;color:#858c77;border-bottom:1px solid var(--line);padding-bottom:19px;margin-bottom:46px}.section-kicker span:last-child{letter-spacing:.06em}.life{padding-top:90px;padding-bottom:95px}.life-grid{display:grid;grid-template-columns:1fr 1fr;gap:95px}.life-intro>.eyebrow{font-size:9px;color:#879077;letter-spacing:.11em;margin-bottom:19px}.life h2{font-size:37px;letter-spacing:-.04em;margin-bottom:22px}.life-intro>p:not(.eyebrow){font-size:14px;color:#717866;line-height:2;max-width:410px}.reading-art{margin:17px -23px 24px}.reading-art img{mix-blend-mode:multiply;mask-image:radial-gradient(ellipse at center,#000 54%,transparent 73%)}.reading-art figcaption{font-size:11px;text-align:center;color:#858a78;line-height:1.6}.history-note{border-left:2px solid #c4ccb3;padding-left:19px;margin-top:14px}.history-note>span{font-size:11px;color:#777a58}.history-note p{font-size:12px;color:#7b806f;line-height:1.9;margin-top:7px}.cite{font-family:var(--sans);font-size:10px;color:#77845d;vertical-align:super;padding:0 3px;text-decoration:underline;text-underline-offset:2px}.timeline-hint{font-size:11px;display:flex;justify-content:space-between;color:#606d59;margin:0 0 15px}.timeline-hint span{color:#8c9382;font-size:10px}.timeline details{border-top:1px solid var(--line)}.timeline details:last-child{border-bottom:1px solid var(--line)}.timeline summary{list-style:none;display:grid;grid-template-columns:82px 1fr 16px;gap:13px;align-items:center;cursor:pointer;padding:22px 0}.timeline summary::-webkit-details-marker{display:none}.timeline time{font-family:Georgia,serif;font-size:25px;line-height:1.1;color:#87966f;letter-spacing:-1px}.timeline time span{display:block;font-size:13px;margin-top:5px;letter-spacing:0}.timeline summary>span{font-family:var(--serif);font-size:17px;line-height:1.5}.timeline small{font-family:var(--sans);display:block;margin-top:6px;font-size:9px;color:#878d7e;letter-spacing:.015em}.timeline i{color:#869377;font-size:19px;transition:transform .25s}.timeline details[open] i{transform:rotate(45deg)}.timeline-body{margin:0 0 23px 95px;font-size:12px;line-height:1.95;color:#717a67}.timeline details[open] .timeline-body{animation:paper-in .26s ease-out}
.lab{background:#344e3f;color:#f6f5eb;padding:72px 0 48px}.lab .section-kicker{color:#b0bca6;border-color:#627360;margin-bottom:38px}.lab-heading{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:end;margin-bottom:42px}.lab-heading .eyebrow{color:#bac5ab;margin-bottom:14px}.lab h2{font-size:42px;letter-spacing:-.04em;line-height:1.35}.lab-explanation{font-size:13px;line-height:1.9;color:#c9d2bf;padding-bottom:6px}.formula{display:flex;gap:10px;align-items:center;margin-top:25px;font-size:12px}.formula span{display:flex;gap:7px;align-items:center}.formula i{color:#b0bca6}.formula strong{font-family:Georgia,serif;font-weight:400;font-size:18px;color:#f7f4eb}.dot{display:inline-block;width:12px;height:12px;border-radius:50%;border:1px solid #8c9f88}.chromatic{background:#92a85c}.white{background:#fffdf0}.black{background:#19251b}.experiment{background:var(--paper);color:var(--ink);border-radius:5px;padding:43px 46px 20px}.experiment-main{display:grid;grid-template-columns:1fr 1fr;gap:75px}.experiment h3{font-family:var(--serif);font-size:20px;display:flex;align-items:center;gap:13px;line-height:1.4}.experiment h3>span{font-family:Georgia,serif;color:#a3ac91;font-size:14px}.experiment h3+p{font-size:11px;color:#828b77;margin-top:8px}.wheel-wrap{max-width:328px;width:100%;margin:27px auto 19px;position:relative;aspect-ratio:1}.wheel-wrap svg{display:block;width:100%;height:100%;overflow:visible}#hue-wheel path{cursor:pointer;transition:opacity .16s,stroke-width .16s;outline:none}#hue-wheel path:hover{opacity:.78}#hue-wheel path:focus-visible{stroke:#17261c;stroke-width:4}#hue-wheel path[aria-pressed=true]{stroke:#354438;stroke-width:3}.wheel-centre{position:absolute;inset:30%;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.wheel-centre>span:first-child{font-size:11px;letter-spacing:.13em;color:#808b70;font-family:Georgia,serif}.wheel-centre strong{font:500 30px var(--serif);margin-top:7px}.tiny-rule{width:19px;height:1px;background:#abb599;margin:17px 0 11px}.wheel-centre small{font-size:6px;letter-spacing:.1em;color:#7d8872;white-space:nowrap}.wheel-panel select{display:block;margin:0 auto;max-width:230px;width:100%;padding:7px 13px;min-height:40px;border:1px solid #d5dbca;border-radius:3px;background:transparent;color:#5a6d4e;font-size:11px}.wheel-footnote{display:flex;justify-content:center;gap:5px;align-items:center;font-size:10px;color:#8b917e;margin-top:12px}.swatch-result{height:180px;border-radius:3px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:21px 24px;margin:24px 0 24px;transition:background-color .18s,color .18s;position:relative}.swatch-result>span{font-size:10px;opacity:.8}.swatch-result strong{font-family:Georgia,serif;font-size:30px;letter-spacing:.04em;font-weight:400}.swatch-caption{font-size:10px;line-height:1.8;opacity:.85}.slider-row{display:grid;grid-template-columns:1fr auto;align-items:center;margin:11px 0 15px;gap:5px}.slider-row label{font-size:12px;display:flex;align-items:center;gap:7px}.latin{font-family:Georgia,serif;font-size:12px;color:#818a76;margin-left:3px}.slider-row output{font-family:Georgia,serif;font-size:15px;color:#627155}.slider-dot{width:9px;height:9px;display:inline-block;border:1px solid #aab29d;border-radius:50%}.slider-dot.light{background:#fff}.slider-dot.dark{background:#344635}.slider-row input{grid-column:1/-1;width:100%;accent-color:#657952;cursor:pointer;height:22px;margin:0}.composition-bar{display:flex;width:100%;height:6px;border-radius:10px;overflow:hidden;border:1px solid #d3d9c8;margin-top:21px}.composition-bar span{display:block;height:100%;transition:width .1s}.composition-line{font-size:10px;margin-top:8px;color:#6e7a5f;line-height:1.8}.mix-note{font-size:9px;line-height:1.8;color:#848c79;margin-top:5px}.mix-actions{display:flex;gap:20px;align-items:center;margin-top:20px;flex-wrap:wrap}.mix-actions .button{padding:10px 18px;min-height:43px;gap:16px;font-size:11px}.text-button{border:0;background:none;padding:6px 0;font-size:11px;color:#6b7a5c;cursor:pointer;text-decoration:underline;text-underline-offset:5px;white-space:nowrap;transition:color .2s}.text-button:hover{color:#233d2a}.save-status{font-size:10px;color:#6a795b;min-height:26px;margin-top:8px}.triangle-row{display:grid;grid-template-columns:1fr 1.2fr .65fr;gap:20px;align-items:center;padding:33px 0 28px;margin-top:29px;border-top:1px solid var(--line)}.triangle-copy .eyebrow{font-size:7px;letter-spacing:.07em;color:#8e967e;margin-bottom:11px}.triangle-copy h3{display:block;font-size:23px;line-height:1.5;margin-bottom:16px}.triangle-copy p:not(.eyebrow){font-size:11px;line-height:1.9;color:#7a8470;margin-top:9px}.triangle-frame{position:relative;margin:10px;aspect-ratio:420/310}.triangle-frame canvas{width:100%;height:100%;display:block;cursor:crosshair;touch-action:pan-y}.triangle-label{position:absolute;font-size:9px;color:#6d7e5c}.triangle-label.top{top:-4%;left:7%}.triangle-label.bottom{bottom:-4%;left:7%}.triangle-label.right{top:43%;right:-7%}#triangle-marker{position:absolute;width:13px;height:13px;border:2px solid white;border-radius:50%;box-shadow:0 0 0 1px #465943;transform:translate(-50%,-50%);pointer-events:none}.triangle-legend{display:flex;flex-direction:column;gap:20px;margin-left:25px}.triangle-legend>div{display:flex;gap:13px;align-items:center}.legend-line{height:26px;width:3px;background:#e7dfc7}.dark-line{background:#485a44}.colour-line{background:#9ab675}.triangle-legend strong{display:block;font-size:11px;font-weight:400;line-height:1.5}.triangle-legend small{font-size:9px;color:#8a927e}.accuracy-note{border-top:1px solid var(--line);padding-top:17px;color:#828a76;font-size:9px;line-height:1.9}.accuracy-note>span{color:#5b6c4f;margin-right:11px}.solid-story{display:grid;grid-template-columns:230px 1fr;align-items:center;gap:53px;max-width:880px;margin:38px auto 0}.solid-figure svg{width:100%;height:auto;display:block}.solid-figure text{fill:#ced6c2;font-size:12px;font-family:var(--sans)}.solid-story .eyebrow{color:#aeba9f;font-size:8px;margin-bottom:10px}.solid-story h3{font-size:25px;color:#e8eddd;margin-bottom:13px}.solid-story p:not(.eyebrow){font-size:12px;color:#bdcbb1;line-height:2}.solid-story .cite{color:#c9d2bf}
.notes{padding-top:90px;padding-bottom:70px}.notes-heading{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:30px}.notes h2{font-size:35px;letter-spacing:-.04em;margin-bottom:14px}.notes-heading p{font-size:12px;color:#838b76;line-height:1.9}.notebook{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:29px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;min-height:220px}.notebook-empty{grid-column:1/-1;text-align:center;align-self:center;padding:20px}.notebook-empty p{font:18px var(--serif);color:#7c886b;margin:15px 0 8px}.notebook-empty a{font-size:11px;color:#72825f}.empty-swatch{display:block;width:42px;height:47px;border:1px solid #c9d0bc;background:linear-gradient(135deg,#e1e4d6,#f8f5ec);margin:0 auto;transform:rotate(-8deg)}.notebook-actions{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:20px}.notebook-actions>p{font-size:11px;color:#869076}.outline{background:transparent;color:var(--green);border-color:#a8b399;font-size:11px}.outline:hover{background:#e4e8da}.colour-card{position:relative;animation:paper-in .3s ease-out}.colour-card-main{display:block;background:#fcfaf2;border:1px solid #e4e6da;padding:9px 9px 12px;width:100%;text-align:left;transition:transform .2s}.colour-card-main:hover{transform:translateY(-3px)}.colour-card-paint{display:block;height:123px;width:100%;border-radius:1px}.colour-card-info{display:block;padding:9px 2px 0}.colour-card-info strong{font-family:Georgia,serif;font-size:17px;display:block;font-weight:400}.colour-card-info span{font-size:9px;color:#89917d}.remove-colour{position:absolute;right:5px;top:5px;width:33px;height:33px;border:0;background:rgba(247,244,235,.85);color:#354438;border-radius:50%;font-size:20px;line-height:1}.remove-colour:hover{background:#fff}.reflection{display:flex;gap:42px;max-width:825px;margin:92px auto 0;padding:0 10px}.asterisk{font-size:64px;line-height:1.3;color:#b1bb9b}.reflection .eyebrow{color:#8f997e;font-size:8px;margin-bottom:12px}.reflection h3{font-size:28px;margin-bottom:14px}.reflection p:not(.eyebrow){color:#79846a;font-size:12px;line-height:2}.reflection .handwritten{font-size:17px!important;color:#65754f!important;margin-top:18px}.sources{border-top:1px solid var(--line);padding-top:55px;padding-bottom:60px}.sources-heading{margin-bottom:24px}.sources .eyebrow{font-size:8px;color:#8c947d;margin-bottom:10px}.sources h2{font-size:27px;margin-bottom:12px}.sources-heading>p:last-child{font-size:11px;color:#8a917f}.source-list{list-style:none;counter-reset:source;display:grid;grid-template-columns:1fr 1fr;gap:0 70px;padding:0;margin:0}.source-list li{counter-increment:source;border-bottom:1px solid var(--line);position:relative}.source-list a{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 0 18px 29px}.source-list li:before{content:counter(source,decimal-leading-zero);position:absolute;top:20px;font:italic 11px Georgia,serif;color:#9ca589}.source-list b{font-size:12px;font-weight:400}.source-list small{display:block;font-size:9px;color:#919882;margin-top:3px;line-height:1.6}.source-list i{color:#8e9c7c}.source-list a:hover b{text-decoration:underline;text-underline-offset:4px}.art-downloads{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:33px;font-size:10px;color:#7d886e}.art-downloads>span{color:#9aa38c;margin-right:7px}.art-downloads a{text-decoration:underline;text-underline-offset:4px}footer{margin:0 5.3%;padding:29px 0 35px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:25px}footer .brand{font-size:16px}footer .brand em{font-size:12px}footer .brand-flower{font-size:25px}footer p{font-size:11px;text-align:center;color:#7b886b;line-height:1.9}footer p span{display:block;font-size:6px;letter-spacing:.1em;color:#939c85}footer>a:last-child{font-size:10px;color:#818d71}.noscript{position:fixed;bottom:0;left:0;right:0;padding:12px;background:#fff2d3;color:#354438;font-size:13px;text-align:center}
@media(min-width:1600px){.hero-art{width:1000px}}@media(max-width:1200px){.section-wrap,.chapter-index{margin-left:6%;margin-right:6%}.life-grid{gap:50px}.experiment-main{gap:45px}.experiment{padding:35px 32px 20px}.triangle-row{gap:15px}.triangle-legend{margin-left:17px}.formula{gap:7px;font-size:11px}.site-header nav{gap:24px}.hero-art{width:min(860px,88vw)}}
@media(max-width:850px){.site-header{gap:15px;margin:0 5%;height:77px}.brand{font-size:18px}.brand em{font-size:12px}.site-header nav{gap:18px;font-size:12px}.header-end{display:none}.hero{padding-top:43px}.hero h1{font-size:43px}.hero-intro{font-size:12px}.hero-art{margin-top:18px}.hero-art figcaption{bottom:10px}.chapter-index{padding:17px 0}.chapter-index a{padding:0 16px;font-size:11px;gap:11px}.life-grid{gap:32px}.life h2{font-size:30px}.life-intro>p:not(.eyebrow){font-size:12px}.timeline summary{grid-template-columns:65px 1fr 12px;gap:10px;padding:20px 0}.timeline summary>span{font-size:15px}.timeline time{font-size:22px}.timeline-body{margin-left:75px;font-size:11px}.timeline-hint{font-size:10px}.timeline-hint span{font-size:8px}.lab-heading{gap:27px}.lab h2{font-size:36px}.lab-explanation{font-size:11px}.formula{gap:5px;font-size:10px}.formula span{gap:4px}.formula strong{font-size:16px}.experiment{padding:28px 25px 20px}.experiment-main{gap:30px}.experiment h3{font-size:17px}.experiment h3+p{font-size:10px}.swatch-result{height:165px;padding:17px}.mix-actions{gap:13px}.mix-actions .button{padding:10px 13px;font-size:10px;gap:12px}.text-button{font-size:10px}.triangle-row{grid-template-columns:1fr 1.3fr}.triangle-legend{display:none}.triangle-label.right{right:-4%}.solid-story{grid-template-columns:180px 1fr;gap:25px}.solid-story h3{font-size:21px}.notes h2{font-size:29px}.notebook{grid-template-columns:repeat(3,1fr)}.source-list{gap:0 30px}.reflection{gap:28px}.section-kicker{font-size:8px}.hero-art .handwritten{font-size:13px}}
@media(max-width:620px){body{font-size:14px}.site-header{height:76px;flex-wrap:wrap;justify-content:center;gap:0;padding:12px 0 7px}.brand{font-size:16px;gap:7px}.brand em{font-size:12px}.brand-flower{font-size:26px}.site-header nav{width:100%;justify-content:center;gap:34px;font-size:10px;margin-top:2px}.site-header nav a{padding:5px 0}.hero{padding-top:36px}.hero>.eyebrow{font-size:7px;letter-spacing:.09em}.hero>.eyebrow span{margin:0 5px}.hero h1{font-size:35px;line-height:1.55;max-width:340px;margin:15px auto 14px;letter-spacing:-.045em}.hero h1 span{display:block}.hero-intro{font-size:10px;line-height:1.95;padding:0 22px}.hero>.button{margin-top:20px;min-height:40px;padding:10px 17px;font-size:10px;gap:20px}.hero-art{width:105%;max-width:none;margin:22px -2.5% 0}.hero-art figcaption{position:static;justify-content:center;padding:0 20px;margin:-5px 0 22px}.hero-art .handwritten{font-size:12px}.hero-art figcaption>span:last-child{display:none}.chapter-index{margin:0 6%;padding:17px 0}.chapter-index a{flex-direction:column;gap:4px;padding:0 6px;text-align:center;font-size:9px}.chapter-index span{font-size:17px}.chapter-index i{display:none}.section-wrap{margin:0 6%}.section-kicker{font-size:7px;letter-spacing:.065em;padding-bottom:15px;margin-bottom:27px;gap:12px}.section-kicker span:last-child{font-size:8px;white-space:nowrap}.life{padding-top:49px;padding-bottom:48px}.life-grid{grid-template-columns:1fr;gap:32px}.life-intro>.eyebrow{font-size:8px;margin-bottom:13px}.life h2{font-size:30px;line-height:1.5;margin-bottom:15px}.life-intro>p:not(.eyebrow){font-size:12px;line-height:1.95}.reading-art{margin:12px -10px 22px}.reading-art img{width:100%}.reading-art figcaption{font-size:10px;padding:0 14px}.history-note{padding-left:14px}.history-note p{font-size:11px}.history-note>span{font-size:10px}.timeline summary{grid-template-columns:72px 1fr 16px;padding:18px 0;gap:14px}.timeline time{font-size:23px}.timeline summary>span{font-size:16px}.timeline small{font-size:9px}.timeline-body{margin-left:86px;margin-bottom:19px;font-size:12px}.timeline-hint{font-size:10px}.timeline-hint span{font-size:9px}.lab{padding:39px 0 33px}.lab-heading{grid-template-columns:1fr;gap:20px;margin-bottom:27px}.lab-heading .eyebrow{font-size:8px;margin-bottom:10px}.lab h2{font-size:34px}.lab h2 br{display:none}.lab-explanation{font-size:12px}.formula{font-size:11px;gap:9px;margin-top:15px}.formula span{gap:5px}.formula strong{font-size:18px}.experiment{padding:25px 21px 18px;border-radius:4px}.experiment-main{grid-template-columns:1fr;gap:34px}.experiment h3{font-size:19px}.experiment h3+p{font-size:11px}.wheel-wrap{width:min(290px,100%);margin:22px auto 18px}.wheel-centre strong{font-size:29px}.wheel-centre small{font-size:6px}.wheel-panel select{font-size:11px}.wheel-footnote{font-size:9px}.mix-panel{border-top:1px solid var(--line);padding-top:25px}.swatch-result{margin-top:21px;height:186px;padding:21px}.swatch-result strong{font-size:32px}.swatch-caption{font-size:11px}.slider-row label{font-size:12px}.slider-row output{font-size:16px}.slider-row input{height:30px}.composition-line{font-size:10px}.mix-note{font-size:10px}.mix-actions{gap:19px}.mix-actions .button{font-size:11px;min-height:44px}.mix-actions .text-button{font-size:11px}.save-status{font-size:10px}.triangle-row{grid-template-columns:1fr;padding-top:25px;gap:15px;margin-top:14px;padding-bottom:18px}.triangle-copy .eyebrow{font-size:7px}.triangle-copy h3{font-size:23px;line-height:1.5;margin-bottom:12px}.triangle-copy h3 br{display:none}.triangle-copy p:not(.eyebrow){font-size:11px}.triangle-frame{max-width:290px;margin:20px auto 15px}.triangle-label.right{right:-5%}.triangle-label{font-size:10px}.accuracy-note{font-size:10px;padding-top:15px;line-height:1.85}.accuracy-note>span{display:block;margin-bottom:4px}.solid-story{display:flex;flex-direction:column;gap:15px;margin-top:31px;text-align:center}.solid-figure{width:185px}.solid-story h3{font-size:23px;line-height:1.5}.solid-story p:not(.eyebrow){font-size:11px;text-align:left}.solid-story .eyebrow{font-size:7px}.notes{padding-top:48px;padding-bottom:42px}.notes-heading{display:block;margin-bottom:25px}.notes h2{font-size:28px;max-width:320px;line-height:1.5}.notes-heading p{font-size:11px}.notes-heading>a{display:inline-block;margin-top:17px;font-size:11px}.notebook{grid-template-columns:repeat(2,1fr);gap:15px;padding:22px 0;min-height:210px}.colour-card-paint{height:120px}.colour-card-info strong{font-size:16px}.colour-card-info span{font-size:8px}.notebook-empty p{font-size:16px}.notebook-actions{gap:10px;align-items:center}.notebook-actions>p{font-size:9px}.notebook-actions .button{font-size:10px;padding:9px 12px;min-height:42px;gap:10px}.reflection{margin-top:56px;padding:0;gap:17px}.asterisk{font-size:40px}.reflection h3{font-size:25px}.reflection .eyebrow{font-size:7px}.reflection p:not(.eyebrow){font-size:11px}.reflection .handwritten{font-size:15px!important}.sources{padding-top:35px;padding-bottom:35px}.sources h2{font-size:26px}.sources-heading>p:last-child{font-size:10px;line-height:1.9}.source-list{grid-template-columns:1fr}.source-list a{padding-top:16px;padding-bottom:16px}.source-list b{font-size:12px}.source-list small{font-size:9px}.art-downloads{gap:13px 20px;font-size:10px}.art-downloads>span{width:100%}footer{margin:0 6%;padding:24px 0 26px;flex-wrap:wrap;gap:17px;justify-content:space-between}footer .brand{font-size:15px}footer .brand em{font-size:11px}footer p{order:3;width:100%;text-align:left;font-size:10px}footer p span{font-size:6px}footer>a:last-child{font-size:10px}}
@media(max-width:360px){.hero h1{font-size:31px}.hero-intro{font-size:9px;padding:0 12px}.experiment{padding-left:15px;padding-right:15px}.formula{gap:6px;font-size:10px}.lab h2{font-size:30px}.triangle-label.right{right:-3%}.notes h2{font-size:26px}.notebook-actions .button{padding:9px 9px;font-size:9px;gap:6px}.timeline summary{grid-template-columns:59px 1fr 12px;gap:12px}.timeline summary>span{font-size:15px}.timeline-body{margin-left:71px}.section-kicker{font-size:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;animation-delay:0ms!important;transition-duration:.001ms!important}}
/* Reading sizes stay comfortable even in narrow notebook-style layouts. */
.site-header nav{font-size:14px}.hero-intro{font-size:16px}.button{font-size:13px}.chapter-index a{font-size:14px}.life-intro>p:not(.eyebrow){font-size:16px}.timeline summary>span{font-size:19px}.timeline small{font-size:11px}.timeline-body{font-size:14px}.timeline-hint,.history-note>span{font-size:12px}.timeline-hint span{font-size:11px}.history-note p{font-size:13px}.reading-art figcaption{font-size:12px}.lab-explanation{font-size:15px}.formula{font-size:14px}.experiment h3+p{font-size:13px}.swatch-result>span,.swatch-caption{font-size:12px}.slider-row label{font-size:14px}.composition-line,.mix-note,.save-status{font-size:12px}.mix-actions .button,.text-button{font-size:12px}.wheel-panel select,.wheel-footnote{font-size:12px}.triangle-copy p:not(.eyebrow){font-size:13px}.triangle-legend strong{font-size:12px}.triangle-legend small,.triangle-label{font-size:11px}.accuracy-note{font-size:12px}.solid-story p:not(.eyebrow){font-size:14px}.notes-heading p{font-size:14px}.notebook-actions>p{font-size:12px}.colour-card-info span{font-size:11px}.reflection p:not(.eyebrow){font-size:14px}.sources-heading>p:last-child{font-size:13px}.source-list b{font-size:14px}.source-list small{font-size:11px}.art-downloads{font-size:12px}.header-end{font-size:12px}.eyebrow,.section-kicker{font-size:10px}.hero-art figcaption>span:last-child{font-size:10px}.lab{scroll-margin-top:0}.lab .section-wrap{padding-top:0}
@media(max-width:850px){.formula{font-size:12px}.lab-explanation{font-size:13px}.timeline summary>span{font-size:17px}.chapter-index a{font-size:12px}.experiment-main{gap:28px}}
@media(max-width:620px){.site-header{height:90px}.site-header nav{font-size:12px;gap:28px}.hero>.eyebrow{font-size:8px}.hero-intro{font-size:12px;line-height:1.9}.hero>.button{font-size:12px;min-height:44px}.hero-art{margin-top:14px}.hero-art .handwritten{font-size:13px}.chapter-index a{font-size:10px}.section-kicker{font-size:8px}.section-kicker span:last-child{font-size:9px}.life-intro>p:not(.eyebrow){font-size:14px}.timeline-body{font-size:14px;margin-left:0;padding-left:1px}.timeline summary>span{font-size:17px}.timeline small{font-size:11px}.history-note p{font-size:13px}.history-note>span,.reading-art figcaption{font-size:12px}.timeline-hint{font-size:12px}.timeline-hint span{font-size:10px}.lab-explanation{font-size:14px}.formula{font-size:12px;gap:7px}.experiment h3{font-size:19px}.experiment h3+p{font-size:13px}.mix-actions .button{font-size:12px}.mix-actions .text-button{font-size:12px}.mix-actions{gap:15px}.triangle-copy p:not(.eyebrow){font-size:13px}.triangle-label{font-size:11px}.accuracy-note{font-size:12px}.solid-story p:not(.eyebrow){font-size:14px}.notes-heading p{font-size:14px}.notes-heading>a{font-size:12px}.notebook-actions{align-items:flex-start}.notebook-actions>p{font-size:11px;max-width:130px}.notebook-actions .button{font-size:11px}.colour-card-info span{font-size:10px}.reflection p:not(.eyebrow){font-size:14px}.sources-heading>p:last-child{font-size:13px}.source-list b{font-size:14px}.source-list small{font-size:11px}.art-downloads{font-size:12px}.hero h1{max-width:100%}.wheel-centre small{font-size:7px}}
@media(max-width:360px){.hero-intro{font-size:11px}.section-kicker{font-size:7px}.formula{font-size:11px;gap:5px}.timeline summary>span{font-size:16px}.notebook-actions .button{font-size:10px;padding:10px 8px}.notebook-actions>p{max-width:105px}.mix-actions{gap:12px}.mix-actions .button{font-size:11px}.mix-actions .text-button{font-size:11px}.notes h2{font-size:26px}}
@media print{.site-header,.button,.text-button,.mix-actions,.notebook-actions,.art-downloads,footer>a:last-child{display:none}.hero{padding-top:10px}.hero-art{width:60%}.lab{background:white;color:#354438}.lab p,.lab h2,.lab h3,.lab-explanation,.lab-heading .eyebrow{color:#354438}.section-wrap{margin:30px 0}.section-kicker{margin-bottom:15px}.life-grid{gap:25px}.timeline details{break-inside:avoid}.notes,.lab,.life{padding:20px 0}a{color:#354438}}