.postit-board{max-width:500px;margin:0 auto;padding:28px 22px;background:#f3ecdf;border:1px solid #e7dbc8;border-radius:22px;background-image:radial-gradient(#cbbd9f65 .8px,transparent .8px);background-size:10px 10px;color:#44331e}
.postit-heading{text-align:center;margin-bottom:22px}.postit-kicker{font-size:9px;letter-spacing:.13em;color:#a1845f}.postit-heading h3{font-size:27px;line-height:1.6;margin:10px 0 5px}.postit-heading h3 span{color:#c48c47}.postit-heading p{font-size:12px;color:#917a5b;margin:0}
.postit-form,.postit-invite{padding:23px 22px 19px;background:#fff1ab;position:relative;box-shadow:2px 7px 12px #60431515;transform:rotate(-1deg);margin:0 6px 25px}
.postit-form:before,.postit-invite:before,.postit-note:before{content:'';position:absolute;top:-8px;left:calc(50% - 28px);width:56px;height:17px;background:#fffdf58f;box-shadow:0 1px 1px #7763420c;transform:rotate(-3deg)}
[data-color="yellow"]{--note:#fff1ab}[data-color="pink"]{--note:#f9d9df}[data-color="blue"]{--note:#d7ebf3}[data-color="green"]{--note:#e1edc9}
.postit-form[data-color],.postit-note[data-color]{background:var(--note)}
.postit-form label[for]{font-size:14px;font-weight:700}.postit-form textarea{display:block;width:100%;border:0;border-bottom:1px solid #8e754a40;border-radius:0;padding:12px 0 10px;min-height:90px;background:transparent;resize:vertical;font-family:inherit;font-size:16px;line-height:1.8;color:#44331e;box-shadow:none}.postit-form textarea::placeholder{color:#987e53}
.postit-form textarea:focus-visible{outline:2px solid #99703d;outline-offset:3px}.postit-emoji{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0}.postit-emoji button{border:0;background:#ffffff55;border-radius:8px;width:33px;height:33px;font-size:20px;cursor:pointer;transition:transform .15s}.postit-emoji button:hover{transform:translateY(-3px);background:#ffffffa0}
.postit-form-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px}.postit-colors{display:flex;gap:7px;padding:0;border:0;margin:0;align-items:center}.postit-colors legend{float:none;width:auto;font-size:10px;margin-bottom:5px}.postit-color{position:relative;display:inline-flex!important;margin:0!important;cursor:pointer}.postit-color input{position:absolute;opacity:0;width:24px;height:24px;margin:0}.postit-color span{width:24px;height:24px;border-radius:50%;background:var(--note);border:1px solid #89735166}.postit-color input:checked+span{outline:2px solid #685035;outline-offset:2px}.postit-color input:focus-visible+span{outline:3px solid #be7132;outline-offset:3px}
#postit-count{font-size:10px;color:#8c7553}#postit-hint{font-size:10px;line-height:1.8;color:#806a4d;margin:12px 0}
.postit-submit{border:0;border-radius:9px;padding:11px 16px;background:#594328;color:#fff9e8;font:inherit;font-size:13px;cursor:pointer}.postit-submit:hover{background:#755330}.postit-submit:focus-visible,.postit-paging button:focus-visible{outline:3px solid #b67539;outline-offset:4px}
.postit-invite{text-align:center;padding-top:25px}.postit-invite>span{font-size:32px}.postit-invite p{font-size:15px;line-height:1.8;margin:8px 0 16px}.postit-invite small{display:block;font-size:10px;color:#94784d;margin-top:13px}
.postit-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 13px;padding-top:7px}.postit-note{position:relative;min-width:0;padding:24px 15px 14px;min-height:150px;box-shadow:2px 5px 10px #60431513;transform:rotate(1.4deg);border-radius:1px 1px 12px 1px;display:flex;flex-direction:column}.postit-note:nth-child(2n){transform:rotate(-1.7deg)}.postit-note p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:16px;line-height:1.8;margin:0 0 16px;flex:1}.postit-note footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:5px;font-size:9px;color:#79664a}.postit-note footer span{overflow-wrap:anywhere}.postit-remove{position:absolute;right:3px;top:2px;border:0;background:transparent;color:#6f583b;width:28px;height:28px;font-size:21px;cursor:pointer}.postit-remove:hover{background:#ffffff70;border-radius:50%}
.postit-paging{display:flex;justify-content:space-between;gap:12px;margin-top:23px}.postit-paging button{background:transparent;border:0;padding:5px 0;font-size:11px;color:#836a49;cursor:pointer}.postit-empty{grid-column:1/-1;text-align:center;padding:18px 8px;color:#a08763}.postit-empty>span{font-size:28px}.postit-empty p{font-size:12px;line-height:1.9;margin:10px 0 0}#postit-status:not(:empty){padding:10px 12px;margin-bottom:20px;font-size:12px;line-height:1.8;background:#fffaf0;border-radius:9px;color:#795331}
@media(max-width:1000px) and (min-width:721px){.feature-story{gap:35px;padding-left:6%;padding-right:6%}.postit-board{padding:25px 14px}.postit-heading h3{font-size:24px}}
@media(max-width:720px){.postit-board{padding:24px 15px}.postit-heading h3{font-size:25px}.postit-form,.postit-invite{margin-left:2px;margin-right:2px;padding:23px 16px 18px}.postit-grid{gap:17px 10px}.postit-note{padding:24px 12px 12px}.postit-note p{font-size:14px}.postit-heading p{font-size:11px}}
@media(prefers-reduced-motion:reduce){.postit-emoji button{transition:none}.postit-emoji button:hover{transform:none}}
.postit-note footer{background:transparent;padding:0;margin:0;border:0;border-radius:0;min-height:0;box-shadow:none}
.postit-sticker-label{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;margin:17px 0 10px}.postit-sticker-label small{font-size:9px;color:#806a4d}.postit-sticker-picker{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.postit-sticker-picker button{display:grid;place-items:center;aspect-ratio:1;border:1px solid transparent;border-radius:12px;background:#ffffff55;padding:4px;transition:transform .18s,background .18s;cursor:pointer;position:relative}.postit-sticker-picker button:hover{transform:translateY(-3px);background:#fff9e8}.postit-sticker-picker button[aria-pressed=true]{border:2px solid #816435;background:#fffaf0;box-shadow:0 2px 7px #8a693a22}.postit-sticker-picker button[aria-pressed=true]:after{content:'✓';position:absolute;right:-3px;top:-5px;border-radius:50%;background:#5b7040;color:white;width:15px;height:15px;line-height:15px;font-size:10px}.postit-sticker-picker button:focus-visible{outline:3px solid #8a693a;outline-offset:2px}.note-sticker-image{display:block;width:100%;height:100%;overflow:visible}.postit-selected{font-size:10px;line-height:1.7;color:#806a4d;margin:10px 0 15px;min-height:17px}.postit-note-content{flex:1}.postit-attached-stickers{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:10px 0 18px}.postit-attached-stickers .note-sticker-image{width:65px;height:65px;filter:drop-shadow(0 3px 2px #80633d22)}.postit-attached-stickers .note-sticker-image:nth-child(2){transform:rotate(8deg)}.postit-attached-stickers .note-sticker-image:nth-child(3){transform:rotate(-6deg)}@media(prefers-reduced-motion:reduce){.postit-sticker-picker button{transition:none}}
.community-section.feature-story{display:block;padding:75px 6%;max-width:1350px;margin:0 auto}.community-section .postit-board{max-width:none;padding:38px 35px 32px}.postit-heading{margin-bottom:35px}.postit-heading h3{font-size:36px}.postit-heading p{font-size:14px}.postit-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.85fr);gap:46px;align-items:start}.postit-layout #postit-composer{position:sticky;top:110px}.postit-layout .postit-form,.postit-layout .postit-invite{transform:rotate(1deg);margin-top:7px}.postit-grid{gap:27px 20px}.postit-note{padding:28px 20px 18px;min-height:190px}.postit-note footer{font-size:10px}.postit-reply{border-top:1px dashed #8a78594a;margin-top:17px;padding-top:13px}.postit-reply b{font-size:10px;color:#685439}.postit-reply p{font-size:13px;margin:6px 0 0}.postit-reply button,.postit-reply-form button{background:#ffffff66;border:0;border-radius:6px;padding:6px 9px;color:#57442a;font-size:10px;cursor:pointer;margin-top:8px}.postit-reply-form{border-top:1px dashed #8a78594a;margin-top:14px;padding-top:12px}.postit-reply-form label{font-size:10px;display:block}.postit-reply-form textarea{font:inherit;display:block;width:100%;background:#ffffff50;border:1px solid #8a78594a;resize:vertical;border-radius:6px;margin-top:5px;padding:7px;min-height:55px}.postit-reply-form button:disabled{opacity:.5}@media(max-width:800px){.community-section.feature-story{padding:45px 5%}.community-section .postit-board{padding:28px 20px}.postit-layout{grid-template-columns:1fr;gap:25px}.postit-layout #postit-composer{position:static;grid-row:1}.postit-heading h3{font-size:28px}}@media(max-width:420px){.postit-grid{grid-template-columns:1fr}.postit-heading p{font-size:12px}.postit-note{transform:rotate(.5deg)}}

#how{scroll-margin-top:90px}