@import "https://fonts.googleapis.com/css2?family=Fira+Code:wght@500;600;700&family=Fira+Sans:wght@400;500;600;700&display=swap";
:root{--bg:#f8fafc;--panel:#fff;--panel-2:#f5f7fa;--text:#0f172a;--muted:#64748b;--border:#e2e8f0;--border-strong:#cbd5e1;--accent:#059669;--accent-dark:#047857;--accent-soft:#ecfdf5;--danger:#b42318;--success:#067647;--shadow:0 24px 70px #0f172a1a}*{box-sizing:border-box}body{background:linear-gradient(#0f172a06 1px, transparent 1px), linear-gradient(90deg, #0f172a06 1px, transparent 1px), var(--bg);min-height:100vh;color:var(--text);background-size:28px 28px;margin:0;font-family:Fira Sans,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select{font:inherit}.app-shell{width:min(980px,100vw - 32px);margin:0 auto;padding:32px 0}.panel{border:1px solid var(--border);background:var(--panel);box-shadow:var(--shadow);border-radius:8px;padding:22px}.panel-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;padding-bottom:16px;display:flex}.panel-kicker{color:#334155;letter-spacing:0;text-transform:uppercase;align-items:center;gap:10px;min-height:32px;font-family:Fira Code,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-weight:700;display:inline-flex}.live-dot{background:var(--accent);border-radius:999px;width:9px;height:9px;box-shadow:0 0 0 5px #0596691f}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.field{gap:8px;display:grid}.field-full{grid-column:1/-1}.range-group{border:1px solid var(--border);background:#fbfdff;border-radius:8px;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:14px;display:grid}.range-title{color:#0f172a;letter-spacing:0;text-transform:uppercase;grid-column:1/-1;font-family:Fira Code,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:700}.field span{color:#334155;font-size:13px;font-weight:700}input,select{border:1px solid var(--border-strong);width:100%;min-height:46px;color:var(--text);background:#fff;border-radius:8px;padding:0 12px;transition:border-color .18s,box-shadow .18s,background-color .18s}select{font-weight:700}input:focus,select:focus{border-color:var(--accent);outline:3px solid #05966929}button{border:1px solid var(--border-strong);background:var(--panel-2);min-height:44px;color:var(--text);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:0 14px;font-weight:700;transition:transform .16s,border-color .16s,background-color .16s,color .16s;display:inline-flex}button:hover:not(:disabled){border-color:#94a3b8;transform:translateY(-1px)}button:disabled{cursor:not-allowed;opacity:.55}.icon-button{min-width:112px}.primary-button{border-color:var(--accent);background:var(--accent);color:#fff;min-width:200px}.primary-button:hover:not(:disabled){border-color:var(--accent-dark);background:var(--accent-dark)}.summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px;display:grid}.summary>div{border:1px solid var(--border);color:#334155;background:linear-gradient(#fff 0%,#f8fafc 100%);border-radius:8px;align-items:center;gap:10px;min-height:44px;padding:0 12px;font-family:Fira Code,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;display:flex}.alert{border-radius:8px;margin-top:16px;padding:12px 14px;font-weight:700}.error{color:var(--danger);background:#fff1f0}.success{color:var(--success);background:#ecfdf3}.actions{border-top:1px solid var(--border);justify-content:flex-end;margin-top:18px;padding-top:18px;display:flex}.spin{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.format-toggle-group{border:1px solid var(--border-strong);background:#f1f5f9;border-radius:8px;gap:2px;padding:3px;display:flex}.format-toggle-btn{cursor:pointer;flex:1;min-height:38px!important;color:var(--muted)!important;box-shadow:none!important;background:0 0!important;border:none!important;border-radius:6px!important;font-weight:600!important;transition:background-color .15s,color .15s,box-shadow .15s,transform .15s!important;transform:none!important}.format-toggle-btn:hover:not(:disabled){color:var(--text)!important;background:#0f172a0a!important;border-color:#0000!important;transform:none!important}.format-toggle-btn.active{color:var(--accent)!important;background:#fff!important;font-weight:700!important;box-shadow:0 1px 3px #0f172a14,0 1px 2px #0f172a0a!important}@media (max-width:820px){.panel-header{flex-direction:column;align-items:stretch}.grid,.summary,.range-group{grid-template-columns:1fr}.format-toggle-group{flex-direction:column}.actions{justify-content:stretch}.primary-button{width:100%}}