.tj, .tj * { box-sizing: border-box; }
.tj { padding: 0 16px; }
.tj-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; }
.tj label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.tj input, .tj select { width: 100%; padding: 8px; border: 1px solid rgba(128,128,128,.45); border-radius: 6px; background: transparent; color: inherit; font: inherit; }
.tj button { padding: 8px 14px; margin: 2px 6px 2px 0; border: 0; border-radius: 6px; background: #2563eb; color: #fff; font: inherit; cursor: pointer; }
.tj button:focus-visible, .tj input:focus-visible, .tj select:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.tj-tf button { padding: 4px 10px; background: rgba(128,128,128,.25); color: inherit; }
.tj-ch { height: 380px; margin: 8px 0 16px; }
.tj-err { display: block; opacity: .75; }
.tj-scroll { overflow-x: auto; }
.tj table { width: 100%; border-collapse: collapse; }
.tj th, .tj td { padding: 8px; text-align: left; white-space: nowrap; border-bottom: 1px solid rgba(128,128,128,.25); }
.tj-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin-bottom: 8px; }
.tj-card { padding: 12px; border: 1px solid rgba(128,128,128,.35); border-radius: 8px; }
.tj-card small { display: block; opacity: .75; }
.tj-card b { font-size: 20px; }
.tj .w { color: #16a34a; }
.tj .l { color: #dc2626; }
.tj-edit { margin-top: 24px; }
.tj-btn { display: inline-block; padding: 8px 16px; border-radius: 6px; background: #2563eb; color: #fff !important; text-decoration: none; }
.tj-btn.tj-alt { padding: 6px 12px; font-size: 13px; background: rgba(128,128,128,.3); color: inherit !important; }
.tj-bar { text-align: right; padding-bottom: 0; }