.nb{position:relative}.nb-btn{background:var(--line-soft);width:40px;height:40px;color:var(--ink-2);border-radius:999px;place-items:center;transition:background .15s,color .15s;display:grid;position:relative}.nb-btn:hover,.nb-btn.is-open{background:var(--green-soft);color:var(--ink)}.nb-badge{min-width:18px;height:18px;color:var(--white);border:2px solid var(--white);background:#c8493a;border-radius:999px;place-items:center;padding:0 5px;font-size:10.5px;font-weight:700;display:grid;position:absolute;top:-2px;right:-2px}.nb-panel{background:var(--white);border:1px solid var(--line);border-radius:var(--r);z-index:120;width:360px;max-width:calc(100vw - 32px);position:absolute;top:calc(100% + 10px);right:0;overflow:hidden;box-shadow:0 18px 48px -20px #39393947}.nb-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;display:flex}.nb-head-title{color:var(--ink);align-items:center;gap:8px;font-size:13px;font-weight:800;display:inline-flex}.nb-head-count{background:var(--green);min-width:20px;height:20px;color:var(--ink);border-radius:999px;justify-content:center;align-items:center;padding:0 6px;font-size:11px;font-weight:800;display:inline-flex}.nb-readall{color:var(--ink-3);font-size:12px;font-weight:700;transition:color .15s}.nb-readall:hover{color:var(--ink)}.nb-list{max-height:380px;overflow-y:auto}.nb-empty{text-align:center;color:var(--ink-3);padding:32px 16px;font-size:13px;font-weight:500}.nb-item{border-bottom:1px solid var(--line-soft);align-items:stretch;transition:background .15s;display:flex}.nb-item:last-child{border-bottom:0}.nb-item:hover{background:var(--line-soft)}.nb-item.is-unread{background:var(--green-tint);box-shadow:inset 3px 0 0 var(--green-2)}.nb-item.is-unread:hover{background:var(--green-soft)}.nb-item-main{text-align:left;flex:1;align-items:flex-start;gap:12px;min-width:0;padding:13px 8px 13px 16px;display:flex}.nb-dot{background:var(--ink-3);border-radius:50%;flex-shrink:0;width:9px;height:9px;margin-top:5px}.nb-dot--approved,.nb-dot--delivered{background:var(--green-2)}.nb-dot--rejected{background:#c8493a}.nb-dot--review{background:#c58a3a}.nb-dot--print,.nb-dot--shipping{background:#2c5fab}.nb-dot--message{background:var(--ink)}.nb-item-body{flex-direction:column;gap:5px;min-width:0;display:flex}.nb-item-head{color:var(--ink);font-size:13.5px;font-weight:700;line-height:1.3}.nb-item-meta{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.nb-item-pill{text-transform:uppercase;letter-spacing:.04em;background:var(--line-soft);color:var(--ink-2);border-radius:999px;padding:2px 8px;font-size:10px;font-weight:800}.nb-item-sub{color:var(--ink-3);font-size:11.5px;font-weight:600}.nb-item-del{width:42px;color:var(--ink-3);flex:none;justify-content:center;align-items:center;transition:color .15s,background .15s;display:flex}.nb-item-del:hover{color:#c8493a;background:#fff1ee}.nb-fade-enter-active,.nb-fade-leave-active{transition:opacity .16s var(--ease), transform .16s var(--ease)}.nb-fade-enter-from,.nb-fade-leave-to{opacity:0;transform:translateY(-6px)}.nb-inline{background:var(--white);border:1px solid var(--line);border-radius:var(--r);margin-bottom:6px;overflow:hidden}.nb-inline .nb-list{max-height:50vh}.area-nav{background:var(--white);border-bottom:1px solid var(--line);padding:28px 0}.area-nav-inner{max-width:var(--maxw);padding:0 var(--pad);grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;margin:0 auto;display:grid}.area-nav-l{gap:16px;display:flex}.area-nav-back{color:var(--ink-2);background:var(--line-soft);border-radius:999px;align-items:center;gap:8px;padding:8px 14px;font-size:13px;font-weight:600;transition:background .15s,color .15s;display:inline-flex}.area-nav-back:hover{background:var(--ink);color:var(--white)}.area-nav-brand{justify-content:center;align-items:center;gap:12px;display:inline-flex}.area-nav-brand img{width:auto;height:34px}.area-nav-r{justify-content:flex-end;align-items:center;gap:8px;display:flex}.area-user{background:var(--line-soft);border-radius:999px;align-items:center;gap:12px;padding:6px 8px 6px 16px;transition:background .15s,transform .15s;display:inline-flex}.area-user:hover{background:var(--green-soft);transform:translateY(-1px)}.area-user-name{color:var(--ink);font-size:13px;font-weight:700}.area-user-sub{color:var(--ink-3);margin-top:1px;font-size:11px;font-weight:500}.area-user-av{background:var(--ink);width:34px;height:34px;color:var(--white);letter-spacing:-.02em;border-radius:999px;flex-shrink:0;place-items:center;font-size:13px;font-weight:700;display:grid}.area-user-logout{color:var(--ink-3);border-radius:999px;padding:8px;transition:color .15s,background .15s}.area-user-logout:hover{color:var(--ink);background:var(--line-soft)}.area-burger{background:var(--line-soft);width:44px;height:44px;color:var(--ink);border-radius:999px;justify-content:center;align-items:center;display:none}.area-backdrop{z-index:200;background:#00000080;position:fixed;inset:0}.area-drawer{z-index:201;background:var(--white);width:80%;max-width:360px;height:100dvh;transition:transform .3s var(--ease);padding:var(--pad);flex-direction:column;gap:6px;display:flex;position:fixed;top:0;right:0;transform:translate(100%);box-shadow:-12px 0 40px #0000001f}.area-drawer.is-open{transform:translate(0)}.area-drawer-head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.area-drawer-user{align-items:center;gap:12px;min-width:0;display:inline-flex}.area-drawer-user-name{color:var(--ink);overflow-wrap:anywhere;font-size:14px;font-weight:700}.area-drawer-user-sub{color:var(--ink-3);margin-top:1px;font-size:12px;font-weight:500}.area-drawer-close{background:var(--line-soft);width:44px;height:44px;color:var(--ink);border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.area-drawer-link{color:var(--ink-2);border-radius:var(--r-md,14px);padding:14px 16px;font-size:16px;font-weight:600;transition:color .2s,background .2s}.area-drawer-link:hover{color:var(--ink);background:var(--line-soft)}.area-drawer-logout{background:var(--ink);color:var(--white);border-radius:999px;justify-content:center;align-items:center;gap:8px;margin-top:auto;padding:15px 20px;font-size:15px;font-weight:600;display:inline-flex}.area-drawer-logout:hover{background:var(--green);color:var(--ink)}.drawer-fade-enter-active,.drawer-fade-leave-active{transition:opacity .3s var(--ease)}.drawer-fade-enter-from,.drawer-fade-leave-to{opacity:0}@media (width<=1024px){.area-nav-l,.area-nav-r{display:none}.area-nav-inner{grid-template-columns:auto 1fr}.area-nav-brand{justify-self:start}.area-burger{justify-self:end;display:inline-flex}}.area-shell{background:#fafaf7;min-height:100vh}