:root{--bg: #0b1120;--surface: #131c31;--surface-2: #1b2540;--line: #25304d;--text: #e7ecf5;--muted: #93a0bd;--accent: #f59e0b;--green: #34d399;--red: #f87171;--radius: 14px;--tabbar: 64px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.45 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}button{font:inherit}.app{max-width:720px;margin:0 auto;padding-bottom:calc(var(--tabbar) + env(safe-area-inset-bottom));min-height:100%}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:#0b1120db;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}.topbar h1{font-size:19px;margin:0;letter-spacing:.2px}.topbar .accent{color:var(--accent)}.content{padding:16px;display:flex;flex-direction:column;gap:14px}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px}.card h2{margin:0 0 12px;font-size:15px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}.row{display:flex;gap:12px;align-items:center}.row.between{justify-content:space-between}.row.wrap{flex-wrap:wrap}.grow{flex:1;min-width:0}.muted{color:var(--muted)}.small{font-size:13px}.right{text-align:right}.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px}.kpi .label{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.5px}.kpi .value{font-size:24px;font-weight:700;margin-top:4px}.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600;background:var(--surface-2);border:1px solid var(--line)}.chip.green{color:var(--green)}.chip.red{color:var(--red)}.chip.accent{color:var(--accent)}.pill{padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}.list{display:flex;flex-direction:column;gap:10px}.item{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px;text-decoration:none}.item:active{background:var(--surface-2)}.item .title{font-weight:600}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:12px;border:1px solid var(--line);background:var(--surface-2);color:var(--text);font-weight:600;cursor:pointer}.btn.block{width:100%}.btn.primary{background:var(--accent);color:#1a1206;border-color:transparent}.btn.ghost{background:transparent}.btn.danger{color:var(--red)}.btn:disabled{opacity:.55}label{display:block;font-size:13px;color:var(--muted);margin:0 0 6px}.field{margin-bottom:12px}input,select,textarea{width:100%;min-height:46px;padding:10px 12px;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:12px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--accent)}textarea{min-height:80px;resize:vertical}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.tabbar{position:fixed;bottom:0;left:0;right:0;z-index:20;height:calc(var(--tabbar) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:flex;background:#131c31f5;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--line)}.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;color:var(--muted);font-size:11px}.tabbar a.active{color:var(--accent)}.tabbar .ico{font-size:20px;line-height:1}.center{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:24px;text-align:center}.brandmark{font-size:40px}.error{color:var(--red);font-size:14px}.spinner{width:28px;height:28px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.divider{height:1px;background:var(--line);margin:4px 0}.section-actions{display:flex;gap:8px}
