/* LeoX OS · Extras */
/* 1. Active hours */
.xah-peak{font-size:13px;color:var(--muted);margin:2px 0 10px}.xah-peak b{color:var(--ink)}
.xah-grid{display:grid;grid-template-columns:16px repeat(24,minmax(0,1fr));gap:2px;align-items:center}
.xah-grid i{display:block;aspect-ratio:1;border-radius:3px;background:rgba(155,123,255,var(--a));box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);transition:transform .15s}
.xah-grid i[style*="--a:0;"],.xah-grid i[style="--a:0"]{background:#232328}
.xah-grid i:hover{transform:scale(1.5);position:relative;z-index:1}
.xah-d{font-size:10px;color:var(--faint);text-align:center}
.xah-grid em{font-style:normal;font-size:10px;color:var(--faint);margin-top:3px}
.xah-go{margin-top:12px;align-self:flex-start}
/* 2. AI rewrite */
.xrw{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0 2px}
.xrw-l{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--muted);margin-right:2px}.xrw-l svg{width:13px;height:13px}
.xrw-b{border:1px solid #2E2E35;background:transparent;color:var(--ink);border-radius:999px;padding:4px 10px;font-size:12px;cursor:pointer;transition:background .15s,border-color .15s,transform .12s}
.xrw-b:hover{border-color:#9B7BFF;background:linear-gradient(90deg,rgba(155,123,255,.18),rgba(255,138,61,.08))}
.xrw-b:active{transform:scale(.95)}
.xrw-b.undo{border-style:dashed;color:var(--muted)}
.xrw.busy .xrw-b{pointer-events:none;opacity:.45}
.xrw.busy .xrw-b.on{opacity:1;border-color:#9B7BFF;animation:xPulse 1s ease-in-out infinite}
@keyframes xPulse{50%{box-shadow:0 0 0 4px rgba(155,123,255,.18)}}
#draft.xrw-flash{animation:xFlash .7s ease}
@keyframes xFlash{0%{box-shadow:0 0 0 2px rgba(155,123,255,.7)}100%{box-shadow:0 0 0 0 rgba(155,123,255,0)}}
/* 3. Funnel */
.xf{margin-top:12px}
.xf .panel-h{flex-wrap:wrap;gap:10px}
.xf-f{display:flex;gap:6px}.xf-f select{width:auto;padding:6px 30px 6px 12px;font-size:12.5px}
.xf-leak{color:#FF8A3D}
.xf-rows{display:flex;flex-direction:column;gap:6px;padding:4px 18px 8px}
.xf-r{display:grid;grid-template-columns:170px minmax(0,1fr) 120px 48px;gap:14px;align-items:center;padding:7px 10px;border-radius:12px;animation:xUp .45s cubic-bezier(.2,.9,.3,1.1) backwards;animation-delay:var(--d)}
@keyframes xUp{from{opacity:0;transform:translateY(6px)}}
.xf-r.leak{background:linear-gradient(90deg,rgba(255,138,61,.1),transparent 70%);box-shadow:inset 0 0 0 1px rgba(255,138,61,.25)}
.xf-t b{display:block;font-size:13.5px}.xf-t small{color:var(--faint);font-size:11.5px}
.xf-tr{height:12px;background:#232328;border-radius:999px;overflow:hidden}
.xf-tr i{display:block;height:100%;border-radius:inherit;background:var(--grad,linear-gradient(90deg,#9B7BFF,#FF8A3D));transform-origin:left;animation:xGrow .7s cubic-bezier(.2,.9,.3,1) backwards;animation-delay:var(--d)}
@keyframes xGrow{from{transform:scaleX(0)}}
.xf-r.leak .xf-tr i{background:linear-gradient(90deg,#9B7BFF,#FF8A3D,#FFD84D)}
.xf-n b{font-family:var(--f-mono);font-size:15px;margin-right:6px}.xf-n small{color:var(--muted);font-size:11.5px}
.xf-lost{font-family:var(--f-mono);font-size:12px;color:var(--red);text-align:right}
.xf-foot{font-size:12px;padding:0 18px 16px}
@media (max-width:700px){.xf-r{grid-template-columns:1fr 70px;gap:4px 10px}.xf-tr{grid-column:1/-1;order:3}.xf-lost{display:none}.xf-t small{display:none}}
/* 4. WhatsApp link + QR */
.xq-b{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:24px;align-items:start}
.xq-form{display:flex;flex-direction:column;gap:14px;min-width:0}
.xq-form input[type=tel]{max-width:260px}
.xq-msg{background:#16221C;border-radius:4px 14px 14px 14px;padding:10px 12px;max-width:440px}.xq-msg small{color:#7EE2A8;font-size:11px;font-weight:600}.xq-msg p{margin-top:2px;font-size:13.5px}
.xq-link{display:flex;gap:8px}.xq-link input{font-family:var(--f-mono);font-size:12px}
.xq-qr{display:flex;flex-direction:column;gap:10px;align-items:stretch}
.xq-card{background:#fff;color:#0B0B0C;border-radius:20px;padding:16px 16px 14px;display:flex;flex-direction:column;align-items:center;gap:4px;box-shadow:0 18px 40px -18px rgba(155,123,255,.6);animation:xUp .4s backwards}
.xq-card #xq-img{width:100%;aspect-ratio:1;display:grid;place-items:center}.xq-card svg{width:100%;height:100%}
.xq-card b{font-size:15px;margin-top:4px;text-align:center}.xq-card small{font-size:12px;color:#555}
.xq-card.empty{background:var(--sunk);color:var(--faint);aspect-ratio:1;justify-content:center;box-shadow:none}
@media (max-width:760px){.xq-b{grid-template-columns:1fr}.xq-qr{max-width:260px}}