/* ===========================================================
   Returns Tracker — board, cards, modal, timeline
   Inherits design tokens from styles.css
   =========================================================== */

:root { --rt-bar-h: 70px; }

body.rt-body { overflow-x: hidden; }
.rt-body::before { content: none; }   /* keep ambient bg from styles.css */

/* density */
body.dense-compact { --rt-card-pad: 13px; --rt-card-gap: 9px; --rt-col-pad: 12px; }
body { --rt-card-pad: 16px; --rt-card-gap: 12px; --rt-col-pad: 14px; }

/* ---------- App bar ---------- */
.rt-bar {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; gap: 18px;
  padding: 13px var(--pad);
  background: color-mix(in oklab, var(--bg) 78%, transparent);
  backdrop-filter: blur(18px) saturate(130%); -webkit-backdrop-filter: blur(18px) saturate(130%);
  border-bottom: 1px solid var(--line);
}
.rt-bar .brand .mono { width: 38px; height: 38px; background: linear-gradient(150deg, var(--accent), var(--accent-2)); }
.rt-bar .brand .who b { font-size: 14px; }
.rt-bar .spacer { flex: 1; }

.rt-views { display: inline-flex; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.02); }
.rt-views button {
  font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--muted);
  padding: 8px 16px; border-radius: 999px; border: none; background: transparent; cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px; transition: color .2s, background .2s;
}
.rt-views button:hover { color: var(--fg); }
.rt-views button.active { color: #1c0f06; background: var(--accent); }

.rt-user {
  display: inline-flex; align-items: center; gap: 11px; padding: 7px 8px 7px 14px;
  border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.02); cursor: default;
}
.rt-user .win { width: 13px; height: 13px; opacity: .5; }
.rt-user .uname { display: flex; flex-direction: column; line-height: 1.2; text-align: right; }
.rt-user .uname b { font-size: 13px; font-weight: 600; }
.rt-user .uname span { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--faint); }

.avatar {
  width: 34px; height: 34px; border-radius: 50%; flex: none; display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 700; font-size: 12.5px; color: #10100f;
  letter-spacing: -.01em; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
}
.avatar.sm { width: 26px; height: 26px; font-size: 10.5px; }
.avatar.lg { width: 46px; height: 46px; font-size: 16px; }
.avatar.has-photo { background-size: cover; background-position: center; color: transparent; text-indent: -9999px; }

/* user avatar set button */
.rt-av-set { position: relative; width: 34px; height: 34px; border: none; background: none; padding: 0; cursor: pointer; border-radius: 50%; }
.rt-av-set .avatar { width: 34px; height: 34px; }
.rt-av-set .cam {
  position: absolute; right: -3px; bottom: -3px; width: 16px; height: 16px; border-radius: 50%;
  background: var(--accent); color: #1c0f06; font-size: 11px; font-weight: 700; display: grid; place-items: center;
  border: 2px solid var(--bg); line-height: 1; box-shadow: 0 2px 8px rgba(0,0,0,.4);
}
.rt-av-set .cam:empty { display: none; }
.rt-av-set:hover::after { content: ""; position: absolute; inset: -2px; border-radius: 50%; box-shadow: 0 0 0 2px color-mix(in oklab, var(--accent) 60%, transparent); }

/* ---------- Sub-bar: KPIs + filter ---------- */
.rt-subbar { padding: 22px var(--pad) 6px; max-width: 1640px; margin: 0 auto; }
.rt-kpis { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.rt-kpi {
  padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  position: relative; overflow: hidden;
}
.rt-kpi .n { font-family: var(--font-display); font-weight: 700; font-size: 30px; letter-spacing: -.03em; line-height: 1; }
.rt-kpi .l { font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--faint); margin-top: 8px; }
.rt-kpi.warn .n { color: #ff8a5c; }
.rt-kpi.danger .n { color: #ff6b6b; }
.rt-kpi.good .n { color: #41d77f; }

.rt-toolbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 20px; }
.rt-toolbar .title { font-family: var(--font-display); font-weight: 700; font-size: 22px; letter-spacing: -.02em; }
.rt-toolbar .spacer { flex: 1; }
.rt-search {
  display: inline-flex; align-items: center; gap: 9px; padding: 9px 14px; border-radius: 999px;
  border: 1px solid var(--line); background: rgba(255,255,255,.02); min-width: 210px;
}
.rt-search input { background: none; border: none; outline: none; color: var(--fg); font-family: var(--font-body); font-size: 13.5px; width: 100%; }
.rt-search input::placeholder { color: var(--faint); }
.rt-search .ic { color: var(--faint); font-size: 14px; }

.rt-filter { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.rt-chip-btn {
  font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted); padding: 8px 13px; border-radius: 999px; border: 1px solid var(--line);
  background: rgba(255,255,255,.02); cursor: pointer; transition: all .2s; display: inline-flex; align-items: center; gap: 7px;
}
.rt-chip-btn:hover { color: var(--fg); border-color: var(--line-strong); }
.rt-chip-btn.active { color: #1c0f06; background: var(--accent); border-color: var(--accent); }
.rt-chip-btn .dot { width: 7px; height: 7px; border-radius: 50%; }
.rt-arch-count { font-family: var(--font-mono); font-size: 9.5px; min-width: 16px; height: 16px; padding: 0 5px; border-radius: 999px; background: rgba(255,255,255,.1); color: var(--fg); display: inline-flex; align-items: center; justify-content: center; }
.rt-chip-btn.active .rt-arch-count { background: rgba(0,0,0,.18); color: #1c0f06; }

/* archive list */
.rt-arch-list { display: flex; flex-direction: column; gap: 9px; }
.rt-arch-empty { text-align: center; padding: 40px 16px; color: var(--faint); font-family: var(--font-mono); font-size: 12px; letter-spacing: .04em; }
.rt-arch-empty .ic { font-size: 32px; display: block; margin-bottom: 12px; opacity: .5; }
.rt-arch-item { display: flex; align-items: center; gap: 13px; padding: 13px 15px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: rgba(255,255,255,.022); }
.rt-arch-item .pbar { width: 4px; align-self: stretch; border-radius: 999px; background: var(--prio, var(--faint)); flex: none; }
.rt-arch-item .ah { flex: 1; min-width: 0; }
.rt-arch-item .ah b { font-size: 14px; font-weight: 600; letter-spacing: -.01em; display: block; }
.rt-arch-item .ah span { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .04em; color: var(--faint); text-transform: uppercase; }
.rt-arch-item .ar { display: inline-flex; gap: 6px; flex: none; }
.rt-arch-item .ar button { font-family: var(--font-body); font-size: 12px; font-weight: 600; padding: 7px 12px; border-radius: 9px; border: 1px solid var(--line-strong); background: rgba(255,255,255,.03); color: var(--muted); cursor: pointer; transition: all .2s; white-space: nowrap; }
.rt-arch-item .ar button:hover { color: var(--fg); border-color: var(--line-strong); }
.rt-arch-item .ar .restore:hover { color: #1c0f06; background: var(--accent); border-color: var(--accent); }
.rt-arch-item .ar .del:hover { color: #ff6b6b; border-color: color-mix(in oklab, #ff6b6b 40%, transparent); background: color-mix(in oklab, #ff6b6b 10%, transparent); }

/* ---------- Board ---------- */
.rt-stage { padding: 18px var(--pad) 60px; max-width: 1640px; margin: 0 auto; }
.rt-board { display: flex; gap: 16px; align-items: flex-start; overflow-x: auto; padding-bottom: 10px; }
.rt-board::-webkit-scrollbar { height: 10px; }
.rt-board::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 999px; }

.rt-col {
  flex: 0 0 320px; width: 320px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: rgba(255,255,255,.018);
  display: flex; flex-direction: column; max-height: calc(100vh - 220px);
  transition: border-color .25s, background .25s;
}
.rt-col.drop-active { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 7%, transparent); }
.rt-col-head { display: flex; align-items: center; gap: 10px; padding: 16px var(--rt-col-pad) 12px; }
.rt-col-head .cdot { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.rt-col-head .ctitle { font-family: var(--font-display); font-weight: 700; font-size: 15px; letter-spacing: -.01em; outline: none; }
.rt-col-head .ccount { font-family: var(--font-mono); font-size: 11px; color: var(--faint); background: rgba(255,255,255,.05); border-radius: 999px; padding: 2px 8px; }
.rt-col-head .cmenu { margin-left: auto; display: flex; gap: 4px; }
.rt-icon-btn {
  width: 28px; height: 28px; border-radius: 8px; border: 1px solid transparent; background: transparent;
  color: var(--faint); cursor: pointer; font-size: 15px; display: grid; place-items: center; transition: all .2s;
}
.rt-icon-btn:hover { color: var(--fg); background: rgba(255,255,255,.06); }

.rt-cards { padding: 4px var(--rt-col-pad) var(--rt-col-pad); display: flex; flex-direction: column; gap: var(--rt-card-gap); overflow-y: auto; min-height: 60px; flex: 1; }
.rt-cards::-webkit-scrollbar { width: 8px; }
.rt-cards::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 999px; }

.rt-col-empty { border: 1px dashed var(--line-strong); border-radius: var(--radius-sm); padding: 22px 14px; text-align: center; font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; color: var(--dim); }

/* card */
.rt-card {
  position: relative; flex: none; border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018));
  padding: var(--rt-card-pad); padding-left: calc(var(--rt-card-pad) + 6px);
  cursor: grab; overflow: hidden;
  transition: transform .18s var(--ease-out), border-color .2s, box-shadow .25s, background .2s;
  animation: rt-card-in .4s var(--ease-out);
}
@keyframes rt-card-in { from { transform: translateY(8px); } to { transform: none; } }
.rt-card:hover { border-color: var(--line-strong); box-shadow: 0 16px 36px -22px rgba(0,0,0,.9); }
.rt-card:active { cursor: grabbing; }
.rt-card.dragging { opacity: .35; }
.rt-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--prio, var(--faint)); }
.rt-card[data-prio="hoch"]   { --prio: #ff6b6b; }
.rt-card[data-prio="mittel"] { --prio: var(--accent); }
.rt-card[data-prio="niedrig"]{ --prio: #41d77f; }

.rt-card .ctop { display: flex; align-items: center; gap: 8px; margin-bottom: 9px; }
.rt-cat { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); color: var(--muted); }
.rt-cat .dot { width: 6px; height: 6px; border-radius: 50%; }
.rt-card .ctitle { font-size: 14.5px; font-weight: 600; line-height: 1.35; letter-spacing: -.01em; text-wrap: pretty; }
.rt-card .cdesc { color: var(--muted); font-size: 12.5px; margin-top: 6px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rt-card .cthumb { margin-top: 11px; height: 104px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); background: #0a0a0c; }
.rt-card .cthumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rt-card .cfoot { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.rt-card .cfoot-right { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; }
.rt-arch-note { display: flex; align-items: center; gap: 7px; margin-top: 11px; padding-top: 10px; border-top: 1px dashed var(--line); font-family: var(--font-mono); font-size: 10px; letter-spacing: .04em; color: var(--faint); }
.rt-arch-note .ai { font-size: 11px; opacity: .8; filter: grayscale(.2); }
.rt-arch-note.soon { color: var(--accent); }
.rt-teams-link { display: inline-flex; align-items: center; gap: 5px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .04em; color: #9aa0f2; border: 1px solid color-mix(in oklab, #7b83eb 36%, transparent); border-radius: 999px; padding: 4px 9px 4px 8px; background: color-mix(in oklab, #7b83eb 12%, transparent); text-decoration: none; transition: all .2s; white-space: nowrap; }
.rt-teams-link:hover { background: color-mix(in oklab, #7b83eb 24%, transparent); color: #fff; border-color: color-mix(in oklab, #7b83eb 55%, transparent); }
.rt-teams-link .tg { width: 13px; height: 13px; display: block; }
.rt-due { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .04em; color: var(--muted); display: inline-flex; align-items: center; gap: 6px; }
.rt-due .dico { opacity: .7; }
.rt-due.overdue { color: #ff6b6b; }
.rt-due.today { color: var(--accent); }
.rt-card .cflags { display: inline-flex; gap: 6px; margin-left: auto; align-items: center; }
.rt-card .cflags:empty { display: none; }
.rt-flag { width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; border: 1px solid var(--line); color: var(--faint); font-size: 12px; }
.rt-flag.teams { color: #7b83eb; border-color: color-mix(in oklab, #7b83eb 30%, transparent); }
.rt-flag.img { color: var(--accent-2); }

/* placeholder during drag */
.rt-placeholder { height: 0; border-radius: var(--radius-sm); border: 1px dashed var(--accent); background: color-mix(in oklab, var(--accent) 8%, transparent); transition: height .15s ease; height: 64px; }

/* add column */
.rt-addcol { flex: 0 0 300px; }
.rt-addcol button { width: 100%; padding: 18px; border: 1px dashed var(--line-strong); border-radius: var(--radius); background: rgba(255,255,255,.015); color: var(--muted); font-family: var(--font-body); font-size: 14px; font-weight: 600; cursor: pointer; transition: all .25s; display: inline-flex; align-items: center; justify-content: center; gap: 9px; }
.rt-addcol button:hover { color: var(--fg); border-color: var(--accent); background: color-mix(in oklab, var(--accent) 6%, transparent); }
.rt-addcard { margin: 2px var(--rt-col-pad) var(--rt-col-pad); padding: 11px; border: 1px dashed var(--line); border-radius: var(--radius-sm); background: transparent; color: var(--muted); font-family: var(--font-body); font-size: 13px; font-weight: 600; cursor: pointer; transition: all .2s; display: flex; align-items: center; justify-content: center; gap: 8px; }
.rt-addcard:hover { color: var(--fg); border-color: var(--accent); background: color-mix(in oklab, var(--accent) 6%, transparent); }

/* ---------- Swimlane layout variant ---------- */
.rt-board.layout-lanes { flex-direction: column; overflow-x: visible; gap: 14px; }
.rt-board.layout-lanes .rt-col { flex: none; width: 100%; max-height: none; }
.rt-board.layout-lanes .rt-cards { flex-direction: row; overflow-x: auto; overflow-y: hidden; align-items: stretch; padding-bottom: 16px; }
.rt-board.layout-lanes .rt-card { flex: 0 0 280px; width: 280px; }
.rt-board.layout-lanes .rt-col-empty { width: 100%; }
.rt-board.layout-lanes .rt-addcard { display: none; }
.rt-board.layout-lanes .rt-addcol { width: 100%; flex: none; }

/* ---------- Timeline ---------- */
.rt-timeline { padding: 24px var(--pad) 70px; max-width: 1100px; margin: 0 auto; }
.rt-tl-switch { display: inline-flex; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.02); margin-bottom: 26px; }
.rt-tl-switch button { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--muted); padding: 8px 16px; border-radius: 999px; border: none; background: transparent; cursor: pointer; transition: all .2s; }
.rt-tl-switch button.active { color: #1c0f06; background: var(--accent); }

/* due-date timeline */
.rt-tl-group { position: relative; padding-left: 34px; padding-bottom: 30px; }
.rt-tl-group::before { content: ""; position: absolute; left: 7px; top: 6px; bottom: -6px; width: 2px; background: var(--line); }
.rt-tl-group:last-child::before { display: none; }
.rt-tl-group::after { content: ""; position: absolute; left: 1px; top: 4px; width: 14px; height: 14px; border-radius: 50%; background: var(--bg); border: 2px solid var(--accent); box-shadow: 0 0 0 4px color-mix(in oklab, var(--accent) 12%, transparent); }
.rt-tl-group.is-overdue::after { border-color: #ff6b6b; box-shadow: 0 0 0 4px color-mix(in oklab, #ff6b6b 14%, transparent); }
.rt-tl-group.is-today::after { background: var(--accent); }
.rt-tl-date { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; }
.rt-tl-date b { font-family: var(--font-display); font-weight: 700; font-size: 18px; letter-spacing: -.02em; }
.rt-tl-date .sub { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); }
.rt-tl-date .sub.over { color: #ff6b6b; }
.rt-tl-date .sub.now { color: var(--accent); }
.rt-tl-items { display: grid; gap: 10px; }
.rt-tl-item { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: rgba(255,255,255,.022); cursor: pointer; transition: border-color .2s, background .2s, transform .2s; }
.rt-tl-item:hover { border-color: var(--line-strong); background: rgba(255,255,255,.04); transform: translateX(3px); }
.rt-tl-item .pbar { width: 4px; align-self: stretch; border-radius: 999px; background: var(--prio, var(--faint)); }
.rt-tl-item .tw { flex: 1; min-width: 0; }
.rt-tl-item .tt { font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; }
.rt-tl-item .tm { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .06em; color: var(--faint); margin-top: 4px; text-transform: uppercase; }
.rt-status-pill { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); white-space: nowrap; }

/* activity feed */
.rt-act { position: relative; padding-left: 34px; }
.rt-act::before { content: ""; position: absolute; left: 7px; top: 10px; bottom: 10px; width: 2px; background: var(--line); }
.rt-act-row { position: relative; display: flex; gap: 14px; padding: 12px 0; align-items: flex-start; }
.rt-act-row::after { content: ""; position: absolute; left: -27px; top: 16px; width: 10px; height: 10px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px var(--bg); }
.rt-act-row .at { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .06em; color: var(--faint); white-space: nowrap; padding-top: 4px; min-width: 96px; }
.rt-act-row .ab { font-size: 14px; color: var(--fg); }
.rt-act-row .ab .who { font-weight: 600; }
.rt-act-row .ab .what { color: var(--muted); }
.rt-act-row .ab .obj { color: var(--accent-2); }

.rt-empty-big { text-align: center; padding: 80px 20px; color: var(--faint); }
.rt-empty-big .ic { font-size: 40px; margin-bottom: 14px; opacity: .5; }
.rt-empty-big b { display: block; font-family: var(--font-display); font-size: 18px; color: var(--muted); }

/* ===========================================================
   MODAL — task editor / identify
   =========================================================== */
.rt-scrim { position: fixed; inset: 0; z-index: 90; background: rgba(6,6,8,.62); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); opacity: 0; pointer-events: none; transition: opacity .3s ease; }
.rt-scrim.show { opacity: 1; pointer-events: auto; }

.rt-modal {
  position: fixed; z-index: 95; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  display: none;
  width: min(640px, 94vw); max-height: 90vh; overflow: hidden;
  flex-direction: column;
  background: color-mix(in oklab, var(--bg) 88%, transparent);
  border: 1px solid var(--line-strong); border-radius: var(--radius-lg);
  backdrop-filter: blur(26px) saturate(130%); -webkit-backdrop-filter: blur(26px) saturate(130%);
  box-shadow: 0 40px 100px -40px rgba(0,0,0,.85);
}
.rt-modal.show { display: flex; animation: rt-modal-in .4s var(--ease-out); }
@keyframes rt-modal-in { from { transform: translate(-50%, -54%) scale(.96); } to { transform: translate(-50%, -50%) scale(1); } }
.rt-modal-head { display: flex; align-items: center; gap: 14px; padding: 22px 26px; border-bottom: 1px solid var(--line); }
.rt-modal-head .mt { font-family: var(--font-display); font-weight: 700; font-size: 19px; letter-spacing: -.02em; }
.rt-modal-head .ms { font-family: var(--font-mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--faint); margin-top: 3px; }
.rt-modal-body { padding: 22px 26px; overflow-y: auto; }
.rt-modal-foot { display: flex; gap: 12px; padding: 18px 26px; border-top: 1px solid var(--line); align-items: center; }
.rt-modal-foot .spacer { flex: 1; }

.rt-field { margin-bottom: 16px; }
.rt-field > label { display: block; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--faint); margin-bottom: 8px; }
.rt-input, .rt-textarea, .rt-select {
  width: 100%; padding: 12px 14px; border-radius: 12px;
  background: rgba(255,255,255,.04); border: 1px solid var(--line-strong); color: var(--fg);
  font-family: var(--font-body); font-size: 14px; outline: none; transition: border-color .2s, background .2s;
}
.rt-textarea { resize: vertical; min-height: 86px; line-height: 1.5; }
.rt-input:focus, .rt-textarea:focus, .rt-select:focus { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 8%, transparent); }
.rt-select { appearance: none; -webkit-appearance: none; cursor: pointer; background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%); background-position: calc(100% - 18px) 19px, calc(100% - 13px) 19px; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }
.rt-select option { background: #16161a; color: var(--fg); }

.rt-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

/* Teams link field */
.rt-teams-row { display: flex; gap: 10px; align-items: stretch; }
.rt-teams-row .rt-input { flex: 1; }
.rt-teams-row .btn { white-space: nowrap; }
.rt-teams-hint { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .03em; color: var(--faint); margin-top: 8px; display: flex; align-items: center; gap: 7px; }
.rt-teams-hint .tg { width: 13px; height: 13px; flex: none; }

/* segmented control */
.rt-seg { display: flex; gap: 6px; }
.rt-seg button { flex: 1; padding: 11px 10px; border-radius: 11px; border: 1px solid var(--line-strong); background: rgba(255,255,255,.03); color: var(--muted); font-family: var(--font-body); font-size: 13px; font-weight: 600; cursor: pointer; transition: all .2s; display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.rt-seg button .dot { width: 8px; height: 8px; border-radius: 50%; }
.rt-seg button:hover { color: var(--fg); border-color: var(--line-strong); }
.rt-seg button.active { color: var(--fg); border-color: var(--accent); background: color-mix(in oklab, var(--accent) 12%, transparent); }

/* assignee picker */
.rt-assignees { display: flex; flex-wrap: wrap; gap: 8px; }
.rt-assignee { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 999px; border: 1px solid var(--line-strong); background: rgba(255,255,255,.03); cursor: pointer; transition: all .2s; }
.rt-assignee:hover { border-color: var(--line-strong); background: rgba(255,255,255,.06); }
.rt-assignee.active { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 12%, transparent); }
.rt-assignee span { font-size: 13.5px; font-weight: 600; color: var(--fg); }
.rt-assignee.active span { color: #fff; }

/* image drop */
.rt-drop { position: relative; border: 1px dashed var(--line-strong); border-radius: 14px; padding: 20px; text-align: center; cursor: pointer; transition: all .2s; background: rgba(255,255,255,.015); }
.rt-drop:hover, .rt-drop.over { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 7%, transparent); }
.rt-drop input[type=file] { display: none; }
.rt-drop .dh { font-family: var(--font-mono); font-size: 11px; letter-spacing: .06em; color: var(--muted); }
.rt-drop .dh b { color: var(--accent); }
.rt-preview { position: relative; margin-top: 12px; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); display: none; }
.rt-preview.show { display: block; }
.rt-preview img { width: 100%; max-height: 220px; object-fit: cover; display: block; }
.rt-preview .rm { position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; border-radius: 8px; background: rgba(12,12,14,.7); border: 1px solid var(--line-strong); color: var(--fg); cursor: pointer; font-size: 15px; }

/* identify modal extras */
.rt-id-list { display: grid; gap: 8px; margin-top: 14px; }
.rt-id-opt { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.02); cursor: pointer; transition: all .2s; }
.rt-id-opt:hover { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 7%, transparent); }
.rt-id-opt .uname2 { flex: 1; }
.rt-id-opt .uname2 b { display: block; font-size: 14px; }
.rt-id-opt .uname2 span { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .06em; color: var(--faint); }
.rt-id-opt .role-pill { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); border: 1px solid var(--line); border-radius: 999px; padding: 4px 9px; }

.rt-del-btn { color: #ff6b6b !important; border-color: color-mix(in oklab, #ff6b6b 32%, transparent) !important; }
.rt-del-btn:hover { background: color-mix(in oklab, #ff6b6b 12%, transparent) !important; }

/* mini link in field label */
.rt-mini-link { float: right; font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--accent); background: none; border: none; cursor: pointer; padding: 0; }
.rt-mini-link:hover { text-decoration: underline; }

/* category manager */
.rt-cat-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.rt-cat-item { display: flex; align-items: center; gap: 11px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.022); }
.rt-cat-swatch { width: 26px; height: 26px; border-radius: 8px; border: none; cursor: pointer; flex: none; position: relative; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); transition: transform .15s; }
.rt-cat-swatch:hover { transform: scale(1.08); }
.rt-cat-swatch::after { content: "↻"; position: absolute; inset: 0; display: grid; place-items: center; color: rgba(0,0,0,.5); font-size: 12px; opacity: 0; transition: opacity .15s; }
.rt-cat-swatch:hover::after { opacity: 1; }
.rt-cat-name { flex: 1; background: rgba(255,255,255,.04); border: 1px solid transparent; border-radius: 9px; color: var(--fg); font-family: var(--font-body); font-size: 14px; font-weight: 600; padding: 8px 11px; outline: none; transition: border-color .2s, background .2s; min-width: 0; }
.rt-cat-name:focus { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 8%, transparent); }
.rt-cat-name:disabled { color: var(--muted); background: transparent; cursor: not-allowed; }
.rt-cat-tag { font-family: var(--font-mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); border: 1px solid var(--line); border-radius: 999px; padding: 3px 8px; flex: none; }
.rt-cat-use { font-family: var(--font-mono); font-size: 10px; color: var(--faint); flex: none; min-width: 38px; text-align: right; }
.rt-cat-del { width: 30px; height: 30px; border-radius: 8px; border: 1px solid transparent; background: transparent; color: var(--faint); cursor: pointer; font-size: 14px; flex: none; transition: all .2s; }
.rt-cat-del:hover { color: #ff6b6b; background: color-mix(in oklab, #ff6b6b 12%, transparent); }
.rt-cat-del:disabled { opacity: .25; cursor: not-allowed; }
.rt-cat-add { display: flex; gap: 10px; }
.rt-cat-add .rt-input { flex: 1; }
.rt-cat-add .btn { white-space: nowrap; }
.rt-cat-note { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .03em; color: var(--faint); }

/* toast */
.rt-toast { position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%) translateY(20px); z-index: 120; padding: 12px 20px; border-radius: 999px; background: var(--accent); color: #1c0f06; font-size: 13px; font-weight: 600; box-shadow: 0 16px 40px -14px var(--accent-glow); opacity: 0; pointer-events: none; transition: opacity .3s, transform .3s var(--ease-out); }
.rt-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ===========================================================
   SSO — Windows / Microsoft Entra ID sign-in
   =========================================================== */
.rt-sso { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 24px;
  background: radial-gradient(1100px 760px at 80% -12%, color-mix(in oklab, var(--accent) 16%, transparent), transparent 60%), radial-gradient(820px 560px at -8% 16%, rgba(255,255,255,.04), transparent 55%), var(--bg);
  font-family: var(--font-body); color: var(--fg); }
.rt-sso.out { opacity: 0; pointer-events: none; transition: opacity .5s ease; }
.rt-sso::after { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(rgba(255,255,255,.025) 1px, transparent 1px); background-size: 4px 4px; opacity: .5; }
.rt-sso-card { position: relative; z-index: 1; width: min(420px, 92vw); padding: 40px 38px 30px; text-align: center;
  background: rgba(255,255,255,.035); border: 1px solid var(--line); border-radius: var(--radius);
  backdrop-filter: blur(22px) saturate(120%); -webkit-backdrop-filter: blur(22px) saturate(120%); box-shadow: 0 30px 80px -30px rgba(0,0,0,.8); }
.rt-sso.in .rt-sso-card { animation: pl-card-in .55s var(--ease-out); }

.rt-win { width: 46px; height: 46px; margin: 0 auto 18px; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 3px; }
.rt-win span { border-radius: 2px; background: var(--accent); }
.rt-win span:nth-child(1){ background:#f25022; } .rt-win span:nth-child(2){ background:#7fba00; }
.rt-win span:nth-child(3){ background:#00a4ef; } .rt-win span:nth-child(4){ background:#ffb900; }
.rt-sso-org { font-family: var(--font-mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--faint); }
.rt-sso h2 { font-family: var(--font-display); font-weight: 700; font-size: 22px; letter-spacing: -.02em; margin-top: 8px; }
.rt-sso .step { color: var(--muted); font-size: 13.5px; margin-top: 8px; min-height: 20px; transition: opacity .3s; }

/* connecting spinner */
.rt-sso-spin { width: 42px; height: 42px; margin: 26px auto 8px; border-radius: 50%; border: 3px solid var(--line-strong); border-top-color: var(--accent); animation: rt-spin .8s linear infinite; }
@keyframes rt-spin { to { transform: rotate(360deg); } }
.rt-sso-dots { display: flex; justify-content: center; gap: 6px; margin-top: 20px; }
.rt-sso-dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--line-strong); transition: background .3s; }
.rt-sso-dots i.on { background: var(--accent); }

/* detected account */
.rt-sso-acct { display: flex; align-items: center; gap: 14px; text-align: left; padding: 16px; margin: 24px 0 6px; border: 1px solid var(--line-strong); border-radius: 16px; background: rgba(255,255,255,.03); animation: pl-card-in .5s var(--ease-out); }
.rt-sso-acct .avatar { width: 50px; height: 50px; font-size: 17px; flex: none; }
.rt-sso-acct .ai { flex: 1; min-width: 0; }
.rt-sso-acct .ai b { font-size: 15.5px; font-weight: 600; display: block; }
.rt-sso-acct .ai span { font-family: var(--font-mono); font-size: 11px; letter-spacing: .03em; color: var(--faint); }
.rt-sso-acct .ck { width: 26px; height: 26px; border-radius: 50%; background: #41d77f; color: #06120b; display: grid; place-items: center; font-size: 14px; font-weight: 700; flex: none; }
.rt-sso-progress { height: 3px; border-radius: 999px; background: var(--line); overflow: hidden; margin-top: 14px; }
.rt-sso-progress i { display: block; height: 100%; width: 0; background: var(--accent); border-radius: 999px; transition: width .9s linear; }
.rt-sso-meta { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.rt-sso-meta .secure { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--faint); }
.rt-sso-meta .secure i { width: 7px; height: 7px; border-radius: 50%; background: #41d77f; box-shadow: 0 0 9px rgba(65,215,127,.5); }
.rt-sso-demo { background: none; border: none; cursor: pointer; font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--dim); transition: color .2s; }
.rt-sso-demo:hover { color: var(--accent); }
.rt-demo-tag { display: inline-block; margin-top: 16px; font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--faint); border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; }

/* sync status pill in bar */
.rt-sync { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); border: 1px solid var(--line); border-radius: 999px; padding: 7px 12px; background: rgba(255,255,255,.02); }
.rt-sync i { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.rt-sync.local i { background: var(--dim); }
.rt-sync.live i { background: #41d77f; box-shadow: 0 0 9px rgba(65,215,127,.5); animation: rt-pulse 2s ease-in-out infinite; }
.rt-sync.sync i { background: var(--accent); animation: rt-spin 1s linear infinite; box-shadow: none; }
@keyframes rt-pulse { 50% { opacity: .4; } }
@media (max-width: 900px) { .rt-sync .txt { display: none; } }

@media (prefers-reduced-motion: reduce) { .rt-sso-spin { animation: none; } .rt-sync.live i, .rt-sync.sync i { animation: none; } }

/* tweak FAB hidden state handled by panel */

@media (max-width: 900px) {
  .rt-kpis { grid-template-columns: repeat(2, 1fr); }
  .rt-row2 { grid-template-columns: 1fr; }
  .rt-bar .brand .who, .rt-user .uname { display: none; }
}
