*{box-sizing:border-box}body{margin:0;background:#f4f7fb;color:#17243a;font:16px system-ui,Arial;line-height:1.45}header{background:#0d2b5d;color:#fff;padding:24px 5%;display:flex;justify-content:space-between;align-items:center;gap:20px}h1{margin:.2em 0}.badge{font-size:.78rem;letter-spacing:.06em;color:#bdd5ff}button,.import{padding:10px 14px;border:1px solid #cbd5e3;border-radius:10px;background:#fff;color:#17243a;font:700 15px system-ui,Arial;cursor:pointer}header button{background:transparent;color:#fff;border-color:#fff}button.active,.primary{background:#155eef;color:#fff;border-color:#155eef}nav{display:flex;gap:7px;padding:10px 4%;overflow:auto;background:#fff;box-shadow:0 1px 4px #17243a12}nav button{white-space:nowrap}main{max-width:1100px;margin:auto;padding:28px 18px}section{background:#fff;border:1px solid #d9e1ec;border-radius:16px;padding:25px}.page{display:none}.page.active{display:block}.cards,.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.mode,.product-choice{text-align:left;padding:22px}.mode b,.product-choice b{display:block;font-size:20px}.mode span,.product-choice span,.small{display:block;margin-top:6px;color:#617084}.product-choice.selected{border:2px solid #155eef;background:#edf4ff}label{display:block;font-weight:700;margin:12px 0}input,select,textarea{width:100%;padding:10px;margin-top:5px;border:1px solid #b9c6d8;border-radius:8px;font:inherit;color:#17243a;background:#fff}textarea{min-height:90px}.large{min-height:170px}.checks{padding:10px 16px;background:#f8fafc;border-radius:12px}.checks input{width:auto;margin-right:8px}.checks label{font-weight:500}.notice,.warning{margin:18px 0;padding:14px;background:#edf4ff;border-left:4px solid #155eef;border-radius:8px}.warning{background:#fff8e8;border-color:#d99100}.conditional{display:none}.conditional.visible{display:block}.actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}.tabs{display:flex;gap:7px;overflow:auto;margin-bottom:12px}.tabs button{white-space:nowrap}.tabpane{display:none}.tabpane.active{display:block}.output{min-height:360px;font:14px ui-monospace,Consolas,monospace;line-height:1.5}.output-actions{margin:8px 0}.import{position:relative;overflow:hidden}.import input{position:absolute;inset:0;opacity:0;cursor:pointer;margin:0}footer{text-align:center;padding:18px;color:#68778b}@media(max-width:600px){header{flex-direction:column;align-items:flex-start}main{padding:16px 10px}section{padding:18px}.actions>*{flex:1 1 auto}}