
    * { box-sizing: border-box; }
    body {
        margin: 0;
        font-family: "Microsoft YaHei", "Segoe UI", sans-serif;
        background: #f0f4f8;
        color: #1c2733;
    }
    header {
        background: linear-gradient(135deg, #2f6fed, #1e4fc9);
        color: #fff;
        padding: 14px 24px;
        box-shadow: 0 2px 8px rgba(0,0,0,.15);
    }
    header h1 { margin: 0; font-size: 18px; font-weight: 600; }
    header p { margin: 4px 0 0; font-size: 12px; opacity: .85; }
    .tabs {
        display: flex;
        gap: 4px;
        padding: 10px 24px 0;
    }
    .tab-btn {
        border: none;
        background: #dde6f2;
        color: #33445c;
        padding: 8px 22px;
        font-size: 14px;
        border-radius: 6px 6px 0 0;
        cursor: pointer;
    }
    .tab-btn.active { background: #fff; color: #2f6fed; font-weight: 600; }
    .tab-panel {
        margin: 0 24px 16px;
        background: #fff;
        border-radius: 0 6px 6px 6px;
        padding: 16px;
        box-shadow: 0 1px 4px rgba(0,0,0,.08);
    }
    .toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 12px; }
    .toolbar label { font-size: 13px; color: #44556c; }
    .toolbar input, .toolbar select {
        border: 1px solid #c3cfdd;
        border-radius: 4px;
        padding: 5px 8px;
        font-size: 13px;
        font-family: Consolas, monospace;
        background: #fafcff;
    }
    .btn {
        border: none;
        border-radius: 4px;
        padding: 6px 14px;
        font-size: 13px;
        background: #2f6fed;
        color: #fff;
        cursor: pointer;
    }
    .btn:hover { background: #255cd1; }
    .btn.ghost { background: #eef2f8; color: #2f6fed; border: 1px solid #c3cfdd; }
    .btn.ghost:hover { background: #dfe8f5; }
    .cols { display: flex; gap: 14px; }
    .col { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
    .col label { font-size: 13px; color: #44556c; }
    textarea {
        width: 100%;
        min-height: 320px;
        resize: vertical;
        border: 1px solid #c3cfdd;
        border-radius: 4px;
        padding: 8px;
        font-family: Consolas, "Courier New", monospace;
        font-size: 13px;
        line-height: 1.5;
        background: #fafcff;
        white-space: pre;
    }
    textarea[readonly] { background: #f2f6fb; color: #1c2733; }
    .status {
        margin-top: 10px;
        padding: 6px 10px;
        border-radius: 4px;
        font-size: 12px;
        background: #eef7ee;
        color: #2e7d32;
    }
    .status.error { background: #fdecea; color: #c62828; }
    .hint { font-size: 12px; color: #8a97a8; margin-top: 8px; }
    .out-actions { display: flex; gap: 8px; }
    .field-label { font-size: 13px; color: #44556c; margin-bottom: 4px; display: block; }
    #caveBytesIn { min-height: 90px; }
    #hookOut, #caveOut { min-height: 90px; }
    .return-addr {
        margin-top: 8px;
        font-size: 13px;
        color: #2f6fed;
        font-family: Consolas, monospace;
    }
