
:root{--ink:#203f42;--petrol:#15575b;--cream:#fffaf0;--paper:#f4eddf;--gold:#9d6735;--line:#cfc4af}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.7 system-ui,sans-serif}h1,h2,h3{font-family:Georgia,serif;line-height:1.17}h1{font-size:clamp(2.6rem,6vw,4.6rem);max-width:17ch;margin:16px 0 24px}h2{font-size:clamp(1.8rem,4vw,2.6rem)}h3{font-size:1.45rem}a{color:var(--petrol)}button,input,select{font:inherit}button,a.button{min-height:46px;border:1px solid var(--petrol);border-radius:8px;padding:10px 17px;background:var(--petrol);color:white;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px}button.secondary,a.secondary{background:var(--cream);color:var(--petrol)}button:disabled{opacity:.55;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #aa543c;outline-offset:4px}img{max-width:100%;display:block}[hidden]{display:none!important}.shell{max-width:1200px;margin:auto;padding:0 28px}.topbar{padding:20px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.brand{font:bold 1.3rem Georgia;text-decoration:none}.hero{display:grid;grid-template-columns:1.25fr .75fr;gap:50px;align-items:center;padding:55px 0}.hero p{max-width:65ch}.eyebrow{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:800}.lead{font-size:1.25rem}.hero-art{aspect-ratio:1;object-fit:cover;border:9px solid var(--cream);border-radius:20px;box-shadow:7px 9px 0 #d8c6a9}.tabs{display:flex;flex-wrap:wrap;gap:10px;border-block:1px solid var(--line);padding:16px 0}.tabs a{padding:9px 15px;border-radius:22px;text-decoration:none;background:#e5e9dc;font-weight:650}.tabs a[aria-current=page]{background:var(--petrol);color:white}.section{padding:40px 0;scroll-margin-top:20px}.doors,.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.door,.panel,.practice,.plant{background:var(--cream);border:1px solid var(--line);border-radius:18px;overflow:hidden}.door{text-decoration:none;color:var(--ink);display:flex;flex-direction:column}.door:hover{box-shadow:0 6px 22px #203f4220;transform:translateY(-2px)}.door-art{height:210px;display:grid;place-items:center;background:#dce5d5}.door-art img{width:100%;height:100%;object-fit:cover}.colour-art{background:conic-gradient(#ba655a,#dcad56,#9ba85a,#5b9e91,#637eac,#ab789e,#ba655a);font:5rem Georgia;color:#fffaf0}.care-art{background:#dce5d5}.herb-art{background:#d7dfb8}.door-copy,.panel,.practice-body,.plant{padding:25px}.door-copy{flex:1}.door b{display:block;margin-top:20px}.quiet{font-size:.9rem;color:#5a6860}.note{border-left:4px solid #a7783f;background:#e7eadf;padding:18px 22px;border-radius:0 12px 12px 0}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.two{display:grid;grid-template-columns:1fr 1fr;gap:28px}.panel h3:first-child{margin-top:0}label{display:block;font-weight:650;margin:14px 0 7px}input[type=range]{width:100%;accent-color:var(--petrol);min-height:38px}input[type=search],select{width:100%;min-height:46px;padding:10px;border:1px solid #839b8f;border-radius:7px;background:white;color:var(--ink)}.colour-wheel{width:min(100%,320px);aspect-ratio:1;border-radius:50%;position:relative;margin:15px auto;touch-action:none;background:conic-gradient(from 90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border:10px solid var(--cream);box-shadow:0 0 0 1px var(--line)}.colour-wheel:after{content:'';position:absolute;inset:28%;border-radius:50%;background:var(--cream);box-shadow:0 0 0 1px #ffffff70}.wheel-hand{position:absolute;inset:0;transform:rotate(var(--angle,0deg));z-index:1;pointer-events:none}.wheel-hand:before{content:'';position:absolute;left:82%;top:calc(50% - 10px);width:20px;height:20px;background:white;border:4px solid #182f31;border-radius:50%}.swatches{display:flex;gap:12px;flex-wrap:wrap}.swatch{flex:1;min-width:75px}.chip{height:90px;background:var(--swatch);border:1px solid #203f4230;border-radius:10px}.swatch code{font-size:.8rem;display:block;margin-top:7px;overflow-wrap:anywhere}.preview-colour{height:130px;border-radius:12px;background:var(--sample,#829a77);margin:15px 0}.rgb-preview{height:100px;border-radius:10px}.quiz-options{display:flex;gap:12px;flex-wrap:wrap}.quiz-options button{width:74px;height:74px;border:4px solid var(--cream);outline:1px solid #668379}.feedback{min-height:3em}.practice-visual{height:180px;background:#dbe5d8;display:grid;place-items:center;position:relative;overflow:hidden}.practice-visual .orb{width:85px;height:85px;background:#e9c984;border-radius:50%;box-shadow:0 0 0 20px #fbf4dd60,0 0 0 40px #fbf4dd30}.practice-visual .star{font:7rem Georgia;color:#f8dfa6}.practice-visual .leaf{width:75px;height:110px;border-radius:100% 0 100% 0;background:#6e8d6a;transform:rotate(25deg)}.practice-visual .line{width:110px;height:12px;border-radius:50%;background:#527d7b;box-shadow:0 -25px 0 #7d9f91,0 25px 0 #b6c4a0}.practice-visual.running .orb,.practice-visual.running .star{animation:float 6s ease-in-out infinite}.practice-visual.running .leaf,.practice-visual.running .line{animation:sway 6s ease-in-out infinite}.practice details{border-top:1px solid var(--line);padding-top:14px;margin:18px 0}.practice summary,.plant summary{cursor:pointer;font-weight:700;min-height:44px}.practice li{margin:9px 0}.tag{display:inline-block;font-size:.75rem;background:#e5e9dc;padding:4px 9px;border-radius:20px}.draw-result{display:grid;grid-template-columns:minmax(140px,220px) 1fr;gap:24px;margin-top:24px}.draw-result img{width:100%;aspect-ratio:2/3;object-fit:contain;background:var(--paper);border-radius:10px}.draw-result h3{margin-top:0}.plant-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.plant h3{margin:10px 0}.plant .plant-mark{font-size:2rem;color:#608156}.search-row{display:grid;grid-template-columns:2fr 1fr;gap:20px}.footer{border-top:1px solid var(--line);padding:26px 0;margin-top:30px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.skip{position:absolute;left:10px;top:-100px;background:white;padding:10px}.skip:focus{top:10px;z-index:10}summary{touch-action:manipulation}.sources{font-size:.9rem}.source-workshop{margin:24px 0}.empty{padding:24px;background:#fffaf0}.guide-section{padding:30px 0}.guide-next{display:flex;gap:12px;flex-wrap:wrap}.guide-button,.room-enter{display:inline-block;padding:12px 18px;background:var(--petrol);color:white;border-radius:8px;text-decoration:none}.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.guide-grid.two{grid-template-columns:repeat(2,1fr)}.guide-card{border:1px solid var(--line);border-radius:14px;background:var(--cream);overflow:hidden}.guide-card-body{padding:22px}.guide-note{background:#e5e9dc;padding:20px;border-radius:12px}.guide-copy{max-width:80ch}.color-strip{display:flex;height:65px}.color-strip span{flex:1}.color-card{padding:22px}.color-card-heading{display:flex;gap:14px;align-items:center}.color-disc{width:44px;height:44px;border-radius:50%;background:var(--color);flex-shrink:0}.color-card-heading h3{margin:0}.color-context-pair{display:grid;grid-template-columns:1fr 1fr}.color-context-pair>div{height:140px;display:grid;place-items:center;background:#fff6df}.color-context-pair>div+div{background:#143b40}.color-context-pair span{background:#57b9ad;width:70px;height:70px;border-radius:50%}.color-mandala-invite{padding:25px;background:#dfe8da;border-radius:18px}.color-mandala-picture{display:block;max-width:300px}.color-mandala-picture img{width:100%}.color-ref{font-size:.8rem}.knowledge-entry summary{padding:14px;cursor:pointer}.knowledge-entry .prose{padding:10px 20px}.card-toggle{display:block}.when-open{display:none}details[open] .when-open{display:inline}details[open] .when-closed{display:none}.color-card .prose{padding:10px 0}.choice-line{display:flex;gap:10px;flex-wrap:wrap}.choice-line button[aria-pressed=true]{background:#9b5a3c}.hue-values{font-variant-numeric:tabular-nums}@keyframes float{50%{transform:translateY(-12px)}}@keyframes sway{50%{transform:rotate(-12deg) translateY(-5px)}}@media(max-width:800px){.hero{grid-template-columns:1fr;gap:25px;padding:35px 0}.hero-art{max-width:320px;justify-self:center}.doors,.cards,.plant-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.two{grid-template-columns:1fr}.shell{padding:0 20px}.guide-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.doors,.cards,.plant-grid,.guide-grid,.guide-grid.two,.search-row{grid-template-columns:1fr}.draw-result{grid-template-columns:1fr}.draw-result img{max-width:220px;margin:auto}.hero-art{max-width:230px}.panel,.practice-body{padding:20px}.tabs a{font-size:.9rem;padding:8px 12px}.door-art{height:170px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* Accessible illustration layout: captions are outside the image. */
html{scrollbar-gutter:stable}body{--paper:#fff6e5;--cream:#fffdf7;--ink:#163e43;--petrol:#075a64;--line:#cdb78f}button:disabled{cursor:not-allowed}.hero-art{aspect-ratio:3/2;object-fit:cover}.door{border:2px solid #b49564;box-shadow:0 4px 0 #dfcba4;min-width:0}.door-art{display:block;position:relative;aspect-ratio:3/2;height:auto;flex:none;overflow:hidden;background:#f8e6c7}.door-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.door-copy{background:#fffdf7;color:#163e43;position:relative;z-index:1;display:flex;flex-direction:column;padding:24px;flex:1}.door-copy .tag{align-self:flex-start}.door-title{font-size:1.65rem;line-height:1.22;margin:16px 0 10px;overflow-wrap:anywhere}.door-copy p{margin:0 0 16px}.door-copy b{margin-top:auto;padding-top:12px;color:#075a64}.door:hover{transform:none;box-shadow:0 7px 20px #143b4025}.door:focus-visible{outline:4px solid #be3a30;outline-offset:4px}.game-art{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;border-radius:10px;border:1px solid #baa37e;margin-bottom:22px}.panel:has(.game-art){background:#fffdf7}.lesson-nav{display:flex;gap:12px;flex-wrap:wrap;padding:4px 0 28px}.lesson-nav a{padding:9px 15px;border:1px solid #9f743f;border-radius:8px;text-decoration:none;background:#fffdf7;font-weight:650}.try-it{padding:16px 18px;background:#edf4e2;border-left:4px solid #4b8d60;border-radius:0 10px 10px 0;font-size:.95rem}.practice-time{display:block;font-size:.78rem;color:#50656a;margin-bottom:12px}.colour-gallery{display:grid;grid-auto-rows:1fr;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;margin-top:26px;align-items:stretch}.colour-gallery template{display:none}.colour-tile{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:10px;background:#fffdf7;color:#163e43;border:2px solid #b49a6f;border-radius:14px;text-align:left;min-width:0;height:100%;box-shadow:0 3px 0 #e0ccaa;gap:0}.colour-tile:hover{box-shadow:0 7px 20px #143b4025;border-color:#075a64}.colour-picture{display:block;aspect-ratio:1;overflow:hidden;border-radius:7px;border:1px solid #d1bf9f;background:var(--tile-colour);flex:none}.colour-picture img{display:block;width:100%;height:100%;object-fit:cover}.colour-caption{display:flex;flex:1;flex-direction:column;padding:16px 6px 8px;gap:9px}.colour-name{font:bold 1.45rem/1.2 Georgia,serif;display:flex;align-items:center;gap:10px}.colour-dot{background:var(--tile-colour);border:1px solid #718385;width:22px;height:22px;border-radius:50%;flex:none}.colour-teaser{font-size:.9rem;line-height:1.5;min-height:2.8em}.colour-open-label{font-size:.85rem;font-weight:700;margin-top:auto;color:#075a64}.colour-tile:focus-visible{outline:4px solid #be3a30;outline-offset:4px}body.has-colour-dialog{overflow:hidden}#colour-dialog{position:fixed;inset:0;margin:auto;width:min(640px,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:0;border:2px solid #b49564;border-radius:18px;background:#fffdf7;color:#163e43;box-shadow:0 24px 100px #102a3b66;overflow:auto;overscroll-behavior:contain}#colour-dialog::backdrop{background:#102d37a8}.colour-dialog-top{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:15px;background:#fffdf7;border-bottom:1px solid #d7c7aa;padding:18px 24px}.colour-dialog-top h2{font-size:1.8rem;margin:0}.colour-dialog-top button{font-size:.9rem;white-space:nowrap}#colour-dialog-body{padding:22px 26px 28px}.colour-dialog-intro{display:flex;align-items:center;gap:22px;margin-bottom:20px}.colour-dialog-intro img{width:150px;height:150px;object-fit:cover;border:6px solid #eee3ce;outline:1px solid #b49a6f;border-radius:8px}.colour-dialog-teaser{font:bold 1.2rem/1.5 Georgia,serif}.guide-question{font-weight:700;color:#075a64;border-top:1px solid #d7c7aa;padding-top:16px}.quiz-options button{color:#102b2e!important;font-weight:750;box-shadow:inset 0 -27px 0 #fffdf7!important;align-items:flex-end;padding-bottom:2px}.swatch .chip{min-width:70px}.swatch code{line-height:1.4}.lesson-note{font-size:.9rem;color:#50656a}.colour-wheel{background:conic-gradient(from 90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}
@media(max-width:1000px){.colour-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:700px){.colour-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.door-copy{padding:22px}.colour-name{font-size:1.25rem}.colour-tile{padding:8px}.colour-caption{padding:12px 3px 6px}.colour-teaser{font-size:.83rem}.hero-art{max-width:100%;width:100%}}@media(max-width:400px){.colour-gallery{gap:10px}.colour-name{font-size:1.08rem;gap:6px}.colour-dot{width:16px;height:16px}.colour-dialog-top{padding:14px}.colour-dialog-top h2{font-size:1.55rem}#colour-dialog-body{padding:18px}.colour-dialog-intro{gap:16px}.colour-dialog-intro img{width:110px;height:110px}.colour-dialog-teaser{font-size:1rem}}

/* Static illustrated practice library. */
.practice-filters{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px;padding:22px;background:#e9ecdf;border:1px solid #c5cbb6;border-radius:16px}.practice-filters label{font-weight:650;display:block}.practice-filters input,.practice-filters select{width:100%;min-width:0;padding:10px;border:1px solid #9aada2;border-radius:7px;background:#fffdf7;color:#203f42}.practice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;grid-auto-rows:1fr}.practice-card{display:flex;flex-direction:column;padding:10px;box-shadow:0 4px 0 #ddc8a7;border:1px solid #baa37e}.practice-card .practice-image{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:9px;border:1px solid #d4c5a9}.practice-card .practice-body{display:flex;flex-direction:column;flex:1;padding:20px 12px 12px}.practice-card h3{font-size:1.4rem;margin:12px 0}.practice-card .practice-body p{margin:0 0 20px}.practice-card button{margin-top:auto;width:100%;font-size:.92rem}.practice-card .tag{align-self:flex-start}.practice-pagination{justify-content:center;align-items:center}.practice-count{scroll-margin-top:20px;font-weight:650}body.has-practice-dialog{overflow:hidden}#practice-dialog{position:fixed;inset:0;margin:auto;width:min(680px,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:0;border:2px solid #b49564;border-radius:18px;background:#fffdf7;color:#163e43;box-shadow:0 24px 100px #102a3b66;overflow:auto;overscroll-behavior:contain}#practice-dialog::backdrop{background:#102d37a8}.practice-dialog-top{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:15px;background:#fffdf7;border-bottom:1px solid #d7c7aa;padding:18px 24px}.practice-dialog-top h2{font-size:1.6rem;margin:0}.practice-dialog-top button{font-size:.9rem;flex:none}#practice-dialog-body{padding:22px 26px 28px}#practice-dialog-body li{margin-bottom:12px}#practice-dialog-body .lead{font-size:1.1rem}.practice-pagination button:disabled{cursor:default}.practice-card,.practice-image{animation:none!important;transition:none!important}@media(max-width:900px){.practice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.practice-filters{grid-template-columns:1fr 1fr}.practice-filters>label:first-child{grid-column:1/-1}}@media(max-width:550px){.practice-grid{grid-template-columns:1fr;gap:22px}.practice-filters{grid-template-columns:1fr}.practice-filters>label:first-child{grid-column:auto}.practice-dialog-top{padding:14px}.practice-dialog-top h2{font-size:1.3rem}#practice-dialog-body{padding:18px}.practice-pagination{gap:8px}.practice-pagination button{padding:9px 12px}}

/* Botanical collection: complete square artworks, never cropped. */
.plant.plant-illustrated{padding:0;overflow:hidden;min-width:0}
.plant-image{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:#fff9ed}
.plant-copy{padding:22px}.plant-copy h3{margin-bottom:6px}
.plant-copy .plant-latin{font-size:.88rem;line-height:1.5;color:#49615b;margin-top:0;overflow-wrap:anywhere}
#herb-draw .plant-drawn{display:grid;grid-template-columns:minmax(220px,340px) minmax(0,1fr);gap:0;margin-top:24px;text-align:left;align-items:start}
.plant-reference{display:block;width:100%;max-width:240px;height:auto;aspect-ratio:1;object-fit:contain;margin:0 auto 18px;border-radius:8px}
@media(max-width:620px){#herb-draw .plant-drawn{grid-template-columns:1fr}.plant-copy{padding:20px}}

/* Keep the long herbal-workshop heading inside narrow phone viewports. */
@media(max-width:400px){.hero{grid-template-columns:minmax(0,1fr)}.hero h1{font-size:2rem}}
