/* ================= Иконки: единый современный стиль ================= */
/* Мягкая цветная подложка + линейная иконка того же цвета. Перебивает тему с !important. */
body .settings-card .settings-row-icon.ox-tint, body .settings-row-icon.ox-tint, body .pf-icon.ox-tint {
  background:color-mix(in srgb, var(--tint, var(--accent)) 15%, transparent) !important;
  color:var(--tint, var(--accent)) !important; box-shadow:none !important; border-radius:12px;
}
:root[data-theme="dark"] body .settings-row-icon.ox-tint, :root[data-theme="dark"] body .pf-icon.ox-tint {
  background:color-mix(in srgb, var(--tint, var(--accent)) 20%, transparent) !important;
  color:color-mix(in srgb, var(--tint, var(--accent)) 78%, #fff) !important;
}
.settings-row-icon .ox-ico, .settings-row-icon > svg { width:20px; height:20px; }
.pf-icon .ox-ico { width:18px; height:18px; }
.attach-menu button > span:first-child .ox-ico, .ox-new-menu button > span:first-child .ox-ico { width:20px; height:20px; color:var(--accent); display:block; }
.attach-menu button > span.ox-tint:first-child { background:none !important; }
.attach-menu button > span.ox-tint:first-child .ox-ico { color:var(--tint); }

/* ================= Раздел «Помощь» ================= */
.ox-help-card { padding-top:10px !important; }
.ox-help-title { font-size:14px; font-weight:800; color:var(--accent); padding:4px 18px 4px; }
.ox-app-version { text-align:center; color:var(--muted); font-size:12.5px; margin:-2px 0 14px; }
.ox-help-body { padding-bottom:24px; }
.ox-ask { display:flex; flex-direction:column; align-items:center; gap:10px; padding:10px 22px 24px; text-align:center; }
.ox-ask-ico { width:84px; height:84px; border-radius:26px; background:color-mix(in srgb, #F5A524 16%, transparent); color:#F5A524; display:flex; align-items:center; justify-content:center; }
.ox-ask-ico svg { width:46px; height:46px; }
.ox-ask b { font-size:19px; }
.ox-ask p { margin:0; color:var(--muted); font-size:14px; line-height:1.45; }
.ox-ask .ox-ask-warn { color:var(--danger); font-size:13px; }
.ox-ask button { margin-top:4px; }
.ox-faq-item { border-bottom:1px solid var(--border); }
.ox-faq-item:last-child { border-bottom:0; }
.ox-faq-item summary { list-style:none; padding:13px 40px 13px 16px; font-weight:700; font-size:14.5px; cursor:pointer; position:relative; }
.ox-faq-item summary::-webkit-details-marker { display:none; }
.ox-faq-item summary::after { content:''; position:absolute; right:18px; top:50%; width:8px; height:8px; border-right:2px solid var(--muted); border-bottom:2px solid var(--muted);
  transform:translateY(-70%) rotate(45deg); transition:transform .2s; }
.ox-faq-item[open] summary::after { transform:translateY(-30%) rotate(-135deg); }
.ox-faq-item p { margin:0; padding:0 16px 14px; color:var(--muted); font-size:14px; line-height:1.5; }
.ox-feat-hero { padding:4px 22px 12px; }
.ox-feat-hero b { font-size:20px; display:block; }
.ox-feat-hero p { margin:4px 0 0; color:var(--muted); font-size:13.5px; }
.ox-feat-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:0 12px 16px; }
.ox-feat { display:flex; flex-direction:column; align-items:flex-start; gap:6px; text-align:left; padding:14px; border-radius:20px; background:var(--panel);
  border:1px solid var(--border); color:var(--text); transition:transform .12s; }
.ox-feat:active { transform:scale(.97); }
.ox-feat-ico { width:40px; height:40px; border-radius:13px; display:flex; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--tint) 16%, transparent); color:var(--tint); }
.ox-feat-ico svg { width:22px; height:22px; }
.ox-feat b { font-size:14.5px; }
.ox-feat span:last-child { font-size:12.5px; color:var(--muted); line-height:1.35; }

/* ================= Публикации в каналах ================= */
.ox-views { display:inline-flex; align-items:center; gap:3px; margin-right:6px; opacity:.85; }
.ox-views svg { width:13px; height:13px; }
.msg-row.ox-post { align-items:flex-end; }
.ox-post-share { align-self:flex-end; width:32px; height:32px; border-radius:50%; margin:0 0 4px 6px; flex:none; display:inline-flex; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--panel) 70%, transparent); color:var(--muted); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.ox-post-share svg { width:16px; height:16px; }

/* ================= Скрепка как в Telegram ================= */
.ox-attach-overlay { align-items:flex-end !important; justify-content:center !important; padding:0 !important; background:rgba(0,0,0,.35) !important; z-index:170 !important; }
.ox-at-sheet { width:100%; max-width:560px; height:min(74vh, 640px); background:var(--panel); border-radius:24px 24px 0 0; display:flex; flex-direction:column;
  box-shadow:0 -10px 40px rgba(0,0,0,.25); animation:oxAtIn .26s cubic-bezier(.2,.8,.2,1); transition:transform .2s; padding-bottom:env(safe-area-inset-bottom, 0px); overflow:hidden; }
@keyframes oxAtIn { from { transform:translateY(100%); } }
.ox-at-grab { display:flex; justify-content:center; padding:8px 0 2px; cursor:grab; touch-action:none; }
.ox-at-grab span { width:40px; height:5px; border-radius:3px; background:var(--border); }
:root[data-theme="dark"] .ox-at-grab span { background:rgba(255,255,255,.18); }
.ox-at-head { display:flex; align-items:center; justify-content:space-between; padding:4px 10px 8px 18px; touch-action:none; }
.ox-at-head b { font-size:16.5px; }
.ox-at-x { width:34px; height:34px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:var(--muted); }
.ox-at-x svg { width:20px; height:20px; }
.ox-at-body { flex:1; overflow-y:auto; overscroll-behavior:contain; }
.ox-at-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:3px; padding:0 3px; }
.ox-at-tile { position:relative; aspect-ratio:1; overflow:hidden; background:var(--panel2); border-radius:4px; display:flex; align-items:center; justify-content:center; color:var(--muted); }
.ox-at-grid > .ox-at-tile:first-child { border-top-left-radius:14px; }
.ox-at-tile img, .ox-at-tile video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ox-at-cam { background:#111; color:#fff; }
.ox-at-cam video { opacity:0; transition:opacity .3s; }
.ox-at-cam.live video { opacity:1; }
.ox-at-cam-ico { position:absolute; top:8px; right:8px; width:30px; height:30px; display:flex; align-items:center; justify-content:center; }
.ox-at-cam:not(.live) .ox-at-cam-ico { position:static; width:40px; height:40px; }
.ox-at-cam-ico svg { width:26px; height:26px; filter:drop-shadow(0 1px 3px rgba(0,0,0,.5)); }
.ox-at-pickall { flex-direction:column; gap:6px; font-size:12.5px; font-weight:700; color:var(--accent); }
.ox-at-pickall svg { width:30px; height:30px; }
.ox-at-media { cursor:pointer; }
.ox-at-check { position:absolute; top:6px; right:6px; width:24px; height:24px; border-radius:50%; border:2px solid #fff; background:rgba(0,0,0,.18);
  box-shadow:0 1px 4px rgba(0,0,0,.35); color:#fff; font-size:12.5px; font-weight:800; display:flex; align-items:center; justify-content:center; }
.ox-at-media.sel .ox-at-check { background:var(--accent); border-color:#fff; }
.ox-at-media.sel img, .ox-at-media.sel video { transform:scale(.9); border-radius:8px; transition:transform .15s; }
.ox-at-dur { position:absolute; left:6px; bottom:6px; color:#fff; width:20px; height:20px; filter:drop-shadow(0 1px 3px rgba(0,0,0,.6)); }
.ox-at-dur svg { width:18px; height:18px; }
.ox-at-note { color:var(--muted); font-size:12.5px; text-align:center; padding:10px 24px 14px; margin:0; line-height:1.4; }
.ox-at-send { display:none; align-items:center; gap:8px; padding:8px 10px; border-top:1px solid var(--border); }
.ox-at-send.show { display:flex; }
.ox-at-send input { flex:1; min-width:0; height:42px; border-radius:21px; border:1px solid var(--border); background:var(--bg); color:var(--text); padding:0 16px; font:inherit; font-size:15px; }
.ox-at-send input:focus { outline:none; border-color:var(--accent); }
#ox-at-go { position:relative; width:46px; height:46px; border-radius:50%; background:var(--accent); color:var(--accent-ink); display:inline-flex; align-items:center; justify-content:center; flex:none; }
#ox-at-go svg { width:21px; height:21px; }
#ox-at-count { position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 5px; border-radius:10px; background:#fff; color:var(--accent); font-size:11.5px; font-weight:800;
  display:flex; align-items:center; justify-content:center; border:2px solid var(--accent); }
#ox-at-count:empty { display:none; }
.ox-at-sheet.has-sel .ox-at-tabs { display:none; }
.ox-at-tabs { display:flex; gap:4px; overflow-x:auto; padding:8px 8px 10px; scrollbar-width:none; border-top:1px solid var(--border); flex:none; }
.ox-at-tabs::-webkit-scrollbar { display:none; }
.ox-at-tabs button { flex:none; min-width:76px; display:flex; flex-direction:column; align-items:center; gap:4px; padding:7px 10px; border-radius:18px; color:var(--text); font-size:12.5px; font-weight:700; }
.ox-at-tabs button.on { background:var(--accent-soft); color:var(--accent); }
.ox-at-tab-ico { width:26px; height:26px; display:flex; align-items:center; justify-content:center; font-size:20px; }
.ox-at-tab-ico svg { width:25px; height:25px; }
.ox-at-list { display:flex; flex-direction:column; padding:0 6px; }
.ox-at-row { display:flex; align-items:center; gap:12px; padding:10px 10px; border-radius:14px; text-align:left; color:var(--text); }
.ox-at-row:active { background:var(--panel2); }
.ox-at-row > span:last-child { display:flex; flex-direction:column; gap:1px; min-width:0; }
.ox-at-row b { font-size:15px; }
.ox-at-row small { color:var(--muted); font-size:12.5px; }
.ox-at-row-ico { width:44px; height:44px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; background:color-mix(in srgb, var(--tint) 16%, transparent); color:var(--tint); }
.ox-at-row-ico svg { width:23px; height:23px; }
.ox-at-ava { width:44px !important; height:44px !important; font-size:20px !important; flex:none; }
.ox-at-loc { padding:0 10px; display:flex; flex-direction:column; gap:8px; }
.ox-at-map { height:170px; border-radius:18px; position:relative; overflow:hidden;
  background:linear-gradient(135deg, color-mix(in srgb, #22C55E 18%, var(--panel2)), color-mix(in srgb, #0EA5E9 16%, var(--panel2)));
  background-image:repeating-linear-gradient(0deg, transparent 0 28px, rgba(127,127,127,.12) 28px 29px), repeating-linear-gradient(90deg, transparent 0 28px, rgba(127,127,127,.12) 28px 29px); }
.ox-at-pin { position:absolute; left:50%; top:50%; transform:translate(-50%,-80%); color:#E5486A; width:44px; height:44px; }
.ox-at-pin svg { width:44px; height:44px; filter:drop-shadow(0 4px 6px rgba(0,0,0,.25)); }
.ox-at-preview { position:fixed; inset:0; z-index:3200; background:#000; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.ox-at-preview img, .ox-at-preview video { max-width:100%; max-height:calc(100% - 80px); object-fit:contain; }
.ox-at-pv-bar { position:absolute; left:0; right:0; bottom:0; display:flex; justify-content:space-between; padding:14px 16px calc(14px + env(safe-area-inset-bottom, 0px)); }
.ox-at-pv-bar button { height:42px; padding:0 18px; border-radius:21px; background:rgba(255,255,255,.14); color:#fff; font-weight:800; }
.ox-at-pv-bar .pri { background:var(--accent); }

/* ================= Plus: цвет интерфейса ================= */
.ox-accent-row { display:flex; gap:10px; flex-wrap:wrap; padding:6px 2px 10px; }
.ox-accent-row button { width:34px; height:34px; border-radius:50%; background:var(--c); position:relative; box-shadow:0 0 0 2px var(--panel), 0 0 0 4px transparent; transition:box-shadow .15s; }
.ox-accent-row button.on { box-shadow:0 0 0 2px var(--panel), 0 0 0 4px var(--c); }
.ox-accent-row button.lock::after { content:''; position:absolute; inset:0; border-radius:50%; background:rgba(0,0,0,.25) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2.2" stroke-linecap="round"><rect x="6" y="11" width="12" height="9" rx="2"/><path d="M9 11V8a3 3 0 0 1 6 0v3"/></svg>') center/16px no-repeat; }
.plus-features li.ox-new b::after { content:'НОВОЕ'; margin-left:6px; font-size:9.5px; font-weight:800; letter-spacing:.4px; color:#fff; background:var(--accent); border-radius:6px; padding:2px 5px; vertical-align:2px; }