.offline-center-open{position:fixed;right:max(14px,env(safe-area-inset-right));bottom:calc(82px + env(safe-area-inset-bottom));z-index:45;width:46px;height:46px;border:1px solid color-mix(in srgb,var(--accent,#57e6a5) 42%,transparent);border-radius:15px;background:color-mix(in srgb,var(--surface,#111c26) 92%,transparent);color:var(--text,#f6fbf8);box-shadow:0 14px 34px rgba(0,0,0,.28);display:grid;place-items:center;font-size:20px;cursor:pointer;backdrop-filter:blur(16px)}
.offline-center-open::after{content:attr(data-count);position:absolute;right:-5px;top:-6px;min-width:20px;height:20px;padding:0 5px;display:grid;place-items:center;border-radius:999px;background:#d79b46;color:#071019;font-size:11px;font-weight:800;opacity:0;transform:scale(.75)}
.has-pending-local-data .offline-center-open::after{opacity:1;transform:scale(1)}
.offline-center-dialog{width:min(560px,calc(100% - 24px));max-height:min(760px,calc(100dvh - 30px));padding:0;border:0;border-radius:24px;background:var(--surface,#111c26);color:var(--text,#f6fbf8);box-shadow:0 30px 90px rgba(0,0,0,.55);overflow:hidden}
.offline-center-dialog::backdrop{background:rgba(1,8,13,.72);backdrop-filter:blur(5px)}
.offline-center-shell{display:flex;flex-direction:column;max-height:min(760px,calc(100dvh - 30px))}
.offline-center-head{display:flex;align-items:center;gap:13px;padding:20px;border-bottom:1px solid var(--line,rgba(255,255,255,.1))}.offline-center-head .route-mark{flex:0 0 auto}.offline-center-head>div{min-width:0;flex:1}.offline-center-head strong{display:block;font-size:18px}.offline-center-head small{display:block;color:var(--muted,#90a1ad);margin-top:3px}.offline-center-close{width:38px;height:38px;border:0;border-radius:12px;background:var(--surface-2,#172530);color:inherit;font-size:22px;cursor:pointer}
.offline-center-body{padding:18px;overflow:auto}.offline-state{padding:15px 16px;border-radius:17px;background:color-mix(in srgb,var(--accent,#57e6a5) 9%,var(--surface-2,#172530));border:1px solid color-mix(in srgb,var(--accent,#57e6a5) 22%,transparent)}.offline-state strong,.offline-state span{display:block}.offline-state span{color:var(--muted,#90a1ad);margin-top:4px;font-size:13px}
.offline-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:14px 0}.offline-metrics article{padding:12px 8px;border-radius:15px;background:var(--surface-2,#172530);text-align:center}.offline-metrics strong{display:block;font-size:22px}.offline-metrics span{display:block;margin-top:4px;color:var(--muted,#90a1ad);font-size:10px;letter-spacing:.05em}
.offline-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.offline-detail-grid>div{padding:13px;border:1px solid var(--line,rgba(255,255,255,.1));border-radius:15px}.offline-detail-grid span,.offline-detail-grid strong{display:block}.offline-detail-grid span{font-size:10px;letter-spacing:.08em;color:var(--muted,#90a1ad)}.offline-detail-grid strong{font-size:13px;margin-top:5px}.offline-storage-track{height:5px;border-radius:99px;background:var(--line,rgba(255,255,255,.1));overflow:hidden;margin-top:8px}.offline-storage-track i{display:block;height:100%;background:var(--accent,#57e6a5);border-radius:inherit}
.offline-pending-list{display:grid;gap:7px;margin:14px 0}.offline-pending-row{display:flex;justify-content:space-between;gap:14px;padding:11px 13px;border-radius:13px;background:var(--surface-2,#172530)}.offline-pending-row span{color:var(--muted,#90a1ad);font-size:13px}.offline-empty{padding:15px;border:1px dashed var(--line,rgba(255,255,255,.12));border-radius:15px;text-align:center}.offline-empty strong,.offline-empty span{display:block}.offline-empty span{margin-top:4px;color:var(--muted,#90a1ad);font-size:12px}
.offline-center-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.offline-center-actions .wide{grid-column:1/-1}.offline-center-note{margin:14px 2px 0;color:var(--muted,#90a1ad);font-size:11px;line-height:1.5}
@media(max-width:520px){.offline-center-open{right:12px;bottom:calc(76px + env(safe-area-inset-bottom))}.offline-metrics{grid-template-columns:repeat(2,1fr)}.offline-detail-grid{grid-template-columns:1fr}.offline-center-actions{grid-template-columns:1fr}.offline-center-actions .wide{grid-column:auto}}