:root{color-scheme:light;--bg:#f5f2e9;--ink:#293e32;--muted:#626b59;--line:#e1e2d5;font-family:"Trebuchet MS",Verdana,Arial,sans-serif;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}button,input{font:inherit}a{color:inherit}button,label{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #3d7455;outline-offset:5px}.skip{position:absolute;left:16px;top:-80px;z-index:3;background:white;padding:14px}.skip:focus{top:16px}.svg-library{position:absolute;width:0;height:0;overflow:hidden}header{max-width:1240px;margin:auto;padding:28px 36px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:8px;text-decoration:none;font-size:27px;font-weight:bold;letter-spacing:-1.5px}.brand>span{color:#9ba87c;font-size:20px;margin-left:2px}.header-note{font-size:11px;color:var(--muted)}.header-badge{border:1px solid #dce0cf;border-radius:30px;padding:9px 13px;font-size:10px}.intro{text-align:center;padding:30px 16px 34px}.eyebrow{font-size:9px;letter-spacing:2.4px;color:#62754e;font-weight:bold;margin:0 0 20px}h1{font-weight:400;font-size:clamp(42px,4.7vw,64px);line-height:1.08;letter-spacing:-2.7px;margin:0}h1 em{font-family:Georgia,serif;color:#718058;font-weight:400}.intro>p:last-child{font-size:12px;color:var(--muted);line-height:1.85;margin:19px 0 0}.workshop{display:grid;grid-template-columns:1.16fr 1fr;max-width:1036px;margin:auto;background:#fffef9;border:1px solid #dce1d0;border-radius:22px;overflow:hidden;box-shadow:0 14px 40px -32px #3e583f77}.preview{background:#e8eddd;display:flex;flex-direction:column;min-height:538px;overflow:hidden}.preview-meta{display:flex;justify-content:space-between;padding:25px 27px 0;font-size:8px;letter-spacing:1.2px;color:#5c6c4d;gap:12px}.preview-meta>span:first-child{display:flex;align-items:center;gap:8px}.preview-meta i{width:5px;height:5px;background:#78905b;border-radius:50%}.preview-meta>span:last-child{font-size:10px}.stage{position:relative;display:grid;place-items:center;flex:1;isolation:isolate;min-height:440px}.stage:before,.stage:after{content:"";position:absolute;border-radius:50%;z-index:-1;width:340px;height:340px;border:1px solid #d7e1c8;background:radial-gradient(ellipse,#f7f7e96b,transparent 70%)}.stage:after{width:405px;height:405px;border:1px dashed #d9e2ca;background:none}.cactus{width:100%;height:440px;overflow:visible;--plant:#8da681;--edge:#587452;--rib:#b4c69d;--spine:#e5e9ce}.cactus[data-color=lime]{--plant:#b7c77d;--edge:#768c49;--rib:#d7dfaa;--spine:#f1efd0}.cactus[data-color=mint]{--plant:#8cb7a4;--edge:#527f6d;--rib:#b9d3bd;--spine:#e7eee0}.cactus[data-color=peach]{--plant:#daa88b;--edge:#a77458;--rib:#efc9a7;--spine:#fff0d2}.cactus[data-color=lilac]{--plant:#b2a2bf;--edge:#7d6a8d;--rib:#d7cade;--spine:#f0e6ef}.cactus[data-color=sky]{--plant:#93b6c3;--edge:#5d8697;--rib:#bfd6de;--spine:#eaf0e8}.cactus-body{transform-origin:250px 480px;animation:sway 6s ease-in-out infinite}.spark{position:absolute;color:#91a477;pointer-events:none}.s1{left:12%;top:26%;font-size:31px}.s2{right:13%;top:61%;font-size:29px}.note{position:absolute;left:9%;bottom:17%;font-family:Georgia,serif;font-style:italic;font-size:14px;color:#62774f;transform:rotate(-9deg);line-height:1.3}.preview-caption{margin:0;padding:5px 18px 25px;text-align:center;color:#536544;font-size:10px;display:flex;align-items:center;justify-content:center;gap:15px}.preview-caption>span{color:#91a279}.controls{padding:31px 33px 26px;min-width:0}h2{font-size:22px;letter-spacing:-.6px;font-weight:400;margin:0 0 8px}.controls-intro{font-size:10px;color:var(--muted);margin:0 0 29px}.option-group{margin:0 0 27px;padding:0;border:0;min-width:0}.option-group legend{padding:0;margin:0 0 13px;width:100%;display:flex;align-items:center;gap:10px;font-size:12px;font-weight:bold;line-height:1.5}.option-group legend>span{font-size:9px;color:#707c61;font-weight:normal}.option-group output{margin-left:auto;background:#f0f2e9;padding:3px 6px;border-radius:5px;font-size:9px;color:#59674e;font-weight:normal}.pot-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.choice{position:relative;cursor:pointer;display:block}.choice input{position:absolute;opacity:0;width:1px;height:1px;overflow:hidden}.tile{display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid var(--line);background:#fbfaf4;border-radius:9px;transition:background .15s,transform .15s,border-color .15s;min-height:44px}.pot-options .tile{padding:10px 2px 9px;gap:7px}.pot-options svg{width:42px;height:31px}.choice-name{font-size:8px;color:#59634f}.choice:hover .tile{background:#eff2e5;transform:translateY(-2px)}.choice input:checked+.tile{border-color:#7f996b;background:#edf1e2;box-shadow:inset 0 0 0 .5px #7f996b}.choice input:focus-visible+.tile{outline:3px solid #3d7455;outline-offset:4px}.color-options{display:flex;justify-content:space-between;gap:8px}.color-options .tile{background:none;border:0;box-shadow:none;min-height:44px;gap:6px}.color-dot{width:34px;height:34px;border:4px solid #fffef9;border-radius:50%;background:var(--swatch);box-shadow:0 0 0 1px transparent}.color-options input:checked+.tile{background:none;box-shadow:none}.color-options input:checked+.tile .color-dot{box-shadow:0 0 0 1.5px #637f53}.color-sage{--swatch:#8da681}.color-lime{--swatch:#b7c77d}.color-mint{--swatch:#8cb7a4}.color-peach{--swatch:#daa88b}.color-lilac{--swatch:#b2a2bf}.color-sky{--swatch:#93b6c3}.decor-options{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px}.decor-options svg{width:26px;height:26px}.decor-options .choice-name{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}.actions{display:flex;gap:9px;margin-top:5px}.actions button{border:1px solid #36573e;border-radius:9px;min-height:46px;background:#36573e;color:#fffef5;font-size:12px}.actions button:hover{background:#2b4932}.actions #randomize{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:1;padding:0 17px}.actions #randomize>span{font-size:23px}.actions #reset{width:47px;flex-shrink:0;background:#fffef9;color:#5b7451;border-color:#dfe4d4;font-size:27px}.actions #reset:hover{background:#eff2e5}.hint{text-align:center;font-size:9px;color:#657156;margin:14px 0 0}.afterword{text-align:center;font-size:11px;line-height:1.7;color:#626f54;margin:26px 18px 36px}.afterword>span{font-size:18px;vertical-align:-1px;margin-right:6px;color:#8e9c70}footer{border-top:1px solid #dfe3d4;max-width:1168px;margin:auto;padding:20px 0 24px;display:flex;justify-content:space-between;gap:15px;font-size:9px;color:#657057}footer>span:last-child>span{padding-left:7px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}noscript p{font-size:12px;line-height:1.6}@keyframes sway{0%,100%{transform:rotate(-.8deg)}50%{transform:rotate(.8deg)}}
@media(max-width:1100px){.workshop{margin-left:28px;margin-right:28px}.controls{padding-left:26px;padding-right:26px}footer{margin:0 30px}.note{left:6%}.header-note{font-size:10px}}
@media(max-width:800px){header{padding:23px 24px 15px}.header-note{display:none}.intro{padding-top:30px}.workshop{grid-template-columns:1fr;max-width:540px;margin:auto}.preview{min-height:400px}.stage{min-height:320px}.cactus{height:330px}.stage:before{width:260px;height:260px}.stage:after{width:315px;height:315px}.note{left:13%;bottom:16%;font-size:13px}.controls{padding:29px 32px}.pot-options svg{width:48px;height:36px}.choice-name{font-size:9px}.decor-options{gap:9px}.decor-options svg{width:29px;height:29px}h1{font-size:53px}.preview-caption{padding-bottom:22px}}
@media(max-width:580px){header{padding:20px 18px 10px}.brand{font-size:25px}.brand img{width:26px;height:30px}.header-badge{font-size:8px;padding:8px 10px}.intro{padding:28px 14px}.eyebrow{font-size:7px;letter-spacing:1.5px;margin-bottom:17px}h1{font-size:43px;letter-spacing:-2px}.intro>p:last-child{font-size:10px;line-height:1.9;margin-top:16px}.workshop{margin:0 16px;border-radius:18px}.preview{min-height:354px}.preview-meta{padding:20px 20px 0;font-size:6px;letter-spacing:1px}.stage{min-height:280px}.cactus{height:286px}.stage:before{width:222px;height:222px}.stage:after{width:270px;height:270px}.note{font-size:11px;left:8%;bottom:17%}.s1{font-size:25px}.s2{font-size:24px}.preview-caption{font-size:9px;gap:9px;padding-bottom:21px}.controls{padding:25px 20px}.controls-intro{font-size:9px}.option-group{margin-bottom:25px}.pot-options{gap:5px}.pot-options svg{width:39px;height:30px}.pot-options .choice-name{font-size:8px}.color-options{gap:3px}.color-dot{width:32px;height:32px}.color-options .choice-name{font-size:8px}.decor-options{gap:4px}.decor-options svg{width:24px;height:24px}.decor-options .tile{min-height:40px}.afterword{font-size:9px;margin-bottom:28px}footer{margin:0 20px;flex-direction:column;align-items:center;gap:9px}.hint{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}