/* Great shared UI foundations. New surfaces must use these tokens. */
:root {
  --ui-bg:#141518; --ui-surface:#1d2025; --ui-card:#1d1f23;
  --ui-control:#262b33; --ui-control-selected:#343941;
  --ui-text:#f5f6fa; --ui-muted:#a8adba; --ui-subtle:#929aa9;
  --ui-action:#087cff; --ui-action-hover:#218bff; --ui-money:#00a3ff;
  --ui-line:#ffffff0b; --ui-focus:#8ebcff;
  --ui-space-1:4px; --ui-space-2:8px; --ui-space-3:12px;
  --ui-space-4:16px; --ui-space-5:24px;
  --ui-control-height:40px; --ui-link-height:48px;
  --ui-radius-control:12px; --ui-radius-card:18px; --ui-radius-sheet:24px;
  --ui-font-body:13px; --ui-font-action:13px; --ui-font-caption:11px;
  --ui-font-heading:15px; --ui-font-brand:24px;
  --ui-weight-body:400; --ui-weight-label:550; --ui-weight-action:650; --ui-weight-heading:700;
  --ui-motion-feedback:180ms; --ui-motion-panel-in:600ms; --ui-motion-panel-out:500ms;
  --ui-motion-reveal:1600ms; --ui-motion-amount:1500ms;
  --ui-ease-out:cubic-bezier(.22,.61,.36,1);
  --ui-ease-amount:cubic-bezier(.16,1,.3,1);
}
body,button,input,select,textarea { font-family:'Onest',system-ui,sans-serif; }
:is(.home-screen,.tasks-screen) { background:var(--ui-bg); color:var(--ui-text); }
.sheet { background:var(--ui-surface); color:var(--ui-text); padding-inline:20px; border-top-left-radius:var(--ui-radius-sheet); border-top-right-radius:var(--ui-radius-sheet); }
.sheet-fixed-heading { background:var(--ui-surface); }
.primary-button,.secondary-button,
.home-invite-actions > button,.partner-offer-actions > button,
.sheet .task-fixed-actions > :is(button,a),.sheet .task-fixed-actions > .offer-stats-back {
  display:flex; align-items:center; justify-content:center;
  min-width:0; min-height:var(--ui-control-height); height:auto;
  padding:9px 12px; border:0; border-radius:var(--ui-radius-control);
  font-size:var(--ui-font-action); font-weight:var(--ui-weight-action); line-height:1.3;
  text-align:center; white-space:normal; overflow-wrap:anywhere;
  transition:background-color var(--ui-motion-feedback) ease,color var(--ui-motion-feedback) ease;
}
.primary-button,.home-invite-actions > .home-invite-share { background:var(--ui-action); color:#fff; }
.secondary-button,.partner-offer-actions > .secondary-button,.home-invite-actions > .home-invite-statistics { background:var(--ui-control); color:var(--ui-text); }
.home-invite-actions { grid-template-columns:minmax(0,1fr) var(--ui-control-height); gap:var(--ui-space-3); }
.home-invite-actions > .home-invite-statistics { width:var(--ui-control-height); height:var(--ui-control-height); padding:0; color:var(--ui-muted); }
.home-invite-actions svg { width:22px; height:22px; }
.partner-offer-actions { gap:var(--ui-space-3); padding:0 var(--ui-space-3) var(--ui-space-3); }
.partner-offer-actions > button { padding-inline:8px; }
.promotion-icon { width:16px; height:16px; margin-left:6px; }
:is(.primary-button,.secondary-button,.home-invite-actions > button,.partner-offer-actions > button):active:not(:disabled),
.home-bottom-panels button:active { transform:none; opacity:.85; }
@media (hover:hover) and (pointer:fine) {
  .primary-button:hover,.home-invite-actions > .home-invite-share:hover { background:var(--ui-action-hover); }
  .secondary-button:hover,.partner-offer-actions > .secondary-button:hover,.home-invite-actions > .home-invite-statistics:hover { background:var(--ui-control-selected); }
}
.home-bottom-panels > section,.partner-offer { border-radius:var(--ui-radius-card); background:var(--ui-card); border:1px solid var(--ui-line); }
.home-bottom-panels > section { padding:var(--ui-space-3); }
.partner-offer-heading { padding:var(--ui-space-3) var(--ui-space-3) var(--ui-space-2); }
.partner-offer-reward { padding:0 var(--ui-space-3) var(--ui-space-2); }
.tasks-screen .task-list { gap:var(--ui-space-3); }
.tasks-screen .task-toolbar { gap:var(--ui-space-3); }
.task-toolbar .task-search,.task-toolbar-control,.task-toolbar-control .wc-control,
.task-toolbar-control .wc-trigger { height:var(--ui-control-height); min-height:var(--ui-control-height); }
.task-toolbar-control { flex-basis:var(--ui-control-height); width:var(--ui-control-height); }
.task-toolbar-control .wc-control,.task-toolbar-control .wc-trigger { width:var(--ui-control-height); }
.task-toolbar-control .task-toolbar-pictogram { top:10px; left:10px; width:20px; height:20px; }
.tasks-screen .task-toolbar .task-search,.tasks-screen .task-toolbar-control .wc-trigger { border-radius:var(--ui-radius-control); }
.copy-link-field { min-height:var(--ui-link-height); padding:4px 6px 4px 12px; border-radius:var(--ui-radius-control); background:var(--ui-control); }
.copy-link-field > input { font-size:12px; color:#b9c2d0; line-height:1.5; }
.copy-link-field > button { flex-basis:var(--ui-control-height); width:var(--ui-control-height); height:var(--ui-control-height); border-radius:var(--ui-radius-control); }
.copy-link-field .copy-link-icon { width:22px; height:22px; }
.home-invite-panel { gap:var(--ui-space-2); }
.home-invite-panel > .home-invite-actions { margin-top:var(--ui-space-1); }
.sheet .sheet-fixed-heading > .partner-offer-heading { padding:16px 0 12px; }
.sheet .task-fixed-actions { gap:var(--ui-space-3); margin:0; padding:0 0 16px; }
.sheet .task-fixed-actions.execution-actions:has(> button:nth-child(2)) { grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); }
.execution-actions > .secondary-button { order:-1; }
.sheet .invite-level-link > svg { flex-shrink:0; width:16px; height:16px; transform:rotate(-90deg); color:var(--ui-muted); }
.sheet .task-fixed-actions > :is(.primary-button,.secondary-button,.copy-link-field),
.sheet .task-fixed-actions .task-share-actions { width:100%; margin:0; }
.sheet-fixed-heading:not([hidden]) ~ #sheet-content > :is(.offer-options,.task-modal-content) { padding-top:8px; }
.offer-details-section + .offer-details-section { margin-top:20px; }
.offer-details-section > h4,.offer-stats-title > h4 { margin:0 0 8px; font-size:var(--ui-font-heading); font-weight:var(--ui-weight-action); line-height:1.3; }
.sheet .offer-details-copy,.sheet .task-modal-description,.offer-conditions-list { color:var(--ui-muted); font-size:var(--ui-font-body); line-height:1.5; }
.sheet .partner-offer-title { font-size:var(--ui-font-brand); font-weight:var(--ui-weight-heading); line-height:1.2; }
.offer-stats-period,.offer-stats-tabs,.sheet .segment { gap:4px; padding:4px; border:0; border-radius:var(--ui-radius-control); background:var(--ui-control); }
.offer-stats-period { margin:4px 0 16px; }
.offer-stats-period > button,.offer-stats-tabs > button,.sheet .segment > button {
  min-width:0; min-height:32px; margin:0; padding:6px; border:0; border-radius:8px;
  background:transparent; color:var(--ui-muted); font-size:13px; font-weight:var(--ui-weight-label); line-height:1.3;
  transition:background-color var(--ui-motion-feedback) ease,color var(--ui-motion-feedback) ease;
}
.offer-stats-period > button[aria-pressed="true"],.offer-stats-tabs > button[aria-pressed="true"],.sheet .segment > button.active { background:var(--ui-control-selected); color:var(--ui-text); }
.offer-stats-detail-controls { grid-template-columns:minmax(0,1fr) var(--ui-control-height); gap:var(--ui-space-3); margin:20px 0 12px; }
.offer-stats-detail-controls.is-clicks { grid-template-columns:minmax(0,1fr); }
.offer-status-filter,.offer-status-filter .wc-control,.offer-status-filter .wc-trigger { width:var(--ui-control-height); height:var(--ui-control-height); }
.offer-status-filter .wc-trigger { min-height:var(--ui-control-height); border-radius:var(--ui-radius-control); background:var(--ui-control); }
.offer-status-filter-icon { inset:10px; }
.offer-status-filter:has(.wc-trigger[aria-expanded="true"]) .wc-trigger { background:var(--ui-control); border-color:var(--ui-action); }
.offer-status { font-size:13px; font-weight:var(--ui-weight-label); }
.offer-stats-money small { font-size:var(--ui-font-caption); font-weight:500; color:var(--ui-subtle); }
.offer-stats-money dd { align-self:center; transform:translateY(3px); }
.offer-stats-metrics dt { font-size:var(--ui-font-caption); font-weight:500; }
.offer-stats-metrics dd { font-weight:var(--ui-weight-action); }
.offer-stats-money .offer-money--approved dd,.offer-tier > strong { color:var(--ui-money); }
.sheet .task-steps { margin:0; gap:12px; }
.task-own-progress-link { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:var(--ui-control-height); margin:12px 0 0; padding:10px 16px; border:1px solid var(--ui-line); border-radius:var(--ui-radius-control); color:var(--ui-text); background:var(--ui-card); font-size:var(--ui-font-action); font-weight:var(--ui-weight-label); text-align:left; }
.task-own-progress-link svg { width:16px; height:16px; }
html[data-modal-frozen] .app-shell *,html[data-modal-frozen] .dock-wrap * { animation-play-state:paused; }
.sheet .execution-progress { display:flex; gap:8px; margin:8px 0 20px; }
.execution-progress > span { flex:1; height:4px; border-radius:4px; background:var(--ui-control-selected); }
.execution-progress > .is-current { background:var(--ui-action); }
.execution-eyebrow { display:block; margin-bottom:8px; color:var(--ui-subtle); font-size:11px; font-weight:500; }
.sheet .execution-current .copy-link-field { margin:16px 0 0; }
.sheet .execution-current .form-label { margin:16px 0 8px; }
.sheet .execution-deposit-reward { margin:8px 0 0; font-size:12px; color:var(--ui-money); }
.execution-summary { margin:16px 0 0; }
.execution-summary > div { display:flex; justify-content:space-between; gap:12px; padding:12px 0; border-top:1px solid var(--ui-line); font-size:13px; }
.execution-summary dt { color:var(--ui-muted); }
.execution-summary dd { margin:0; color:var(--ui-text); font-weight:650; text-align:right; }
.sheet .execution-tracking { margin:16px 0 0; color:var(--ui-muted); font-size:13px; }
.own-task-item { position:relative; padding:16px 0; border-top:1px solid var(--ui-line); }
.own-task-item:first-child { padding-top:0; border:0; }
.own-task-item > div { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.own-task-item > div > strong { min-width:0; font-size:14px; font-weight:650; overflow-wrap:anywhere; }
.own-task-item .offer-status { flex-shrink:0; font-size:11px; }
.sheet .own-task-item > p { margin:8px 0; font-size:12px; line-height:1.4; color:var(--ui-muted); }
.own-task-amount { display:block; margin:12px 0; font-size:18px; font-weight:650; color:var(--ui-money); }
.sheet .own-task-item > button { width:100%; margin:12px 0 0; }
:is(button,a,input,summary):focus-visible { outline:2px solid var(--ui-focus); outline-offset:2px; }
@media(max-width:359px) { .sheet { padding-inline:16px; } .offer-stats-detail-controls { gap:8px; } }
@media(prefers-reduced-motion:reduce) {
  .primary-button,.secondary-button,.home-invite-actions > button,.partner-offer-actions > button,
  .offer-stats-period > button,.offer-stats-tabs > button,.sheet .segment > button { transition:none; }
}

/* The hold is visible beside the balance and never enters the spendable sum. */
.home-screen .balance-hold { position:absolute; top:calc(50% + 28 * var(--won-unit)); left:0; right:0; display:flex; align-items:center; justify-content:center; gap:8px; width:max-content; max-width:100%; min-height:24px; margin:0 auto; padding:2px 8px; border-radius:8px; color:var(--ui-muted); background:transparent; font-size:12px; line-height:1.4; }
.home-screen .balance-hold strong { color:#d6b970; font-weight:650; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.home-screen .balance-block.has-hold .balance-sub { top:calc(50% + 53 * var(--won-unit)); }

/* Shared, interruptible feedback; data and geometry remain readable. */
:is(.primary-button,.secondary-button,.copy-link-field > button,.task-own-progress-link,.home-invite-actions > button,.menu-row,.balance-hold,.text-button) {
  transition:background-color 240ms ease,color 240ms ease,opacity 240ms ease;
}
.copy-link-field > button[data-copy-complete] { color:var(--ui-money); }
.copy-link-field > button[data-copy-complete] .copy-link-icon { animation:copy-link-confirm 480ms var(--ui-ease-out) both; }
@keyframes copy-link-confirm { from { opacity:0; transform:translateY(3px) scale(.94); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:reduce) { .copy-link-field > button[data-copy-complete] .copy-link-icon { animation:none; } }

/* Shared secondary routes keep the same control geometry. */
.dock-wrap[hidden] { display:none; }
.bonus-overview-back { display:flex; align-items:center; gap:8px; width:100%; margin:0 0 16px; }
.bonus-overview-back .ui-icon { width:16px; height:16px; transform:rotate(180deg); }
.profile-identity { min-width:0; }
.profile-identity :is(h1,p),.stat-card strong { overflow-wrap:anywhere; }
@media(max-width:359px) { .nav-button { font-size:13px; } }

/* Offer typography is UI text and must not inherit viewport-scaled banner units. */
.partner-offer-info { gap:6px; }
.partner-offer-title { font-size:var(--ui-font-brand); }
.partner-offer-tags { gap:5px; flex-wrap:wrap; }
.partner-offer-tag { padding:3px 6px; font-size:11px; line-height:1.25; }
.partner-offer-reward { gap:8px; }
.partner-offer-reward > span { font-size:12px; line-height:1.35; }
.offer-stats-money dd { max-width:65%; }
.offer-stats-money dt { flex:0 0 auto; max-width:45%; }
.offer-stats-money dt .offer-status { max-width:100%; }
.offer-stats-money [data-amount-number],.offer-event-amount { max-width:100%; white-space:normal; overflow-wrap:anywhere; }
.offer-event summary > .offer-event-amount { max-width:55%; min-width:0; }
@media(max-width:360px) {
  .partner-offer-title,.sheet .partner-offer-title,.sheet .sheet-fixed-heading .partner-offer-title { font-size:22px; }
}
