.scenario-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.25rem; } .table { width: 100%; border-collapse: collapse; border-radius: var(--table-radius); overflow: hidden; box-shadow: var(--shadow); } .table th, .table td { padding: 0.75rem 1rem; border-bottom: 1px solid var(--color-border); background: rgba(21, 27, 35, 0.85); } .table tbody tr:hover { background: rgba(43, 165, 143, 0.12); } .breadcrumb { display: flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; color: var(--muted); margin-bottom: 1.2rem; } .breadcrumb a { color: var(--brand-2); text-decoration: none; } .actions { display: flex; gap: 0.75rem; } .btn { display: inline-flex; align-items: center; justify-content: center; padding: 0.6rem 1.1rem; border-radius: var(--radius-sm); text-decoration: none; font-weight: 600; transition: transform 0.2s ease, box-shadow 0.2s ease; } .btn-primary { background: linear-gradient(90deg, var(--brand) 0%, var(--brand-2) 100%); color: var(--color-text-dark); box-shadow: 0 8px 18px rgba(241, 178, 26, 0.25); } .btn-secondary { background: rgba(148, 197, 255, 0.2); color: var(--color-text-invert); border: 1px solid rgba(148, 197, 255, 0.35); } .btn-link { padding: 0.35rem 0.5rem; color: var(--brand-3); text-decoration: none; } .btn:hover, .btn:focus { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25); }