:root{--ink:#243f3b;--green:#244d48;--paper:#fbfaf6;--line:#e2e4dc;--muted:#66716a;--accent:#e9a75e;--blue:#385ece;font-family:Tahoma,'Arial',sans-serif;color:var(--ink);background:var(--paper);font-size:16px}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,label.file-button{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:3px solid #6384dd;outline-offset:4px}button{border:0;background:none}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.topbar{height:102px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#fffefa}.brand{display:flex;align-items:center;gap:14px;font-family:Georgia,serif;font-size:29px;letter-spacing:-1px}.brand small{display:block;font:10px Tahoma,sans-serif;letter-spacing:1.6px;margin-top:7px;color:var(--muted)}.brandmark{width:43px;height:47px;border-radius:15px 15px 22px 22px;background:var(--green);color:white;font:bold 44px Georgia;text-align:center;line-height:38px;position:relative}.brandmark span{position:absolute;right:1px;top:-11px;color:var(--accent);font-size:35px}.head-actions{display:flex;align-items:center;gap:22px}.edition{font-size:13px;border:1px solid #dce1d6;padding:7px 12px;border-radius:20px;color:var(--muted)}.icon-button{border:1px solid var(--line);border-radius:50px;min-width:42px;min-height:42px;padding:8px 14px;background:#fffefa;font-size:18px}.icon-button span{font-size:14px}.icon-button[aria-pressed=true]{background:var(--green);color:white}main{max-width:1400px;margin:auto;padding:0 5vw}.intro{display:flex;justify-content:space-between;align-items:center;margin:48px 0 36px}.eyebrow{font-size:11px;letter-spacing:2.1px;font-weight:600;color:var(--muted)}h1{font-size:clamp(25px,3vw,37px);font-weight:500;letter-spacing:-.5px;line-height:1.5;margin:12px 0}p{line-height:1.8}.intro p:not(.eyebrow){color:var(--muted);margin:9px 0}.collection-note{display:flex;align-items:center;gap:18px;font-size:13px;line-height:1.9;border-left:1px solid #cdd6c9;padding-left:35px}.note-number{font:italic 75px Georgia;color:#9aa893}.collection-note b{font-weight:normal;color:var(--green)}.view-tabs{display:flex;gap:33px;border-bottom:1px solid var(--line)}.view-tabs button{padding:12px 0 18px;white-space:nowrap;position:relative;font-size:15px;color:var(--muted)}.view-tabs button.active{color:var(--green);font-weight:bold}.view-tabs button.active:after{content:'';height:3px;bottom:-1px;left:0;right:0;background:var(--green);position:absolute}.view-tabs span{font-size:12px;margin-left:5px;background:#eceee6;border-radius:20px;padding:2px 6px}.filter-row{margin:26px 0;display:flex;gap:20px;align-items:center;justify-content:space-between}.chips{display:flex;gap:9px;flex-wrap:wrap}.chips button{border-radius:30px;border:1px solid var(--line);padding:9px 17px;font-size:14px;white-space:nowrap;background:#fffefa}.chips button.active{background:var(--green);color:white;border-color:var(--green)}.search{display:flex;align-items:center;gap:10px;border-bottom:1px solid #b7c1b6;padding:5px 3px;min-width:150px}.search span{font-size:25px}.search input{width:140px;border:0;background:transparent;outline-offset:0;font-size:14px;color:var(--ink)}.gallery-heading{display:flex;justify-content:space-between;align-items:center;margin-top:26px;margin-bottom:20px}.gallery-heading h2{font-size:18px;font-weight:500;margin:0}.gallery-heading span{font-size:13px;color:var(--muted)}.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 22px}.art-card{position:relative;min-width:0}.art-open{display:block;width:100%;padding:0;text-align:left}.art-image{aspect-ratio:1;overflow:hidden;border-radius:16px;background:#e8ebe2;position:relative}.art-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}.art-open:hover img{transform:scale(1.035)}.art-open:hover h3{color:var(--blue)}.card-favorite{position:absolute;right:11px;top:11px;width:34px;height:34px;border-radius:50%;background:#fffef9ed;color:var(--green);font-size:23px;box-shadow:0 1px 6px #0001;line-height:1;z-index:1}.card-favorite[aria-pressed=true]{color:#b54f44}.art-card h3{margin:13px 0 7px;font-size:16px;font-weight:500;line-height:1.5}.art-meta{font-size:12px;color:var(--muted);display:flex;justify-content:space-between;gap:5px;line-height:1.8}.card-status{position:absolute;bottom:10px;left:10px;background:#fffef6e8;border-radius:20px;padding:5px 10px;font-size:12px}.mini-progress{position:absolute;bottom:0;left:0;height:4px;background:var(--green)}.research-note{margin:46px 0 35px;padding:22px 25px;background:#edf0e6;display:flex;gap:20px;align-items:center;border-radius:12px}.tiny-flower{font-size:40px;color:#62745d}.research-note b{font-size:15px;font-weight:500}.research-note p{margin:3px 0;font-size:13px;color:var(--muted)}.research-note>span:last-child{margin-left:auto;font-size:10px;letter-spacing:2px;color:#72836e;max-width:145px;line-height:1.9}footer{border-top:1px solid var(--line);padding:22px 0 30px;display:flex;gap:12px;justify-content:space-between;font-size:12px;color:var(--muted)}.empty{grid-column:1/-1;text-align:center;padding:70px 10px;color:var(--muted)}.studio-heading{display:flex;align-items:center;justify-content:space-between;margin:26px 0 22px;gap:20px}.studio-heading h1{font-size:25px;margin:4px 0}.studio-heading>div{text-align:center}.studio-heading p{margin:0}.text-button{font-size:14px;padding:10px 5px}.studio-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:32px;padding-bottom:30px;align-items:start}.canvas-panel{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#f0f0e8}.canvas-top{background:#fffefa;display:flex;justify-content:space-between;align-items:center;padding:8px 18px;font-size:12px;color:var(--muted)}#viewport{height:min(67vh,690px);min-height:300px;overflow:hidden;position:relative;touch-action:none;display:flex;align-items:center;justify-content:center;background:#e8ebe3}#art-wrap{width:min(100%,67vh);aspect-ratio:1;transform-origin:center;flex-shrink:0}#canvas{width:100%;height:100%;display:block;cursor:crosshair;touch-action:none}#loading{position:absolute;inset:0;background:#fbfaf6e8;display:grid;place-items:center}.canvas-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fffefa;padding:10px 16px}.canvas-tools>div{display:flex;align-items:center;border:1px solid var(--line);border-radius:8px}.canvas-tools button{min-height:34px;min-width:34px;font-size:14px}.canvas-tools span{font-size:11px;color:var(--muted)}.palette-panel{background:#fffefa;border:1px solid var(--line);border-radius:16px;padding:26px 22px}.palette-panel h2{font-size:21px;font-weight:500;margin:12px 0}.instructions{font-size:14px;color:var(--muted);margin-bottom:24px}.progress-label{display:flex;justify-content:space-between;font-size:14px}progress{height:7px;width:100%;border:0;border-radius:8px;overflow:hidden;margin-top:12px;background:#e4e9df}progress::-webkit-progress-bar{background:#e4e9df}progress::-webkit-progress-value{background:var(--green);border-radius:8px}progress::-moz-progress-bar{background:var(--green)}.muted{font-size:13px;color:var(--muted);line-height:1.8}.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 10px;margin:24px 0}.swatch{position:relative;width:44px;height:44px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px #d5ddd1;font-size:15px;font-weight:bold;margin:auto}.swatch.active{box-shadow:0 0 0 3px var(--green);transform:scale(1.1)}.swatch.done{opacity:.5}.swatch small{position:absolute;bottom:-7px;right:-5px;border-radius:10px;background:#fff;color:#3c5146;font-size:10px;padding:1px 4px;box-shadow:0 1px 3px #0002}.primary-button,.secondary-button{display:block;width:100%;padding:13px 16px;min-height:46px;border-radius:9px;font-size:14px;line-height:1.6;text-align:center}.primary-button{background:var(--green);color:white}.primary-button:hover{background:#32635b}.secondary-button{border:1px solid #cdd6c9;background:#fffefa}.hint-note{text-align:center;font-size:11px;color:var(--muted)}.reset-button{display:block;margin:20px auto 0;font-size:12px;color:var(--muted)}.quiet-note{border-top:1px solid var(--line);margin-top:23px;padding-top:20px;font-size:12px;text-align:center;color:#6b7e61}.quiet .palette-panel>.eyebrow,.quiet .quiet-note,.quiet .instructions,.quiet .canvas-tools>span,.quiet .edition{display:none}.quiet #studio{max-width:1600px}dialog{color:var(--ink);border:1px solid var(--line);border-radius:20px;padding:32px;max-width:480px;width:calc(100% - 32px);max-height:90vh;overflow:auto;background:var(--paper);box-shadow:0 24px 100px #182b2940}dialog::backdrop{background:#172e2b88;backdrop-filter:blur(5px)}dialog h2{font-size:25px;line-height:1.5;font-weight:500;margin:10px 0 20px}dialog h3{font-size:18px;font-weight:500}dialog p{font-size:14px}dialog .dialog-close{position:absolute;right:13px;top:9px;font-size:26px;min-width:36px;min-height:36px}#complete{text-align:center}#complete-image{width:65%;border-radius:10px}#complete-title{margin:14px 0 22px}.dialog-actions{display:flex;gap:10px}.dialog-actions>*{flex:1}fieldset{border:0;margin:25px 0 0;padding:0}legend{font-size:14px;margin:auto auto 10px}fieldset button{border:1px solid var(--line);border-radius:30px;font-size:13px;padding:8px 12px;margin:4px}fieldset button.selected{background:var(--green);color:white}.file-button{display:block;margin-top:12px;cursor:pointer}.file-button input{display:none}hr{border:0;border-top:1px solid var(--line);margin:25px 0}#toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,15px);background:#244d48f5;color:white;padding:12px 22px;border-radius:30px;max-width:90vw;width:max-content;font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:20}#toast.show{opacity:1;transform:translate(-50%,0)}
.playground-hero{min-height:530px;margin:28px 0 38px;padding:clamp(30px,5vw,70px);display:grid;grid-template-columns:minmax(0,.88fr) minmax(420px,1.12fr);align-items:center;gap:7%;overflow:hidden;position:relative;border-radius:34px;background:linear-gradient(135deg,#fff2c8 0%,#ffe0db 47%,#d9f2ef 100%);box-shadow:0 22px 70px #42564b16}.playground-hero:before{content:'';position:absolute;width:250px;height:250px;border-radius:50%;background:#fff9;left:-105px;bottom:-120px}.hero-copy{position:relative;z-index:2}.hero-copy .eyebrow{color:#526c65;font-size:12px}.hero-copy h1{font:500 clamp(42px,5vw,72px)/1.08 Georgia,'Times New Roman',serif;letter-spacing:-2.5px;margin:16px 0 20px;color:#173f3b}.hero-copy h1 span{color:#e45f52;font-style:italic}.hero-lead{max-width:570px;color:#50645f;font-size:17px;line-height:1.8;margin:0}.hero-actions{display:flex;align-items:center;gap:12px;margin:28px 0 20px}.hero-primary,.hero-secondary{min-height:52px;padding:14px 22px;border-radius:16px;font-size:15px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}.hero-primary{background:#244d48;color:white;box-shadow:0 9px 24px #244d4833}.hero-primary:hover{background:#e45f52;transform:translateY(-2px)}.hero-secondary{background:#fff9;border:1px solid #fff;color:#38564f}.hero-secondary:hover{background:white}.trust-row{display:flex;flex-wrap:wrap;gap:15px;color:#49635b;font-size:13px}.hero-gallery{height:405px;position:relative}.hero-gallery img{position:absolute;display:block;object-fit:cover;aspect-ratio:1;border:8px solid #fff;border-radius:25px;box-shadow:0 20px 45px #294b4540;background:#e6ebe5}.hero-main-image{width:min(64%,350px);left:16%;top:4%;transform:rotate(-3deg);z-index:2}.hero-side-image{width:min(37%,190px);z-index:3}.hero-side-image.one{right:0;top:7%;transform:rotate(8deg)}.hero-side-image.two{left:0;bottom:0;transform:rotate(-9deg)}.hero-sun{position:absolute;width:142px;height:142px;border-radius:50%;right:9%;bottom:2%;background:#ffb739}.hero-sticker{position:absolute;z-index:4;right:4%;bottom:12%;width:82px;height:82px;border-radius:50%;display:grid;place-items:center;text-align:center;transform:rotate(9deg);background:#e95e53;color:white;font:bold 14px/1.3 Tahoma,sans-serif;box-shadow:0 8px 20px #943e3540}.hero-nudge{position:absolute;z-index:4;left:2%;top:4%;font:italic 15px/1.45 Georgia,serif;color:#48615a;transform:rotate(-6deg)}.view-tabs{background:#fffefa;position:sticky;top:0;z-index:6;padding-top:8px}.gallery{gap:32px 24px}.art-image{border-radius:22px;box-shadow:0 10px 28px #2e4d4212;transition:transform .25s,box-shadow .25s}.art-open:hover .art-image{transform:translateY(-5px);box-shadow:0 18px 38px #2e4d4224}.card-status{font-weight:600}.research-note{background:linear-gradient(120deg,#dcefea,#eef3d8);border-radius:22px;padding:27px 30px}.tiny-flower{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;background:#fff9;color:#e45f52}.primary-button{border-radius:14px}.topbar{background:#fffefaeF;backdrop-filter:blur(12px)}
@media(min-width:1450px){main{padding:0 40px}}@media(max-width:1050px){.playground-hero{grid-template-columns:1fr 1fr;gap:20px;padding:42px 36px}.hero-copy h1{font-size:48px}.hero-gallery{height:350px}.gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.filter-row{flex-wrap:wrap}.studio-layout{gap:18px;grid-template-columns:minmax(0,1fr) 240px}.palette-panel{padding:20px 14px}.canvas-tools>span{display:none}}@media(max-width:700px){.topbar{height:83px;padding:0 20px}.brand{font-size:23px;gap:10px}.brand small{font-size:8px;letter-spacing:1px}.brandmark{width:35px;height:39px;font-size:36px;line-height:32px}.head-actions{gap:7px}.edition,.head-actions .icon-button span{display:none}.icon-button{padding:7px;min-width:36px;min-height:36px}main{padding:0 16px}.playground-hero{min-height:0;margin:16px 0 26px;padding:29px 22px 22px;display:flex;flex-direction:column;align-items:stretch;border-radius:25px;gap:18px}.hero-copy h1{font-size:clamp(37px,11vw,50px);letter-spacing:-1.6px;margin:11px 0 15px}.hero-copy .eyebrow{font-size:10px}.hero-lead{font-size:15px;line-height:1.65}.hero-actions{display:grid;grid-template-columns:1fr;margin:21px 0 17px}.hero-primary,.hero-secondary{width:100%;min-height:48px}.trust-row{gap:8px 13px;font-size:12px}.hero-gallery{height:245px}.hero-main-image{width:58%;left:22%;top:3%;border-width:6px;border-radius:19px}.hero-side-image{width:31%;border-width:5px;border-radius:16px}.hero-side-image.one{right:1%;top:3%}.hero-side-image.two{left:2%;bottom:0}.hero-sun{width:94px;height:94px;right:8%;bottom:0}.hero-sticker{width:62px;height:62px;font-size:11px;right:1%;bottom:8%}.hero-nudge{font-size:12px;left:1%;top:1%}.view-tabs{gap:24px;overflow-x:auto;top:0}.view-tabs button{font-size:13px}.filter-row{gap:15px;margin:20px 0}.chips{gap:7px}.chips button{font-size:12px;padding:8px 12px}.search{width:100%}.search input{width:100%}.gallery-heading h2{font-size:16px}.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px 14px}.art-image{border-radius:15px}.art-card h3{font-size:14px;margin-top:10px}.art-meta{font-size:11px;flex-wrap:wrap}.card-favorite{width:31px;height:31px;right:8px;top:8px}.research-note{padding:18px 16px;gap:12px;margin:30px 0 23px}.research-note>span:last-child{display:none}.research-note p{font-size:12px}.tiny-flower{width:45px;height:45px;flex:0 0 45px}footer{flex-direction:column;font-size:11px;line-height:1.6}.studio-heading{margin:18px 0;gap:8px}.studio-heading h1{font-size:18px}.studio-heading .eyebrow{font-size:9px;letter-spacing:1px}.studio-layout{display:flex;flex-direction:column;gap:18px}.canvas-panel,.palette-panel{width:100%}#viewport{height:calc(100vw - 42px);min-height:0}#art-wrap{width:100%}.canvas-top{padding:6px 10px;font-size:10px}.canvas-top button{font-size:12px}.canvas-tools{padding:7px 10px}.palette-panel{padding:18px}.palette-panel>.eyebrow,.palette-panel h2,.quiet-note{display:none}.instructions{margin:0 0 16px;font-size:13px}.palette{grid-template-columns:repeat(6,1fr);gap:18px 9px;margin:20px 0 25px}.swatch{width:39px;height:39px}.palette-panel .primary-button{max-width:350px;margin:auto}.reset-button{margin-top:7px}.quiet #studio{padding:0 12px}.quiet #viewport{height:calc(100vw - 26px)}dialog{padding:27px 20px}dialog h2{font-size:22px}#complete-image{width:65%}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}