.cf-wrap{--bg:#0f172a;--card:#111827;--muted:#9ca3af;--text:#e5e7eb;--accent:#f59e0b;--danger:#ef4444;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;background:linear-gradient(180deg,#0b1220,#0f172a);
  color:var(--text);padding:24px;border-radius:18px}
h1{margin:0 0 10px;font-size:clamp(1.2rem,2.2vw,1.6rem)}
.cf-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.cf-breadcrumb{color:var(--muted)}
.cf-card{background:var(--card);border:1px solid #1f2937;border-radius:14px;padding:14px;margin:10px 0}
.cf-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.cf-input{background:#0b1020;border:1px solid #1f2937;border-radius:10px;color:var(--text);padding:10px 12px;min-width:220px}
.cf-btn{background:var(--accent);color:#111827;border:none;border-radius:12px;padding:10px 14px;font-weight:700;cursor:pointer}
.cf-btn:hover{filter:brightness(1.05)}
.cf-secondary{background:#334155;color:#e5e7eb}
.cf-danger{background:#ef4444;color:#fff}
.cf-big{font-size:1.1rem;padding:14px 18px}
.cf-muted{color:#9ca3af}
.cf-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:8px;margin-top:8px}
.cf-item{border:1px dashed #27324a;border-radius:10px;padding:10px}
.cf-badge{display:inline-block;background:#0b1020;border:1px solid #1f2937;border-radius:999px;padding:4px 8px;font-size:.8rem;color:#cbd5e1}
.cf-table{width:100%;border-collapse:collapse;margin-top:10px}
.cf-table th,.cf-table td{border:1px solid #1f2937;padding:8px;text-align:left}
.cf-table th{background:#0b1020}
.cf-live{margin:8px 0;padding:10px;border:1px solid #1f2937;border-radius:10px;background:#0b1020}
.cf-foot{margin-top:8px;color:#94a3b8}