@font-face{font-family:Inter Fallback;size-adjust:107%;ascent-override:90%;src:local(Arial)}:root{-webkit-font-smoothing:antialiased;--bg:#0a0a0b;--panel:#141416;--field-bg:#0f0f11;--border:#232327;--text:#f2f2f4;--text-dim:#8b8b95;--text-faint:#52525a;--accent:#6366f1;--accent-glow:#6366f138;font-family:Inter,Inter Fallback,system-ui,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{background:radial-gradient(circle at 15% -10%, #6366f112, transparent 45%), var(--bg);min-height:100%;color:var(--text)}body{font-size:14.5px;line-height:1.55}.topbar{border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:5;background:#0a0a0bd9;align-items:center;gap:14px;padding:18px 32px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:8px;font-size:16px;font-weight:600;display:flex}.brand-mark{background:linear-gradient(135deg, var(--accent), #4f46e5);color:#fff;border-radius:6px;justify-content:center;align-items:center;width:22px;height:22px;font-size:12px;font-weight:700;display:flex}.template-label{color:var(--text-dim);border:1px solid var(--border);border-radius:20px;padding:4px 10px;font-size:12.5px}.wrap{grid-template-columns:1.1fr .9fr;align-items:start;gap:20px;max-width:1200px;margin:0 auto;padding:28px 32px;display:grid}.panel{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:22px}.variant-tabs{flex-wrap:wrap;gap:6px;margin-bottom:18px;display:flex}.tab{border:1px solid var(--border);background:var(--field-bg);color:var(--text-dim);cursor:pointer;border-radius:8px;padding:7px 12px;font-size:12.5px;transition:all .15s}.tab:hover{color:var(--text)}.tab.active{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 0 14px var(--accent-glow)}.form{flex-direction:column;gap:14px;display:flex}.row{grid-template-columns:1fr 1fr;gap:12px;display:grid}.field{flex-direction:column;gap:5px;display:flex}.field label{color:var(--text-dim);font-size:12.5px;font-weight:500}.opt{color:var(--text-faint);font-size:11px;font-weight:400}input,textarea{border:1px solid var(--border);background:var(--field-bg);color:var(--text);border-radius:8px;padding:9px 11px;font-family:inherit;font-size:13.5px;transition:border-color .15s,box-shadow .15s}input:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow);outline:none}.group{border:1px solid var(--border);background:#ffffff04;border-radius:10px;flex-direction:column;gap:12px;padding:12px;display:flex}.hidden{display:none!important}.result-panel{flex-direction:column;gap:20px;display:flex;position:sticky;top:90px}.result-block{flex-direction:column;gap:8px;display:flex}.result-header{justify-content:space-between;align-items:center;display:flex}.result-title{text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);font-size:11.5px;font-weight:600}.result-value{background:var(--field-bg);border:1px solid var(--border);word-break:break-word;border-radius:10px;padding:14px;font-size:14.5px}.result-value.reference em{font-style:italic}.result-note{color:var(--text-faint);padding:0 2px;font-size:12px}.copy-btn{border:1px solid var(--border);background:var(--field-bg);color:var(--text-dim);cursor:pointer;border-radius:7px;padding:5px 12px;font-size:12px;transition:all .15s}.copy-btn:hover{border-color:var(--accent);color:var(--text)}@media (width<=900px){.wrap,.row{grid-template-columns:1fr}.result-panel{position:static}}