/* Pocket Hero: scoped Post-it repair candidate.
   Load LAST, after all existing inline styles. No markup or script changes required.
   CSS paper grows with its content; existing SVG art is not stretched or modified.
   Only tip-note hosts, note content and the blocking reminder are covered. */
:is(#parentStickyHost, #kidStickyHost, #gpStickyHost) {
  box-sizing:border-box!important;
  max-width:calc(100vw - 16px)!important;
  max-height:calc(100vh - var(--ph-note-top) - env(safe-area-inset-bottom, 0px) - 12px)!important;
  max-height:calc(100dvh - var(--ph-note-top) - env(safe-area-inset-bottom, 0px) - 12px)!important;
  top:var(--ph-note-top)!important;
  padding:8px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}
#parentStickyHost { --ph-note-top:calc(104px + env(safe-area-inset-top, 0px)); }
#kidStickyHost { --ph-note-top:calc(108px + env(safe-area-inset-top, 0px)); }
#gpStickyHost { --ph-note-top:calc(92px + env(safe-area-inset-top, 0px)); }
@media(max-width:1050px) {
  #parentStickyHost { --ph-note-top:calc(var(--ph-ios-dead-top, 76px) + 118px); }
}
@media(max-width:800px) {
  #kidStickyHost { --ph-note-top:calc(var(--ph-kid-ios-dead-top, 76px) + 86px); }
}
@media(max-width:760px) {
  #gpStickyHost { --ph-note-top:calc(var(--ph-gp-ios-dead-top, 76px) + 70px); }
}
/* A short landscape viewport needs more room for the note's scrollable content. */
@media(max-height:500px) {
  :is(#parentStickyHost, #kidStickyHost, #gpStickyHost) { --ph-note-top:max(12px, env(safe-area-inset-top, 0px)); }
}

:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) {
  --ph-note-paper:#fff4a6;
  --ph-note-paper-end:#ffe782;
  --ph-note-fold:#f2d667;
  --ph-note-font:ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold","Segoe UI Rounded",system-ui,-apple-system,sans-serif;
  position:relative!important;
  box-sizing:border-box!important;
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  padding:80px 24px 36px!important;
  border:1px solid rgba(62,74,92,.14)!important;
  border-radius:3px 3px 5px 3px!important;
  background:linear-gradient(155deg,var(--ph-note-paper),var(--ph-note-paper-end))!important;
  box-shadow:0 7px 15px rgba(8,31,58,.16)!important;
  filter:none!important;
  overflow:visible!important;
  color:#15385f!important;
  font-family:var(--ph-note-font)!important;
  font-style:normal!important;
  text-align:left!important;
  isolation:isolate;
  transform-origin:12% 0!important;
  transform-style:flat!important;
  backface-visibility:hidden!important;
  will-change:auto!important;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox).note-blue { --ph-note-paper:#e0f5ff;--ph-note-paper-end:#c5e9fc;--ph-note-fold:#a9d7ef; }
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox).note-green { --ph-note-paper:#e7f7d5;--ph-note-paper-end:#d0edb5;--ph-note-fold:#b5d996; }
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox).note-pink { --ph-note-paper:#ffe6ee;--ph-note-paper-end:#ffd2e2;--ph-note-fold:#eeb5ce; }
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox).note-coral { --ph-note-paper:#ffe7dc;--ph-note-paper-end:#ffd0bb;--ph-note-fold:#edb095; }
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) *, :is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox)::before, :is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox)::after {
  box-sizing:border-box!important;
  font-family:var(--ph-note-font)!important;
  font-style:normal!important;
}
/* Tape, close button and mascot occupy their own top strip, above all text. */
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox)::before {
  content:""!important;
  display:block!important;
  position:absolute!important;
  top:10px!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:88px!important;
  height:23px!important;
  border:1px solid rgba(145,119,66,.12)!important;
  border-radius:1px!important;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.12) 0 2px,transparent 2px 4px),rgba(236,215,161,.76)!important;
  box-shadow:0 1px 2px rgba(87,64,20,.08)!important;
  opacity:1!important;
  transform:translateX(-50%) rotate(-3deg)!important;
  pointer-events:none!important;
}
/* Small folded corner. It never consumes the text column or action area. */
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox)::after {
  content:""!important;
  display:block!important;
  position:absolute!important;
  top:auto!important;
  left:auto!important;
  right:0!important;
  bottom:0!important;
  width:24px!important;
  height:24px!important;
  border:0!important;
  border-radius:3px 0 4px 0!important;
  background:linear-gradient(135deg,rgba(255,255,255,.7) 0 48%,var(--ph-note-fold) 51% 100%)!important;
  box-shadow:-1px -1px 2px rgba(72,53,17,.08)!important;
  opacity:1!important;
  transform:none!important;
  animation:none!important;
  pointer-events:none!important;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) :is(.phStickyEyebrow,.kidStickyEyebrow,.phStickyTitle,.kidStickyTitle,.gpStickyTitle,.phStickyBody,.kidStickyBody,.gpStickyBody,.blockingReminderTitle,.blockingReminderNote,.blockingReminderExplain) {
  position:static!important;
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  height:auto!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  text-align:left!important;
  text-overflow:clip!important;
  -webkit-line-clamp:unset!important;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) :is(.phStickyEyebrow,.kidStickyEyebrow) {
  margin-bottom:7px!important;
  color:#32658e!important;
  font-size:11px!important;
  line-height:1.4!important;
  font-weight:800!important;
  letter-spacing:.06em!important;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) :is(.phStickyTitle,.kidStickyTitle,.gpStickyTitle) {
  color:#103767!important;
  font-size:21px!important;
  line-height:1.22!important;
  font-weight:900!important;
  letter-spacing:-.015em!important;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) :is(.phStickyBody,.kidStickyBody,.gpStickyBody,.blockingReminderNote) {
  margin-top:10px!important;
  color:#28476a!important;
  font-size:15px!important;
  line-height:1.5!important;
  font-weight:650!important;
  letter-spacing:normal!important;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) :is(.phStickyActions,.kidStickyActions,.gpStickyActions) {
  display:flex!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:18px 0 0!important;
  padding:0!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) :is(.phStickyActions,.kidStickyActions,.gpStickyActions) button,
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) #blockingReminderButton {
  box-sizing:border-box!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:44px!important;
  height:auto!important;
  padding:10px 12px!important;
  border:1px solid rgba(24,60,104,.14)!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.72)!important;
  color:#15385f!important;
  font-family:var(--ph-note-font)!important;
  font-size:13px!important;
  line-height:1.3!important;
  font-weight:850!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  cursor:pointer;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) :is(.phStickyActions,.kidStickyActions,.gpStickyActions) button.primary,
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) #blockingReminderButton {
  background:#1769d2!important;
  color:#fff!important;
  border-color:transparent!important;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) :is(.phStickyPal,.kidStickyPal,.gpStickyPal) {
  position:absolute!important;
  top:16px!important;
  right:16px!important;
  bottom:auto!important;
  left:auto!important;
  width:52px!important;
  height:52px!important;
  max-width:none!important;
  object-fit:contain!important;
  filter:none!important;
  pointer-events:none!important;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) :is(.phStickyClose,.kidStickyClose,.gpStickyClose) {
  position:absolute!important;
  display:grid!important;
  place-items:center!important;
  left:14px!important;
  top:18px!important;
  right:auto!important;
  bottom:auto!important;
  width:44px!important;
  height:44px!important;
  min-height:44px!important;
  padding:0!important;
  margin:0!important;
  border:1px solid rgba(24,60,104,.13)!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.7)!important;
  color:#15385f!important;
  font-size:25px!important;
  line-height:1!important;
  cursor:pointer;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) button:focus-visible { outline:3px solid #0c4d9d!important;outline-offset:3px!important; }

/* Reminder acknowledgement remains the only way to dismiss the blocking note. */
#blockingReminderOverlay {
  --ph-note-overlay-top:calc(22px + env(safe-area-inset-top, 0px));
  padding:var(--ph-note-overlay-top) 16px calc(22px + env(safe-area-inset-bottom, 0px))!important;
}
#blockingReminderOverlay #blockingReminderBox {
  width:min(480px,100%)!important;
  padding:48px 28px 36px!important;
  max-height:calc(100vh - var(--ph-note-overlay-top) - env(safe-area-inset-bottom, 0px) - 24px)!important;
  max-height:calc(100dvh - var(--ph-note-overlay-top) - env(safe-area-inset-bottom, 0px) - 24px)!important;
  overflow:auto!important;
  overscroll-behavior:contain;
}
#blockingReminderOverlay #blockingReminderBox .blockingReminderIcon { font-size:44px!important;line-height:1.2!important;margin-bottom:8px!important; }
#blockingReminderOverlay #blockingReminderBox .blockingReminderTitle { font-size:26px!important;line-height:1.2!important;color:#103767!important; }
#blockingReminderOverlay #blockingReminderBox :is(.blockingReminderTitle,.blockingReminderNote,.blockingReminderExplain) { text-align:center!important; }
#blockingReminderOverlay #blockingReminderBox #blockingReminderButton { width:100%!important;margin:20px 0 0!important;font-size:16px!important; }
#blockingReminderOverlay #blockingReminderBox .blockingReminderExplain { color:#385675!important;font-size:13px!important;line-height:1.45!important;margin-top:12px!important; }
@media(max-width:800px) {
  #blockingReminderOverlay { --ph-note-overlay-top:var(--ph-kid-ios-dead-top, 76px); }
}
@media(max-width:374px) {
  :is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) { padding-left:18px!important;padding-right:18px!important; }
  :is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox) :is(.phStickyTitle,.kidStickyTitle,.gpStickyTitle) { font-size:20px!important; }
}
@media(max-height:500px) {
  #blockingReminderOverlay { --ph-note-overlay-top:max(12px, env(safe-area-inset-top, 0px)); }
}

/* Finish before the earliest existing replacement timer (500 ms in Family Circle).
   No network, acknowledgement, localStorage or removal semantics are changed. */
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox).v36-stick { animation:phNoteSettle 260ms ease-out both!important; }
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox):is(.is-peeling,.v36-peel) {
  animation:phNoteFoldAway 480ms cubic-bezier(.3,.08,.6,1) forwards!important;
  pointer-events:none!important;
}
:is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox).v36-crumple {
  animation:phNoteCrumpleAway 480ms cubic-bezier(.4,.05,.6,1) forwards!important;
  transform-origin:50% 50%!important;
  pointer-events:none!important;
}
@keyframes phNoteSettle {
  from { transform:translateY(-8px) rotate(-1deg);opacity:0; }
  to { transform:translateY(0) rotate(0);opacity:1; }
}
@keyframes phNoteFoldAway {
  0% { transform:perspective(900px) rotateY(0) scaleX(1);opacity:1; }
  30% { transform:perspective(900px) rotateY(-25deg) scaleX(.97);opacity:1; }
  72% { transform:perspective(900px) rotateY(-70deg) scaleX(.6);opacity:.9; }
  100% { transform:perspective(900px) rotateY(-89deg) scaleX(.06) translateY(-12px);opacity:0; }
}
@keyframes phNoteCrumpleAway {
  0% { transform:scale(1) rotate(0);clip-path:inset(0 round 3px);opacity:1; }
  35% { transform:scale(.75,.86) rotate(-7deg);clip-path:polygon(7% 0,88% 6%,100% 75%,76% 100%,0 88%,8% 41%);opacity:1; }
  70% { transform:scale(.35,.44) rotate(13deg);clip-path:polygon(17% 0,81% 9%,100% 63%,74% 100%,8% 87%,0 38%);opacity:.95; }
  100% { transform:translateY(26px) scale(.04) rotate(25deg);clip-path:inset(8% round 30%);opacity:0; }
}
@media(prefers-reduced-motion:reduce) {
  :is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox).v36-stick { animation:none!important; }
  :is(#parentStickyHost .phStickyNote.v36Sticky, #kidStickyHost .kidStickyNote, #gpStickyHost .gpStickyNote, #blockingReminderBox.blockingReminderBox):is(.is-peeling,.v36-peel,.v36-crumple) {
    animation:phNoteQuietExit 120ms linear forwards!important;
  }
}
@keyframes phNoteQuietExit { from { opacity:1; } to { opacity:0; } }

/* Parent artwork reset: match the older color-specific SVG rule specificity.
   Keep this after all earlier note rules; no layout or behavior changes. */
#parentStickyHost .phStickyNote.v36Sticky.note-yellow,
#parentStickyHost .phStickyNote.v36Sticky.note-blue,
#parentStickyHost .phStickyNote.v36Sticky.note-green,
#parentStickyHost .phStickyNote.v36Sticky.note-pink,
#parentStickyHost .phStickyNote.v36Sticky.note-coral {
  background-image:linear-gradient(155deg,var(--ph-note-paper),var(--ph-note-paper-end))!important;
  background-repeat:no-repeat!important;
  background-size:100% 100%!important;
  background-position:center!important;
}

/* Retain the note inside its scroll host; a legacy runtime class offsets it. */
#parentStickyHost .phStickyNote.v36Sticky {
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
}