/* v16.51 · Trade Journal 360° — hanya tampilan modul trade-360.js.
   Memakai token ds.css; mode terang lewat body.light. Untuk membatalkan: hapus tautan CSS + JS dari index.html. */
body.t3-lock { overflow: hidden; }

/* ---------- CTA di panel detail ---------- */
.t3-cta { display: flex; align-items: center; gap: 12px; padding: 12px 16px; margin: 0 0 16px; border-radius: 16px;
  background: linear-gradient(135deg, rgba(215,180,74,.14), rgba(45,212,191,.07)); box-shadow: inset 0 0 0 1px rgba(215,180,74,.28); }
.t3-cta-i { flex: none; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; color: #e8c766; background: rgba(215,180,74,.14); }
.t3-cta-t { flex: 1; min-width: 0; }
.t3-cta-t b { display: block; font-size: 15px; color: var(--text-primary, #fff); }
.t3-cta-t small { display: block; font-size: 12px; line-height: 1.4; color: var(--text-secondary, rgba(235,235,245,.62)); }
.t3-cta button { flex: none; min-height: 40px; padding: 0 16px; border: 0; border-radius: 12px; font-weight: 600; font-size: 13px; cursor: pointer; color: #1a1405; background: linear-gradient(180deg, #ecca6a, #d7b44a); }
.t3-cta button:focus-visible, .t3 button:focus-visible, .t3 .t3-in:focus-visible { outline: 2px solid #d7b44a; outline-offset: 2px; }
body.light .t3-cta-t b { color: #27272a; } body.light .t3-cta-t small { color: #52525b; } body.light .t3-cta-i { color: #8a6a10; }

/* ---------- Lembar penuh ---------- */
.t3-ov { position: fixed; inset: 0; z-index: 57; display: flex; align-items: flex-end; justify-content: center; background: rgba(0,0,0,.55);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .2s ease; }
.t3-ov[hidden] { display: none; } .t3-ov.on { opacity: 1; }
.t3 { position: relative; display: flex; flex-direction: column; width: 100%; height: calc(100% - env(safe-area-inset-top, 0px) - 8px); max-width: 1000px; box-sizing: border-box; overflow: hidden;
  color: var(--text-primary, #fff); border-radius: 24px 24px 0 0; background: linear-gradient(165deg, #1d1e22 0%, #131417 60%, #0f1012 100%);
  box-shadow: 0 -24px 60px -20px rgba(0,0,0,.7), inset 0 0 0 1px var(--border-strong, rgba(255,255,255,.14)); transform: translateY(24px); transition: transform .24s cubic-bezier(.22,.61,.36,1); }
.t3-ov.on .t3 { transform: none; }
@media (min-width: 900px) { .t3-ov { align-items: center; } .t3 { height: min(94vh, 980px); border-radius: 24px; } }
body.light .t3 { background: linear-gradient(165deg, #fff 0%, #f6f4ee 100%); color: #27272a; box-shadow: 0 -24px 60px -20px rgba(60,48,20,.3), inset 0 0 0 1px rgba(0,0,0,.1); }
.tnum { font-variant-numeric: tabular-nums; }

/* ---------- Header ---------- */
.t3-hd { flex: none; padding: 12px 16px 0; border-bottom: 1px solid var(--border, rgba(255,255,255,.08)); background: inherit; }
.t3-top { display: flex; align-items: center; gap: 12px; }
.t3-back { display: inline-flex; align-items: center; gap: 2px; min-height: 40px; padding: 0 12px 0 8px; border: 0; border-radius: 12px; background: var(--surface, rgba(255,255,255,.05)); color: inherit; font-weight: 600; font-size: 13px; cursor: pointer; }
.t3-brand { flex: 1; font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform:none; color: #d7b44a; text-align: center; }
.t3-comp { min-width: 44px; text-align: center; padding: 8px 12px; border-radius: 999px; font-size: 12px; font-weight: 600; background: rgba(215,180,74,.16); color: #e8c766; box-shadow: inset 0 0 0 1px rgba(215,180,74,.3); }
.t3-ttl { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin: 12px 0 8px; }
.t3-ttl h2 { margin: 0; font-size: 22px; line-height: 1.2; font-weight: 600; letter-spacing: -.02em; overflow-wrap: anywhere; }
.t3-ttl small { color: var(--text-secondary, rgba(235,235,245,.62)); font-size: 13px; }
.t3-pl { font-size: 22px; font-weight: 600; white-space: nowrap; } .t3-pl.pos { color: #2dd4bf; } .t3-pl.neg { color: #ff7a68; }
.t3-badge { display: inline-block; vertical-align: middle; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; background: var(--surface-elevated, rgba(255,255,255,.07)); }
.t3-badge.long { color: #2dd4bf; background: rgba(45,212,191,.14); } .t3-badge.short { color: #ff7a68; background: rgba(255,122,104,.14); }
.t3-tabs, .t3-nav { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding: 2px 0 12px; -webkit-overflow-scrolling: touch; }
.t3-tabs::-webkit-scrollbar, .t3-nav::-webkit-scrollbar { display: none; }
.t3-tab { flex: none; min-height: 34px; padding: 0 16px; border: 0; border-radius: 999px; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--text-secondary, rgba(235,235,245,.7)); background: var(--surface, rgba(255,255,255,.05)); }
.t3-tab.on { color: #e8c766; background: rgba(215,180,74,.18); box-shadow: inset 0 0 0 1px rgba(215,180,74,.4); }
.t3-tab.add { background: transparent; box-shadow: inset 0 0 0 1px var(--border-strong, rgba(255,255,255,.16)); }
.t3-nav { padding-bottom: 8px; }
.t3-pill { flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 12px 0 8px; border: 0; border-radius: 12px; background: transparent; color: var(--text-secondary, rgba(235,235,245,.62)); font-size: 13px; font-weight: 600; cursor: pointer; }
.t3-pill b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: 12px; background: var(--surface-elevated, rgba(255,255,255,.08)); }
.t3-pill.on { color: var(--text-primary, #fff); background: var(--surface-pressed, rgba(255,255,255,.1)); }
.t3-pill.done b { background: rgba(45,212,191,.2); color: #2dd4bf; }
body.light .t3-pill.on { color: #18181b; } body.light .t3-back, body.light .t3-tab, body.light .t3-badge { background: rgba(0,0,0,.05); }
body.light .t3-ttl small, body.light .t3-pill { color: #52525b; }

/* ---------- Isi ---------- */
.t3-scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 16px 16px 28px; -webkit-overflow-scrolling: touch; }
.t3-sec { margin: 0 0 16px; padding: 16px; border-radius: 20px; background: var(--surface, rgba(255,255,255,.04)); box-shadow: inset 0 0 0 1px var(--border, rgba(255,255,255,.08)); scroll-margin-top: 4px; }
.t3-sh { display: flex; gap: 12px; align-items: center; margin-bottom: 16px; }
.t3-n { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; font-size: 13px; font-weight: 600; color: #1a1405; background: linear-gradient(180deg, #ecca6a, #d7b44a); }
.t3-sh h3 { margin: 0; font-size: 17px; font-weight: 600; } .t3-sh p { margin: 1px 0 0; font-size: 13px; color: var(--text-secondary, rgba(235,235,245,.62)); }
.t3-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } .t3-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 12px 0; }
@media (min-width: 700px) { .t3-grid { grid-template-columns: repeat(4, 1fr); } }
.t3-f { display: flex; flex-direction: column; gap: 4px; min-width: 0; margin: 0 0 12px; } .t3-grid .t3-f, .t3-grid3 .t3-f { margin: 0; }
.t3-f > span, .t3-sub { font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform:none; color: var(--text-tertiary, rgba(235,235,245,.55)); }
.t3-sub { margin: 0 0 8px; }
.t3-in { width: 100%; box-sizing: border-box; min-height: 44px; padding: 0 12px; border: 0; border-radius: 12px; font: inherit; font-size: 17px; color: inherit; background: var(--surface-elevated, rgba(255,255,255,.06)); box-shadow: inset 0 0 0 1px var(--border, rgba(255,255,255,.1)); color-scheme: dark; }
.t3-in::placeholder { color: var(--text-tertiary, rgba(235,235,245,.4)); }
.t3-in.sm { min-height: 38px; font-size: 15px; } .t3-ta { padding: 12px 12px; resize: vertical; line-height: 1.5; min-height: 64px; }
body.light .t3-in { background: #fff; box-shadow: inset 0 0 0 1px rgba(0,0,0,.14); color-scheme: light; }
.t3-seg { display: flex; gap: 4px; padding: 4px; border-radius: 16px; background: var(--surface-elevated, rgba(255,255,255,.06)); }
.t3-seg button { flex: 1; min-height: 38px; border: 0; border-radius: 12px; font-weight: 700; font-size: 15px; background: transparent; color: var(--text-secondary, rgba(235,235,245,.7)); cursor: pointer; }
.t3-seg button.long.on { background: rgba(45,212,191,.18); color: #2dd4bf; } .t3-seg button.short.on { background: rgba(255,122,104,.18); color: #ff7a68; }
.t3-der { display: grid; grid-template-columns: repeat(auto-fit, minmax(104px, 1fr)); gap: 8px; margin-top: 16px; }
.t3-tile { padding: 12px 12px; border-radius: 16px; background: var(--surface-elevated, rgba(255,255,255,.05)); }
.t3-tile small { display: block; font-size: 12px; font-weight: 600; color: var(--text-tertiary, rgba(235,235,245,.55)); text-transform:none; letter-spacing: 0; }
.t3-tile b { display: block; margin-top: 4px; font-size: 17px; } .t3-tile.pos b, td.pos { color: #2dd4bf; } .t3-tile.neg b, td.neg { color: #ff7a68; }
.t3-warn { margin: 12px 0 0; padding: 8px 12px; border-radius: 12px; font-size: 13px; color: #f4c15a; background: rgba(244,193,90,.1); }
.t3-hint { margin: 12px 0 0; font-size: 13px; line-height: 1.5; color: var(--text-secondary, rgba(235,235,245,.62)); }
.t3-link { display: inline-block; margin: 12px 16px 0 0; padding: 8px 0; min-height: 32px; border: 0; background: none; font-size: 13px; font-weight: 600; color: #e8c766; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.t3-link.danger { color: #ff7a68; } .t3-link:disabled { opacity: .5; }
body.light .t3-link { color: #8a6a10; } body.light .t3-link.danger { color: #b83526; } body.light .t3-warn { color: #8a5a00; }
.t3-x { flex: none; width: 34px; height: 34px; border: 0; border-radius: 12px; font-size: 20px; line-height: 1; background: transparent; color: var(--text-tertiary, rgba(235,235,245,.55)); cursor: pointer; }
.t3-x:hover { background: rgba(255,122,104,.14); color: #ff7a68; }

/* ---------- Timeline ---------- */
.t3-tl, .t3-hist, .t3-rules { list-style: none; margin: 0; padding: 0; }
.t3-tl { position: relative; }
.t3-ph { margin: 16px 0 8px; padding-left: 28px; } .t3-ph:first-child { margin-top: 0; }
.t3-ph span { font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform:none; color: var(--text-tertiary, rgba(235,235,245,.6)); }
.t3-ph.before span { color: #9ab4ff; } .t3-ph.entry span { color: #2dd4bf; } .t3-ph.manage span { color: #e8c766; } .t3-ph.exit span { color: #ff7a68; }
.t3-ev, .t3-he { position: relative; display: flex; padding: 0 0 12px 28px; }
.t3-ev::before, .t3-he::before { content: ""; position: absolute; left: 7px; top: 14px; bottom: -2px; width: 2px; background: var(--border-strong, rgba(255,255,255,.14)); }
.t3-ev:last-child::before, .t3-he:last-child::before { display: none; }
.t3-dot { position: absolute; left: 0; top: 6px; width: 16px; height: 16px; border-radius: 50%; background: #9ab4ff; box-shadow: 0 0 0 4px rgba(154,180,255,.16); }
.t3-ev.entry .t3-dot { background: #2dd4bf; box-shadow: 0 0 0 4px rgba(45,212,191,.16); } .t3-ev.manage .t3-dot { background: #e8c766; box-shadow: 0 0 0 4px rgba(232,199,102,.16); }
.t3-ev.exit .t3-dot { background: #ff7a68; box-shadow: 0 0 0 4px rgba(255,122,104,.16); }
.t3-ev.auto .t3-dot { border-radius: 4px; transform: rotate(45deg) scale(.8); }
.t3-evb { flex: 1; min-width: 0; } .t3-evr { display: flex; gap: 8px; margin-bottom: 8px; align-items: center; flex-wrap: wrap; } .t3-evr .t3-in { width: auto; flex: 1 1 130px; }
.t3-evr .t3-x { margin-left: auto; }
.t3-auto { display: flex; flex-direction: column; padding: 8px 0; } .t3-auto b { font-size: 15px; } .t3-auto small { color: var(--text-secondary, rgba(235,235,245,.62)); font-size: 12px; }
.t3-adds { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.t3-add { min-height: 38px; padding: 0 16px; border: 0; border-radius: 999px; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--text-primary, #fff); background: var(--surface-elevated, rgba(255,255,255,.07)); box-shadow: inset 0 0 0 1px var(--border-strong, rgba(255,255,255,.14)); }
.t3-empty { list-style: none; padding: 16px; border-radius: 16px; font-size: 13px; text-align: center; color: var(--text-secondary, rgba(235,235,245,.62)); background: var(--surface-elevated, rgba(255,255,255,.04)); }
body.light .t3-add { color: #27272a; }

/* ---------- Sebelum vs Sesudah ---------- */
.t3-ba { display: grid; grid-template-columns: 1fr; gap: 16px; } @media (min-width: 760px) { .t3-ba { grid-template-columns: 1fr 1fr; } }
.t3-shot { min-width: 0; } .t3-shot h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 15px; font-weight: 700; }
.t3-shot h4 i { width: 10px; height: 10px; border-radius: 50%; background: #9ab4ff; } .t3-shot h4 i.act { background: #e8c766; }
.t3-img { display: block; width: 100%; padding: 0; border: 0; border-radius: 16px; overflow: hidden; cursor: zoom-in; background: #000; aspect-ratio: 16 / 10; }
.t3-img img { width: 100%; height: 100%; object-fit: contain; display: block; }
.t3-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 100%; aspect-ratio: 16 / 10; border-radius: 16px; border: 1.5px dashed var(--border-strong, rgba(255,255,255,.22)); background: transparent; color: var(--text-secondary, rgba(235,235,245,.7)); font-size: 13px; font-weight: 600; cursor: pointer; }
.t3-drop:disabled { opacity: .6; }
.t3-shot-act { display: flex; flex-wrap: wrap; gap: 0 16px; margin-bottom: 4px; }
.t3-thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 8px; margin: 8px 0; }
.t3-thumbs button { padding: 0; border: 0; border-radius: 12px; overflow: hidden; aspect-ratio: 1; cursor: pointer; box-shadow: inset 0 0 0 1px var(--border-strong, rgba(255,255,255,.2)); } .t3-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.t3-wrap-x { margin-top: 16px; overflow-x: auto; }
.t3-tab2 { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 360px; }
.t3-tab2 th, .t3-tab2 td { padding: 8px 8px; text-align: right; border-bottom: 1px solid var(--border, rgba(255,255,255,.08)); }
.t3-tab2 th:first-child, .t3-tab2 tbody th { text-align: left; } .t3-tab2 thead th { font-size: 12px; text-transform:none; letter-spacing: 0; color: var(--text-tertiary, rgba(235,235,245,.55)); }
.t3-tab2 tbody th { font-weight: 600; } td.ok { color: var(--text-secondary, rgba(235,235,245,.62)); }

/* ---------- Aturan ---------- */
.t3-score { display: grid; grid-template-columns: auto 1fr; gap: 8px 16px; align-items: center; margin-bottom: 12px; }
.t3-score small { display: block; font-size: 12px; font-weight: 600; text-transform:none; letter-spacing: 0; color: var(--text-tertiary, rgba(235,235,245,.55)); } .t3-score b { font-size: 28px; } .t3-score b.pos { color: #2dd4bf; } .t3-score b.neg { color: #ff7a68; }
.t3-sbar { display: flex; height: 10px; border-radius: 999px; overflow: hidden; background: var(--surface-elevated, rgba(255,255,255,.08)); }
.t3-sbar i.ok { background: #2dd4bf; } .t3-sbar i.viol { background: #ff7a68; } .t3-sbar i.na { background: #8a8f98; }
.t3-leg { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0; padding: 0; list-style: none; font-size: 12px; color: var(--text-secondary, rgba(235,235,245,.62)); }
.t3-leg li::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; background: #8a8f98; } .t3-leg .ok::before { background: #2dd4bf; } .t3-leg .viol::before { background: #ff7a68; } .t3-leg .un::before { background: transparent; box-shadow: inset 0 0 0 1.5px #8a8f98; }
.t3-rule { padding: 12px 0; border-top: 1px solid var(--border, rgba(255,255,255,.08)); } .t3-rule:first-child { border-top: 0; }
.t3-rt { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; } .t3-rt > span { flex: 1 1 140px; min-width: 0; font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.t3-g { font-style: normal; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; background: var(--surface-elevated, rgba(255,255,255,.08)); color: var(--text-secondary, rgba(235,235,245,.7)); } .t3-g.req { background: rgba(244,193,90,.14); color: #f4c15a; }
.t3-rb { display: flex; gap: 8px; }
.t3-rs { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 8px; border: 0; border-radius: 12px; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--text-secondary, rgba(235,235,245,.7)); background: var(--surface-elevated, rgba(255,255,255,.06)); box-shadow: inset 0 0 0 1px var(--border, rgba(255,255,255,.1)); }
.t3-rs em { font-style: normal; } @media (max-width: 420px) { .t3-rs em { display: none; } }
.t3-rs.ok.on { background: rgba(45,212,191,.18); color: #2dd4bf; box-shadow: inset 0 0 0 1px rgba(45,212,191,.5); } .t3-rs.viol.on { background: rgba(255,122,104,.18); color: #ff7a68; box-shadow: inset 0 0 0 1px rgba(255,122,104,.5); } .t3-rs.na.on { background: rgba(138,143,152,.22); color: var(--text-primary, #fff); }
.t3-rule .t3-in.sm { margin-top: 8px; }
.t3-addrule { display: flex; gap: 8px; margin-top: 12px; }
.t3-btn { flex: none; min-height: 44px; padding: 0 20px; border: 0; border-radius: 12px; font-weight: 700; font-size: 15px; cursor: pointer; color: var(--text-primary, #fff); background: var(--surface-elevated, rgba(255,255,255,.08)); }
.t3-btn.pri { color: #1a1405; background: linear-gradient(180deg, #ecca6a, #d7b44a); } .t3-btn.ghost { background: transparent; box-shadow: inset 0 0 0 1px var(--border-strong, rgba(255,255,255,.18)); } .t3-btn:disabled { opacity: .45; cursor: default; }
body.light .t3-btn:not(.pri) { color: #27272a; } body.light .t3-rs.na.on { color: #27272a; } body.light .t3-g.req { color: #8a5a00; }

/* ---------- Review ---------- */
.t3-chips, .t3-scope { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.t3-chip { min-height: 38px; padding: 0 16px; border: 0; border-radius: 999px; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--text-secondary, rgba(235,235,245,.75)); background: var(--surface-elevated, rgba(255,255,255,.06)); box-shadow: inset 0 0 0 1px var(--border, rgba(255,255,255,.1)); }
.t3-chip.on { color: #e8c766; background: rgba(215,180,74,.18); box-shadow: inset 0 0 0 1px rgba(215,180,74,.5); } .t3-chip.good.on { color: #2dd4bf; background: rgba(45,212,191,.16); box-shadow: inset 0 0 0 1px rgba(45,212,191,.5); }
.t3-chk { display: flex; align-items: center; gap: 12px; min-height: 44px; font-size: 15px; cursor: pointer; } .t3-chk input { width: 20px; height: 20px; accent-color: #d7b44a; }

/* ---------- Riwayat ---------- */
.t3-he::before { top: 12px; } .t3-he .t3-dot { background: #8a8f98; box-shadow: 0 0 0 4px rgba(138,143,152,.16); } .t3-he.new .t3-dot { background: #2dd4bf; } .t3-he.del .t3-dot { background: #ff7a68; }
.t3-he > div { flex: 1; min-width: 0; } .t3-hh { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; } .t3-hh b { font-size: 13px; } .t3-hh small { font-size: 12px; color: var(--text-secondary, rgba(235,235,245,.62)); }
.t3-ht { margin: 2px 0 0; font-size: 13px; font-weight: 600; } .t3-hc { margin: 8px 0 0; padding: 0; list-style: none; font-size: 13px; line-height: 1.5; color: var(--text-secondary, rgba(235,235,245,.78)); } .t3-hc li { padding: 2px 0; overflow-wrap: anywhere; }
.t3-hc s { opacity: .6; } .t3-hc q { quotes: "“" "”"; } .t3-hc b { color: var(--text-primary, #fff); } .t3-more { opacity: .7; } .t3-moreb { list-style: none; padding-left: 28px; }
body.light .t3-hc b { color: #18181b; } body.light .t3-hc { color: #3f3f46; }

/* ---------- Bar simpan + lightbox ---------- */
.t3-bar { flex: none; display: flex; align-items: center; gap: 12px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--border, rgba(255,255,255,.08)); background: inherit; }
.t3-st { flex: 1; font-size: 13px; font-weight: 600; } .t3-st.ok { color: #2dd4bf; } .t3-st.dirty { color: #f4c15a; }
body.light .t3-st.dirty { color: #8a5a00; } body.light .t3-st.ok { color: #0f766e; }
.t3-lb { position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; padding: 16px; background: rgba(0,0,0,.9); cursor: zoom-out; }
.t3-lb img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 8px; } .t3-lbx { position: absolute; top: calc(10px + env(safe-area-inset-top, 0px)); right: 12px; width: 44px; height: 44px; border: 0; border-radius: 50%; font-size: 28px; color: #fff; background: rgba(255,255,255,.14); cursor: pointer; }

@media (prefers-reduced-motion: reduce) { .t3-ov, .t3 { transition: none; } .t3 { transform: none; } }
html.mo-lite .t3-ov { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(0,0,0,.7); }
@media (forced-colors: active) { .t3-sec, .t3-in, .t3-tile { border: 1px solid CanvasText; } .t3-pill.on, .t3-tab.on, .t3-chip.on, .t3-rs.on { outline: 2px solid Highlight; } }