:root{--bg: #0b1020;--panel: #131a2a;--panel-2: #0f1523;--text: #e6e8ee;--muted: #aab2c5;--accent: #4f8cff;--accent-2: #2dd4bf;--danger: #ff6b6b;--ok: #22c55e;--shadow: 0 10px 30px rgba(0,0,0,.35);--radius: 14px}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,"Apple Color Emoji","Segoe UI Emoji";background:radial-gradient(1000px 600px at 20% -10%,#1c2540,transparent),radial-gradient(1000px 700px at 120% 0%,#0f172a,transparent),var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto}header{padding:28px 16px 10px;text-align:center}header h1{margin:0;font-size:clamp(20px,3.6vw,28px);letter-spacing:.2px;font-weight:700}header p{margin:8px 0 0;color:var(--muted);font-size:14px}.container{width:min(980px,92vw);margin:14px auto 28px;display:grid;gap:18px;grid-template-columns:1fr}.panel{background:linear-gradient(180deg,#ffffff05,#ffffff03);border:1px solid rgba(255,255,255,.06);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,#ffffff08,#fff0)}.panel-header h2{font-size:16px;margin:0;font-weight:600;letter-spacing:.2px}.grid{display:grid;gap:14px;padding:16px}@media (min-width: 720px){.container{grid-template-columns:1fr 1.2fr;align-items:start}.grid.fields{grid-template-columns:repeat(2,1fr)}}.field{display:grid;gap:6px}.label-row{display:flex;gap:8px;align-items:center}label{font-size:13px;color:var(--muted)}.suffix{margin-left:auto;font-size:12px;color:var(--muted);opacity:.9}input[type=number]{width:100%;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#ffffff05,#ffffff04);color:var(--text);outline:none;transition:border-color .15s ease,box-shadow .15s ease;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}input[type=number]:focus{border-color:#4f8cffb3;box-shadow:0 0 0 3px #4f8cff2e}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.error{color:var(--danger);font-size:12px}.hint{color:var(--muted);font-size:12px}.actions{display:flex;gap:10px;padding:0 16px 16px}.btn{padding:12px 16px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:var(--panel);color:var(--text);font-weight:600;cursor:pointer;transition:transform .05s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease}.btn.primary{background:linear-gradient(135deg,var(--accent),#6aa6ff);border:none;box-shadow:0 8px 20px #4f8cff59}.btn.secondary{background:linear-gradient(135deg,#334155,#232d3f)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.6;cursor:not-allowed}.result{padding:16px;display:grid;gap:12px}.kpis{display:grid;gap:12px;grid-template-columns:1fr}@media (min-width: 520px){.kpis{grid-template-columns:repeat(4,1fr)}}.kpi{background:var(--panel-2);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:12px}.kpi .label{color:var(--muted);font-size:12px}.kpi .value{font-size:18px;font-weight:700;margin-top:4px}.steps{background:#0c1222;border:1px dashed rgba(255,255,255,.12);border-radius:12px;padding:12px;overflow-x:auto}pre{margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:13px;color:#e5e7eb}code{white-space:pre}footer{text-align:center;color:var(--muted);font-size:12px;padding:16px}.data-table{width:100%;border-collapse:collapse;table-layout:fixed}.data-table th,.data-table td{border:1px solid rgba(255,255,255,.18);padding:6px;font-size:13px;vertical-align:middle;background:#ffffff05}.data-table thead th{position:sticky;top:0;background:#0f1523;color:var(--muted);z-index:1}.data-table input[type=number]{width:100%;padding:6px;border-radius:0;border:none;outline:none;background:transparent;color:var(--text);font-size:13px}.data-table input[type=number]:focus{box-shadow:inset 0 0 0 1px #4f8cff99;border-radius:2px}.data-table tr:nth-child(2n) td{background:#ffffff04}.data-table tr:hover td{background:#4f8cff14}
