.member-signals{margin:0 0 24px;border:1px solid var(--line);background:var(--surface);border-radius:18px;overflow:hidden}
.member-signals header,.ms-controls{padding:24px 28px}
.member-signals header{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}
.member-signals h2{margin:6px 0;font-size:28px}.member-signals p{color:var(--muted);line-height:1.6}
.member-signals header p{margin:0}.member-signals header a{color:var(--gold);white-space:nowrap}
.member-signals button,.member-signals input{font:inherit}.member-signals button{cursor:pointer}
.ms-controls label{display:block;font-weight:700;margin-bottom:9px}
.ms-search{display:flex;gap:10px}.ms-input-wrap{display:flex;flex:1;min-width:0;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.ms-input-wrap:focus-within{outline:2px solid var(--gold);outline-offset:2px}
.ms-input-wrap input{min-width:0;flex:1;width:100%;padding:14px;background:transparent;border:0;color:var(--text);outline:0;font-size:18px}
.ms-input-wrap input::-webkit-search-cancel-button{-webkit-appearance:none}
.ms-input-wrap button{border:0;background:transparent;color:var(--gold);padding:0 14px}
.ms-refresh,.ms-more{border:1px solid var(--line);border-radius:10px;background:var(--surface2);color:var(--text);padding:12px 16px}
.ms-filters{display:grid;grid-template-columns:repeat(4,1fr);margin-top:18px;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.ms-filters button{min-height:44px;padding:12px 5px;border:0;border-right:1px solid var(--line);background:var(--bg);color:var(--muted);font-weight:700}
.ms-filters button:last-child{border-right:0}.ms-filters button[aria-pressed=true]{background:var(--gold);color:#171300}
.member-signals button:focus-visible,.member-signals a:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.ms-status{margin:12px 0 0;font-size:13px;min-height:21px}.ms-status[data-error=true]{color:var(--red)}
.ms-card{padding:22px 28px;border-top:1px solid var(--line)}
.ms-card h3{margin:0;font-size:22px;overflow-wrap:anywhere}.ms-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ms-direction{font-size:12px;color:var(--green)}.ms-event{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin:10px 0;font-size:13px;color:var(--muted)}
.ms-stage{color:var(--gold);font-weight:700}.ms-entry{font-size:14px;color:var(--muted);margin:8px 0 14px}.ms-entry strong{color:var(--text);font-weight:600;margin-right:16px}
.ms-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 14px;color:var(--muted)}
.ms-price strong{color:var(--text);font-size:22px}.ms-return{font-size:21px;font-weight:700}.ms-positive{color:var(--green)}.ms-negative{color:var(--red)}
.ms-card .ms-note{font-size:12px;margin:7px 0 0}.ms-empty{padding:28px;text-align:center;color:var(--muted)}
.ms-footer{padding:0 28px 22px}.ms-footer p{margin:12px 0 0;font-size:12px}.ms-more{width:100%;margin-top:12px}
@media(max-width:600px){.member-signals{border-radius:12px}.member-signals header,.ms-controls{padding:20px 16px}.member-signals header{align-items:flex-start}.member-signals h2{font-size:25px}.member-signals header a{font-size:13px;margin-top:7px}.ms-card{padding:20px 16px}.ms-filters button{font-size:13px}.ms-refresh{padding:10px}.ms-footer{padding:0 16px 18px}.ms-card h3{font-size:21px}.ms-input-wrap input{font-size:17px}}

.ms-tp-prices{display:flex;flex-wrap:wrap;gap:8px 16px}.ms-tp-prices>span{display:inline-flex;align-items:baseline;gap:6px}.ms-tp-prices strong{margin-right:0}

.ms-tp-event{align-items:baseline;gap:8px 14px}
.ms-tp-event .ms-stage,.ms-tp-percent{font-size:20px;font-weight:800;line-height:1.35}
.ms-tp-percent{color:var(--green);font-variant-numeric:tabular-nums}
@media(max-width:600px){.ms-tp-event .ms-time{flex-basis:100%}}

/* Interaction recipes: Transitions.dev, copyright 2026 Jakub Antalik. */
:root {
  --tabs-dur: 250ms;
  --tabs-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --tabs-text-muted: rgba(15, 15, 15, 0.8);
  --tabs-text-active: #0f0f0f;
  --tabs-bar-bg: #f1f1f1;
  --tabs-pill-bg: #ffffff;
}
/* The bar is just a flex container with padding for the pill
   to sit inside. Tabs sit on z-index: 1, the pill on z-index: 0,
   so labels read above the pill background. */
.t-tabs {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px;
  border-radius: 48px;
  background: var(--tabs-bar-bg);
}
.t-tab {
  position: relative;
  appearance: none;
  border: 0;
  background: transparent;
  height: 30px;
  padding: 4px 12px;
  color: var(--tabs-text-muted);
  cursor: pointer;
  border-radius: 48px;
  z-index: 1;
  transition: color var(--tabs-dur) var(--tabs-ease);
}
.t-tab:not([aria-selected="true"]):hover,
.t-tab[aria-selected="true"] {
  color: var(--tabs-text-active);
}

/* The pill: width + transform are written inline by JS so
   the transition tweens between the previous and next
   measured positions. */
.t-tabs-pill {
  position: absolute;
  top: 3px;
  left: 0;
  height: 30px;
  width: 0;
  background: var(--tabs-pill-bg);
  border-radius: 48px;
  transform: translateX(0);
  transition:
    transform var(--tabs-dur) var(--tabs-ease),
    width     var(--tabs-dur) var(--tabs-ease);
  will-change: transform, width;
  z-index: 0;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .t-tabs-pill, .t-tab { transition: none !important; }
}
:root {
  --modal-open-dur: 250ms;
  --modal-close-dur: 150ms;
  --modal-scale: 0.96;
  --modal-scale-close: 0.96;
  --modal-ease: cubic-bezier(0.22, 1, 0.36, 1);
}
.t-modal {
  transform-origin: center;
  transform: scale(var(--modal-scale));
  opacity: 0;
  pointer-events: none;
  transition:
    transform var(--modal-open-dur) var(--modal-ease),
    opacity   var(--modal-open-dur) var(--modal-ease);
  will-change: transform, opacity;
}
.t-modal.is-open {
  transform: scale(1);
  opacity: 1;
  pointer-events: auto;
}
.t-modal.is-closing {
  transform: scale(var(--modal-scale-close));
  opacity: 0;
  pointer-events: none;
  transition:
    transform var(--modal-close-dur) var(--modal-ease),
    opacity   var(--modal-close-dur) var(--modal-ease);
}

@media (prefers-reduced-motion: reduce) {
  .t-modal { transition: none !important; }
}
/* Product integration: preserve button semantics, grid widths and brand colours. */
.t-tabs {
  --tabs-text-muted: var(--muted, #aab2bd);
  --tabs-text-active: var(--text, #f5f3ed);
  --tabs-pill-bg: var(--gold, #f7c928);
  --tabs-bar-bg: var(--surface, #101215);
}
:is(.filters, .health-tabs, .ms-filters).t-tabs {
  display: grid;
  align-items: stretch;
  gap: 3px;
  padding: 4px;
  border-radius: 12px;
  isolation: isolate;
}
:is(.filters, .health-tabs, .ms-filters).t-tabs .t-tab {
  min-width: 0;
  min-height: 44px;
  height: auto;
  border: 0;
  border-radius: 8px;
  background: transparent;
  padding: 8px 3px;
  color: var(--tabs-text-muted);
  line-height: 1.4;
}
:is(.filters, .health-tabs, .ms-filters).t-tabs .t-tab:is([aria-pressed="true"], [aria-selected="true"]) { color: #111; background: transparent; }
:is(.filters, .health-tabs, .ms-filters).t-tabs .t-tab:focus-visible { outline: 2px solid var(--text); outline-offset: -3px; }
.t-tabs .t-tabs-pill { border-radius: 8px; }
body[data-theme="light"] .t-tabs, body.light .t-tabs { --tabs-pill-bg: #eac347; }
:is(button, a.primary-action, a.secondary-action, .app-install-link) { touch-action: manipulation; }
:is(.primary-button, .secondary-button, .icon-button, .read-all-button, .health-text-button, .primary-action, .secondary-action, .ms-refresh, .ms-more, .app-install-link, .film-close, .app-install-close) {
  transition: transform 150ms cubic-bezier(0.22, 1, 0.36, 1), background-color 150ms ease, border-color 150ms ease;
}
:is(.primary-button, .secondary-button, .icon-button, .read-all-button, .health-text-button, .primary-action, .secondary-action, .ms-refresh, .ms-more, .app-install-link, .film-close, .app-install-close):not(:disabled):active {
  transform: scale(.97);
  transition-duration: 70ms;
}
:is(.current-price-value, .current-price-change, .ms-price, .ms-return, .price-cell strong) { font-variant-numeric: tabular-nums; }
.t-modal { overscroll-behavior: contain; }
.t-modal.is-closing { pointer-events: auto; }
.t-modal::backdrop { transition: background-color 150ms ease; }
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  .topbar, .bottom-nav, .dialog-head { backdrop-filter: none; background: var(--surface, #101215); }
  .t-modal::backdrop { backdrop-filter: none; background: rgb(0 0 0 / 85%); }
}
@media (prefers-reduced-motion: reduce) {
  :is(.primary-button, .secondary-button, .icon-button, .read-all-button, .health-text-button, .primary-action, .secondary-action, .ms-refresh, .ms-more, .app-install-link, .film-close, .app-install-close) { transition: none; transform: none !important; }
  .t-modal { transform: none !important; }
}
