:root{--bg: #070b0a;--bg-2: #0b110f;--panel-bg: rgba(14, 22, 20, .72);--panel-solid: #0d1513;--border: #1b2b27;--border-bright: #2f4b45;--grid: rgba(70, 130, 118, .05);--text: #cdd9d4;--text-muted: #6d847b;--accent: #ff6a1e;--accent-soft: rgba(255, 106, 30, .14);--accent-2: #45c9b6;--font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Code", "Consolas", monospace;--font-ui: "Segoe UI", system-ui, -apple-system, Roboto, sans-serif;font-family:var(--font-ui);color-scheme:dark}*{box-sizing:border-box}body{margin:0;color:var(--text);background-color:var(--bg);background-image:radial-gradient(1100px 600px at 50% -10%,rgba(255,106,30,.08),transparent 60%),radial-gradient(900px 700px at 100% 110%,rgba(69,201,182,.06),transparent 55%),linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:100% 100%,100% 100%,34px 34px,34px 34px;background-attachment:fixed;min-height:100vh}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9999;background:repeating-linear-gradient(to bottom,#0000 0,#0000 2px,#00000029 3px);mix-blend-mode:overlay;opacity:.5}.app{max-width:1280px;margin:0 auto;padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.app__header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem;border:1px solid var(--border);border-radius:6px;background:linear-gradient(90deg,#ff6a1e0f,#0e161480 40%);flex-wrap:wrap}.app__brand{display:flex;align-items:center;gap:.85rem}.app__logo{width:34px;height:34px;flex:0 0 auto;border:1px solid var(--accent);background:linear-gradient(135deg,var(--accent-soft),transparent),conic-gradient(from 0deg,transparent 0 25%,rgba(255,106,30,.25) 25% 50%,transparent 50% 75%,rgba(255,106,30,.25) 75%);box-shadow:0 0 12px #ff6a1e59,inset 0 0 8px #ff6a1e40;transform:rotate(45deg)}.app__header h1{margin:0;font-family:var(--font-mono);font-size:1rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text)}.app__subtitle{margin:.2rem 0 0;color:var(--text-muted);font-size:.8rem}.app__subtitle code,.panel__placeholder code{color:var(--accent);background:#0006;padding:.05rem .3rem;border-radius:3px;font-family:var(--font-mono);font-size:.85em}.app__status{display:flex;align-items:center;gap:.5rem;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;color:var(--text-muted);text-transform:uppercase}.app__status-sep{color:var(--border-bright)}.app__status-dot{width:7px;height:7px;border-radius:50%;background:var(--accent-2);box-shadow:0 0 8px var(--accent-2);animation:hud-pulse 2.2s ease-in-out infinite}@keyframes hud-pulse{0%,to{opacity:1}50%{opacity:.35}}.app__main{display:grid;grid-template-columns:320px 1fr;gap:1rem}.panel{position:relative;background:var(--panel-bg);border:1px solid var(--border);border-radius:6px;padding:1rem;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.panel:before,.panel:after{content:"";position:absolute;width:14px;height:14px;border:0 solid var(--accent);pointer-events:none;opacity:.85}.panel:before{top:-1px;left:-1px;border-top-width:2px;border-left-width:2px}.panel:after{bottom:-1px;right:-1px;border-bottom-width:2px;border-right-width:2px}.panel h2{display:flex;align-items:center;gap:.55rem;margin:0 0 .9rem;font-family:var(--font-mono);font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted)}.panel h2:before{content:"";width:7px;height:7px;flex:0 0 auto;background:var(--accent);box-shadow:0 0 8px #ff6a1eb3;transform:rotate(45deg)}.panel h2:after{content:"";flex:1;height:1px;background:linear-gradient(to right,var(--border-bright),transparent)}.panel--controls{display:flex;flex-direction:column;gap:1rem}.panel--preview{min-height:360px;display:flex;flex-direction:column}.panel__placeholder{color:var(--text-muted);font-size:.9rem}.field{display:flex;flex-direction:column;gap:.4rem;font-size:.85rem}.field__label{color:var(--text-muted);font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase}.field__label em{color:var(--accent);font-style:normal}.field__input{background:#00000059;color:var(--text);border:1px solid var(--border-bright);border-radius:4px;padding:.5rem .6rem;font-size:.85rem;font-family:var(--font-mono);transition:border-color .15s,box-shadow .15s}.field__input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 1px var(--accent-soft),0 0 10px #ff6a1e33}select.field__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--accent) 50%),linear-gradient(135deg,var(--accent) 50%,transparent 50%);background-position:right .85rem center,right .6rem center;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:1.6rem}select.field__input option,select.field__input optgroup{background:var(--panel-solid);color:var(--text)}select.field__input option:checked{background:var(--accent-soft);color:var(--accent)}input[type=range].field__input{padding:0;background:transparent;border:none;accent-color:var(--accent)}.field--checkbox{flex-direction:row;align-items:center;gap:.5rem;color:var(--text);font-size:.82rem}.field--checkbox input{accent-color:var(--accent);width:15px;height:15px}.params{display:flex;flex-direction:column;gap:.9rem}.btn,.export-buttons button{background:#0000004d;color:var(--text);border:1px solid var(--border-bright);border-radius:4px;padding:.55rem .9rem;font-size:.72rem;font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:border-color .15s,box-shadow .15s,color .15s,background .15s}.btn:hover,.export-buttons button:hover:not(:disabled){border-color:var(--accent-2);color:#fff;box-shadow:0 0 12px #45c9b640}.btn--primary{background:linear-gradient(180deg,var(--accent),#d9530f);border-color:var(--accent);color:#0b0d10;font-weight:700;box-shadow:0 0 16px #ff6a1e59}.btn--primary:hover{color:#0b0d10;border-color:var(--accent);box-shadow:0 0 22px #ff6a1e8c}.export-buttons button:disabled{opacity:.4;cursor:not-allowed}.export-buttons{display:flex;gap:.5rem;margin-top:.6rem;flex-wrap:wrap}.preview{flex:1;display:flex;flex-direction:column;min-height:300px}.preview__svg{flex:1;width:100%;min-height:280px;background:radial-gradient(600px 400px at 50% 45%,rgba(255,106,30,.06),transparent 70%),linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px),var(--panel-solid);background-size:100% 100%,22px 22px,22px 22px,100% 100%;border:1px solid var(--border-bright);border-radius:4px;filter:drop-shadow(0 0 6px rgba(255,106,30,.25))}.preview__meta{margin:.45rem 0 0;font-size:.68rem;font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);text-align:right}.preview--empty{align-items:center;justify-content:center;color:var(--text-muted);border:1px dashed var(--border-bright);border-radius:4px}.xml-output{width:100%;min-height:220px;resize:vertical;background:#0006;color:var(--accent-2);border:1px solid var(--border-bright);border-radius:4px;padding:.65rem;font-family:var(--font-mono);font-size:.78rem;line-height:1.45;white-space:pre}.xml-output:focus{outline:none;border-color:var(--accent-2);box-shadow:0 0 10px #45c9b633}.xml-output::-webkit-scrollbar,select.field__input::-webkit-scrollbar{width:10px;height:10px}.xml-output::-webkit-scrollbar-track{background:#0000004d}.xml-output::-webkit-scrollbar-thumb{background:var(--border-bright);border-radius:2px}.xml-output::-webkit-scrollbar-thumb:hover{background:var(--accent)}@media(max-width:760px){.app__main{grid-template-columns:1fr}.app__header{flex-direction:column;align-items:flex-start}}