@import url('./tokens.css');
*{box-sizing:border-box}body{margin:0;background:#f5f1e9;color:#292d29;font:16px/1.55 system-ui,-apple-system,sans-serif}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.4}header,footer{display:flex;align-items:center;justify-content:space-between;padding:26px 5vw}.wordmark{font-size:25px;letter-spacing:-1.2px;color:inherit;text-decoration:none;font-weight:650}.wordmark span{color:#b95e40;margin-left:8px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:650;color:#6e746c}.quiet{border:0;background:none;color:#505b4f;font-size:12px;padding:10px;text-decoration:underline;text-underline-offset:4px}main{max-width:1320px;margin:auto;padding:24px 5vw 0;display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:30px 48px}.intro{grid-column:1/-1;padding:0 0 4px}h1{font:56px/1.06 Georgia,serif;letter-spacing:-1.8px;margin:14px 0 20px}h2{font:28px/1.14 Georgia,serif;letter-spacing:-.5px;margin:14px 0}.intro>p:last-child,aside>p{font-size:14px;color:#6f766d}.canvas-panel{border:1px solid #dfddd1;border-radius:8px;height:430px;background:#e9e9df;position:relative;overflow:hidden}.canvas-top,.canvas-bottom{position:absolute;left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;z-index:1;font-size:10px;letter-spacing:1px;color:#646d5f}.canvas-top{top:20px}.canvas-bottom{bottom:20px;letter-spacing:0;gap:10px;font-size:11px}#badge{border:1px solid #b4bcae;padding:5px 9px;border-radius:20px;font-size:9px}canvas{width:100%;height:100%;display:block}.palette{display:flex;gap:7px}.palette button{border:2px solid #e9e9df;border-radius:50%;width:22px;height:22px}.palette [aria-pressed=true]{outline:1px solid #5d6758}.palette [data-colour=terra]{background:#b96b51}.palette [data-colour=sage]{background:#6a846d}.palette [data-colour=blue]{background:#587e91}aside{padding-top:7px}aside>button{width:100%;padding:13px 15px;border-radius:4px;background:#344837;color:#fff;border:1px solid #344837;text-align:left;font-size:12px}aside>button span{float:right}.caption{font-size:10px!important;color:#7e857b!important}.divider{border-top:1px solid #dbded3;margin:23px 0}.consent{display:flex;align-items:start;gap:8px;font-size:11px;color:#626b5d}.consent input{margin-top:4px;accent-color:#344837}.consent a,.privacy a{color:inherit;text-underline-offset:3px}.key-label{display:block;margin-top:14px;font-size:10px}#key{border:1px solid #d2d6cb;padding:10px;width:100%;background:transparent;border-radius:4px;font-size:11px;margin:5px 0 10px}.secondary{background:transparent;color:#344837}aside>.quiet{background:transparent;color:#5b6856;border:0;text-align:center;padding:10px}#status{font-size:11px;min-height:35px}.privacy{grid-column:1/-1;padding:32px 0 20px;border-top:1px solid #dddccf;max-width:920px;margin-top:15px}.privacy h2{font-size:24px}.privacy p{font-size:12px;line-height:1.8;color:#6b7366}footer{font-size:10px;color:#7f8778;border-top:1px solid #dddccf}footer span:last-child{letter-spacing:1px}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #b75d36;outline-offset:4px}@media(max-width:800px){header>.eyebrow{display:none}main{grid-template-columns:1fr;gap:20px}h1{font-size:46px}.canvas-panel{height:360px}aside{max-width:440px}.intro{grid-column:auto}.privacy{grid-column:auto}footer span:last-child{display:none}}@media(prefers-reduced-motion:reduce){.caption::after{content:''}}

.download{display:block;font-size:12px;color:#344837;padding:8px 0}.download[hidden]{display:none}
