.esn{width:min(560px,100%);animation:.5s cubic-bezier(.16,1,.3,1) esn-in;position:relative}@keyframes esn-in{0%{opacity:0;transform:translateY(28px)scale(.97)}to{opacity:1;transform:none}}.esn[data-leaving=true]{animation:.32s forwards esn-out}@keyframes esn-out{to{opacity:0;transform:translateY(20px)scale(.98)}}.esn[data-level=calm]{--lv:var(--info);--lv-strong:oklch(46% .13 250);--lv-soft:oklch(96% .03 250);--lv-line:oklch(88% .06 250);--lv-rgb:64 110 200}.esn[data-level=notice]{--lv:var(--primary);--lv-strong:oklch(62% .18 156);--lv-soft:oklch(96% .05 158);--lv-line:oklch(86% .09 158);--lv-rgb:36 168 110}.esn[data-level=warn]{--lv:var(--warning);--lv-strong:oklch(60% .16 62);--lv-soft:oklch(96% .06 80);--lv-line:oklch(86% .1 75);--lv-rgb:214 150 24}.esn[data-level=urgent]{--lv:var(--destructive);--lv-strong:oklch(48% .18 18);--lv-soft:oklch(96% .04 18);--lv-line:oklch(86% .09 20);--lv-rgb:210 64 58}.esn-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl,calc(var(--radius) + 4px));box-shadow:var(--shadow-lg);transition:background .3s,border-color .3s;position:relative;overflow:hidden}.esn-accent-edge{background:var(--lv);width:4px;position:absolute;top:0;bottom:0;left:0}.esn-body{align-items:flex-start;gap:.95rem;padding:1.05rem 1.15rem .9rem 1.35rem;display:flex}.esn-icon{background:var(--lv-soft);width:44px;height:44px;color:var(--lv-strong);border:1px solid var(--lv-line);border-radius:13px;flex:none;place-items:center;display:grid}.esn-text{flex:1;min-width:0}.esn-top{flex-wrap:wrap;align-items:center;gap:.55rem;display:flex}.esn-title{letter-spacing:-.01em;font-size:1.02rem;font-weight:800}.esn-lv-badge{letter-spacing:.04em;text-transform:uppercase;color:var(--lv-strong);background:var(--lv-soft);border:1px solid var(--lv-line);border-radius:999px;padding:.2rem .46rem;font-size:.66rem;font-weight:700}.esn-msg{color:var(--muted-foreground);margin-top:.28rem;font-size:.9rem;line-height:1.45}.esn-msg b{color:var(--foreground);font-weight:600}.esn-count{font-family:var(--font-mono,monospace);color:var(--lv-strong);font-variant-numeric:tabular-nums;font-weight:600}.esn-close{width:30px;height:30px;color:var(--muted-foreground);cursor:pointer;background:0 0;border:none;border-radius:999px;flex:none;place-items:center;transition:background .15s,color .15s;display:grid}.esn-close:hover{background:var(--muted);color:var(--foreground)}.esn-actions{flex-wrap:wrap;align-items:center;gap:.6rem;padding:0 1.15rem 1.05rem 1.35rem;display:flex}.esn-snooze{align-items:center;gap:.45rem;margin-right:auto;display:inline-flex}.esn-snooze-label{color:var(--muted-foreground);align-items:center;gap:.3rem;font-size:.82rem;font-weight:500;display:inline-flex}.esn-snooze-pills{background:var(--muted);border-radius:999px;gap:.3rem;padding:.22rem;display:inline-flex}.esn-snooze-pill{cursor:pointer;color:var(--muted-foreground);background:0 0;border:none;border-radius:999px;padding:.34rem .6rem;font-size:.8rem;font-weight:600;transition:all .15s}.esn-snooze-pill:hover:not(:disabled){color:var(--foreground);background:var(--card);box-shadow:var(--shadow-xs,var(--shadow-sm))}.esn-snooze-pill:disabled{opacity:.38;cursor:not-allowed}.esn-btn{border-radius:var(--radius-md,calc(var(--radius) - 2px));cursor:pointer;white-space:nowrap;border:1px solid #0000;justify-content:center;align-items:center;gap:.5rem;height:2.5rem;padding:0 1rem;font-size:.88rem;font-weight:600;line-height:1;transition:background .15s,border-color .15s,box-shadow .15s,transform 50ms;display:inline-flex}.esn-btn:active{transform:translateY(.5px)}.esn-btn-ghost{color:var(--muted-foreground);background:0 0}.esn-btn-ghost:hover{background:var(--muted);color:var(--foreground)}.esn-btn-cta{background:var(--lv);color:#fff;box-shadow:var(--shadow-sm)}.esn-btn-cta:hover{filter:brightness(1.05)}.esn-meter{background:var(--muted);height:4px}.esn-meter>span{background:var(--lv);height:100%;transition:width .25s linear,background .3s;display:block}.esn[data-anim="2"] .esn-btn-cta{animation:3.2s ease-in-out infinite esn-cta-breathe}@keyframes esn-cta-breathe{0%,to{box-shadow:var(--shadow-sm), 0 0 0 0 rgba(var(--lv-rgb), 0)}50%{box-shadow:var(--shadow-sm), 0 0 0 5px rgba(var(--lv-rgb), .16)}}.esn[data-anim="3"] .esn-card{background:var(--lv-soft);border-color:var(--lv-line);animation:5s ease-in-out .6s infinite esn-bob}.esn[data-anim="3"] .esn-icon{animation:1.8s ease-in-out infinite esn-icon-pulse}.esn[data-anim="3"] .esn-btn-cta{animation:2.2s ease-in-out infinite esn-cta-breathe}@keyframes esn-icon-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes esn-bob{0%,90%,to{transform:translateY(0)}94%{transform:translateY(-5px)}}.esn[data-anim="4"] .esn-card{background:var(--lv-soft);border-color:var(--lv);animation:.5s cubic-bezier(.36,.07,.19,.97) esn-shake,1.6s ease-out .5s infinite esn-halo}.esn[data-anim="4"] .esn-icon{color:#fff;background:var(--lv);border-color:var(--lv);animation:.9s ease-in-out infinite esn-icon-pulse}.esn[data-anim="4"] .esn-btn-cta{animation:1.1s ease-in-out infinite esn-cta-breathe}.esn[data-anim="4"] .esn-meter>span{animation:1.1s ease-in-out infinite esn-meter-flash}.esn[data-anim="4"] .esn-accent-edge{animation:1.1s ease-in-out infinite esn-edge-flash}@keyframes esn-halo{0%{box-shadow:var(--shadow-lg), 0 0 0 0 rgba(var(--lv-rgb), .5)}70%{box-shadow:var(--shadow-lg), 0 0 0 16px rgba(var(--lv-rgb), 0)}to{box-shadow:var(--shadow-lg), 0 0 0 0 rgba(var(--lv-rgb), 0)}}@keyframes esn-shake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(3px)}30%,50%,70%{transform:translate(-5px)}40%,60%{transform:translate(5px)}}@keyframes esn-meter-flash{0%,to{opacity:1}50%{opacity:.5}}@keyframes esn-edge-flash{0%,to{opacity:1}50%{opacity:.45}}@media (prefers-reduced-motion:reduce){.esn,.esn[data-leaving=true],.esn[data-anim] .esn-card,.esn[data-anim] .esn-icon,.esn[data-anim] .esn-btn-cta,.esn[data-anim] .esn-meter>span,.esn[data-anim] .esn-accent-edge{animation:none!important}}.es-tutorial{--green:#0ec17c;--navy:#003c55;--background:oklch(98.5% .006 234);--foreground:oklch(30.15% .0572 282.418);--muted:oklch(96.2% .012 286);--muted-foreground:oklch(48.84% .0414 284.764);--border:oklch(91.5% .02 286);--font-sans:Inter, system-ui, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, monospace;--font-display:"Bricolage Grotesque", "Inter", sans-serif}.es-tutorial:fullscreen{aspect-ratio:auto;border-radius:0;width:100vw;height:100vh}@keyframes es-blink{0%,49%{opacity:1}50%,to{opacity:0}}.es-tutorial .es-caret{animation:1.05s step-end infinite es-blink}@keyframes es-spin{to{transform:rotate(360deg)}}.es-tutorial .es-spin{animation:.9s linear infinite es-spin}
