/* "Your Trybe results are ready" banner (Today and Account), drawn by
   public/js/results-nudge.js. Everything is prefixed "rn-".

   A one-line script in the page sets html[data-rn] before first paint when
   this browser last showed the banner, so the mount keeps its height until
   the answer arrives; without it the mount takes no space at all. One primary
   (purple) action, 44px tall, 12px corners, both palettes from app.css. */
.rn-mount:empty{display:none}
html[data-rn] .rn-mount:empty{display:block;min-height:76px;margin:16px 0 12px}
.rn-card{display:grid;grid-template-columns:36px minmax(0,1fr) auto 28px;align-items:center;gap:12px 14px;box-sizing:border-box;margin:16px 0 12px;padding:14px 16px 14px 18px;
  border:1px solid color-mix(in srgb,var(--violet) 26%,var(--rule));border-radius:var(--r-lg);
  background:radial-gradient(120% 160% at 100% 0,color-mix(in srgb,var(--violet) 10%,transparent),transparent 60%),var(--pane);
  box-shadow:0 1px 2px rgba(25,24,40,.04)}
.rn-card.is-phone{grid-template-columns:36px minmax(0,1fr) 28px}
.rn-ico{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:var(--r-md);background:color-mix(in srgb,var(--violet) 13%,var(--pane));color:var(--violet)}
.rn-ico svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.rn-text{margin:0;max-width:none;font:400 15px/22px var(--sans);color:var(--ink-2)}
.rn-text b{font-weight:650;color:var(--ink)}
.rn-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:var(--r-pill);background:var(--violet-fill);color:#fff;font:650 14.5px/1 var(--sans);text-decoration:none;white-space:nowrap}
.rn-btn:hover{background:var(--violet-deep);color:#fff}
.rn-close{display:inline-grid;place-items:center;width:28px;height:28px;margin:0;padding:0;border:0;border-radius:var(--r-pill);background:transparent;color:var(--ink-3);cursor:pointer;position:relative}
.rn-close::after{content:"";position:absolute;inset:-8px}
.rn-close:hover{background:var(--pane-2);color:var(--ink)}
.rn-btn:focus-visible,.rn-close:focus-visible{outline:2px solid var(--violet);outline-offset:2px}
.rn-close svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
@media (max-width:640px){
  .rn-card{grid-template-columns:32px minmax(0,1fr) 28px;padding:12px 12px 12px 14px}
  .rn-ico{width:32px;height:32px}
  .rn-btn{grid-column:2/3;grid-row:2;justify-self:start}
  .rn-close{grid-column:3;grid-row:1;align-self:start}
  html[data-rn] .rn-mount:empty{min-height:120px}
}
