.nudge-container { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1.5rem; }
/* Stained-paper texture as background, softened by a translucent cream
   layer on top so the stains don't fight the handwritten text for
   attention. Layer order (top → bottom): cream wash, texture image,
   cream fallback color. The wash uses the same warm tone as the base
   so the paper keeps its temperature instead of cooling toward white. */
.nudge-postit {
  position: relative;
  width: 300px;
  min-height: 180px;
  padding: 2.5rem 2rem;
  background:
    linear-gradient(rgba(245, 240, 232, 0.35), rgba(245, 240, 232, 0.35)),
    url('../assets/images/design-space-stained-paper-textured-background.png') center / cover no-repeat,
    #f5f0e8;
  color: #333;
  font-family: var(--font-display);
  font-size: 0.95rem;
  line-height: 1.6;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform var(--transition-base), box-shadow var(--transition-base);
  transform: rotate(-1.5deg);
  box-shadow: 2px 3px 12px rgba(0,0,0,0.4), inset 0 0 40px rgba(139,0,0,0.03);
}
.nudge-postit::before { content: ''; position: absolute; top: -8px; left: 50%; transform: translateX(-50%); width: 60px; height: 16px; background: rgba(139, 0, 0, 0.3); border-radius: 1px; }
.nudge-postit:hover { transform: rotate(0deg) scale(1.02); box-shadow: 4px 6px 20px rgba(0,0,0,0.5), 0 0 30px var(--color-red-glow); }
.nudge-postit .tap-text { font-family: var(--font-body); font-size: 0.8rem; color: #999; font-weight: 300; }
.nudge-postit .nudge-content { display: none; }
.nudge-postit.revealed .tap-text { display: none; }
.nudge-postit.revealed .nudge-content { display: block; }
.nudge-actions { display: flex; gap: 0.75rem; opacity: 0; transition: opacity var(--transition-base); }
.nudge-postit.revealed ~ .nudge-actions { opacity: 1; }
.nudge-btn { font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.45rem 0.9rem; border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-text-muted); cursor: pointer; border-radius: 3px; transition: all var(--transition-fast); }
.nudge-btn:hover { border-color: var(--color-red); color: var(--color-text); box-shadow: 0 0 10px var(--color-red-glow); }
.nudge-stamp-img { position: absolute; bottom: 8px; right: 10px; width: 20px; height: 20px; opacity: 0.35; }
