/* UI-015 · frontend content surfaces only; load after the existing component CSS.
   Transparent borders preserve current measurements. Controls, focus, alerts and tables keep their rules. */
.phone {--ui-card-surface:#24272b;--ui-card-nested:#2b2e32;--ui-card-muted:#202326;}

/* Messages, account/benefits, creation and purchase summaries. Explicit classes, never a global reset. */
.phone :is(
 .message-card,.empty-state,.content-card,.template-card,.task-card,.state-lines,
 .member-card,.wallet-card,.wallet-summary,.service-grid,.checkin-card,.account-empty,
 .official-address-card,.recovery-card,.recovery-choice,.creator-income,
 .studio-entry,.studio-manual,.studio-task-card,.studio-context,.studio-reference,
 .studio-advanced,.studio-director,.studio-suggestion,.studio-api-panel,.studio-manual-panel,.studio-empty,
 .generation-card,.generation-quote,.generation-state-list,.generation-task-facts,
 .generation-empty,.generation-task-detail,.generation-snapshot,
 .creator-level,.creator-income-card,.creator-price-card,.creator-withdraw-card,
 .channel-invite,.finance-filters,.finance-empty
) {border-color:transparent;box-shadow:none;background:var(--ui-card-surface);}

.phone .message-card.is-read {background:var(--ui-card-muted);}
.phone .account-empty {border-radius:16px;}
.phone .message-card>.message-tools {border-top-color:transparent;background:var(--ui-card-nested);}
.phone :is(.balance-source,.creator-stats>article,.creator-stats>div,.creator-balance-grid>article,.creator-balance-grid>div,.channel-metrics>article,.channel-metrics>div,.finance-metrics>article,.finance-metrics>div) {border-color:transparent;background:var(--ui-card-surface);}
.phone :is(.wallet-summary,.wallet-card,.creator-income-card,.creator-withdraw-card) .balance-source {background:var(--ui-card-nested);}

/* Former separator rows become spaced surfaces, with existing text sizes and controls retained. */
.phone :is(.account-record-card,.benefit-task,.account-setting-row,.wallet-ledger-row,.creator-ledger-row,.creator-withdraw-row,.privilege-row) {border-color:transparent;border-radius:14px;background:var(--ui-card-surface);padding:16px 14px;margin-top:12px;margin-bottom:12px;}
.phone .creator-work-card {border-bottom-color:transparent;border-radius:14px;background:var(--ui-card-surface);padding:16px 14px;margin:12px 0;}

/* Unselected purchase/reward tiles have no frame; selected, claimed and available states stay visible. */
.phone :is(.recharge-plan,.vip-plan):not(.selected):not([aria-pressed=true]):not([aria-current=true]) {border-color:transparent;background:var(--ui-card-surface);}
.phone .checkin-day:not(.is-current):not(.is-claimed):not([data-state=available]):not([data-state=claimed]) {border-color:transparent;background:var(--ui-card-nested);}
.phone .activity-card {border-color:transparent;}
.phone .public-work-card .poster-frame {border-color:transparent;}

/* Neutral service facts can lose their frame. Access gates and warning/error/refund states are excluded. */
.phone .studio-connection:is([data-state=checking],[data-state=ready]),
.phone .studio-live-notice:not([data-state]),
.phone .studio-live-task:is([data-phase=submitting],[data-phase=queued],[data-phase=running],[data-phase=verifying],[data-phase=ready],[data-phase=refunded]),
.phone .creator-qualification:not([data-state]),
.phone .channel-access:not([data-state=disabled]),
.phone .finance-direction-card:not([data-direction=unknown]) {border-color:transparent;background:var(--ui-card-surface);}

/* Keep semantic settlement fills and highlighted work rails; no table/field/state/focus selectors are reset. */
.phone .finance-direction-card:is([data-direction=payable],[data-direction=platform_pays]) {background:#30262d;}
.phone .finance-direction-card:is([data-direction=receivable],[data-direction=channel_returns]) {background:#253028;}
