.playful-sticky-board,.playful-page-peel{--playful-blue:#087aa3;--playful-ink:#15364a;--playful-line:#9bd7e8;box-sizing:border-box;color:var(--playful-ink)}.playful-sticky-board *,.playful-page-peel *{box-sizing:border-box}.playful-sticky-board{contain:layout paint;background:#f7fcfe;border:1px solid #bce3ee;border-radius:22px;width:min(100%,560px);margin:24px auto;padding:18px;overflow:hidden;box-shadow:0 12px 30px #174c6212}.playful-sticky-stage{isolation:isolate;width:100%;min-height:154px;font:inherit;cursor:pointer;background:0 0;border:0;padding:0;display:block;position:relative}.playful-sticky-lines{pointer-events:none;width:100%;height:126px;position:absolute;inset:13px 0 auto;overflow:visible}.playful-sticky-lines path{fill:none;stroke:var(--playful-blue);stroke-width:3px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px;opacity:0;transition:stroke-dashoffset .52s .14s,opacity .12s .14s}.playful-sticky-note{width:90px;min-height:78px;transform:translate(var(--playful-x), var(--playful-y)) rotate(var(--playful-angle));transform-origin:50% 16%;z-index:1;background:#fff;border:1px solid #9fd4e3;border-radius:4px 4px 12px;place-content:center;padding:12px 8px;transition:transform .62s cubic-bezier(.2,.82,.22,1);display:grid;position:absolute;top:48px;left:calc(50% - 45px);box-shadow:0 8px 18px #174c6218}.playful-sticky-note:first-of-type{--playful-slot:-116px}.playful-sticky-note:nth-of-type(2){--playful-slot:0px;transition-delay:80ms}.playful-sticky-note:nth-of-type(3){--playful-slot:116px;transition-delay:.16s}.playful-sticky-note:before{content:"";background:#d9f2f8cc;width:30px;height:12px;position:absolute;top:-7px;left:50%;transform:translate(-50%)rotate(-2deg)}.playful-sticky-note b{letter-spacing:.06em;font-size:17px}.playful-sticky-note i{background:#bce7f1;border-radius:9px;width:34px;height:3px;margin:8px auto 0;display:block}.playful-sticky-board.is-arranged .playful-sticky-note{transform:translate(var(--playful-slot), 0) rotate(0)}.playful-sticky-board.is-arranged .playful-sticky-lines path{stroke-dashoffset:0;opacity:1}.playful-sticky-action,.playful-peel-close{border:1px solid var(--playful-blue);background:var(--playful-blue);color:#fff;min-height:44px;font:inherit;cursor:pointer;border-radius:999px;font-weight:800}.playful-sticky-action{width:min(100%,290px);margin:5px auto 0;padding:10px 18px;display:block}.playful-sticky-action:hover,.playful-peel-close:hover{background:#056587}:is(.playful-sticky-action:focus-visible,.playful-peel-handle:focus-visible,.playful-peel-close:focus-visible){outline-offset:3px;outline:3px solid #f2c94c}.playful-panel-status{color:#42677a;text-align:center;margin:9px 0 0;font-size:13px;line-height:1.6}.playful-page-peel{width:min(100%,560px);height:var(--playful-peel-height,72px);contain:layout paint;background:#eaf8fc;border-radius:20px 0 20px 20px;margin:24px auto;transition:height .42s cubic-bezier(.2,.75,.2,1);position:relative;overflow:hidden}.playful-peel-reveal{border-radius:inherit;height:100%;min-height:178px;opacity:clamp(0, var(--playful-peel), 1);transform:translateX(calc(28px - var(--playful-peel-distance)));background:#f7fdff;border:1px solid #b7e1ed;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:14px;padding:18px 72px 18px 18px;transition:transform .42s cubic-bezier(.2,.75,.2,1),opacity .26s;display:grid}.playful-peel-reveal img{object-fit:contain;width:96px;height:124px;display:block}.playful-peel-reveal p{overflow-wrap:anywhere;min-width:0;margin:0;font-size:15px;font-weight:700;line-height:1.75}.playful-peel-close{white-space:nowrap;word-break:keep-all;grid-column:2;justify-self:start;min-width:104px;padding:8px 22px;font-size:16px;line-height:1.5}.playful-greeting-chunk{white-space:nowrap;display:inline-block}.profile-current>.playful-page-peel{grid-column:1/-1}.profile-current .playful-page-peel .playful-peel-reveal p{margin:0}.playful-peel-handle{color:#fff;cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none;z-index:2;width:64px;height:64px;transform:scale(var(--playful-peel-scale));transform-origin:100% 0;background:linear-gradient(225deg,#fff 0 47%,#9bdbe9 48% 51%,#1684a7 52% 100%);border:0;border-radius:0 0 0 18px;padding:0;transition:transform .42s cubic-bezier(.2,.75,.2,1);position:absolute;top:0;right:0}.playful-page-peel.is-dragging .playful-peel-handle{cursor:grabbing}.playful-peel-handle span{text-align:center;width:48px;font-size:11px;font-weight:800;line-height:1;position:absolute;bottom:7px;right:4px;transform:rotate(-44deg)}.playful-page-peel:not(.is-open):not(.is-dragging) .playful-peel-reveal{visibility:hidden}.playful-sticky-board.is-motionless,.playful-sticky-board.is-motionless *,.playful-page-peel.is-motionless,.playful-page-peel.is-motionless *,html[data-farout-motion=off] :is(.playful-sticky-board,.playful-page-peel),html[data-farout-motion=off] :is(.playful-sticky-board,.playful-page-peel) *{transition:none!important;animation:none!important}@media (max-width:600px){.playful-sticky-board{padding:14px 10px}.playful-sticky-stage{min-height:143px}.playful-sticky-note{width:74px;min-height:70px;left:calc(50% - 37px)}.playful-sticky-note:first-of-type{--playful-slot:-76px}.playful-sticky-note:nth-of-type(3){--playful-slot:76px}.playful-sticky-lines{transform:scaleX(.68)}}@media (max-width:700px){.playful-peel-reveal{grid-template-columns:minmax(0,1fr);justify-items:center;gap:10px;min-height:190px;padding:14px 18px 12px}.playful-peel-reveal img{width:62px;height:76px}.playful-peel-reveal p{text-align:center;font-size:14px;line-height:1.65}.playful-peel-close{grid-column:1/-1;justify-self:center}.playful-peel-handle{width:64px;height:64px}}@media (prefers-reduced-motion:reduce){.playful-sticky-board,.playful-page-peel,.playful-sticky-board *,.playful-page-peel *{transition:none!important;animation:none!important}}
