:root{--bg: #EAF1FB;--panel: #FFFFFF;--border: #E5E8EE;--text: #1F2430;--text-muted: #6B7280;--accent: #00A99D;--accent-soft: #E1F6F4;--tools-link: #F26522;--hint: #E5484D;--success: #16A34A;--term-bg: #0B0F14;--term-text: #8FF0A4;--term-muted: #5B6B73;--radius: 10px;--font-body: "Inter", sans-serif;--font-mono: "JetBrains Mono", monospace}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%}body{font-family:var(--font-body);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-size:13.5px}button{font-family:inherit;cursor:pointer}input,select,textarea{font-family:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:1px}a{color:inherit;text-decoration:none}.app{min-height:100vh;display:flex;flex-direction:column}.topbar{height:52px;flex:none;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:14px;padding:0 18px;position:sticky;top:0;z-index:20}.topbar:after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:linear-gradient(90deg,#2dd4cb,#0e9e9e 45%,#1e3a8a)}.hamburger{width:32px;height:32px;border:none;background:transparent;border-radius:7px;display:flex;align-items:center;justify-content:center;color:#475467}.hamburger:hover{background:#f1f3f7}.logo{display:flex;align-items:center;gap:8px}.logo small{font-size:10px;font-weight:700;color:#94a3b8;margin-left:2px;letter-spacing:.08em;text-transform:uppercase;padding-left:8px;border-left:1px solid var(--border)}.topbar-right{margin-left:auto;display:flex;align-items:center;gap:12px}.pill{display:flex;align-items:center;gap:6px;font-size:11px;color:#0e7a3c;background:#e9f9ef;border:1px solid #C9F0D6;padding:4px 9px;border-radius:999px;font-weight:600}.user-role-label{font-size:12px;font-weight:600;color:#344054}.avatar{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,#00a99d,#1e3a8a);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11.5px}.body-row{flex:1;display:flex;min-height:0}.sidebar{width:220px;flex:none;border-right:none;background:linear-gradient(180deg,#0b1e3d,#123a66);padding:16px 12px 14px;overflow-y:auto;transition:width .18s ease,padding .18s ease,opacity .12s ease;display:flex;flex-direction:column}.sidebar-logout{margin-top:auto;padding-top:10px;border-top:1px solid rgba(255,255,255,.12)}.sidebar-logout .side-item{color:#fca5a5}.sidebar-logout .side-item:hover{background:#dc26262e}.app.collapsed .sidebar{width:0;padding:16px 0;opacity:0;overflow:hidden;border-right:none}.side-item{width:100%;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;border:none;background:transparent;color:#b9c9e6;font-size:13px;font-weight:500;text-align:left}.side-item:hover{background:#ffffff14}.side-item.active{background:#ffffff24;color:#fff;font-weight:600}.side-item svg{flex:none;opacity:.85}.tools-label{font-size:10.5px;letter-spacing:.1em;color:#6e86b4;font-weight:700;text-transform:uppercase;padding:16px 10px 8px}.tools-group-btn{width:100%;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;border:none;background:transparent;color:#b9c9e6;font-size:13px;font-weight:500;text-align:left}.tools-group-btn:hover{background:#ffffff14}.tools-group-btn svg.chev{margin-left:auto;transition:transform .15s ease;flex:none;color:#6e86b4}.tools-group-btn.open svg.chev{transform:rotate(90deg)}.tools-submenu{overflow:hidden;max-height:0;transition:max-height .18s ease;padding-left:8px}.tools-submenu.open{max-height:200px}.tools-sublink{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:none;background:transparent;color:#fff;font-size:12.8px;font-weight:500;padding:7px 10px 7px 26px;border-radius:8px;position:relative}.tools-sublink:before{content:"";position:absolute;left:14px;top:50%;width:5px;height:5px;border-radius:50%;background:#fff6;transform:translateY(-50%)}.tools-sublink:hover{background:#ffffff14}.tools-sublink.active{background:#2dd4cb33;font-weight:700;color:#fff}.tools-sublink.active:before{background:#2dd4cb}.main{flex:1;min-width:0;display:flex;flex-direction:column}.page-scroll{flex:1;padding:26px 30px 10px}.page-head{margin-bottom:18px}.page-head h1{font-size:19px;margin:0 0 3px;font-weight:700}.page-head p{margin:0;font-size:12.5px;color:var(--text-muted)}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius)}.card-head{padding:16px 18px;border-bottom:1px solid var(--border)}.card-head h3{margin:0;font-size:14.5px;font-weight:700}.card-head p{margin:3px 0 0;font-size:12px;color:var(--text-muted)}.card-body{padding:18px}.hero-light{border-radius:12px;padding:22px 24px;margin-bottom:20px;background:linear-gradient(120deg,#e9f2ff,#e1f6f4 60%,#dcebfb);border:1px solid #CFE3FA;position:relative;overflow:hidden}.hero-light .eyebrow{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#0e9e9e;font-weight:800;margin-bottom:6px}.hero-light h2{font-size:20px;margin:0;line-height:1.35;color:#1e3a8a;white-space:nowrap}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}.stat-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px 16px 14px}.stat-card .stat-label{font-size:11.5px;color:var(--text-muted);display:flex;align-items:center;gap:7px}.stat-card .stat-value{font-size:24px;font-weight:800;margin-top:8px}.stat-card .stat-sub{font-size:11px;color:var(--text-muted);margin-top:3px}.stat-icon{width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex:none}.grid-2{display:grid;grid-template-columns:1.5fr 1fr;gap:16px;align-items:start}table.activity{width:100%;border-collapse:collapse;font-size:12.6px}table.activity th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);padding:0 8px 9px;font-weight:700}table.activity td{padding:10px 8px;border-top:1px solid var(--border);vertical-align:top}.tag{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:999px}.tag.gen{background:#e7f0ff;color:#1d4ed8}.tag.rev{background:#fff1e6;color:#b45309}.empty-state{padding:30px 10px;text-align:center;color:var(--text-muted)}.empty-state svg{margin-bottom:9px;opacity:.4}.empty-state p{margin:0 0 12px;font-size:12.5px}.btn{border:none;border-radius:7px;padding:8px 14px;font-size:12.6px;font-weight:600;display:inline-flex;align-items:center;gap:6px}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{filter:brightness(1.07)}.btn-ghost{background:#f1f3f7;color:var(--text)}.btn-ghost:hover{filter:brightness(.97)}.btn-dark{background:#1f2937;color:#fff}.btn-sm{padding:6px 11px;font-size:12px;border-radius:6px}.btn-submit{background:var(--accent);color:#fff;border-radius:6px;padding:8px 22px;font-size:13px;font-weight:600;border:none}.btn-submit:hover{filter:brightness(1.06)}.btn:disabled{opacity:.6;cursor:not-allowed}.device-mini{display:flex;flex-wrap:wrap;gap:7px}.device-chip{font-size:11px;padding:5px 9px;border-radius:7px;border:1px solid var(--border);display:flex;align-items:center;gap:6px;color:var(--text-muted);background:#f8fafc}.device-chip .dot{width:6px;height:6px;border-radius:50%;background:var(--success)}.f-label{font-size:12.6px;font-weight:700;color:#1f2430;margin:0 0 6px;display:block}.field{margin-bottom:16px}.field input,.field select{width:100%;padding:8px 10px;border-radius:6px;border:1px solid #D8DCE3;font-size:12.8px;background:#fff;color:var(--text)}.field input:focus,.field select:focus{border-color:var(--accent)}.field.has-error input,.field.has-error select{border-color:var(--hint);background:#fff7f7}.field select.placeholder{color:var(--hint)}.field-with-hint{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap}.field-with-hint input,.field-with-hint select{flex:1;min-width:220px}.inline-hint{font-size:11px;color:var(--hint);background:#fff1f1;border:1px solid #FBD5D5;border-radius:6px;padding:6px 9px;white-space:nowrap;align-self:center}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}.two-col .sub-hint{font-size:11px;color:var(--hint);margin-top:5px}.field .error-msg{font-size:11.5px;color:var(--hint);margin-top:5px;display:none}.field.has-error .error-msg{display:block}.form-actions{display:flex;gap:10px;margin-top:6px;align-items:center}.form-error-banner{background:#fff1f1;border:1px solid #FBD5D5;color:var(--hint);padding:9px 12px;border-radius:8px;font-size:12px;margin-bottom:14px}.term-wrap{position:sticky;top:16px}.output-label{font-size:12.6px;font-weight:700;color:#1f2430;margin-bottom:8px;display:flex;align-items:center;gap:7px}.output-label svg{color:var(--accent)}.term-status{display:none;align-items:center;gap:8px;font-size:11.6px;color:#0e7a3c;background:#e9f9ef;border:1px solid #C9F0D6;padding:8px 11px;border-radius:8px 8px 0 0;font-weight:600}.term-status.show{display:flex}.term-toolbar{display:flex;align-items:center;justify-content:space-between;padding:10px 13px;background:#0f151c;border-radius:10px 10px 0 0}.term-dots{display:flex;gap:6px}.term-dots span{width:8px;height:8px;border-radius:50%;background:#2a3646}.term-title{font-family:var(--font-mono);font-size:11px;color:#8093a6}.term-actions{display:flex;gap:6px}.term-actions button{background:#1b2430;color:#b9c9e6;border:none;border-radius:6px;padding:5px 8px;font-size:10.8px;display:flex;align-items:center;gap:5px;font-weight:500}.term-actions button:hover{background:#243044}.term-actions button:disabled{opacity:.4;cursor:not-allowed}.term-body{background:var(--term-bg);border-radius:0 0 10px 10px;min-height:380px;max-height:600px;overflow:auto;padding:14px 16px;font-family:var(--font-mono);font-size:12px;line-height:1.6;color:var(--term-text)}.term-body .line{display:flex;gap:12px;white-space:pre-wrap;word-break:break-word}.term-body .ln{color:#3c4b57;-webkit-user-select:none;user-select:none;flex:none;width:20px;text-align:right}.term-placeholder{color:var(--term-muted);font-family:var(--font-mono);font-size:12px;line-height:1.7}.caret{display:inline-block;width:6px;height:12px;background:#8ff0a4;animation:blink 1.1s steps(1) infinite;vertical-align:middle;margin-left:2px}@keyframes blink{50%{opacity:0}}.tpl-select-row{display:flex;gap:9px;align-items:center;margin-bottom:11px;flex-wrap:wrap}.tpl-select-row select{padding:7px 9px;border-radius:7px;border:1px solid var(--border);font-size:12px}.code-editor{width:100%;min-height:320px;border-radius:8px;border:1px solid #1B2430;background:#0f151c;color:#c7d6e5;font-family:var(--font-mono);font-size:11.8px;line-height:1.6;padding:13px;resize:vertical}.code-editor:focus{border-color:var(--accent)}.info-strip{display:flex;gap:11px;padding:13px 15px;border:1px dashed #C7D6FF;background:var(--accent-soft);border-radius:10px;font-size:12px;color:#1e3a8a;line-height:1.6;margin-bottom:16px}.device-table{width:100%;border-collapse:collapse;font-size:12.6px;margin-top:4px}.device-table th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);padding:0 9px 9px}.device-table td{padding:10px 9px;border-top:1px solid var(--border)}.footer{border-top:1px solid var(--border);padding:14px 30px;margin-top:20px;display:flex;justify-content:center;flex-wrap:wrap;gap:6px;font-size:11.3px;color:#9aa3b2;background:#fff}.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:#0b1e3d;position:relative;overflow:hidden}.login-screen:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:url(/iconnet-badge.jpg);background-size:cover;background-position:center;background-repeat:no-repeat;opacity:.15}.login-card{width:100%;max-width:360px;background:#fff;border-radius:14px;border:1px solid var(--border);padding:28px 26px;box-shadow:0 25px 60px -20px #00000073;position:relative;z-index:1}.login-header{text-align:center;margin-bottom:18px}.login-header svg{margin:0 auto 14px;display:block}.login-card h1{font-size:17px;margin:0 0 4px}.login-card p.sub{font-size:12.5px;color:var(--text-muted);margin:0}.login-card .field{margin-bottom:14px}@media (max-width: 1080px){.sidebar{display:none}.two-col,.grid-2{grid-template-columns:1fr}.stat-grid{grid-template-columns:1fr 1fr}}
