:root{--bg: #f5f7fa;--card: #ffffff;--border: rgba(0, 0, 0, .1);--border-subtle: rgba(0, 0, 0, .06);--text: #0f1923;--muted: #5a6a7a;--accent: #1a6ef5;--accent-muted: rgba(26, 110, 245, .1);--shadow: 0 8px 32px rgba(0, 0, 0, .08);--dot-close: #e74c3c;--dot-min: #f39c12;--dot-max: #27ae60;--status-valid-bg: rgba(39, 174, 96, .08);--status-valid-border: rgba(39, 174, 96, .2);--status-valid-text: #1a8f4a;--status-hint-bg: rgba(0, 0, 0, .03);--footer-label: #aab4be;--footer-built: #8a9aaa;--footer-built-strong: #3a6abf;--toggle-bg: rgba(0, 0, 0, .06);--toggle-border: rgba(0, 0, 0, .12);--toggle-text: #334455}[data-theme=dark]{--bg: #07111f;--card: rgba(10, 18, 32, .88);--border: rgba(148, 163, 184, .18);--border-subtle: rgba(148, 163, 184, .1);--text: #f4f7fb;--muted: #9fb0c5;--accent: #388bff;--accent-muted: rgba(56, 139, 255, .14);--shadow: 0 20px 60px rgba(0, 0, 0, .35);--status-valid-bg: rgba(39, 174, 96, .09);--status-valid-border: rgba(39, 174, 96, .22);--status-valid-text: #5dc985;--status-hint-bg: rgba(10, 18, 32, .5);--footer-label: #2a4060;--footer-built: #3a5270;--footer-built-strong: #5a8abf;--toggle-bg: rgba(148, 163, 184, .08);--toggle-border: rgba(148, 163, 184, .2);--toggle-text: #9fb0c5}body{font-family:Trebuchet MS,Avenir Next,Segoe UI,sans-serif;background:var(--bg);color:var(--text);transition:background .2s,color .2s}.btn-theme-toggle{background:var(--toggle-bg);border:1px solid var(--toggle-border);color:var(--toggle-text);font-size:13px;padding:7px 14px;border-radius:8px;cursor:pointer;transition:background .15s}.btn-theme-toggle:hover{background:var(--accent-muted);color:var(--accent);border-color:var(--accent)}.status-valid{background:var(--status-valid-bg);border:1px solid var(--status-valid-border);border-radius:8px;padding:8px 14px;font-size:13px;color:var(--status-valid-text)}.status-hint{flex:1;background:var(--status-hint-bg);border:1px solid var(--border-subtle);border-radius:8px;padding:8px 14px;font-size:12px;color:var(--muted)}.footer-contact-label{color:var(--footer-label)}.footer-built{color:var(--footer-built)}.footer-built strong{color:var(--footer-built-strong)}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}button,input{font:inherit}button{cursor:pointer}.editor-page{width:min(1100px,calc(100vw - 32px));min-height:100vh;margin:0 auto;display:flex;flex-direction:column}.editor-header{display:flex;align-items:center;justify-content:space-between;padding:20px 0 16px}.editor-logo{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600;color:var(--text)}.editor-logo svg{display:block}.editor-logo span{color:var(--accent)}.btn-heroes{background:var(--accent-muted);border:1px solid rgba(56,139,255,.3);color:#7ab8ff;font-size:13px;padding:7px 16px;border-radius:8px;text-decoration:none;transition:background .15s}.btn-heroes:hover{background:#388bff38}.editor-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.toolbar-label{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#4a6480}.toolbar-actions{display:flex;gap:8px}.btn-tool{background:#94a3b812;border:1px solid var(--border);color:var(--muted);font-size:12px;padding:5px 13px;border-radius:7px;transition:background .15s,color .15s}.btn-tool:hover{background:#94a3b821;color:var(--text)}.btn-tool.primary{background:var(--accent-muted);border-color:#388bff4d;color:#7ab8ff}.editor-frame{background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);flex:1}.editor-topbar{display:flex;align-items:center;gap:7px;padding:11px 16px;border-bottom:1px solid var(--border-subtle)}.traffic-dot{width:9px;height:9px;border-radius:50%}.editor-encoding{margin-left:auto;font-family:Courier New,monospace;font-size:11px;color:#3a5270;letter-spacing:.04em}.editor-page .cm-editor{min-height:60vh;border-radius:0;border:none;background:transparent;box-shadow:none}.editor-page .cm-scroller{font-size:15px}.editor-statusbar{display:flex;gap:10px;margin-top:10px}.status-valid{background:#27ae6017;border:1px solid rgba(39,174,96,.22);border-radius:8px;padding:8px 14px;font-size:13px;color:#5dc985}.status-hint{flex:1;background:#0a122080;border:1px solid var(--border-subtle);border-radius:8px;padding:8px 14px;font-size:12px;color:#3a5270}.editor-footer{display:flex;align-items:center;justify-content:space-between;padding:16px 0 20px;border-top:1px solid var(--border-subtle);margin-top:12px}.footer-contact{display:flex;flex-direction:column;gap:2px}.footer-contact-label{font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#2a4060;margin-bottom:2px}.footer-contact-name{font-size:12px;color:var(--muted)}.footer-contact-email{font-size:12px;color:#5a7aab;text-decoration:none}.footer-built{font-size:12px;color:#3a5270}.footer-built strong{color:#5a8abf;font-weight:500}@media (max-width: 720px){.editor-page{width:calc(100vw - 20px)}.toolbar-actions{gap:5px}.btn-tool{padding:5px 9px}.editor-footer{flex-direction:column;align-items:flex-start;gap:10px}}.status-valid{background:#27ae6017;border:1px solid rgba(39,174,96,.22);border-radius:8px;padding:8px 14px;font-size:13px;color:#27ae60;transition:background .2s,color .2s}.status-valid.status-error{background:#e74c3c17;border-color:#e74c3c40;color:#e74c3c}