:root{--text-main:#0f172a;--text-muted:#64748b;--surface:#ffffff;--surface-muted:#f1f5f9;--border:rgba(15,23,42,.12);--primary:#4f46e5;--primary-dark:#4338ca;--cfg-accent:#4f46e5;--cfg-accent-soft:rgba(79,70,229,.14);--cfg-ink:#0f172a;--cfg-muted:#64748b;--cfg-line:rgba(15,23,42,.1);--cfg-radius:14px;--cfg-radius-sm:10px;--cfg-shadow:0 4px 24px rgba(15,23,42,.06);--cfg-window-bg:#ffffff;--cfg-window-bg-sub:#f8fafc;--cfg-window-fg:#0f172a;--cfg-window-fg-muted:#64748b;--cfg-window-border:rgba(15,23,42,.12);--cfg-window-bar-border:rgba(15,23,42,.08);}
.cfg-prose{margin-bottom:2.5rem;}
.cfg-prose h2{font-size:1.35rem;font-weight:700;margin:0 0 1rem;color:var(--text-main);}
.cfg-prose p,.cfg-prose li{font-size:1rem;line-height:1.65;color:var(--text-muted);}
.cfg-prose p{margin:0 0 1rem;}
.cfg-prose .cfg-lede{font-size:1.05rem;color:var(--text-main);}
.cfg-dl{margin:0;padding:0;display:grid;gap:1rem;}
.cfg-dl>div{margin:0;padding:1rem 1.125rem;border-radius:var(--cfg-radius-sm);border:1px solid var(--border);background:var(--surface);}
.cfg-dl dt{font-weight:700;font-size:0.9375rem;color:var(--text-main);margin:0 0 0.35rem;}
.cfg-dl dd{margin:0;font-size:0.9375rem;color:var(--text-muted);line-height:1.55;}
.cfg-callout{display:flex;gap:0.75rem;align-items:flex-start;padding:1rem 1.125rem;border-radius:var(--cfg-radius-sm);border-left:4px solid var(--primary);background:var(--surface-muted);margin-bottom:2rem;}
.cfg-callout strong{display:block;font-size:0.9375rem;color:var(--text-main);margin-bottom:0.25rem;}
.cfg-callout p{margin:0;font-size:0.9375rem;color:var(--text-muted);line-height:1.5;}
.cfg-workbench{margin-bottom:2.75rem;}
.cfg-grid{display:grid;gap:1.25rem;grid-template-columns:1fr;}
@media (min-width:992px){.cfg-grid{grid-template-columns:minmax(0,1fr) minmax(300px,1.05fr);align-items:start;}}
.cfg-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--cfg-radius);box-shadow:var(--cfg-shadow);padding:1rem 1.125rem 1.25rem;}
@media (min-width:992px){.cfg-panel{padding:1.25rem 1.35rem 1.5rem;}}
.cfg-panel-hd{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0.5rem;margin-bottom:1rem;}
.cfg-eyebrow{font-size:0.6875rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-muted);}
.cfg-hint{font-size:0.8125rem;color:var(--text-muted);margin:0 0 1rem;line-height:1.45;}
.cfg-format-wrap{margin-bottom:1.125rem;}
.cfg-format-scroller{display:flex;gap:0.5rem;overflow-x:auto;padding-bottom:0.25rem;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scrollbar-width:thin;}
.cfg-format-scroller::-webkit-scrollbar{height:4px;}
.cfg-format-scroller::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px;}
.cfg-format-btn{flex:0 0 auto;scroll-snap-align:start;padding:0.55rem 1rem;font-size:0.8125rem;font-weight:600;border-radius:999px;border:1px solid var(--border);background:var(--surface-muted);color:var(--text-muted);cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease;-webkit-tap-highlight-color:transparent;}
.cfg-format-btn:hover{color:var(--text-main);border-color:rgba(79,70,229,.35);}
.cfg-format-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
.cfg-format-btn.is-on{background:var(--primary);border-color:var(--primary);color:#fff;}
.cfg-field{margin-bottom:1rem;}
.cfg-field:last-of-type{margin-bottom:0;}
.cfg-label-row{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;margin-bottom:0.4rem;}
.cfg-label{font-size:0.8125rem;font-weight:600;color:var(--text-main);}
.cfg-tip{position:relative;display:inline-flex;}
.cfg-tip-btn{width:1.5rem;height:1.5rem;border-radius:999px;border:none;background:var(--surface-muted);color:var(--text-muted);font-size:0.75rem;font-weight:700;cursor:pointer;line-height:1;}
.cfg-tip-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
.cfg-tip-pop{visibility:hidden;opacity:0;position:absolute;z-index:20;bottom:calc(100% + 6px);right:0;width:min(240px,calc(100vw - 2rem));padding:0.5rem 0.65rem;font-size:0.75rem;font-weight:500;line-height:1.4;color:#fff;background:var(--cfg-ink);border-radius:8px;transition:opacity .15s ease;}
.cfg-tip:focus-within .cfg-tip-pop,.cfg-tip:hover .cfg-tip-pop{visibility:visible;opacity:1;}
.cfg-select,.cfg-input{width:100%;padding:0.65rem 0.85rem;font-size:0.9375rem;border-radius:var(--cfg-radius-sm);border:1px solid var(--border);background:var(--surface);color:var(--text-main);transition:border-color .15s ease,box-shadow .15s ease;}
.cfg-select:focus,.cfg-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--cfg-accent-soft);}
.cfg-chips{display:flex;flex-wrap:wrap;gap:0.45rem;margin-top:0.65rem;}
.cfg-chip{padding:0.45rem 0.8rem;font-size:0.75rem;font-weight:600;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--text-muted);cursor:pointer;transition:all .15s ease;-webkit-tap-highlight-color:transparent;}
.cfg-chip:hover{border-color:var(--primary);color:var(--primary);}
.cfg-chip:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
.cfg-kv-head{display:flex;align-items:center;justify-content:space-between;margin:1.25rem 0 0.5rem;}
.cfg-kv-list{display:flex;flex-direction:column;gap:0.65rem;}
.cfg-kv-row{display:grid;gap:0.5rem;grid-template-columns:1fr;padding:0.65rem;border-radius:var(--cfg-radius-sm);border:1px solid var(--border);background:var(--surface-muted);}
@media (min-width:576px){.cfg-kv-row{grid-template-columns:1fr 1fr auto;align-items:center;}}
.cfg-kv-row .cfg-input{margin:0;font-size:0.875rem;padding:0.55rem 0.7rem;}
.cfg-kv-remove{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border:none;border-radius:var(--cfg-radius-sm);background:rgba(239,68,68,.12);color:#dc2626;font-size:1.25rem;line-height:1;cursor:pointer;transition:background .15s ease;}
.cfg-kv-remove:hover{background:rgba(239,68,68,.2);}
.cfg-kv-remove:focus-visible{outline:2px solid #dc2626;outline-offset:2px;}
.cfg-add{width:100%;margin-top:0.75rem;padding:0.65rem;font-size:0.875rem;font-weight:600;border-radius:var(--cfg-radius-sm);border:none;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;cursor:pointer;transition:transform .12s ease,filter .12s ease;}
.cfg-add:hover{filter:brightness(1.05);transform:translateY(-1px);}
.cfg-add:focus-visible{outline:2px solid #16a34a;outline-offset:2px;}
.cfg-tight{display:grid;gap:0.75rem;grid-template-columns:1fr;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border);}
@media (min-width:576px){.cfg-tight{grid-template-columns:1fr 1fr;}}
.cfg-actions{display:flex;flex-direction:column;gap:0.5rem;margin-top:1.15rem;}
@media (min-width:480px){.cfg-actions{flex-direction:row;flex-wrap:wrap;}}
.cfg-btn-primary{flex:1;min-height:48px;padding:0 1.25rem;font-size:0.9375rem;font-weight:700;border:none;border-radius:var(--cfg-radius-sm);background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease;position:relative;}
.cfg-btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(79,70,229,.28);}
.cfg-btn-primary:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
.cfg-btn-primary.is-busy{cursor:wait;opacity:.88;}
.cfg-btn-primary.is-busy .cfg-btn-idle{display:none;}
.cfg-btn-primary.is-busy .cfg-btn-busy{display:inline;}
.cfg-btn-busy{display:none;}
.cfg-btn-ghost{min-height:48px;padding:0 1.1rem;font-size:0.875rem;font-weight:600;border-radius:var(--cfg-radius-sm);border:1px solid var(--border);background:var(--surface);color:var(--text-muted);cursor:pointer;transition:border-color .15s ease,color .15s ease,background .15s ease;}
.cfg-btn-ghost:hover{border-color:var(--primary);color:var(--primary);background:var(--surface-muted);}
.cfg-btn-ghost:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
.cfg-window{border-radius:var(--cfg-radius);overflow:hidden;border:1px solid var(--cfg-window-border);background:var(--cfg-window-bg);box-shadow:var(--cfg-shadow);}
.cfg-window-top{display:flex;align-items:center;gap:0.5rem;padding:0.65rem 1rem;border-bottom:1px solid var(--cfg-window-bar-border);background:var(--cfg-window-bg-sub);}
.cfg-window-dots{display:flex;gap:6px;}
.cfg-window-dots span{width:10px;height:10px;border-radius:99px;background:#e2e8f0;}
.cfg-window-dots span:nth-child(1){background:#fecdd3;}
.cfg-window-dots span:nth-child(2){background:#fde68a;}
.cfg-window-dots span:nth-child(3){background:#bbf7d0;}
.cfg-window-title{flex:1;text-align:center;font-size:0.6875rem;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--cfg-window-fg-muted);}
.cfg-window-body{min-height:200px;max-height:min(52vh,420px);overflow:auto;padding:1rem 1.1rem;background:var(--cfg-window-bg);}
@media (min-width:992px){.cfg-window-body{max-height:min(60vh,520px);}}
.cfg-pre{margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:0.75rem;line-height:1.55;color:var(--cfg-window-fg);white-space:pre-wrap;word-break:break-word;}
.cfg-placeholder{margin:0;font-size:0.875rem;color:var(--cfg-window-fg-muted);text-align:center;padding:2rem 0.5rem;}
.cfg-emit-ft{display:grid;gap:0.5rem;padding:0.75rem 1rem;border-top:1px solid var(--cfg-window-bar-border);background:var(--cfg-window-bg-sub);}
@media (min-width:480px){.cfg-emit-ft{grid-template-columns:1fr 1fr;}}
.cfg-copy,.cfg-dl-btn{display:inline-flex;align-items:center;justify-content:center;gap:0.4rem;min-height:44px;padding:0 1rem;font-size:0.8125rem;font-weight:600;border-radius:var(--cfg-radius-sm);border:1px solid var(--border);background:var(--surface);color:var(--text-main);cursor:pointer;transition:background .15s ease,border-color .15s ease;}
.cfg-copy:hover,.cfg-dl-btn:hover{background:var(--surface-muted);border-color:var(--cfg-line);}
.cfg-copy:focus-visible,.cfg-dl-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
.cfg-copy.is-done{background:#ecfdf5;border-color:#6ee7b7;color:#047857;}
.cfg-err{color:#b91c1c;font-size:0.875rem;margin:0;}
.cfg-is-hidden{display:none !important;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
@media (prefers-reduced-motion:reduce){.cfg-format-btn,.cfg-chip,.cfg-btn-primary,.cfg-add,.cfg-kv-remove,.cfg-copy,.cfg-dl-btn{transition:none;}.cfg-btn-primary:hover,.cfg-add:hover{transform:none;}}