.nbtn{position:relative}
.nbtn b{display:inline-block;min-width:18px;height:18px;line-height:18px;border-radius:9px;background:var(--red);color:#fff;font-size:11px;font-weight:700;margin-left:6px;padding:0 5px;text-align:center}
.nbtn b:empty{display:none}
.sdot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-left:6px;vertical-align:middle}
.s-open{background:transparent}.s-approved{background:#3DDC84}.s-revise{background:var(--red)}.s-hold{background:#F2C14E}
.tile .tn{position:absolute;top:4px;right:4px;min-width:18px;height:18px;border-radius:9px;background:var(--red);color:#fff;font-size:10px;font-weight:700;line-height:18px;text-align:center;padding:0 4px}
.tile .ts{position:absolute;top:6px;left:6px;width:9px;height:9px;border-radius:50%;border:1px solid rgba(0,0,0,.4)}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:20;height:min(78vh,720px);background:#121211;border-top:2px solid var(--red);transform:translateY(105%);transition:transform .28s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;max-width:760px;margin:0 auto;box-shadow:0 -20px 60px rgba(0,0,0,.6);padding-bottom:env(safe-area-inset-bottom)}
.sheet.open{transform:none}
.shade{position:fixed;inset:0;z-index:19;background:rgba(0,0,0,.45);display:none}.shade.open{display:block}
.shHead{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line)}
.shTabs{display:flex}
.shTabs button{height:34px;padding:0 12px;border:1px solid #3A3A38;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-right:-1px;color:var(--bone)}
.shTabs button.on{background:var(--bone);color:#0A0A0A;border-color:var(--bone)}
.sync{margin-left:auto;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey);display:flex;align-items:center;gap:6px;white-space:nowrap}
.sync i{width:7px;height:7px;border-radius:50%;background:#555}.sync.live i{background:#3DDC84}.sync.local i{background:#F2C14E}
.shBody{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px 14px}
.pg{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--red);font-weight:600}
.pgt{font-family:'Archivo',sans-serif;font-weight:800;font-stretch:112%;font-size:17px;text-transform:uppercase;margin:3px 0 12px}
.status{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.status button{height:32px;padding:0 12px;border:1px solid #3A3A38;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--bone);display:flex;align-items:center;gap:6px}
.status button i{width:8px;height:8px;border-radius:50%}
.status button.on{border-color:#fff;color:#fff;background:#222}
.statusBy{font-size:13px;color:var(--grey);display:flex;align-items:center;gap:8px;min-height:22px;margin-bottom:10px}
.av{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;letter-spacing:.02em}
.statusBy .av{width:22px;height:22px;font-size:10px}
.note{display:flex;gap:10px;padding:12px 0;border-top:1px solid var(--line)}
.note.mine .ntext{color:#fff}
.nhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.nname{font-weight:700;font-size:15px;color:#fff}
.ntime,.nedit{font-size:12px;color:var(--grey)}
.ntext{font-size:15px;line-height:1.5;color:var(--bone);margin-top:3px;white-space:pre-wrap;word-break:break-word}
.where{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--red);margin-top:2px}
.nact{display:flex;gap:14px;margin-top:6px}
.nact button{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey);padding:4px 0}
.nedit-box textarea,.compose textarea,.who input{width:100%;background:#0A0A0A;border:1px solid #3A3A38;color:#fff;font:inherit;font-size:16px;padding:10px;border-radius:0;resize:none}
.empty{color:var(--grey);font-size:14px;padding:18px 0}
.aitem{display:flex;gap:10px;width:100%;text-align:left;padding:12px 0;border-top:1px solid var(--line);align-items:flex-start}
.aitem img{width:46px;height:58px;object-fit:cover;margin-left:auto;flex:0 0 auto;background:#222}
.aitem .tx{width:46px;height:58px;margin-left:auto;flex:0 0 auto;background:#222;display:flex;align-items:center;justify-content:center;font-family:'Archivo',sans-serif;font-weight:900;font-stretch:125%;font-size:9px;color:var(--red)}
.aday{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);padding:16px 0 4px}
.filters{display:flex;gap:6px;overflow-x:auto;padding-bottom:8px;scrollbar-width:none}
.filters button{flex:0 0 auto;height:32px;padding:0 10px 0 4px;border:1px solid #3A3A38;font-size:12px;color:var(--bone);display:flex;align-items:center;gap:6px}
.filters button.all{padding:0 12px}
.filters button.on{border-color:#fff;color:#fff;background:#222}
.filters .av{width:24px;height:24px;font-size:10px}
.shFoot{border-top:1px solid var(--line);padding:10px 14px}
.who{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:13px;color:var(--grey)}
.who input{height:36px;font-size:15px;padding:6px 10px}
.who input.need{border-color:var(--red)}
.who b{color:#fff}
.who button{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey);text-decoration:underline}
.compose{display:flex;gap:8px;align-items:flex-end}
.compose button{height:44px;padding:0 16px;background:var(--red);color:#fff;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:13px}
.compose button:disabled{opacity:.35}
.nhint{font-size:12px;color:var(--grey);margin-top:6px;min-height:16px}
.modal{position:fixed;inset:0;z-index:30;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;padding:20px}
.modal.show{display:flex}
.modal div{background:#141413;border:1px solid #3A3A38;padding:20px;max-width:340px}
.modal h3{margin:0 0 8px;font-family:'Archivo',sans-serif;font-stretch:112%;text-transform:uppercase}
.modal p{color:var(--bone);font-size:14px;margin:0 0 16px}
.modal button{height:40px;padding:0 16px;border:1px solid #3A3A38;margin-right:8px;text-transform:uppercase;font-weight:600;letter-spacing:.06em;font-size:12px}
.modal button.ok{background:var(--red);border-color:var(--red)}
.btn{white-space:nowrap}
.shTabs button{white-space:nowrap;padding:0 10px}
@media (max-width:440px){.sync span{display:none}.shHead{gap:6px;padding:10px}}
