/* FuBots console — sections the design system has no component for (forms, tables, meter).
   Tokens only (--fx-*), so «رمل» and «ليل» both follow. */
.cp-main{padding:32px 0 72px}
.cp-hero{padding:24px 0 8px}
.cp-hero h1{font-size:clamp(28px,4vw,40px);font-weight:700;margin:0 0 8px;color:var(--fx-ink)}
.cp-card{margin:20px 0;padding:24px}
.cp-card h2{font-size:22px;font-weight:700;margin:0 0 12px}
.cp-card h3{font-size:17px;font-weight:700;margin:24px 0 8px}
.cp-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.cp-muted{color:var(--fx-muted);margin:8px 0}
.cp-flash{display:inline-block;margin:12px 0 0;padding:8px 16px;border-radius:var(--fx-r-pill);background:var(--fx-paper);border:1px solid var(--fx-line);font-weight:700}
.cp-meter{height:10px;border-radius:var(--fx-r-pill);background:var(--fx-line);overflow:hidden;margin:16px 0 4px}
.cp-meter span{display:block;height:100%;background:var(--fx-accent);border-radius:inherit}
.cp-list{list-style:none;margin:0;padding:0}
.cp-list li{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:10px 0;border-bottom:1px solid var(--fx-line)}
.cp-list li span{font-weight:700}
.cp-list li small{opacity:.75}
.cp-list li form{margin-inline-start:auto}
.cp-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;margin:12px 0 0}
.cp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.cp-form label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:700;min-width:200px;flex:1}
.cp-form input,.cp-form select{font:inherit;font-weight:400;padding:10px 14px;border-radius:var(--fx-r-md);border:1px solid var(--fx-line);background:var(--fx-paper);color:var(--fx-ink)}
.cp-form input:focus-visible,.cp-form select:focus-visible{outline:2px solid var(--fx-accent);outline-offset:1px}
.cp-scroll{overflow-x:auto}
.cp-table{width:100%;border-collapse:collapse;font-size:15px}
.cp-table th,.cp-table td{text-align:start;padding:10px 8px;border-bottom:1px solid var(--fx-line);vertical-align:top}
.cp-table td form{display:inline-block;margin:0 0 4px 4px}
.cp-secret{display:block;padding:12px 16px;border-radius:var(--fx-r-md);background:var(--fx-paper);border:1px dashed var(--fx-accent);word-break:break-all;font-size:15px}
.cp-pre{overflow-x:auto;padding:12px 16px;border-radius:var(--fx-r-md);background:var(--fx-paper);border:1px solid var(--fx-line);font-size:14px}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em}
.cp-form small{font-size:13px;font-weight:400;line-height:1.5}
.cp-hint{color:var(--fx-muted)}
.cp-err{color:var(--fx-ink);font-weight:700!important;padding-inline-start:8px;border-inline-start:3px solid var(--fx-accent)}
.cp-form input[aria-invalid="true"]{border-color:var(--fx-accent);border-width:2px}
.cp-flash--err{border-color:var(--fx-accent)}
.cp-grid{align-items:start}
.cp-grid>button{margin-top:28px}
