.tj-app { --tj-ink:#0f172a; --tj-muted:#64748b; --tj-line:#e2e8f0; --tj-paper:#fff; --tj-wash:#f8fafc; --tj-navy:#1e3a8a; --tj-blue:#2563eb; --tj-green:#047857; --tj-red:#b91c1c; --tj-gold:#b45309; max-width:1120px; margin:0 auto; color:var(--tj-ink); }
.tj-hero { background:linear-gradient(135deg,#1e3a8a 0%,#2563eb 52%,#1e40af 100%); color:#fff; border-radius:18px; padding:1.6rem 1.5rem 1.35rem; margin-bottom:1.1rem; box-shadow:0 10px 30px rgba(30,58,138,.18); }
.tj-hero h1, .tj-hero h1 i { font-size:1.55rem; font-weight:800; margin:0 0 .25rem; letter-spacing:-.02em; color:#fff !important; }
.tj-hero p { margin:0; opacity:.86; font-size:.95rem; }
.tj-hero .tj-note { color:rgba(255,255,255,.92) !important; opacity:1; margin:.45rem 0 0; }
.tj-hero .tj-note strong { color:#fff !important; }
.tj-coupon {
  color:#ca8a04 !important;
  font-size:.95rem;
  font-weight:700;
}
.tj-coupon strong { color:#a16207 !important; font-weight:800; }
.tj-hero .tj-coupon {
  color:#fde047 !important;
  opacity:1;
  margin:.5rem 0 0;
  font-size:.95rem;
  font-weight:700;
  text-shadow:0 1px 0 rgba(15,23,42,.35);
}
.tj-hero .tj-coupon strong { color:#fde047 !important; font-weight:800; }
.tj-app a, .tj-app a:hover, .tj-app a:focus, .tj-app a:visited {
  color:#0f172a !important;
  text-decoration:none !important;
}
.tj-nav { display:flex; flex-wrap:wrap; gap:.45rem; margin:1rem 0 1.15rem; }
.tj-nav a, .tj-nav a:hover, .tj-nav a:focus, .tj-nav a:visited {
  display:inline-flex; align-items:center; gap:.4rem; padding:.48rem 1rem; border-radius:999px; text-decoration:none !important; font-weight:750; font-size:.88rem;
  color:#0f172a !important; background:#fff !important; border:1px solid #cbd5e1 !important; box-shadow:0 1px 0 rgba(15,23,42,.04);
}
.tj-nav a:hover { background:#f1f5f9 !important; }
.tj-nav a i { color:inherit !important; }
.tj-nav a.is-on, .tj-nav a.is-on:hover, .tj-nav a.is-on:focus, .tj-nav a.is-on:visited {
  background:#0f172a !important; color:#fff !important; border-color:#0f172a !important; box-shadow:none;
}
.tj-kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:.75rem; margin-bottom:1.1rem; }
.tj-kpi { background:var(--tj-paper); border:1px solid var(--tj-line); border-radius:14px; padding:.9rem 1rem; }
.tj-kpi span { display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--tj-muted); font-weight:700; }
.tj-kpi strong { display:block; font-size:1.28rem; margin-top:.2rem; letter-spacing:-.03em; }
.tj-card { background:var(--tj-paper); border:1px solid var(--tj-line); border-radius:16px; margin-bottom:1rem; overflow:hidden; }
.tj-card h2, .tj-card h3 { font-size:1.05rem; font-weight:800; margin:0; }
.tj-hd { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.95rem 1.1rem; border-bottom:1px solid var(--tj-line); background:var(--tj-wash); }
.tj-bd { padding:1.1rem; }
.tj-pos { color:var(--tj-green); }
.tj-neg { color:var(--tj-red); }
.tj-flat { color:var(--tj-muted); }
.tj-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:.85rem; }
.tj-acct, .tj-app a.tj-acct, .tj-app a.tj-acct:hover, .tj-app a.tj-acct:visited {
  border:1px solid var(--tj-line); border-radius:14px; padding:1rem; background:#fff; display:flex; flex-direction:column; gap:.35rem; min-height:148px; text-decoration:none !important; color:#0f172a !important;
}
.tj-acct-main { display:flex; flex-direction:column; gap:.35rem; text-decoration:none !important; color:#0f172a !important; }
.tj-acct-actions { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.35rem; }
.tj-acct-actions .tj-btn { padding:.32rem .7rem; font-size:.78rem; }
.tj-acct:hover { border-color:#94a3b8; box-shadow:0 8px 18px rgba(15,23,42,.07); }
.tj-acct .meta { color:var(--tj-muted); font-size:.82rem; }
.tj-pill { display:inline-flex; align-items:center; border-radius:999px; padding:.12rem .55rem; font-size:.72rem; font-weight:700; background:#f1f5f9; color:#0f172a; border:1px solid #cbd5e1; cursor:default; }
.tj-pill:hover { background:#e2e8f0; color:#0f172a; }
.tj-pill.ok { background:#ecfdf5; color:#065f46; border-color:#6ee7b7; }
.tj-pill.ok:hover { background:#d1fae5; color:#065f46; }
.tj-pill.warn { background:#fffbeb; color:#92400e; border-color:#fcd34d; }
.tj-pill.warn:hover { background:#fef3c7; color:#92400e; }
.tj-pill.bad { background:#fef2f2; color:#991b1b; border-color:#fca5a5; }
.tj-pill.bad:hover { background:#fee2e2; color:#991b1b; }
.tj-form { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:.7rem .8rem; }
.tj-form.tight { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }
.tj-form-simple { grid-template-columns:repeat(4,minmax(0,1fr)); }
.tj-form label { display:flex; flex-direction:column; gap:.28rem; font-size:.78rem; font-weight:700; color:#475569; }
.tj-form label.span2 { grid-column:span 2; }
.tj-form label.span3 { grid-column:1 / -1; }
.tj-form input, .tj-form select, .tj-form textarea { border:1px solid #cbd5e1; border-radius:10px; padding:.48rem .65rem; font-size:.92rem; color:#0f172a; background:#fff; }
.tj-form textarea { min-height:84px; resize:vertical; }
.tj-form input:focus, .tj-form select:focus, .tj-form textarea:focus { outline:2px solid #93c5fd; border-color:#2563eb; }
.tj-actions { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin-top:.4rem; }
.tj-btn, a.tj-btn, button.tj-btn,
.tj-app a.tj-btn, .tj-app a.tj-btn:hover, .tj-app a.tj-btn:focus, .tj-app a.tj-btn:visited {
  display:inline-flex; align-items:center; gap:.4rem; border:0; border-radius:10px; padding:.55rem 1rem; font-weight:750; font-size:.9rem;
  background:#0f172a !important; color:#fff !important; text-decoration:none !important; cursor:pointer;
}
.tj-btn:hover, .tj-app a.tj-btn:hover { color:#fff !important; filter:brightness(1.08); }
.tj-btn i, a.tj-btn i { color:inherit !important; }
.tj-btn.ghost, a.tj-btn.ghost, .tj-app a.tj-btn.ghost, .tj-app a.tj-btn.ghost:hover, .tj-app a.tj-btn.ghost:visited {
  background:#fff !important; color:#0f172a !important; border:1px solid #cbd5e1 !important; filter:none;
}
.tj-btn.danger, a.tj-btn.danger { background:#991b1b !important; color:#fff !important; }
.tj-btn.green, a.tj-btn.green { background:#047857 !important; color:#fff !important; }
.tj-table { width:100%; border-collapse:collapse; font-size:.88rem; }
.tj-table th { text-align:left; font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--tj-muted); padding:.55rem .5rem; border-bottom:1px solid var(--tj-line); }
.tj-table td { padding:.6rem .5rem; border-bottom:1px solid #f1f5f9; vertical-align:top; }
.tj-table tr:hover td { background:#f8fafc; }
.tj-empty { text-align:center; padding:2.2rem 1rem; color:var(--tj-muted); }
.tj-empty i { font-size:2rem; display:block; margin-bottom:.4rem; opacity:.7; }
.tj-flash { border-radius:12px; padding:.75rem 1rem; margin-bottom:1rem; font-weight:650; }
.tj-flash.ok { background:#ecfdf5; color:#065f46; border:1px solid #a7f3d0; }
.tj-flash.err { background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }
.tj-note { color:var(--tj-muted); font-size:.84rem; }
.tj-split { display:grid; grid-template-columns:1.4fr .9fr; gap:1rem; }
.tj-heat { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.tj-heat i { display:block; aspect-ratio:1; border-radius:4px; background:#e2e8f0; }
.tj-heat i[data-v="p"] { background:#059669; }
.tj-heat i[data-v="m"] { background:#34d399; }
.tj-heat i[data-v="n"] { background:#f87171; }
.tj-heat i[data-v="z"] { background:#cbd5e1; }
details.tj-more { grid-column:1 / -1; }
details.tj-more summary { cursor:pointer; font-weight:700; color:#0f172a; margin-bottom:.6rem; }
.tj-filters { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:.8rem; }
.tj-filters input, .tj-filters select { border:1px solid #cbd5e1; border-radius:10px; padding:.4rem .6rem; }
.tj-tiny { font-size:.78rem; color:var(--tj-muted); }
.tj-toggle { display:inline-flex; border:1px solid var(--tj-line); border-radius:999px; overflow:hidden; background:#fff; }
.tj-toggle label { margin:0; cursor:pointer; }
.tj-toggle input { position:absolute; opacity:0; pointer-events:none; }
.tj-toggle span { display:block; min-width:4.2rem; text-align:center; padding:.5rem 1.2rem; font-weight:800; font-size:.82rem; letter-spacing:.06em; color:#64748b; }
.tj-toggle label:first-child input:checked + span { background:#334155; color:#fff; }
.tj-toggle label:last-child input:checked + span { background:#047857; color:#fff; }
.tj-readonly form[method="post"]:not(.tj-pin-form) { display:none !important; }
.tj-share-shell { max-width:520px; margin:2.5rem auto 3rem; padding:0 1rem; }
.tj-pin-card { box-shadow:0 12px 32px rgba(15,23,42,.08); }
.tj-pin-form label { display:flex; flex-direction:column; gap:.35rem; font-size:.78rem; font-weight:700; color:#475569; }
.tj-pin-form input[name="pin"] { border:1px solid #cbd5e1; border-radius:12px; padding:.7rem .8rem; font-size:1.35rem; letter-spacing:.35em; text-align:center; max-width:220px; }
.tj-share-list { display:flex; flex-direction:column; gap:.45rem; max-width:560px; }
.tj-share-row { display:flex; align-items:flex-start; gap:.7rem; margin:0; padding:.7rem .85rem; border:1px solid #e2e8f0; border-radius:12px; background:#fff; cursor:pointer; }
.tj-share-row:hover { border-color:#94a3b8; background:#f8fafc; }
.tj-share-row input { margin-top:.2rem; }
.tj-share-row span { display:flex; flex-direction:column; gap:.1rem; }
.tj-share-row strong { font-size:.92rem; color:#0f172a; }
.tj-rule { display:flex; justify-content:space-between; gap:1rem; padding:.45rem 0; border-bottom:1px dashed #e2e8f0; font-size:.9rem; }
.tj-rule a { text-decoration:underline !important; }
.tj-form .tj-field { display:flex; flex-direction:column; gap:.28rem; font-size:.78rem; font-weight:700; color:#475569; }
.tj-form .tj-toggle label { display:block; gap:0; font-size:inherit; font-weight:inherit; color:inherit; }
.tj-remind { display:flex; justify-content:space-between; gap:1rem; align-items:baseline; padding:.7rem .85rem; border:1px solid #cbd5e1; border-radius:12px; background:#fff; color:#0f172a !important; text-decoration:none !important; margin-bottom:.45rem; }
.tj-remind:last-child { margin-bottom:0; }
.tj-remind strong { color:#0f172a !important; }
.tj-remind span { color:#334155 !important; font-weight:700; }
.tj-remind.warn { background:#fffbeb; border-color:#f59e0b; }
.tj-remind.bad { background:#fef2f2; border-color:#ef4444; }
.tj-chart { height:240px; }
.tj-pager { display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.85rem; }
.tj-pager a { display:inline-flex; min-width:2rem; justify-content:center; padding:.35rem .6rem; border-radius:8px; font-weight:750; font-size:.82rem; color:#0f172a !important; background:#fff !important; border:1px solid #cbd5e1 !important; text-decoration:none !important; }
.tj-pager a.is-on { background:#0f172a !important; color:#fff !important; border-color:#0f172a !important; }
.tj-modal[hidden] { display:none !important; }
.tj-modal {
  position:fixed; inset:0; z-index:2400; display:flex; align-items:flex-start; justify-content:center;
  padding:8vh 1rem 2rem; background:rgba(15,23,42,.48);
}
.tj-modal-card {
  width:min(540px,100%); background:#fff; border-radius:16px; overflow:hidden;
  box-shadow:0 18px 50px rgba(15,23,42,.28); max-height:80vh; display:flex; flex-direction:column;
}
.tj-modal-card .tj-bd { overflow:auto; }
.tj-form .tj-modal { grid-column:1 / -1; }
.tj-form .tj-share-row { flex-direction:row; align-items:flex-start; font-size:inherit; font-weight:inherit; color:inherit; }
.tj-form .tj-share-row input[type="checkbox"] { width:auto; margin-top:.2rem; padding:0; border:0; box-shadow:none; }
@media (max-width: 860px) {
  .tj-split { grid-template-columns:1fr; }
  .tj-form label.span2 { grid-column:1 / -1; }
  .tj-form-simple { grid-template-columns:1fr 1fr; }
}
