body {
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      margin: 0;
      background: #1e1e1e; /* Dark grey background */
      color: #f1f1f1;       /* Light text */
      height: 100vh;
      display: flex;
      flex-direction: column;
    }

    header {
      background: #2c2c2c;  /* Slightly lighter dark grey */
      color: white;
      padding: 1rem 2rem;
      display: flex;
      justify-content: space-between;
      align-items: center;
      box-shadow: 0 2px 4px rgba(0,0,0,0.3);
      flex-shrink: 0;
    }

    header h1 {
      margin: 0;
      font-size: 1.5rem;
    }

    header button {
      background: #00c853;  /* Bright green */
      border: none;
      color: white;
      padding: 0.5rem 1rem;
      border-radius: 6px;
      cursor: pointer;
      font-size: 1rem;
    }

    main {
      display: flex;
      flex: 1;
      gap: 1.5rem;
      padding: 1.5rem;
      box-sizing: border-box;
      overflow: hidden;
      min-height: 0;
    }

    /* Left column for actions */
    .actions {
      flex: 2;
      display: flex;
      flex-direction: column;
      gap: 1rem;
      overflow-y: auto;
      min-height: 0;
    }

    /* Collapsible section styling */
    details.action-section {
      background: #2a2a2a;  /* Slightly lighter dark background */
      padding: 1rem;
      border-radius: 12px;
      box-shadow: 0 4px 12px rgba(0,0,0,0.4);
      display: flex;
      flex-direction: column;
      gap: 0.5rem;
      box-sizing: border-box;
      cursor: pointer;
    }

    details[open] {
      margin-bottom: 0.5rem;
    }

    details summary {
      font-size: 1.25rem;
      font-weight: bold;
      color: #00c853;
      outline: none;
      list-style: none;
    }

    details summary::-webkit-details-marker {
      display: none;
    }

    label {
      font-weight: 500;
      color: #f1f1f1;
    }

    input {
      padding: 0.5rem;
      border-radius: 6px;
      border: 1px solid #666;
      font-size: 1rem;
      background: #1e1e1e;
      color: #f1f1f1;
      width: 100%;
      box-sizing: border-box;
    }

    button.submit {
      margin-top: 0.5rem;
      background: #00c853;  /* Bright green */
      color: white;
      border: none;
      padding: 0.75rem;
      border-radius: 8px;
      cursor: pointer;
      font-size: 1rem;
      transition: background 0.3s ease;
    }

    button.submit:hover {
      background: #00e676;  /* Lighter green on hover */
    }

    /* Right column for log panel */
    #logPanel {
      flex: 1;
      background: #121212;  /* Deep dark background */
      color: #f1f1f1;
      padding: 1rem;
      border-radius: 12px;
      overflow-y: auto;
      font-family: monospace;
      white-space: pre-line;
      min-width: 200px;
      border: 1px solid #00c853;
    }

    #logPanel h2 {
      margin-top: 0;
      margin-bottom: 0.5rem;
      font-size: 1.25rem;
      color: #00c853;  /* Match action color */
    }

    /* Responsive adjustments */
    @media (max-width: 900px) {
      main {
        flex-direction: column;
        overflow: auto;
      }
      .actions, #logPanel {
        flex: unset;
      }
    }