.qn-bell,.qn-center,.qn-toasts{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#30223e;box-sizing:border-box;}.qn-center *,.qn-toasts *{box-sizing:border-box;}.qn-center [hidden],.qn-badge[hidden]{display:none!important;}.qn-bell{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:42px;width:42px;height:42px;padding:9px!important;border:1px solid #e5d9f1!important;border-radius:13px!important;background:#f8f3fd!important;color:#8152ba!important;cursor:pointer;box-shadow:none!important;}.qn-bell svg{width:22px;height:22px;}.qn-badge{position:absolute;top:-5px;inset-inline-end:-5px;display:grid;place-items:center;background:#9560cf;color:white;font-size:10px;font-weight:700;min-width:18px;height:18px;padding:0 4px;border:2px solid white;border-radius:12px;line-height:1;}.qn-floating{position:fixed;inset-inline-end:18px;bottom:98px;z-index:60;box-shadow:0 5px 18px #32204315!important;}.qn-center{position:fixed;inset:0;width:min(540px,calc(100vw - 32px));max-width:540px;max-height:85vh;max-height:85dvh;margin:auto;padding:0;border:1px solid #e4d8ef;border-radius:22px;background:#fcfaff;box-shadow:0 25px 100px #1c0b3526;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c3abd9 transparent;}.qn-center::backdrop{background:#26153766;backdrop-filter:blur(3px);}.qn-center svg,.qn-toasts svg{width:21px;height:21px;}.qn-header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:24px;background:#fcfaff;border-bottom:1px solid #ebe2f2;}.qn-center h2{margin:0;font:650 21px/1.3 Inter,"Segoe UI",sans-serif;letter-spacing:-.5px;color:#30223e;}.qn-header p{margin:6px 0 0;font-size:12px;line-height:1.6;color:#96849f;}.qn-center button,.qn-toasts button{font-family:inherit;cursor:pointer;text-transform:none;letter-spacing:normal;box-shadow:none;}.qn-close,.qn-toast-close{display:grid;place-items:center;padding:8px!important;width:36px;height:36px;min-width:36px;border:0!important;border-radius:10px;background:#f1eaf7;color:#89659f;}.qn-center button:focus-visible,.qn-center a:focus-visible,.qn-bell:focus-visible{outline:3px solid #bb97de;outline-offset:3px;}.qn-settings{display:flex;flex-wrap:wrap;gap:8px;padding:16px 24px 0;}.qn-soft{border:1px solid #e4d9ee!important;background:#fff;color:#876799;border-radius:9px;padding:9px 12px;font-size:11px;min-height:36px;}.qn-soft[aria-pressed=true]{background:#ece3f7;border-color:#b69acb!important;color:#67428c;}.qn-tabs{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:18px 24px 12px;}.qn-tabs>button{padding:8px 12px;border:0;background:transparent;border-radius:9px;color:#947ea2;font-size:12px;min-height:36px;}.qn-tabs>button.is-active{background:#eae0f6;color:#714598;font-weight:600;}.qn-tabs>.qn-mark{margin-inline-start:auto;font-size:10px;padding:8px 0;}.qn-center button:disabled{opacity:.45;cursor:default;}.qn-center .qn-connection{margin:0;padding:0 24px 14px;font-size:10px;color:#918099;line-height:1.5;}.qn-center .qn-connection.is-error{color:#b86462;}.qn-refresh{display:block;margin:0 24px 12px;width:calc(100% - 48px);border:1px solid #d8c5e9;background:#eee5f8;color:#765091;border-radius:9px;padding:10px;font-size:12px;}.qn-list{padding:0 14px;}.qn-item{display:flex;align-items:flex-start;gap:12px;padding:17px 12px;border:1px solid transparent;border-bottom-color:#efe7f5;border-radius:12px;margin-bottom:6px;background:#fff;}.qn-item.is-unread{background:#f0e8f9;border-color:#e5d5f3;}.qn-item-icon{display:grid;place-items:center;width:34px;height:34px;flex:none;background:#e9ddf5;border-radius:11px;color:#9769bc;}.qn-item-copy{min-width:0;flex:1;}.qn-center .qn-item h3{font-size:13px;line-height:1.5;margin:0 0 5px;color:#4b335e;font-weight:650;}.qn-center .qn-item p{font-size:12px;line-height:1.7;margin:0 0 7px;color:#8a7597;overflow-wrap:anywhere;}.qn-item time{font-size:10px;color:#a18bae;}.qn-item-actions{display:flex;align-items:center;gap:16px;margin-top:10px;}.qn-item-actions>a,.qn-read{font:600 11px/1.5 Inter,"Segoe UI",Arial,sans-serif;color:#8860a9;text-decoration:none;background:transparent;border:0;padding:4px 0;min-height:30px;}.qn-read{margin-inline-start:auto;}.qn-empty{text-align:center;padding:36px 20px 48px;color:#b399c7;}.qn-empty>svg{display:block;margin:0 auto 17px;width:32px;height:32px;}.qn-empty strong{display:block;font-size:15px;color:#735784;}.qn-empty p{font-size:12px;color:#a28bb0;line-height:1.7;}.qn-more{display:block;margin:16px auto;border:1px solid #decde9;border-radius:10px;background:#f7f0fc;color:#8c6b9c;padding:11px 20px;font-size:12px;}.qn-center .qn-foot{padding:14px 24px 22px;margin:0;font-size:10px;line-height:1.7;color:#aa97b4;}.qn-toasts{position:fixed;inset-inline-end:22px;top:92px;z-index:99999;width:min(350px,calc(100vw - 32px));pointer-events:none;}.qn-toast{display:flex;gap:10px;align-items:flex-start;padding:17px;border:1px solid #e0cfee;border-inline-start:4px solid #ab79cb;border-radius:14px;background:#fff;box-shadow:0 10px 35px #4423571a;margin-bottom:10px;pointer-events:auto;animation:qn-arrive .22s ease-out;}.qn-toast>div{min-width:0;flex:1;}.qn-toast strong{display:block;font-size:13px;line-height:1.5;color:#624276;}.qn-toast p{margin:6px 0 0;font-size:12px;line-height:1.65;color:#a087ad;overflow-wrap:anywhere;}.qn-toast-close{width:28px;height:28px;min-width:28px;padding:5px!important;}.qn-toast-close svg{width:16px;height:16px;}@keyframes qn-arrive{from{opacity:0;transform:translateY(-9px)}to{opacity:1;transform:translateY(0)}}@media(max-width:600px){.qn-center{width:calc(100vw - 24px);max-height:90dvh;border-radius:18px;}.qn-header{padding:20px;}.qn-settings,.qn-tabs{padding-inline-start:20px;padding-inline-end:20px;}.qn-toasts{top:16px;inset-inline-end:16px;}.qn-item-actions>a,.qn-read{min-height:40px;}.qn-tabs>.qn-mark{flex-basis:100%;text-align:start;}.qn-floating{inset-inline-end:16px;bottom:100px;}}@media(prefers-reduced-motion:reduce){.qn-toast{animation:none;}}
.qn-push-hint{margin:0;padding:0 20px 16px;font:inherit;font-size:12px;line-height:1.65;color:#82708e;overflow-wrap:anywhere;}.qn-settings{flex-wrap:wrap;}.qn-settings button[aria-pressed=true]{background:#e9f5ee;color:#367753;border-color:#c7e4d0;}.qn-settings button:disabled{opacity:.6;cursor:wait;}

/* Full-height notification drawer, shared across customer and staff screens. */
.qn-center.qn-center{top:0;inset-inline-end:0;bottom:0;inset-inline-start:auto;margin:0;width:min(460px,100vw);max-width:100vw;height:100vh;height:100dvh;max-height:100dvh;border:0;border-inline-start:1px solid #e4d8ef;border-radius:0;padding:0;transform:translateX(100%);transition:transform .24s ease;box-shadow:-12px 0 48px #27163720;}:where(html[dir="rtl"]) .qn-center.qn-center{transform:translateX(-100%);}
.qn-center.is-visible{transform:translateX(0);}.qn-center.is-closing{transform:translateX(100%);}:where(html[dir="rtl"]) .qn-center.is-closing{transform:translateX(-100%);}
.qn-center::backdrop{background:#26153745;backdrop-filter:blur(2px);}
.qn-center .qn-header{padding:22px 20px;gap:12px;}.qn-center .qn-close{width:44px;height:44px;min-width:44px;display:grid;place-items:center;padding:12px!important;border-radius:12px;}.qn-center .qn-close svg{width:20px;height:20px;}
.qn-center .qn-settings{padding:18px 20px 0;display:block;}
.qn-center .qn-switch{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 14px;min-height:48px;border:1px solid #e7dfee;border-radius:13px;background:#fff;color:#594566;font-size:14px;font-weight:600;}
.qn-switch-track{width:42px;height:24px;border-radius:20px;background:#d8d1e0;position:relative;flex:none;}.qn-switch-track:after{content:"";position:absolute;inset-inline-start:3px;top:3px;width:18px;height:18px;background:#fff;border-radius:50%;box-shadow:0 1px 3px #0002;transition:transform .18s;}
.qn-switch[aria-checked=true] .qn-switch-track{background:#7950be;}.qn-switch[aria-checked=true] .qn-switch-track:after{transform:translateX(18px);}:where(html[dir="rtl"]) .qn-switch[aria-checked=true] .qn-switch-track:after{transform:translateX(-18px);}
.qn-permission{margin:16px 20px 4px;padding:18px;background:#f2ebfb;border:1px solid #e5d9f1;border-radius:15px;}
.qn-permission h3{margin:0 0 10px;font-size:16px;line-height:1.4;color:#513763;}.qn-center .qn-permission .qn-push-hint{margin:0 0 14px;padding:0;font-size:13px;line-height:1.7;color:#796588;}
.qn-center .qn-permit{min-height:44px;border:0;border-radius:11px;padding:11px 15px;background:#7044b5;color:#fff;font-size:13px;font-weight:600;width:100%;}
@media(max-width:600px){.qn-center.qn-center{width:100%;border:0;}.qn-center .qn-header{padding-top:max(18px,env(safe-area-inset-top));}.qn-center .qn-foot{padding-bottom:max(20px,env(safe-area-inset-bottom));}}
@media(prefers-reduced-motion:reduce){.qn-center.qn-center,.qn-switch-track:after{transition:none;}}

.qn-center .qn-header h2{margin:0;font-size:21px;line-height:1.3;}.qn-center .qn-header p{margin:6px 0 0;}.qn-center .qn-close{align-self:flex-start;flex-shrink:0;}

.qn-center.qn-center{overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;font:14px/1.5 Inter,"Segoe UI",Arial,sans-serif;color:#30223e;scrollbar-gutter:stable;}.qn-center.qn-center .qn-header{flex-shrink:0;}.qn-center.qn-center h3{letter-spacing:normal;line-height:1.4;}.qn-center.qn-center .qn-close{display:grid;place-items:center;min-height:44px;line-height:1;margin:0;}.qn-center.qn-center button{touch-action:manipulation;}