.penpal-sheet,.penpal-banner,.penpal-overlay{box-sizing:border-box;--pp-s1: #edf1f6;--pp-s2: #dfe5ed;--pp-c1: #f0f4f8;--pp-c2: #dce3ec;--pp-inset: #e0e5ec;--pp-text: #3d4a5a;--pp-muted: #5a677a;--pp-sh: #bec3c9;--pp-hi: #ffffff;--pp-bd: #3d4a5a26;--pp-sheen: #ffffff80;--pp-green: #126b37;--pp-amber: #78620c;--pp-scrim: #17202e66}body.dark-mode .penpal-sheet,body.dark-mode .penpal-banner,body.dark-mode .penpal-overlay{--pp-s1: #2c313b;--pp-s2: #22262f;--pp-c1: #303641;--pp-c2: #272c35;--pp-inset: #242932;--pp-text: #f0f3f7;--pp-muted: #bbc3cf;--pp-sh: #1a1e26;--pp-hi: #3b424e;--pp-bd: #ffffff0d;--pp-sheen: #ffffff12;--pp-green: #64f696;--pp-amber: #ead889;--pp-scrim: #00000080}.penpal-sheet{box-sizing:border-box;width:min(calc(100vw - 32px),26rem);max-height:calc(100dvh - 32px);margin:auto;padding:22px 22px 26px;overflow-y:auto;overscroll-behavior:contain;border:1px solid var(--pp-bd);border-radius:28px;background:radial-gradient(ellipse at 50% 0%,#64f69614,transparent 60%),linear-gradient(135deg,var(--pp-s1),var(--pp-s2));color:var(--pp-text);box-shadow:0 24px 60px #17202e40,12px 12px 28px var(--pp-sh),inset 1px 1px 0 var(--pp-sheen);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;text-align:center}.penpal-sheet[open]{display:flex;flex-direction:column;align-items:center;gap:20px;animation:popup-card-enter .18s ease-out}.penpal-sheet::backdrop{background:var(--popup-backdrop, #17202e66);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.penpal-sheet *,.penpal-banner *,.penpal-overlay *{box-sizing:border-box}.penpal-sheet svg{fill:none;stroke:currentcolor;stroke-linecap:round;stroke-linejoin:round}.penpal-sheet .penpal-sheet-close{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border:1px solid var(--pp-bd);border-radius:14px;background:linear-gradient(145deg,var(--pp-c1),var(--pp-c2));color:var(--pp-muted);box-shadow:3px 3px 8px var(--pp-sh),-2px -2px 6px var(--pp-hi);cursor:pointer}.penpal-sheet .penpal-sheet-close svg{width:16px;height:16px;stroke-width:2}.penpal-eyebrow{display:flex;justify-content:center;align-items:center;gap:8px;margin:0;padding:0 48px;color:var(--pp-green);font-size:.66rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}.penpal-eyebrow span{font-size:1rem;text-shadow:0 0 16px #64f696a6}.penpal-beacon{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;height:96px}.penpal-waves{width:40px;height:60px;overflow:visible}.penpal-waves.r{transform:scaleX(-1)}.penpal-waves path{stroke:var(--pp-green);stroke-width:2.4;opacity:.55}.penpal-mail{display:grid;place-items:center;width:64px;height:64px;border-radius:16px;background:#64f696;color:#11291b;box-shadow:0 0 30px #64f69659,6px 6px 14px var(--pp-sh),inset 0 1px 1px #ffffff80}.penpal-mail svg{width:32px;height:32px;stroke-width:1.7}.penpal-beacon:after{content:"";position:absolute;left:50%;top:50%;box-sizing:border-box;width:92px;height:92px;margin:-46px 0 0 -46px;border:3px solid var(--pp-green);border-radius:50%;box-shadow:0 0 22px #64f69666;opacity:0;transform:scale(.8);transition:opacity .24s ease-out,transform .24s ease-out}.penpal-sheet[data-state=success] .penpal-beacon:after,.penpal-beacon.is-on:after{opacity:1;transform:none}.penpal-sheet[data-state=success] .penpal-waves,.penpal-beacon.is-on .penpal-waves{opacity:0;transition:opacity .2s ease-out}.penpal-mail .penpal-done{display:none;stroke-width:2.2}.penpal-sheet[data-state=success] .penpal-mail svg:not(.penpal-done){display:none}.penpal-sheet[data-state=success] .penpal-mail .penpal-done{display:block;width:30px;height:30px}@media (prefers-reduced-motion: no-preference){.penpal-sheet[data-state=alerts] .penpal-mail{animation:penpal-buzz 2.6s ease-in-out infinite}.penpal-sheet[data-state=alerts] .penpal-waves path{opacity:0;animation:penpal-wave 2.6s ease-out infinite}.penpal-sheet[data-state=alerts] .penpal-waves .w2{animation-delay:.22s}.penpal-sheet[data-state=alerts] .penpal-waves .w3{animation-delay:.44s}}@media (prefers-reduced-motion: reduce){.penpal-sheet[open]{animation:none}.penpal-beacon:after,.penpal-waves{transition:none}}@keyframes penpal-buzz{0%,20%,to{transform:none}4%{transform:rotate(-7deg)}8%{transform:rotate(6deg)}12%{transform:rotate(-4deg)}16%{transform:rotate(2deg)}}@keyframes penpal-wave{0%{opacity:0;transform:translate(4px)}12%{opacity:.95}55%,to{opacity:0;transform:translate(-6px)}}.penpal-sheet-copy{display:flex;flex-direction:column;align-items:center;gap:12px}.penpal-sheet h2{margin:0;color:var(--pp-text);font-size:1.5rem;line-height:1.15;letter-spacing:-.03em;font-weight:700}.penpal-sheet h2:focus{outline:none}.penpal-sheet-copy p{margin:0;color:var(--pp-muted);font-size:.875rem;line-height:1.6}.penpal-sheet-copy p.penpal-warning{padding:12px 14px;border:1px solid color-mix(in srgb,var(--pp-amber) 45%,transparent);border-radius:16px;background:var(--pp-inset);color:var(--pp-text);text-align:left}.penpal-facts,.penpal-steps{display:flex;flex-direction:column;gap:8px;width:100%;margin:0;padding:12px 14px;border-radius:16px;background:var(--pp-inset);box-shadow:inset 3px 3px 8px var(--pp-sh),inset -2px -2px 6px var(--pp-hi);list-style:none;text-align:left}.penpal-facts li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;align-items:start;font-size:.8rem;line-height:1.45}.penpal-facts svg{width:16px;height:16px;margin-top:1px;stroke:var(--pp-green);stroke-width:2}.penpal-steps{gap:12px;padding:14px}.penpal-steps li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;align-items:start;font-size:.875rem;line-height:1.5}.penpal-step-num{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:#64f696;color:#11291b;font-size:.8rem;font-weight:800}.penpal-inline-icon svg{width:18px;height:18px;vertical-align:-4px;stroke:#0a84ff;stroke-width:1.8}.penpal-share-art{display:flex;align-items:center;gap:14px;height:80px;color:var(--pp-muted);font-size:1.4rem}.penpal-share-icon{display:grid;place-items:center;width:60px;height:60px;border-radius:16px;background:linear-gradient(145deg,var(--pp-c1),var(--pp-c2));box-shadow:4px 4px 10px var(--pp-sh),-3px -3px 9px var(--pp-hi)}.penpal-share-icon svg{width:30px;height:30px;stroke:#0a84ff;stroke-width:1.8}.penpal-code-box{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label label" "code copy" "note note";align-items:center;gap:6px 12px;width:100%;box-sizing:border-box;padding:14px 14px 12px;border:1px solid #64f69659;border-radius:16px;background:#64f6960f;text-align:left}.penpal-code-label{grid-area:label;color:var(--pp-muted);font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.penpal-code-box .penpal-claim{grid-area:code;justify-self:start;padding:6px 12px;font-size:1.5rem;letter-spacing:.12em}.penpal-code-note{grid-area:note;color:var(--pp-muted);font-size:.8rem}.penpal-sheet .penpal-copy{grid-area:copy;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:112px;min-height:44px;padding:0 14px;border:1px solid #64f69680;border-radius:12px;background:transparent;color:var(--pp-green);font:inherit;font-size:.9rem;font-weight:700;cursor:pointer;transition:background-color .16s ease-out,color .16s ease-out}.penpal-sheet .penpal-copy svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7}.penpal-sheet .penpal-copy.is-copied{background:#64f696;color:#11291b}.penpal-sheet .penpal-copy:focus-visible{outline:2px solid var(--pp-green);outline-offset:2px}.penpal-steps-skip,.penpal-steps-hint{width:100%;margin:0;color:var(--pp-muted);font-size:.8rem;line-height:1.45;text-align:left}.penpal-steps-hint .penpal-inline-icon svg{width:16px;height:16px;vertical-align:-3px}.penpal-claim{display:inline-block;padding:2px 8px;border-radius:8px;background:#64f696;color:#11291b;font-family:ui-monospace,Menlo,monospace;font-size:1.05rem;letter-spacing:.08em;white-space:nowrap}.penpal-sheet-actions{display:flex;flex-direction:column;align-items:stretch;gap:10px;width:100%}.penpal-sheet button.penpal-primary,.penpal-banner button.penpal-primary,.penpal-overlay .penpal-primary,.penpal-sheet .penpal-primary{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:48px;margin:0;padding:14px 18px;border:1px solid #adffc14d;border-radius:14px;background:linear-gradient(135deg,#82ffaf,#53db83);color:#11291b;font:inherit;font-size:.82rem;font-weight:700;text-decoration:none;box-shadow:0 0 26px #64f69626,4px 4px 10px var(--pp-sh),inset 0 1px 1px #fff6;cursor:pointer}.penpal-sheet button.penpal-primary:disabled{cursor:progress;opacity:.85}.penpal-sheet button.penpal-primary svg{width:16px;height:16px;stroke-width:2}.penpal-sheet button.penpal-secondary,.penpal-banner button.penpal-secondary,.penpal-overlay button.penpal-secondary{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:48px;margin:0;padding:14px 18px;border:1px solid var(--pp-bd);border-radius:14px;background:linear-gradient(145deg,var(--pp-c1),var(--pp-c2));color:var(--pp-text);font:inherit;font-size:.82rem;font-weight:600;box-shadow:4px 4px 10px var(--pp-sh),-3px -3px 9px var(--pp-hi);cursor:pointer}.penpal-quiet{min-height:44px;margin:0;padding:0 8px;border:0;background:transparent;box-shadow:none;color:var(--pp-muted, var(--landing-muted, inherit));font:inherit;font-size:.8rem;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.penpal-sheet button.penpal-quiet{min-height:44px;border:0;background:transparent;box-shadow:none;color:var(--pp-muted);font-size:.8rem;font-weight:600}.penpal-sheet-status{min-height:1.2em;margin:-6px 0 0;color:var(--pp-muted);font-size:.8rem}.penpal-sheet-status:empty{display:none}.penpal-sheet :focus-visible,.penpal-banner :focus-visible,.penpal-overlay :focus-visible{outline:2px solid var(--pp-green);outline-offset:3px}.penpal-banner{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 12px;width:100%;margin:0 auto 8px;padding:8px 12px;border:1px solid var(--pp-bd);border-radius:16px;background:linear-gradient(145deg,var(--pp-c1),var(--pp-c2));color:var(--pp-text);box-shadow:3px 3px 8px var(--pp-sh),-2px -2px 6px var(--pp-hi);font-size:.85rem;line-height:1.4;text-align:center}.penpal-banner[hidden]{display:none}.penpal-turn-chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;background:var(--pp-inset);color:var(--pp-muted);font-weight:700;box-shadow:inset 2px 2px 5px var(--pp-sh),inset -1px -1px 4px var(--pp-hi)}.penpal-turn-chip.is-turn{background:#64f696;color:#11291b;box-shadow:0 0 14px #64f69640}.penpal-banner .penpal-note{color:var(--pp-muted);font-size:.78rem}.penpal-banner .penpal-note.is-warning{color:var(--pp-amber);font-weight:600}.penpal-banner button.penpal-primary,.penpal-banner button.penpal-secondary{width:auto;min-height:44px;padding:10px 14px}.penpal-banner .penpal-dismiss{display:grid;place-items:center;width:44px;height:44px;min-height:44px;margin:0;padding:0;border:0;border-radius:12px;background:transparent;box-shadow:none;color:var(--pp-muted);font:inherit;font-size:1.2rem;cursor:pointer}#keyboard{position:relative}#penpalKeyboardNote{display:none}body.penpal-not-your-turn #keyboard>:not(#penpalKeyboardNote){visibility:hidden}body.penpal-not-your-turn #penpalKeyboardNote{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:12px;border-radius:16px;background:var(--pp-inset);color:var(--pp-text);box-shadow:inset 3px 3px 8px var(--pp-sh),inset -2px -2px 6px var(--pp-hi);text-align:center}#penpalKeyboardNote strong{font-size:1.2rem}#penpalKeyboardNote span{color:var(--pp-muted);font-size:.82rem}.penpal-overlay{position:fixed;inset:0;z-index:var(--z-modal-backdrop, 60);display:grid;place-items:center;padding:16px;background:var(--pp-scrim)}.penpal-overlay[hidden]{display:none}.penpal-overlay-card{display:flex;flex-direction:column;align-items:center;gap:14px;width:min(100%,24rem);padding:24px 22px;border:1px solid var(--pp-bd);border-radius:24px;background:linear-gradient(135deg,var(--pp-s1),var(--pp-s2));color:var(--pp-text);box-shadow:0 24px 60px #17202e40;text-align:center}.penpal-overlay-card h2{margin:0;font-size:1.3rem}.penpal-overlay-card p{margin:0;color:var(--pp-muted);font-size:.9rem;line-height:1.55}.penpal-banners{position:fixed;left:50%;top:max(8px,env(safe-area-inset-top));z-index:var(--z-modal-backdrop, 60);display:flex;flex-direction:column;gap:8px;width:min(calc(100vw - 24px),34rem);transform:translate(-50%);pointer-events:none}.penpal-banners .penpal-banner{margin:0;pointer-events:auto}body.penpal-not-your-turn #submitGuess{opacity:.5}.penpal-note-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-top:6px}.penpal-note-actions:empty{display:none}.penpal-note-alerts{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 8px}#penpalKeyboardNote button.penpal-primary{width:auto;min-height:44px;padding:10px 14px}#penpalKeyboardNote .penpal-note{color:var(--pp-amber);font-size:.78rem;font-weight:600}body.penpal-not-your-turn #penpalKeyboardNote{overflow-y:auto;gap:2px;padding:8px 12px}body.penpal-not-your-turn #penpalKeyboardNote strong{font-size:1.05rem}body.penpal-not-your-turn #penpalKeyboardNote>span{font-size:.78rem;line-height:1.35}#penpalKeyboardNote .penpal-note-alerts .penpal-note{font-size:.74rem;line-height:1.35}body.penpal-frozen #board,body.penpal-frozen #stampContainer,body.penpal-frozen #hintTooltip,body.penpal-frozen #inputArea,body.penpal-frozen #keyboard>:not(#penpalRoundResult){visibility:hidden}.penpal-frozen-board{position:absolute;display:grid;margin:0;pointer-events:none}.penpal-frozen-board .tile{width:var(--frozen-tile-width, var(--tile-size));height:var(--frozen-tile-height, var(--tile-size));min-width:0;min-height:0;font-size:var(--frozen-tile-font, var(--tile-font))}.penpal-frozen-stamps{position:absolute;top:0;height:100%;pointer-events:none;z-index:var(--z-panel-interactive)}body.penpal-frozen #keyboard>#penpalRoundResult{visibility:visible}#penpalRoundResult{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;flex-wrap:nowrap;align-items:center;justify-content:center;gap:4px;margin:0;padding:8px 12px;overflow-y:auto;border-radius:16px;background:var(--pp-inset);color:var(--pp-text);box-shadow:inset 3px 3px 8px var(--pp-sh),inset -2px -2px 6px var(--pp-hi);text-align:center}#penpalRoundResult strong{font-size:1.2rem}#penpalRoundResult .penpal-round-definition{display:-webkit-box;max-width:34rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;color:var(--pp-muted);font-size:.82rem;line-height:1.35}#penpalRoundResult .penpal-round-next{color:var(--pp-muted);font-size:.78rem}#penpalRoundResult button.penpal-primary{justify-content:center;min-width:10rem;margin-top:6px}
