:root {
            --font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            --color-bg: #f0f0f0;
            --color-window-bg: #ffffff;
            --color-border: #a0a0a0;
            --color-title-bg: #e1e1e1;
            --color-text: #000;
            --color-primary: #3478c5;
            --color-danger: #e81123;
            --color-success: #28a745;
        }

        body, html {
            height: 100%;
            margin: 0;
            overflow: hidden;
            background-color: var(--color-bg);
            font-family: var(--font-main);
            font-size: 14px;
            user-select: none;
        }
        
        #login-screen { display: flex; align-items: center; justify-content: center; height: 100%; }
        .login-box { background: var(--color-window-bg); padding: 30px; border: 1px solid var(--color-border); border-radius: 5px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); width: 320px; }
        .login-box h2 { text-align: center; margin-top: 0; }
        .login-box .input-group { margin-bottom: 15px; }
        .login-box label { display: block; margin-bottom: 5px; font-weight: 600; }
        .login-box input { width: 100%; padding: 8px; border: 1px solid var(--color-border); border-radius: 3px; box-sizing: border-box; }
        .login-box button { width: 100%; padding: 10px; background: var(--color-primary); color: white; border: none; border-radius: 3px; cursor: pointer; font-size: 16px; }
        .login-box .toggle-form { text-align: center; margin-top: 15px; }
        .login-box .toggle-form a { color: var(--color-primary); cursor: pointer; text-decoration: none; }
        .login-box .error-message { color: var(--color-danger); text-align: center; margin-bottom: 10px; min-height: 18px; }
        #register-form { display: none; }

        #app-container { display: none; height: 100%; }
        #desktop { height: 100%; position: relative; }
        
        .window { position: absolute; background: var(--color-window-bg); border: 1px solid var(--color-border); box-shadow: 0 2px 8px rgba(0,0,0,0.15); display: flex; flex-direction: column; border-radius: 4px; min-width: 200px; min-height: 300px; }
        .title-bar { height: 30px; border-bottom: 1px solid #c0c0c0; padding: 0 8px; display: flex; align-items: center; justify-content: space-between; cursor: grab; background: var(--color-title-bg); border-radius: 4px 4px 0 0; font-weight: 600; flex-shrink: 0; }
        .title-bar:active { cursor: grabbing; }
        .title-bar-controls { display: flex; align-items: center; gap: 5px; }
        .title-bar .title { flex-grow: 1; padding-left: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .title-bar-button { width: 22px; height: 22px; border: none; background: transparent; font-size: 16px; color: #666; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; line-height: 1; border-radius: 2px; }
        .title-bar-button:hover { background-color: rgba(0,0,0,0.1); }
        .close-button:hover { color: #fff; background-color: var(--color-danger); }
        .window-body { flex-grow: 1; padding: 15px; display: flex; flex-direction: column; overflow: hidden; }
        
        .tool-launcher { width: 200px; }
        .tool-launcher .tool-list { list-style: none; padding: 0; margin: 0; }
        .tool-launcher .tool-list li { padding: 8px 12px; cursor: pointer; border-bottom: 1px solid #eee; display: flex; align-items: center; gap: 10px; width: 200px; }
        .tool-launcher .tool-list li:hover { background-color: var(--color-primary); color: white; }
        .tool-launcher .tool-list svg { width: 16px; height: 16px; }

        .form-row { display: flex; gap: 8px; margin-bottom: 15px; align-items: center; flex-shrink: 0; }
        .ping-options, .traceroute-options, .mtr-options, .wping-options { display: none; gap: 15px; margin-bottom: 15px; flex-wrap: wrap; align-items: center; }
        .ping-options .input-group, .traceroute-options .input-group, .mtr-options .input-group, .wping-options .input-group { display: flex; align-items: center; gap: 5px; }
        .ping-options .input-group input[type="checkbox"] { margin-left: 10px; }
        .command-form input, .command-form select, button { border: 1px solid var(--color-border); background: var(--color-window-bg); font-family: var(--font-main); font-size: 14px; padding: 6px 8px; border-radius: 3px; }
        .ping-options input[type="number"], .traceroute-options input[type="number"], .mtr-options input[type="number"], .wping-options input[type="number"] { width: 60px; }
        button { cursor: pointer; background-color: #e1e1e1; border-color: #adadad; }
        button:hover { border-color: var(--color-primary); }
        button:active { background-color: #c1c1c1; }
        button.stop-button { background-color: var(--color-danger); color: white; border-color: #c00; }
        .form-row input[type="text"] { flex-grow: 1; }
        
        .output-area { flex-grow: 1; background: #2b2b2b; color: #a9b7c6; border: 1px solid #444; padding: 10px; overflow: auto; white-space: pre; font-family: 'Consolas', 'Menlo', monospace; border-radius: 3px; user-select: text; }
        .output-area .error-line { color: var(--color-danger); font-weight: bold; }
        .resize-handle { position: absolute; bottom: 0; right: 0; width: 12px; height: 12px; cursor: se-resize; }

        /* Estilos do Dashboard SNMP */
        .snmp-config .input-group { margin-bottom: 10px; }
        .snmp-config .input-group textarea { width: 100%; height: 100px; padding: 8px; border: 1px solid var(--color-border); border-radius: 3px; box-sizing: border-box; resize: vertical; }
        .snmp-config button { margin-top: 10px; }
        .snmp-data-list { list-style: none; padding: 0; margin: 0; }
        .snmp-data-list li { padding: 8px; border-bottom: 1px solid #eee; }
        .snmp-dashboard-body { flex-grow: 1; overflow-y: auto; }
        .snmp-dashboard .window-body { padding: 0; }
        .snmp-dashboard .error-line { padding: 15px; }