.kit-eg-page { background:var(--bg); color:var(--text-1); }
.kit-eg-page * { box-sizing:border-box; }
.kit-eg-hero { background:linear-gradient(180deg,#1F0046 0%, #2A0B61 100%); color:#fff; padding:32px 16px 60px; }
.kit-eg-hero-inner { max-width:1180px; margin:0 auto; }
.kit-eg-hero h1 { font-size:clamp(1.7rem,5vw,2.6rem); font-weight:800; line-height:1.12; margin:6px 0 12px; letter-spacing:-.02em; }
.kit-eg-hero h1 .accent { background:linear-gradient(90deg,#27E19D,#6BFFB0); -webkit-background-clip:text; background-clip:text; color:transparent; }
.kit-eg-hero p { font-size:.98rem; color:rgba(255,255,255,.85); max-width:680px; line-height:1.5; margin:0; font-weight:500; }

.kit-eg-wrap { max-width:1180px; margin:0 auto 40px; padding:0 16px; }
.kit-eg-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; }
@media (max-width:820px) { .kit-eg-layout { grid-template-columns:1fr; } }

.kit-eg-panel { background:var(--bg-card); border:1.5px solid var(--border); border-radius:16px; padding:22px; }
.kit-eg-panel h2 { font-size:1.05rem; font-weight:800; color:var(--text-1); margin:0 0 4px; letter-spacing:-.01em; }
.kit-eg-panel small.intent { color:var(--text-3); font-size:.84rem; display:block; margin-bottom:18px; }

.kit-eg-field { margin-bottom:14px; }
.kit-eg-field label { display:block; font-size:.76rem; color:var(--text-2); font-weight:700; margin-bottom:6px; text-transform:uppercase; letter-spacing:.04em; }
.kit-eg-field input[type="text"], .kit-eg-field input[type="number"], .kit-eg-field select {
  width:100%; padding:10px 12px; border:1.5px solid var(--border); border-radius:10px; font-size:.94rem; color:var(--text-1); outline:none; font-family:inherit; background:var(--bg-card);
}
.kit-eg-field input:focus, .kit-eg-field select:focus { border-color:#7B2FBE; }

.kit-eg-radio-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; }
.kit-eg-radio { background:var(--bg-card-2); border:1.5px solid var(--border); border-radius:10px; padding:10px 12px; cursor:pointer; transition:border-color .12s, background .12s; font-size:.86rem; color:var(--text-2); font-weight:600; display:flex; align-items:center; gap:8px; }
.kit-eg-radio input { margin:0; accent-color:#7B2FBE; }
.kit-eg-radio.is-active { background:var(--bg-card); border-color:#7B2FBE; color:var(--text-1); box-shadow:0 0 0 3px rgba(123,47,190,.12); }
.kit-eg-radio code { background:rgba(123,47,190,.1); padding:1px 6px; border-radius:4px; font-size:.78rem; color:var(--accent-text, #7B2FBE); }

.kit-eg-toggle { display:flex; align-items:center; gap:10px; cursor:pointer; padding:10px 12px; background:var(--bg-card-2); border:1.5px solid var(--border); border-radius:10px; }
.kit-eg-toggle input { margin:0; accent-color:#7B2FBE; }
.kit-eg-toggle-label { font-size:.88rem; color:var(--text-2); font-weight:600; }
.kit-eg-toggle-meta { color:var(--text-3); font-size:.78rem; }
.kit-eg-mode-btn { background:transparent; color:var(--text-3); border:1.5px solid transparent; }
.kit-eg-mode-btn.is-active { background:var(--bg-card); color:var(--text-1); border-color:#7B2FBE; }

.kit-eg-btn { display:inline-flex; align-items:center; justify-content:center; gap:7px; background:#7B2FBE; color:#fff; padding:12px 22px; border:0; border-radius:11px; font-weight:700; font-size:.94rem; cursor:pointer; transition:background .15s, transform .12s; box-shadow:0 4px 12px -3px rgba(123,47,190,.4); width:100%; }
.kit-eg-btn:hover { background:#6A26A8; transform:translateY(-1px); }
.kit-eg-btn-secondary { background:var(--bg-card); color:var(--accent-text, #7B2FBE); border:1.5px solid #7B2FBE; box-shadow:none; }
.kit-eg-btn-secondary:hover { background:var(--bg-card-2); }

.kit-eg-output { background:var(--bg-card-2); border-radius:12px; padding:14px; min-height:300px; max-height:520px; overflow-y:auto; }
.kit-eg-output-empty { text-align:center; color:var(--text-3); padding:80px 16px; font-size:.92rem; }
.kit-eg-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; background:var(--bg-card); border:1px solid var(--border); border-radius:9px; margin-bottom:6px; font-family:'SF Mono', Menlo, Monaco, Consolas, monospace; font-size:.86rem; color:var(--text-1); transition:background .12s; }
.kit-eg-row:hover { background:var(--bg-card-2); }
.kit-eg-row-email { word-break:break-all; flex:1; min-width:0; }
.kit-eg-row-copy { background:var(--bg-card); border:1px solid var(--border); color:var(--accent-text, #7B2FBE); padding:5px 10px; border-radius:7px; font-size:.74rem; font-weight:700; cursor:pointer; flex-shrink:0; transition:all .12s; }
.kit-eg-row-copy:hover { background:#7B2FBE; color:#fff; border-color:#7B2FBE; }
.kit-eg-row-copy.is-copied { background:#27E19D; color:#0a4d2f; border-color:#27E19D; }

.kit-eg-actions { display:flex; gap:8px; margin-top:14px; flex-wrap:wrap; }
.kit-eg-actions button { flex:1; min-width:120px; }

.kit-eg-disclaimer { background:#FFF6DA; border:1px solid #FFCB47; border-radius:10px; padding:10px 14px; font-size:.78rem; color:#5C3D00; line-height:1.45; margin-top:14px; }
.kit-eg-disclaimer strong { color:var(--text-1); }

.kit-eg-panel { min-width:0; }
.kit-eg-field label, .kit-eg-label { font-size:.88rem; color:var(--text-2); font-weight:600; margin-bottom:8px; text-transform:none; letter-spacing:0; }
.kit-eg-field label.kit-eg-radio { margin:0; }
.kit-eg-radio code { background:transparent; padding:0; color:inherit; font-size:.8rem; overflow-wrap:anywhere; }
.kit-eg-pool { grid-template-columns:repeat(3,minmax(0,1fr)); }
.kit-eg-field label.kit-eg-toggle { display:flex; flex-wrap:wrap; text-transform:none; }
.kit-eg-toggle-meta { flex-basis:100%; }
.kit-eg-custom-domain { display:flex; flex-wrap:wrap; gap:8px; }
.kit-eg-custom-domain input { min-width:0; }
.kit-eg-error { color:var(--error); font-size:.9rem; line-height:1.5; margin:12px 0; }
.kit-eg-notice { color:var(--text-2); margin:10px 0; }
.kit-eg-advanced summary { padding:8px 0; color:var(--text-2); font-weight:600; cursor:pointer; }
.kit-eg-output { min-height:180px; }
.kit-eg-output:focus-visible { outline:2px solid var(--accent-text); outline-offset:3px; }
.kit-eg-row-copy.is-copied { background:var(--bg-card); color:var(--teal); border-color:currentColor; }
@media(max-width:480px) { .kit-eg-panel { padding:16px; } .kit-eg-radio-grid { grid-template-columns:1fr; } .kit-eg-pool { grid-template-columns:repeat(3,minmax(0,1fr)); } .kit-eg-radio { padding:10px 8px; } }

.kit-eg-hero-inner { padding:0 16px; }
