/* 📥 آف لائن tab (modules/offline.js) — all selectors prefixed .off- */
.off-tab { direction: rtl; }
.off-card { background: var(--card); border: 1px solid #ffffff22; border-radius: 12px; padding: 10px 12px; margin: 0 0 10px; line-height: 1.7; }
body.light .off-card { color: #1b2a22; border-color: #00000022; }
.off-h { margin: 0 0 6px; color: var(--gold); font-size: 15px; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
body.light .off-h { color: #8a6a10; }
.off-sub { color: var(--muted); font-size: 12px; font-weight: normal; }
body.light .off-sub, body.light .off-card .note, body.light .off-card .row label { color: #5b6e63; }
.off-net { display: flex; align-items: center; gap: 8px; font-size: 14.5px; }
.off-dot { width: 12px; height: 12px; border-radius: 50%; background: #888; flex: 0 0 12px; }
.off-dot.on { background: #3fa36b; box-shadow: 0 0 6px #3fa36b; }
.off-dot.off { background: #d9822b; box-shadow: 0 0 6px #d9822b; animation: off-blink 1.6s ease-in-out infinite; }
@keyframes off-blink { 50% { opacity: .45; } }
.off-usage, .off-persist, .off-sum, .off-est, .off-pinfo, .off-textst, .off-modelst { font-size: 13px; margin: 4px 0; }
.off-sum { color: var(--muted); }
body.light .off-sum { color: #4b5d53; }
.off-bar { height: 6px; background: #ffffff18; border-radius: 4px; overflow: hidden; margin: 4px 0; }
body.light .off-bar { background: #00000014; }
.off-bar i { display: block; height: 100%; width: 0; background: var(--gold); transition: width .3s; }
.off-bar.off-big { height: 12px; border-radius: 6px; }
.off-bar.off-big i { background: linear-gradient(90deg, var(--accent), var(--gold)); }
.off-plabel { font-weight: 600; color: var(--gold); font-size: 14px; }
body.light .off-plabel { color: #8a6a10; }
.off-perr { color: #e0884a; font-size: 13px; }
.off-btns { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 2px; }
.off-btns button { flex: 1 1 auto; padding: 6px 8px; font-size: 13px; }
.off-btns button[hidden] { display: none; }
.off-grid { display: grid; grid-template-columns: repeat(10, 1fr); gap: 3px; margin: 6px 0; }
.off-cell { --pct: 0%; position: relative; padding: 0; height: 28px; font-size: 12px; border-radius: 6px; overflow: hidden;
  background: linear-gradient(to top, #3fa36b99 var(--pct), #ffffff10 var(--pct)); border: 1px solid #ffffff22; color: var(--text); }
body.light .off-cell { background: linear-gradient(to top, #3fa36b88 var(--pct), #00000008 var(--pct)); border-color: #00000022; color: #1b2a22; }
.off-cell span { position: relative; }
.off-cell.off-full { background: #3fa36b; color: #fff; }
.off-cell.off-sel { outline: 2px solid var(--gold); outline-offset: -2px; font-weight: 700; }
.off-pick { display: flex; gap: 4px; flex-wrap: wrap; }
.off-pick button { padding: 2px 8px; font-size: 12px; border-radius: 12px; }
.off-recsum { margin-top: 4px; }
.off-persistbtn { padding: 3px 8px; font-size: 12.5px; }
