.notification-center { position: fixed; top: 20px; left: 20px; width: min(410px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); overflow-y: auto; z-index: 1090; display: grid; gap: 12px; pointer-events: none; }
.store-notice { pointer-events: auto; display: grid; grid-template-columns: 26px minmax(0,1fr) 30px; gap: 12px; padding: 18px; border-radius: 18px; background: #fff; color: #393428; border: 1px solid #e6e0d5; border-inline-start: 4px solid #8b6c3a; box-shadow: 0 12px 40px #30261726; animation: notice-in .2s ease-out; }
.store-notice > i { font-size: 1.4rem; color: #8b6c3a; }
.store-notice--success { border-inline-start-color: #287950; }
.store-notice--success > i { color: #287950; }
.store-notice--error { border-inline-start-color: #b3313b; }
.store-notice--error > i { color: #b3313b; }
.store-notice--warning { border-inline-start-color: #a5680e; }
.store-notice strong { font-size: .95rem; }
.store-notice-message { margin-top: 6px; font-size: .88rem; line-height: 1.9; overflow-wrap: anywhere; }
.store-notice a { display: inline-block; color: #765415; font-weight: 700; text-decoration: underline; padding-block: 6px; }
.notice-close { border: 0; background: #f6f3ed; border-radius: 50%; width: 30px; height: 30px; font-size: 1.3rem; color: #645b4c; }
.server-messages { padding: 16px; background: #fff5df; list-style: none; }
.cart-badge[hidden] { display: none; }
:where(button, a, input, select, textarea):focus-visible { outline: 3px solid #9a752e; outline-offset: 3px; }
@keyframes notice-in { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
@media(max-width:575.98px) { .notification-center { left: 16px; top: calc(12px + env(safe-area-inset-top)); } .store-notice { padding: 14px; } }
@media(prefers-reduced-motion:reduce) { .store-notice { animation: none; } }