:root{font-family:Geist,Arial,sans-serif;color:#2b2242;background:#f5f1f9}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}main{overflow-x:hidden;width:100%;max-width:100%}a{color:inherit;text-underline-offset:4px}nav{display:flex;justify-content:space-between;margin:24px 5%;padding:20px 26px;border:1px solid #c5b7d6;border-radius:50px}nav a{text-decoration:none}header{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center;max-width:1400px;margin:auto;padding:100px 5% 120px;background:radial-gradient(ellipse at bottom right,#cdbfe855,transparent 75%)}h1{max-width:72rem;font-size:clamp(3rem,5.3vw,5.3rem);line-height:1.04;letter-spacing:-.06em;margin:0 0 30px}header p{max-width:620px;font-size:1.12rem;line-height:1.8}.actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0}.button,button{background:#5b397e;color:white;border:1px solid #5b397e;border-radius:8px;padding:14px 20px;font:inherit;text-decoration:none;cursor:pointer}.light{background:#fff;color:#5b397e}.button:hover,button:hover{filter:brightness(.9)}button:disabled{opacity:.45;cursor:not-allowed}header img{width:100%;border-radius:26px;transform:rotate(3deg);transition:transform .7s}header img:hover{transform:rotate(0) scale(1.02)}section{max-width:1400px;margin:auto;padding:125px 5%}h2{font-size:clamp(2rem,4vw,4rem);letter-spacing:-.045em;line-height:1.1;margin:0 0 30px}h3{font-size:1.5rem;margin-top:0}p{line-height:1.8}.intro{display:grid;grid-template-columns:1fr 1fr;gap:45px;margin-bottom:50px}.comparisons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:dense;border:1px solid #c5b7d6;border-radius:20px;overflow:hidden}.comparisons article{padding:25px;border-right:1px solid #c5b7d6;background:#eae1f4;transition:background .5s}.comparisons article:last-child{border:0}.comparisons article:hover{background:#dfcfee}details{padding:20px 0;border-top:1px solid #b29bc9}summary{font-weight:600;cursor:pointer}details p{font-size:.95rem}details a{font-size:.9rem}.direction{background:#332248;color:#f7efff;max-width:none}.direction>p{font-size:.85rem}.inline-art{width:90px;height:50px;object-fit:cover;border-radius:35px;vertical-align:middle}#scenario{max-width:950px;min-height:120px}.stack{max-width:1000px;margin-top:75px}.stack p{padding:32px;background:#523b6a;border-radius:16px;font-size:1.18rem}.lead{font-size:1.1rem;max-width:1050px}.settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}label{display:block;font-size:.9rem}input,textarea{font:inherit;font-size:1rem;width:100%;padding:12px;margin-top:7px;background:white;color:#2b2242;border:1px solid #b29bc9;border-radius:6px}textarea{min-height:90px;resize:vertical}.reference{display:grid;grid-template-columns:150px 1fr 1fr;gap:20px;padding:24px;background:#fff;border:1px solid #c5b7d6;border-radius:16px;margin:20px 0}.reference img{width:100%;height:130px;object-fit:contain;background:#eee}.reference .actions{margin:0}.reference button{padding:10px 14px}.palette{display:flex;gap:12px}#palette{display:flex;flex-wrap:wrap;gap:14px;margin:28px 0}.swatch{border:1px solid #a994bf;border-radius:10px;overflow:hidden;min-width:120px;background:white}.swatch div{height:65px}.swatch span{display:block;padding:12px;font-size:.85rem}canvas{display:block;width:100%;height:auto;background:#ece5f4;border-radius:16px;border:1px solid #c5b7d6}#status{font-weight:600;min-height:30px}.restore{border:1px solid #c5b7d6;border-radius:16px;padding:25px;margin-top:30px}.closing{background:#e4d7ef;max-width:none}.closing p,.closing details{max-width:1000px}footer{background:#332248;color:#f7efff;padding:50px 5%}:focus-visible{outline:3px solid #b36116;outline-offset:3px}@media(min-width:1100px){.comparisons{display:flex}.comparisons article{flex:1;min-width:0;transition:flex .5s,background .5s}.comparisons article:has(details:hover){flex:2}}@media(max-width:850px){.comparisons{grid-template-columns:repeat(2,minmax(0,1fr))}.comparisons article{border-bottom:1px solid #c5b7d6}.intro{grid-template-columns:1fr;gap:10px}.settings{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){nav{font-size:.8rem;padding:17px}header{grid-template-columns:1fr;padding-top:65px}h1{font-size:2.8rem}header img{max-height:260px;object-fit:cover;transform:none}section{padding:85px 6%}.comparisons,.settings,.reference{grid-template-columns:1fr}.comparisons article{border-right:0}.reference img{height:190px}h2{font-size:2.2rem}.stack p{padding:24px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
