/* One small inbox, with readable glass cards and a clear severity rail. */
#notifications-toggle{position:relative;flex:0 0 auto;min-width:34px;min-height:34px;padding:5px;font-size:1.15rem;line-height:1;}
.notification-badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.2em;padding:1px 4px;margin-inline-start:4px;background:#efd35b;color:#171315;font-size:10px;font-weight:800;line-height:1.3;border-radius:var(--etti-radius,8px);vertical-align:middle;}
.notification-badge[hidden],#etti-notifications[hidden]{display:none!important;}
#notifications-toggle .notification-badge{position:absolute;inset:-3px -3px auto auto;margin:0;}
.etti-notification-toggle{display:inline-flex;align-items:center;gap:2px;position:relative;min-width:24px;}
.etti-notification-toggle svg{width:14px;height:14px;}
.etti-notification-toggle[hidden]{display:none!important;}
#etti-notifications{position:fixed;z-index:1900;inset:calc(env(safe-area-inset-top,0px) + 68px) 12px auto auto;width:min(430px,calc(100vw - 24px));max-height:calc(100dvh - 144px);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--fruit-open-border,#efd35b);border-radius:var(--etti-radius,8px);background:linear-gradient(145deg,rgb(33 25 40 / 97%),rgb(12 19 27 / 97%));box-shadow:0 20px 70px #0009;color:#f5f3f4;isolation:isolate;}
.notification-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px 8px;}
.notification-heading h2{margin:0;font-size:1.12rem;letter-spacing:.02em;}
.notification-heading h2::before{content:'✦';color:#efd35b;margin-inline-end:8px;}
.notification-close{min-width:34px;min-height:34px;}
.notification-toolbar{display:flex;flex-wrap:wrap;gap:7px;padding:0 16px 8px;}
.notification-toolbar input{min-width:100px;flex:1 1 160px;}
.notification-toolbar :is(input,select){height:34px;background:#0d111bcc;color:inherit;padding:4px 8px;border:1px solid #efd35b;border-radius:var(--etti-radius,8px);}
.notification-status{padding:0 16px;margin:0 0 8px;font-size:.72rem;color:#c4bec9;}
.notification-list{overflow:auto;overscroll-behavior:contain;padding:0 10px 10px;display:grid;gap:9px;min-height:80px;}
.notification-card{position:relative;padding:12px 12px 10px 16px;border:1px solid #655873;border-inline-start:3px solid #efd35b;border-radius:var(--etti-radius,8px);background:linear-gradient(120deg,#44304944,#14252e66);}
.notification-card[data-severity=info]{border-inline-start-color:#62df8a;}
.notification-card.is-read{background:#121a2266;}
.notification-card-heading{display:flex;align-items:center;gap:8px;}
.notification-card h3{font-size:.92rem;margin:0;line-height:1.35;}
.notification-dot{width:7px;height:7px;flex:none;background:#efd35b;border-radius:var(--etti-radius,8px);box-shadow:0 0 12px #efd35b77;}
.is-read .notification-dot{background:#89949c;box-shadow:none;}
.notification-detail{font-size:.82rem;line-height:1.45;margin:8px 0;}
.notification-meta,.notification-time,.notification-reset{font-size:.69rem;color:#c8c0cc;overflow-wrap:anywhere;}
.notification-meta{margin:6px 0;}
.notification-usage{font-size:.8rem;color:#efd35b;margin:7px 0;}
.notification-reset{margin:4px 0;}
.notification-follow{margin-top:8px;font-size:.78rem;}
.notification-follow summary{cursor:pointer;padding:5px 0;}
.notification-follow p{line-height:1.4;margin:5px 0 8px;}
.notification-actions{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin-top:9px;}
#etti-notifications .notification-actions button,.notification-snooze{font-size:.7rem;padding:6px 8px;min-height:32px;}
.notification-extension{display:flex;align-items:center;gap:8px;}
.notification-extension input{width:75px;padding:6px;background:#111b25;color:white;border:1px solid #efd35b;}
.notification-empty{padding:24px 14px 32px;text-align:center;}
.notification-empty h3{font-size:1rem;margin:8px;}
.notification-empty p{font-size:.8rem;}
.notification-empty-orbit{display:inline-grid;place-items:center;width:58px;height:58px;border:1px solid #62df8a;background:radial-gradient(ellipse,#62df8a28,transparent);color:#62df8a;font-size:28px;transform:rotate(-8deg);}
.notification-update{margin:0 16px 8px;}
@media(max-width:480px){#etti-notifications{inset:calc(env(safe-area-inset-top,0px) + 60px) 8px auto;width:calc(100vw - 16px);max-height:calc(100dvh - 130px);}.notification-heading{padding:10px 12px 6px;}.notification-toolbar{padding-inline:12px;}}
