body{font-family:Arial,sans-serif;max-width:800px;margin:0 auto;padding:20px;background-color:#f5f5f5}h1{color:#333;border-bottom:3px solid #2196F3;padding-bottom:10px}.container{background-color:#fff;padding:30px;border-radius:8px;box-shadow:0 2px 4px #0000001a;margin-bottom:20px}.controls{margin:20px 0;padding:20px;background-color:#e8f5e9;border-radius:4px}button{background-color:#2196f3;color:#fff;padding:12px 24px;font-size:16px;border:none;border-radius:4px;cursor:pointer;margin-right:10px;transition:background-color .3s}button:hover{background-color:#1976d2}button:active{transform:translateY(1px)}.log{margin-top:20px;padding:15px;background-color:#263238;color:#4caf50;border-radius:4px;font-family:monospace;font-size:12px;max-height:300px;overflow-y:auto}.log-entry{margin:5px 0;border-left:3px solid #4CAF50;padding:5px 5px 5px 10px}.log-entry.received{border-left-color:#ff9800;color:#ff9800}.log-entry.sent{border-left-color:#2196f3;color:#2196f3}.log-entry.action{border-left-color:#4caf50;color:#4caf50}.status{display:inline-block;padding:4px 8px;border-radius:3px;font-size:12px;margin-left:10px}.status.ready{background-color:#4caf50;color:#fff}.status.waiting{background-color:#ff9800;color:#fff}.grid-version{display:grid;grid-template-columns:1fr 1fr;gap:12px}.grid-version .cell{border:1px solid #ccc;border-radius:8px;padding:1.5rem;display:flex;align-items:center;justify-content:center;min-height:120px}
