:root{--paper:#f4f2eb;--ink:#25271f;--muted:#686b61;--line:#d6d8cb;--accent:#fa5b35}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}button,a{touch-action:manipulation}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #3462c6;outline-offset:5px}.page{max-width:1440px;margin:auto;padding:0 64px}.nav{height:104px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{display:inline-flex;align-items:baseline;font-weight:900;font-size:28px;letter-spacing:-1.8px}.brand-dot{width:8px;height:8px;background:var(--accent);border-radius:50%;margin-left:4px}.nav-links{display:flex;gap:38px;font-size:13px;font-weight:600}.nav-links a{padding:12px 0}.nav-links a:hover{text-decoration:underline;text-underline-offset:5px}.hero{padding:60px 0 74px;display:grid;grid-template-columns:1.3fr 1fr;gap:7%;align-items:center}.eyebrow{font-family:monospace;font-size:10px;font-weight:500;letter-spacing:1.2px;margin:0 0 22px;line-height:1.6}.small-dot{display:inline-block;width:6px;height:6px;background:var(--accent);border-radius:50%;margin-right:7px;vertical-align:middle}h1{font-size:clamp(90px,12.6vw,177px);font-weight:900;letter-spacing:-.095em;line-height:1;margin:0 0 27px;white-space:nowrap}.title-star{display:inline-block;color:var(--accent);font-weight:400;font-size:.38em;vertical-align:top;line-height:1.4;letter-spacing:0;margin:3px 0 0 15px}.hero-line{font-size:clamp(26px,3vw,41px);line-height:1.12;letter-spacing:-1.6px;margin:0 0 20px}.hero-line em{font-family:Georgia,serif;font-weight:400;color:var(--accent)}.hero-description{font-size:14px;color:var(--muted);line-height:1.7;margin:0 0 29px}.primary-link{display:inline-flex;align-items:center;justify-content:space-between;gap:35px;padding:17px 22px;background:var(--ink);border:1px solid var(--ink);border-radius:6px;color:var(--paper);font-size:12px;font-weight:600;transition:background .2s}.primary-link:hover{background:#45483a}.primary-link span{font-size:18px}.hero-art{padding-top:16px;transform:rotate(2deg)}.art-grid{display:grid;grid-template-columns:1fr 1fr;aspect-ratio:1;overflow:hidden;border-radius:5px;box-shadow:10px 14px 0 #e4e3d9}.tile{position:relative;display:grid;place-items:center;overflow:hidden}.tile-sun{background:#ff623c}.sun{width:70%;aspect-ratio:1;border-radius:50%;background:#f4dda7}.tile-arch{background:#a8bdd0}.arch{width:65%;height:85%;position:absolute;bottom:0;background:#344e41;border-radius:100px 100px 0 0}.arch:after{content:"";position:absolute;bottom:0;left:29%;width:42%;height:66%;border-radius:100px 100px 0 0;background:#a8bdd0}.tile-check{background-color:#edd9ad;background-image:conic-gradient(#344e41 25%,transparent 0 50%,#344e41 0 75%,transparent 0);background-size:50% 50%}.tile-flower{background:#344e41}.flower{color:#ff623c;font-size:clamp(110px,17vw,230px);line-height:.8;font-family:Georgia,serif}.art-caption{font-family:monospace;font-size:9px;letter-spacing:1px;display:flex;justify-content:space-between;padding-top:22px}.collection{padding:42px 0 0;border-top:1px solid var(--line)}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px}.section-head .eyebrow{margin-bottom:9px}h2{font-size:42px;letter-spacing:-1.8px;line-height:1.08;font-weight:500;margin:0}.hint{font-size:12px;line-height:1.7;margin:0 0 4px;color:var(--muted)}.collection-tools{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:29px 0}.filters{display:flex;flex-wrap:wrap;gap:8px}.filter{border:1px solid var(--line);border-radius:40px;padding:10px 17px;background:transparent;font-size:12px;min-height:42px;transition:background .15s}.filter span{margin-left:4px;opacity:.65;font-size:10px}.filter:hover{background:#e5e6dc}.filter.active{background:var(--ink);border-color:var(--ink);color:var(--paper)}.random-button{border:0;background:none;font-size:12px;white-space:nowrap;padding:12px 0 12px 12px;min-height:44px}.random-button span{font-size:21px;vertical-align:middle;margin-right:5px}.random-button:hover{text-decoration:underline;text-underline-offset:5px}.palette-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 25px}.palette-card{min-width:0;scroll-margin-top:32px;border-radius:10px;transition:box-shadow .2s,transform .2s}.palette-card.highlight{box-shadow:0 0 0 4px var(--paper),0 0 0 6px var(--accent);transform:translateY(-3px)}.swatches{height:176px;display:flex;border-radius:8px;overflow:hidden}.swatch{border:0;flex:1;min-width:0;display:flex;align-items:flex-end;justify-content:center;padding:12px 2px;position:relative;transition:flex .2s}.swatch:hover,.swatch:focus-visible{flex:1.5}.swatch:focus-visible{outline:3px solid currentColor;outline-offset:-5px}.hex{font-family:monospace;font-size:10px;letter-spacing:-.3px;opacity:0;transition:opacity .15s}.swatch:hover .hex,.swatch:focus-visible .hex{opacity:1}.card-meta{display:flex;justify-content:space-between;align-items:center;padding:14px 1px 0;gap:8px}.card-name{font-size:14px;font-weight:600;letter-spacing:-.2px;margin:0 0 6px}.card-label{font-family:monospace;font-size:9px;letter-spacing:.8px;color:var(--muted);text-transform:uppercase;margin:0}.copy-palette{border:1px solid var(--line);border-radius:50%;background:transparent;min-width:38px;height:38px;display:grid;place-items:center;flex-shrink:0}.copy-palette:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}.copy-icon{width:12px;height:13px;border:1.4px solid currentColor;border-radius:2px;position:relative}.copy-icon:before{content:"";width:9px;height:10px;border:1.4px solid currentColor;border-radius:2px;position:absolute;top:-5px;left:-5px;background:var(--paper)}.copy-palette:hover .copy-icon:before{background:var(--ink)}.collection-bottom{margin-top:38px;display:flex;justify-content:space-between;gap:12px;font-family:monospace;font-size:9px;letter-spacing:1px;color:var(--muted)}.collection-bottom a:hover{color:var(--ink)}.about{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:66px;padding:55px 10%;display:grid;grid-template-columns:1fr 2fr;gap:60px}.about-star{font-family:Georgia,serif;font-size:150px;color:var(--accent);align-self:center;justify-self:center;line-height:1}.about h2{font-size:34px}.about p:not(.eyebrow){font-size:14px;line-height:1.8;color:var(--muted);max-width:560px;margin:20px 0 0}.about .eyebrow{margin-bottom:14px}.about p.about-note{font-size:12px;color:var(--ink)}footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:32px 0 40px}footer>span{font-family:monospace;font-size:9px;letter-spacing:1px;color:var(--muted)}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);border-radius:8px;padding:15px 24px;background:var(--ink);color:var(--paper);font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:10;max-width:calc(100vw - 32px);text-align:center;box-shadow:0 8px 25px #25271f20}.toast.visible{opacity:1;transform:translate(-50%,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-link{position:fixed;top:-80px;left:20px;background:var(--ink);color:var(--paper);padding:16px;z-index:50}.skip-link:focus{top:12px}dialog{border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);max-width:480px;width:calc(100% - 32px);padding:28px}dialog::backdrop{background:#25271f80}dialog h2{font-size:24px}dialog p{font-size:14px;line-height:1.6}dialog textarea{width:100%;height:80px;margin-bottom:16px;padding:10px;font-family:monospace;border:1px solid var(--line);border-radius:4px}.no-script{padding:24px;border:1px solid var(--line)}
@media(min-width:1500px){.hero{gap:10%}}
@media(max-width:1000px){.page{padding:0 32px}.hero{gap:5%;padding:48px 0 58px}.nav{height:84px}.hero-line{font-size:32px}.palette-grid{gap:28px 18px}.swatches{height:155px}.filter{padding:10px 13px}.about{padding:42px 4%;gap:30px}}
@media(max-width:700px){.page{padding:0 22px}.nav{height:76px}.wordmark{font-size:25px}.nav-links{gap:21px;font-size:12px}.hero{grid-template-columns:1fr;padding:36px 0 38px;gap:38px}.eyebrow{font-size:9px}h1{font-size:clamp(90px,23vw,156px);margin-bottom:22px}.hero-line{font-size:34px}.hero-description{font-size:13px}.hero-art{max-width:440px;width:90%;margin:0 auto;padding-top:0;transform:rotate(1.5deg)}.flower{font-size:clamp(150px,41vw,230px)}.art-caption{font-size:8px}.section-head{display:block}.hint{margin:16px 0 0}.collection{padding-top:30px}h2{font-size:36px}.collection-tools{flex-wrap:wrap;gap:9px;margin:23px 0}.filters{gap:7px;flex:1 1 100%}.filter{padding:10px 12px;font-size:11px}.random-button{padding-left:0}.palette-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}.swatches{height:145px}.hex{font-size:8px}.card-name{font-size:12px}.card-label{font-size:8px}.copy-palette{min-width:36px;height:36px}.collection-bottom{font-size:8px;line-height:1.6}.about{grid-template-columns:1fr;padding:32px 0;gap:22px;margin-top:38px}.about-star{font-size:74px;justify-self:start}.about h2{font-size:31px}.about p:not(.eyebrow){font-size:13px}footer{flex-wrap:wrap;padding:25px 0;gap:16px}footer>span{font-size:8px}footer>span:nth-child(2){display:none}}
@media(max-width:440px){.palette-grid{grid-template-columns:1fr}.swatches{height:190px}.hex{font-size:10px;opacity:1}.card-name{font-size:14px}.card-label{font-size:9px}.copy-palette{min-width:44px;height:44px}.collection-bottom{flex-direction:column}.desktop-break{display:none}.title-star{margin-left:10px}.nav-links{gap:16px}}
@media(hover:none){.hex{opacity:1}.swatch:hover{flex:1}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
