/* ════════════════════════════════════════════════════════════════════════════
 * Agent Studio — Body · Money · Skills panels (P3–P5)
 * ════════════════════════════════════════════════════════════════════════════
 * Shared styling for the three sub-studios that mount into the shell's tab
 * panels. Uses the same design-token vocabulary as agent-studio.html / the Brain
 * + Memory studios so the five tabs feel like one product. Each tab owns a class
 * prefix: .bdy (Body), .mny (Money), .skl (Skills).
 */

/* ── Shared section scaffolding ──────────────────────────────────────────── */
.bdy-section,
.mny-section,
.skl-section {
	margin-bottom: var(--space-xl, 2.618rem);
}
.bdy-section:last-child,
.mny-section:last-child,
.skl-section:last-child {
	margin-bottom: 0;
}
.bdy-section-head h3,
.mny-section-head h3,
.skl-section-head h3 {
	margin: 0 0 2px;
	font-family: var(--font-display);
	font-size: var(--text-lg, 1.236rem);
	color: var(--ink-bright, #fff);
}
.bdy-section-head p,
.mny-section-head p,
.skl-section-head p {
	margin: 0 0 var(--space-md, 1rem);
	font-size: var(--text-md, 0.8125rem);
	line-height: var(--leading-normal, 1.618);
	color: var(--ink-dim, #888);
}

/* Shared inline empty / error states */
.bdy-empty,
.mny-empty,
.mny-inline-empty,
.skl-inline-empty {
	text-align: center;
	color: var(--ink-dim, #888);
	padding: var(--space-lg, 1.618rem);
}
.bdy-empty h3,
.mny-empty h3 {
	margin: 8px 0 6px;
	font-family: var(--font-display);
	color: var(--ink-bright, #fff);
}
.bdy-empty-glyph,
.mny-empty-glyph {
	width: 48px;
	height: 48px;
	margin: 0 auto var(--space-sm);
	display: grid;
	place-items: center;
	font-size: 22px;
	border-radius: var(--radius-lg, 14px);
	background: var(--surface-2, rgba(255, 255, 255, 0.05));
	border: 1px solid var(--stroke);
	color: var(--ink-dim);
}
.mny-empty-glyph.small { width: 38px; height: 38px; font-size: 18px; }
.mny-inline-empty p,
.skl-inline-empty p { margin: 0 0 10px; font-size: var(--text-md, 0.8125rem); }

/* ════════════════════════════════════════════════════════════════════════════
 * BODY
 * ══════════════════════════════════════════════════════════════════════════ */
.bdy-avatar-card {
	display: flex;
	gap: var(--space-md, 1rem);
	align-items: center;
	padding: var(--space-md, 1rem);
	border-radius: var(--radius-lg, 14px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03));
	border: 1px solid var(--stroke);
}
.bdy-avatar-thumb {
	flex: 0 0 auto;
	width: 84px;
	height: 84px;
	border-radius: var(--radius-md, 10px);
	overflow: hidden;
	background:
		radial-gradient(120% 90% at 50% 0%, rgba(139, 92, 246, 0.18), transparent 65%),
		var(--surface-3, rgba(255, 255, 255, 0.06));
	display: grid;
	place-items: center;
	border: 1px solid var(--stroke);
}
.bdy-avatar-thumb img { width: 100%; height: 100%; object-fit: cover; }
.bdy-avatar-fallback { font-size: 32px; color: var(--ink-faint, #666); }
.bdy-avatar-meta { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.bdy-avatar-name {
	font-weight: var(--weight-bold, 700);
	font-size: var(--text-base, 1rem);
	color: var(--ink-bright, #fff);
}
.bdy-avatar-sub { font-size: var(--text-md, 0.8125rem); color: var(--ink-dim, #888); }
.bdy-avatar-actions { display: flex; flex-wrap: wrap; gap: var(--space-sm, 0.618rem); margin-top: 8px; }
.bdy-avatar-actions .studio-action { margin-top: 0; }

/* Resting pose readout */
.bdy-resting {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 12px;
	margin-bottom: var(--space-md, 1rem);
	border-radius: var(--radius-pill, 999px);
	background: var(--surface-2, rgba(255, 255, 255, 0.05));
	border: 1px solid var(--stroke);
}
.bdy-resting-label { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim); text-transform: uppercase; letter-spacing: 0.06em; }
.bdy-resting-val { font-size: var(--text-md, 0.8125rem); font-weight: var(--weight-semibold, 600); color: var(--accent, #a78bfa); }

/* Featured + category clip grids */
.bdy-featured {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
	gap: 8px;
	margin-bottom: var(--space-md, 1rem);
}
.bdy-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
	gap: 8px;
	padding: 10px 0 4px;
}
.bdy-cat { border-top: 1px solid var(--stroke); }
.bdy-cat-summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 11px 2px;
	cursor: pointer;
	font-weight: var(--weight-semibold, 600);
	font-size: var(--text-ui, 0.875rem);
	color: var(--ink, #e8e8e8);
	list-style: none;
	user-select: none;
}
.bdy-cat-summary::-webkit-details-marker { display: none; }
.bdy-cat-summary:hover { color: var(--ink-bright, #fff); }
.bdy-cat-count {
	font-size: var(--text-2xs, 0.6875rem);
	color: var(--ink-dim);
	background: var(--surface-3, rgba(255, 255, 255, 0.08));
	border-radius: var(--radius-pill, 999px);
	padding: 1px 8px;
}

.bdy-chip {
	position: relative;
	display: flex;
	border-radius: var(--radius-md, 10px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03));
	border: 1px solid var(--stroke);
	overflow: hidden;
	transition: border-color var(--duration-fast, var(--duration-fast)) var(--ease-standard), background var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard);
}
.bdy-chip:hover { border-color: var(--stroke-strong, rgba(255, 255, 255, 0.2)); background: var(--surface-2); }
.bdy-chip--featured { background: var(--surface-2, rgba(255, 255, 255, 0.05)); }
.bdy-chip--playing { border-color: var(--accent, #a78bfa); box-shadow: 0 0 0 1px var(--accent, #a78bfa) inset; }
.bdy-chip--resting { border-color: rgba(139, 92, 246, 0.5); }
.bdy-chip-play {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	appearance: none;
	background: transparent;
	border: none;
	cursor: pointer;
	padding: 10px 11px;
	color: var(--ink, #e8e8e8);
	text-align: left;
	min-width: 0;
}
.bdy-chip-icon { font-size: 18px; line-height: 1; }
.bdy-chip-label {
	font-size: var(--text-md, 0.8125rem);
	font-weight: var(--weight-medium, 500);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}
.bdy-chip-play:active { transform: scale(0.97); }
.bdy-chip-pin {
	position: absolute;
	top: 5px;
	right: 5px;
	appearance: none;
	background: rgba(0, 0, 0, 0.3);
	border: none;
	border-radius: 50%;
	width: 22px;
	height: 22px;
	cursor: pointer;
	color: var(--ink-faint, #777);
	font-size: 13px;
	line-height: 1;
	opacity: 0;
	transition: opacity var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard);
}
.bdy-chip:hover .bdy-chip-pin,
.bdy-chip-pin.on { opacity: 1; }
.bdy-chip-pin:hover { color: var(--accent, #a78bfa); transform: scale(1.15); }
.bdy-chip-pin.on { color: var(--accent, #a78bfa); }

/* Body skeleton */
.bdy-skel-card { height: 116px; border-radius: var(--radius-lg, 14px); }
.bdy-skel-row { height: 36px; width: 180px; border-radius: var(--radius-pill, 999px); margin: 16px 0; }
.bdy-skel-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; }
.bdy-skel-chip { height: 64px; border-radius: var(--radius-md, 10px); }
.bdy-skel-card,
.bdy-skel-row,
.bdy-skel-chip,
.mny-skel-card {
	background: linear-gradient(110deg, rgba(255, 255, 255, 0.03) 30%, rgba(255, 255, 255, 0.07) 50%, rgba(255, 255, 255, 0.03) 70%);
	background-size: 220% 100%;
	animation: studio-shimmer 1.4s ease-in-out infinite;
}

/* ════════════════════════════════════════════════════════════════════════════
 * MONEY
 * ══════════════════════════════════════════════════════════════════════════ */
.mny-skel-card { height: 120px; border-radius: var(--radius-lg, 14px); margin-bottom: 14px; }

.mny-wallet-card {
	padding: var(--space-md, 1rem);
	border-radius: var(--radius-lg, 14px);
	background:
		radial-gradient(120% 80% at 0% 0%, rgba(74, 222, 128, 0.08), transparent 55%),
		var(--surface-1, rgba(255, 255, 255, 0.03));
	border: 1px solid var(--stroke);
}
.mny-wallet-empty { text-align: center; }
.mny-wallet-glyph { font-size: 30px; color: var(--ink-faint, #666); margin-bottom: 8px; }
.mny-wallet-empty p { margin: 0 0 12px; color: var(--ink-dim); }
.mny-wallet-bal { display: flex; gap: var(--space-lg, 1.618rem); margin-bottom: 14px; }
.mny-bal { display: flex; flex-direction: column; }
.mny-bal b { font-family: var(--font-display); font-size: var(--text-xl, 1.618rem); color: var(--ink-bright, #fff); line-height: 1.1; }
.mny-bal span { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim); text-transform: uppercase; letter-spacing: 0.06em; }

.mny-wallet-addr {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	padding: 10px 12px;
	border-radius: var(--radius-md, 10px);
	background: var(--surface-2, rgba(255, 255, 255, 0.05));
	border: 1px solid var(--stroke);
	margin-bottom: 12px;
}
.mny-addr-label { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim); text-transform: uppercase; letter-spacing: 0.06em; }
.mny-addr { font-family: var(--font-mono, ui-monospace, monospace); font-size: var(--text-md, 0.8125rem); color: var(--ink-bright, #fff); }
.mny-icon-btn {
	appearance: none;
	display: inline-grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border-radius: var(--radius-sm, 6px);
	border: 1px solid var(--stroke);
	background: var(--surface-3, rgba(255, 255, 255, 0.08));
	color: var(--ink, #e8e8e8);
	cursor: pointer;
	text-decoration: none;
	font-size: 13px;
	transition: background var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard);
}
.mny-icon-btn:hover { background: var(--surface-4, rgba(255, 255, 255, 0.12)); border-color: var(--stroke-strong); }
.mny-wallet-tools { display: flex; flex-wrap: wrap; gap: var(--space-sm, 0.618rem); }
.mny-wallet-tools .studio-action { margin-top: 0; }

/* Pricing rows */
.mny-price-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.mny-price-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-md, 1rem);
	flex-wrap: wrap;
	padding: 11px 13px;
	border-radius: var(--radius-md, 10px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03));
	border: 1px solid var(--stroke);
	transition: border-color var(--duration-fast) var(--ease-standard);
}
.mny-price-row.is-priced { border-color: rgba(74, 222, 128, 0.35); }
.mny-price-meta { display: flex; align-items: center; gap: 10px; min-width: 0; }
.mny-price-icon { font-size: 18px; }
.mny-price-name { display: block; font-weight: var(--weight-semibold, 600); color: var(--ink-bright, #fff); font-size: var(--text-md, 0.8125rem); }
.mny-price-desc { display: block; font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim); max-width: 36ch; }
.mny-price-input { display: flex; align-items: center; gap: 6px; }
.mny-price-cur { color: var(--ink-dim); font-size: var(--text-md); }
.mny-price-input input {
	width: 72px;
	padding: 6px 8px;
	border-radius: var(--radius-sm, 6px);
	border: 1px solid var(--stroke);
	background: var(--surface-2, rgba(255, 255, 255, 0.05));
	color: var(--ink-bright, #fff);
	font-size: var(--text-md, 0.8125rem);
	text-align: right;
}
.mny-price-input input:focus { outline: none; border-color: var(--accent, #a78bfa); }
.mny-price-unit { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim); }
.mny-price-save { margin-top: 0; }

/* Earnings feed */
.mny-earn-summary { display: flex; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.mny-earn-stat {
	flex: 1 1 90px; padding: 10px 12px; border-radius: var(--radius-md, 10px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03)); border: 1px solid var(--stroke);
	display: flex; flex-direction: column; gap: 2px;
}
.mny-earn-stat b { font-size: var(--text-lg, 1rem); color: var(--ink-bright, #fff); font-variant-numeric: tabular-nums; }
.mny-earn-stat b.pos { color: var(--success, #4ade80); }
.mny-earn-stat span { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim, #888); }
.mny-earn-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.mny-earn-row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 12px;
	border-radius: var(--radius-md, 10px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03));
	border: 1px solid var(--stroke);
	font-size: var(--text-md, 0.8125rem);
}
.mny-earn-row[data-status='pending'] { opacity: 0.65; }
.mny-earn-amt { font-weight: var(--weight-bold, 700); color: var(--success, #4ade80); white-space: nowrap; }
.mny-earn-detail { flex: 1; min-width: 0; color: var(--ink, #e8e8e8); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mny-earn-detail b { color: var(--ink-bright, #fff); }
.mny-earn-time { color: var(--ink-dim); font-size: var(--text-2xs, 0.6875rem); white-space: nowrap; }
.mny-earn-tx { color: var(--ink-dim); text-decoration: none; }
.mny-earn-tx:hover { color: var(--ink-bright); }

/* ════════════════════════════════════════════════════════════════════════════
 * SKILLS
 * ══════════════════════════════════════════════════════════════════════════ */
.skl-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 10px;
}
.skl-card {
	display: flex;
	gap: 12px;
	padding: 13px;
	border-radius: var(--radius-lg, 14px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03));
	border: 1px solid var(--stroke);
	transition: border-color var(--duration-fast) var(--ease-standard), background var(--duration-fast) var(--ease-standard), opacity var(--duration-fast) var(--ease-standard);
}
.skl-card.is-on { border-color: rgba(139, 92, 246, 0.4); background: var(--surface-2, rgba(255, 255, 255, 0.05)); }
.skl-card:not(.is-on):not(.is-locked) { opacity: 0.72; }
.skl-card:not(.is-on):not(.is-locked):hover { opacity: 1; border-color: var(--stroke-strong); }
.skl-card-icon {
	flex: 0 0 auto;
	width: 36px;
	height: 36px;
	display: grid;
	place-items: center;
	font-size: 18px;
	border-radius: var(--radius-md, 10px);
	background: var(--surface-3, rgba(255, 255, 255, 0.08));
	border: 1px solid var(--stroke);
}
.skl-card-main { flex: 1; min-width: 0; }
.skl-card-top { display: flex; align-items: center; gap: 8px; }
.skl-card-name { font-weight: var(--weight-semibold, 600); color: var(--ink-bright, #fff); font-size: var(--text-md, 0.8125rem); }
.skl-sellable-tag {
	font-size: 9px;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	font-weight: var(--weight-bold, 700);
	color: var(--success, #4ade80);
	background: rgba(74, 222, 128, 0.12);
	border: 1px solid rgba(74, 222, 128, 0.3);
	border-radius: var(--radius-pill, 999px);
	padding: 1px 7px;
}
.skl-card-desc { margin: 3px 0 0; font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim); line-height: 1.5; }
.skl-card-foot { margin-top: 7px; min-height: 0; }
.skl-price-chip {
	appearance: none;
	cursor: pointer;
	font-size: var(--text-2xs, 0.6875rem);
	font-weight: var(--weight-semibold, 600);
	color: var(--ink-dim);
	background: var(--surface-3, rgba(255, 255, 255, 0.08));
	border: 1px solid var(--stroke);
	border-radius: var(--radius-pill, 999px);
	padding: 3px 10px;
	transition: color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard);
}
.skl-price-chip:hover { color: var(--ink-bright, #fff); border-color: var(--stroke-strong); }
.skl-price-chip.is-priced { color: var(--success, #4ade80); border-color: rgba(74, 222, 128, 0.3); }
.skl-price-chip.is-loading { cursor: default; }
.skl-card-toggle { flex: 0 0 auto; display: grid; place-items: center; }
.skl-locked-badge { color: var(--accent, #a78bfa); font-size: 11px; }

/* Toggle switch */
.skl-switch {
	appearance: none;
	position: relative;
	width: 38px;
	height: 22px;
	border-radius: var(--radius-pill, 999px);
	background: var(--surface-3, rgba(255, 255, 255, 0.12));
	border: 1px solid var(--stroke);
	cursor: pointer;
	transition: background var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard);
}
.skl-switch[aria-checked='true'] { background: rgba(139, 92, 246, 0.6); border-color: rgba(139, 92, 246, 0.8); }
.skl-switch-knob {
	position: absolute;
	top: 2px;
	left: 2px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #fff;
	transition: transform var(--duration-fast) var(--ease-standard);
}
.skl-switch[aria-checked='true'] .skl-switch-knob { transform: translateX(16px); }
.skl-switch:focus-visible { outline: 2px solid var(--focus-ring-color, #fff); outline-offset: 2px; }

/* ── Toasts (shared shape) ───────────────────────────────────────────────── */
.bdy-toast,
.mny-toast,
.skl-toast {
	position: fixed;
	left: 50%;
	bottom: 24px;
	transform: translateX(-50%) translateY(12px);
	z-index: 100;
	padding: 9px 16px;
	border-radius: var(--radius-pill, 999px);
	background: var(--surface-4, rgba(30, 31, 40, 0.95));
	border: 1px solid var(--stroke-strong, rgba(255, 255, 255, 0.2));
	color: var(--ink-bright, #fff);
	font-size: var(--text-md, 0.8125rem);
	font-weight: var(--weight-semibold, 600);
	box-shadow: var(--shadow-2, 0 8px 32px rgba(0, 0, 0, 0.5));
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--duration-base, var(--duration-base)) var(--ease-out), transform var(--duration-base) var(--ease-out);
}
.bdy-toast.show,
.mny-toast.show,
.skl-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.mny-toast-err,
.skl-toast-err,
.bdy-toast-err { border-color: var(--danger, #f87171); color: var(--danger, #f87171); }

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 540px) {
	.bdy-featured,
	.bdy-grid { grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); }
	.skl-grid { grid-template-columns: 1fr; }
	.mny-price-row { align-items: flex-start; }
	.bdy-avatar-card { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
	.bdy-skel-card,
	.bdy-skel-row,
	.bdy-skel-chip,
	.mny-skel-card { animation: none; }
	.bdy-chip-play,
	.skl-switch-knob,
	.bdy-chip-pin { transition: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Money panel — holdings, activity, withdraw (P4 additions)
   ═══════════════════════════════════════════════════════════════════════════ */
.studio-btn-danger {
	background: color-mix(in srgb, var(--danger, #f87171) 16%, transparent);
	color: var(--danger, #f87171);
	border-color: color-mix(in srgb, var(--danger, #f87171) 45%, transparent);
}
.studio-btn-danger:hover { background: color-mix(in srgb, var(--danger, #f87171) 26%, transparent); }

.mny-sub-head {
	margin: var(--space-md, 1rem) 0 8px;
	font-size: var(--text-2xs, 0.6875rem);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink-faint, rgba(255, 255, 255, 0.45));
	font-weight: var(--weight-semibold, 600);
	display: flex; align-items: center; gap: 8px;
}
.mny-count {
	font-size: var(--text-2xs, 0.6875rem);
	padding: 1px 7px;
	border-radius: var(--radius-pill, 999px);
	background: var(--surface-3, rgba(255, 255, 255, 0.08));
	color: var(--ink-dim, #888);
	letter-spacing: 0;
}
.mny-faint { color: var(--ink-faint, rgba(255, 255, 255, 0.45)); font-size: var(--text-md, 0.8125rem); margin: 6px 0; }
.mny-skel-line { height: 14px; border-radius: 6px; background: var(--surface-2); animation: mny-pulse 1.4s ease-in-out infinite; }
@keyframes mny-pulse { 0%, 100% { opacity: 0.4; } 50% { opacity: 0.8; } }

.mny-hold-list, .mny-act-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.mny-hold-row, .mny-act-row {
	display: flex; align-items: center; gap: 10px;
	padding: 7px 10px;
	border-radius: var(--radius-md, 10px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03));
	border: 1px solid var(--stroke);
	font-size: var(--text-md, 0.8125rem);
}
.mny-hold-mint, .mny-act-tx { color: var(--ink-dim, #888); text-decoration: none; font-family: var(--font-mono); font-size: var(--text-2xs, 0.6875rem); }
.mny-hold-mint:hover, .mny-act-tx:hover { color: var(--ink-bright, #fff); }
.mny-hold-amt { margin-left: auto; color: var(--ink-bright, #fff); font-variant-numeric: tabular-nums; }
.mny-act-sum { color: var(--ink, #e8e8e8); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mny-act-delta { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--ink-dim); }
.mny-act-delta.pos, .pos { color: var(--success, #4ade80); }
.mny-act-delta.neg, .neg { color: var(--danger, #f87171); }
.mny-act-row.is-fail .mny-act-sum { color: var(--danger, #f87171); }

.mny-withdraw {
	margin-top: var(--space-md, 1rem);
	padding: var(--space-md, 1rem);
	border-radius: var(--radius-lg, 14px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03));
	border: 1px solid var(--stroke);
}
.mny-withdraw-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-weight: var(--weight-semibold, 600); color: var(--ink-bright, #fff); margin-bottom: 10px; }
.mny-asset-toggle { display: inline-flex; gap: 2px; padding: 2px; border-radius: 6px; background: var(--surface-2, rgba(255,255,255,0.06)); border: 1px solid var(--stroke); }
.mny-asset-btn {
	border: 0; background: transparent; color: var(--ink-dim, #888); cursor: pointer;
	padding: 3px 12px; border-radius: 6px; font-size: var(--text-2xs, 0.6875rem); font-weight: var(--weight-semibold, 600);
	transition: background-color var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard);
}
.mny-asset-btn:hover { color: var(--ink-bright, #fff); }
.mny-asset-btn.is-on { background: var(--accent, #6366f1); color: #fff; }
.mny-withdraw-avail { margin-left: auto; font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim, #888); font-weight: var(--weight-normal, 400); font-variant-numeric: tabular-nums; }
.mny-withdraw-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.mny-withdraw-row input {
	flex: 1 1 140px; min-width: 0;
	padding: 8px 12px;
	border-radius: var(--radius-md, 10px);
	background: var(--bg-0, #0a0a0a);
	border: 1px solid var(--stroke);
	color: var(--ink-bright, #fff);
	font-size: var(--text-md, 0.8125rem);
}
.mny-withdraw-row input[data-wd="amount"] { flex: 0 1 120px; }
.mny-withdraw-row .studio-btn { margin-top: 0; }
.mny-withdraw-result { margin-top: 10px; font-size: var(--text-md, 0.8125rem); color: var(--success, #4ade80); }
.mny-withdraw-result a { color: var(--success, #4ade80); }

/* ═══════════════════════════════════════════════════════════════════════════
   Trading Brain (.tb-*) — the visual sniping/trading rule builder
   ═══════════════════════════════════════════════════════════════════════════ */
.tb { display: block; }
.tb-head { display: flex; flex-wrap: wrap; gap: var(--space-md, 1rem); align-items: flex-start; justify-content: space-between; margin-bottom: var(--space-md, 1rem); }
.tb-title h3 { margin: 0; font-family: var(--font-display); font-size: var(--text-lg, 1.236rem); color: var(--ink-bright, #fff); }
.tb-title p { margin: 4px 0 0; font-size: var(--text-md, 0.8125rem); color: var(--ink-dim, #888); max-width: 46ch; line-height: var(--leading-normal, 1.618); }
.tb-head-controls { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.tb-mode { display: inline-flex; padding: 3px; border-radius: var(--radius-pill, 999px); background: var(--surface-2, rgba(255, 255, 255, 0.05)); border: 1px solid var(--stroke); }
.tb-mode-btn {
	border: 0; background: transparent; cursor: pointer;
	padding: 6px 14px; border-radius: var(--radius-pill, 999px);
	font-size: var(--text-md, 0.8125rem); font-weight: var(--weight-semibold, 600);
	color: var(--ink-dim, #888); transition: all var(--duration-fast) var(--ease-standard);
}
.tb-mode-btn.is-on { background: var(--ink-bright, #fff); color: var(--bg-0, #0a0a0a); }
.tb-mode-btn:focus-visible { outline: 2px solid var(--focus-ring-color, #fff); outline-offset: 2px; }

.tb-status { font-size: var(--text-2xs, 0.6875rem); font-weight: var(--weight-semibold, 600); padding: 4px 10px; border-radius: var(--radius-pill, 999px); }
.tb-status-live { color: var(--success, #4ade80); background: color-mix(in srgb, var(--success, #4ade80) 14%, transparent); }

.tb-kill {
	cursor: pointer;
	padding: 7px 14px; border-radius: var(--radius-pill, 999px);
	font-size: var(--text-md, 0.8125rem); font-weight: var(--weight-bold, 700);
	background: color-mix(in srgb, var(--danger, #f87171) 14%, transparent);
	color: var(--danger, #f87171);
	border: 1px solid color-mix(in srgb, var(--danger, #f87171) 40%, transparent);
	transition: all var(--duration-fast) var(--ease-standard);
}
.tb-kill:hover { background: color-mix(in srgb, var(--danger, #f87171) 24%, transparent); }
.tb-kill.is-killed { background: var(--danger, #f87171); color: #fff; box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger, #f87171) 22%, transparent); }
.tb-kill:focus-visible { outline: 2px solid var(--danger, #f87171); outline-offset: 2px; }

.tb-disclosure {
	margin: 0 0 var(--space-md, 1rem);
	padding: 10px 14px;
	border-radius: var(--radius-md, 10px);
	background: color-mix(in srgb, var(--warn, #fbbf24) 7%, transparent);
	border: 1px solid color-mix(in srgb, var(--warn, #fbbf24) 26%, transparent);
	color: var(--ink, #e8e8e8);
	font-size: var(--text-md, 0.8125rem); line-height: var(--leading-normal, 1.618);
}

/* — Visual flow — */
.tb-name { display: flex; flex-direction: column; gap: 5px; margin-bottom: var(--space-md, 1rem); }
.tb-name input {
	padding: 9px 13px; border-radius: var(--radius-md, 10px);
	background: var(--bg-0, #0a0a0a); border: 1px solid var(--stroke);
	color: var(--ink-bright, #fff); font-size: var(--text-base, 1rem); font-weight: var(--weight-semibold, 600);
}
.tb-flow { display: flex; flex-direction: column; align-items: stretch; }
.tb-connector { display: flex; justify-content: center; height: 18px; }
.tb-connector span { width: 2px; height: 100%; background: linear-gradient(var(--wallet-stroke, rgba(139, 92, 246, 0.3)), var(--stroke)); }

.tb-node {
	border-radius: var(--radius-lg, 14px);
	background: var(--surface-glass, linear-gradient(180deg, rgba(20, 21, 28, 0.7), rgba(14, 15, 22, 0.5)));
	border: 1px solid var(--stroke);
	overflow: hidden;
	transition: border-color var(--duration-fast) var(--ease-standard);
}
.tb-node:hover { border-color: var(--stroke-strong, rgba(255, 255, 255, 0.14)); }
.tb-node-head {
	display: flex; align-items: center; gap: 9px;
	padding: 10px 14px;
	border-bottom: 1px solid var(--stroke);
	background: var(--surface-1, rgba(255, 255, 255, 0.03));
}
.tb-node-glyph {
	display: grid; place-items: center; width: 24px; height: 24px;
	border-radius: var(--radius-sm, 6px);
	background: var(--wallet-accent-soft, rgba(139, 92, 246, 0.1));
	color: var(--wallet-accent, #c4b5fd); font-size: 14px;
}
.tb-node-title { font-weight: var(--weight-semibold, 600); color: var(--ink-bright, #fff); font-size: var(--text-ui, 0.875rem); }
.tb-node-body { padding: 12px 14px; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px 14px; }

.tb-field { display: flex; flex-direction: column; gap: 4px; }
.tb-field-l { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim, #888); }
.tb-input-wrap { display: flex; align-items: center; gap: 6px; }
.tb-input-wrap input {
	flex: 1 1 auto; min-width: 0;
	padding: 7px 10px; border-radius: var(--radius-md, 10px);
	background: var(--bg-0, #0a0a0a); border: 1px solid var(--stroke);
	color: var(--ink-bright, #fff); font-size: var(--text-md, 0.8125rem); font-variant-numeric: tabular-nums;
}
.tb-input-wrap input:focus { outline: none; border-color: var(--wallet-stroke, rgba(139, 92, 246, 0.4)); }
.tb-suffix { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-faint, rgba(255, 255, 255, 0.45)); white-space: nowrap; }
.tb-check { display: flex; align-items: center; gap: 7px; font-size: var(--text-md, 0.8125rem); color: var(--ink, #e8e8e8); align-self: end; }
.tb-check input { accent-color: var(--wallet-accent, #c4b5fd); }
.tb-err { grid-column: 1 / -1; font-size: var(--text-2xs, 0.6875rem); color: var(--danger, #f87171); }

.tb-english {
	margin: var(--space-md, 1rem) 0 0;
	padding: 11px 14px;
	border-radius: var(--radius-md, 10px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03));
	border: 1px dashed var(--stroke-strong, rgba(255, 255, 255, 0.14));
	color: var(--ink, #e8e8e8); font-size: var(--text-md, 0.8125rem); line-height: var(--leading-normal, 1.618);
}

/* — Cards (guardrails, backtest, positions, audit) — */
.tb-guardrails, .tb-assisted, .tb-backtest, .tb-positions, .tb-audit {
	margin-top: var(--space-lg, 1.618rem);
}
.tb-guardrails {
	padding: var(--space-md, 1rem);
	border-radius: var(--radius-lg, 14px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03));
	border: 1px solid var(--stroke);
}
.tb-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.tb-card-head h4 { margin: 0; font-family: var(--font-display); font-size: var(--text-ui, 0.875rem); color: var(--ink-bright, #fff); display: flex; align-items: center; gap: 8px; }
.tb-card-head p { margin: 3px 0 0; width: 100%; font-size: var(--text-md, 0.8125rem); color: var(--ink-dim, #888); line-height: var(--leading-normal, 1.618); }
.tb-badge {
	font-size: var(--text-2xs, 0.6875rem); font-weight: var(--weight-semibold, 600);
	padding: 2px 8px; border-radius: var(--radius-pill, 999px);
	background: var(--surface-3, rgba(255, 255, 255, 0.08)); color: var(--ink-dim, #888);
	letter-spacing: 0; text-transform: none;
}
.tb-badge-high { background: color-mix(in srgb, var(--success, #4ade80) 16%, transparent); color: var(--success, #4ade80); }
.tb-badge-medium { background: color-mix(in srgb, var(--warn, #fbbf24) 16%, transparent); color: var(--warn, #fbbf24); }
.tb-badge-low { background: color-mix(in srgb, var(--danger, #f87171) 14%, transparent); color: var(--danger, #f87171); }

.tb-glimits { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px 14px; }
.tb-glimits-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.tb-spent { font-size: var(--text-md, 0.8125rem); color: var(--ink-dim, #888); display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tb-spent b { color: var(--ink, #e8e8e8); font-variant-numeric: tabular-nums; }
.tb-spent.is-warm b { color: var(--warning, #fbbf24); }
.tb-spent.is-hot b { color: var(--danger, #f87171); }
.tb-budget-bar { display: inline-block; width: 84px; height: 5px; border-radius: 6px; background: var(--surface-2, rgba(255,255,255,0.08)); overflow: hidden; vertical-align: middle; }
.tb-budget-fill { display: block; height: 100%; border-radius: 6px; background: var(--success, #4ade80); transition: width var(--duration-slow) var(--ease-standard), background-color var(--duration-base) var(--ease-standard); }
.tb-spent.is-warm .tb-budget-fill { background: var(--warning, #fbbf24); }
.tb-spent.is-hot .tb-budget-fill { background: var(--danger, #f87171); }
.tb-glimits-foot .studio-btn { margin-top: 0; }

.tb-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: var(--space-lg, 1.618rem); }
.tb-actions .studio-btn { margin-top: 0; }

.tb-hint { padding: 12px 14px; border-radius: var(--radius-md, 10px); background: var(--surface-1, rgba(255, 255, 255, 0.03)); border: 1px solid var(--stroke); color: var(--ink-dim, #888); font-size: var(--text-md, 0.8125rem); line-height: var(--leading-normal, 1.618); margin-top: var(--space-md, 1rem); }
.tb-hint-warn { border-color: color-mix(in srgb, var(--warn, #fbbf24) 30%, transparent); color: var(--warn, #fbbf24); }

/* — Assisted candidates — */
.tb-cands { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.tb-cand {
	display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
	padding: 12px 14px; border-radius: var(--radius-lg, 14px);
	background: var(--surface-glass, linear-gradient(180deg, rgba(20, 21, 28, 0.7), rgba(14, 15, 22, 0.5)));
	border: 1px solid var(--stroke);
	transition: border-color var(--duration-fast) var(--ease-standard), opacity var(--duration-base) var(--ease-out);
}
.tb-cand:hover { border-color: var(--stroke-strong, rgba(255, 255, 255, 0.14)); }
.tb-cand-done { opacity: 0.55; }
.tb-cand-main { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.tb-cand-id { display: flex; align-items: center; gap: 8px; }
.tb-cand-id b { color: var(--ink-bright, #fff); font-size: var(--text-ui, 0.875rem); }
.tb-cand-link { font-family: var(--font-mono); font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim, #888); text-decoration: none; }
.tb-cand-link:hover { color: var(--ink-bright, #fff); }
.tb-cand-meta { display: flex; gap: 10px; flex-wrap: wrap; font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim, #888); }
.tb-cand-side { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tb-cand-out { font-size: var(--text-md, 0.8125rem); color: var(--ink-bright, #fff); font-variant-numeric: tabular-nums; }
.tb-cand-out i { color: var(--ink-faint, rgba(255, 255, 255, 0.45)); font-style: normal; font-size: var(--text-2xs, 0.6875rem); }
.tb-cand-side .studio-btn { margin-top: 0; }
.tb-fw { font-size: var(--text-2xs, 0.6875rem); font-weight: var(--weight-semibold, 600); padding: 3px 9px; border-radius: var(--radius-pill, 999px); }
.tb-fw-ok { background: color-mix(in srgb, var(--success, #4ade80) 16%, transparent); color: var(--success, #4ade80); }
.tb-fw-warn { background: color-mix(in srgb, var(--warn, #fbbf24) 16%, transparent); color: var(--warn, #fbbf24); }
.tb-fw-block { background: color-mix(in srgb, var(--danger, #f87171) 16%, transparent); color: var(--danger, #f87171); }

/* — Backtest — */
.tb-bt-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 10px; }
.tb-bt-stat { padding: 12px; border-radius: var(--radius-md, 10px); background: var(--surface-1, rgba(255, 255, 255, 0.03)); border: 1px solid var(--stroke); text-align: center; }
.tb-bt-stat b { display: block; font-size: var(--text-lg, 1.236rem); font-family: var(--font-display); color: var(--ink-bright, #fff); font-variant-numeric: tabular-nums; }
.tb-bt-stat b.pos { color: var(--success, #4ade80); }
.tb-bt-stat b.neg { color: var(--danger, #f87171); }
.tb-bt-stat span { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim, #888); }
.tb-caveats { margin-top: 12px; font-size: var(--text-md, 0.8125rem); color: var(--ink-dim, #888); }
.tb-caveats summary { cursor: pointer; color: var(--ink, #e8e8e8); }
.tb-caveats ul { margin: 8px 0 0; padding-left: 18px; line-height: var(--leading-normal, 1.618); }

/* — Positions — */
.tb-pos, .tb-audit-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.tb-pos-row {
	display: grid; grid-template-columns: 1.4fr 0.9fr 0.9fr 1.2fr auto; gap: 10px; align-items: center;
	padding: 10px 12px; border-radius: var(--radius-md, 10px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03)); border: 1px solid var(--stroke);
	font-size: var(--text-md, 0.8125rem);
}
.tb-pos-id { display: flex; align-items: center; gap: 8px; }
.tb-pos-id b { color: var(--ink-bright, #fff); }
.tb-pos-id a { color: var(--ink-dim, #888); text-decoration: none; font-size: var(--text-2xs, 0.6875rem); }
.tb-pos-id a:hover { color: var(--ink-bright, #fff); }
.tb-pos-live { color: var(--success, #4ade80); }
.tb-pos-state { color: var(--ink-dim, #888); }
.tb-pos-entry { color: var(--ink-dim, #888); font-variant-numeric: tabular-nums; }
.tb-pos-pnl { text-align: right; font-variant-numeric: tabular-nums; color: var(--ink, #e8e8e8); }
.tb-pos-pnl.pos { color: var(--success, #4ade80); }
.tb-pos-pnl.neg { color: var(--danger, #f87171); }
.tb-pos-close { margin-top: 0; padding: 5px 10px; font-size: var(--text-2xs, 0.6875rem); justify-self: end; white-space: nowrap; }
.tb-pos-close:hover:not(:disabled) { border-color: var(--danger, #f87171); color: var(--danger, #f87171); }
.tb-pos-close:disabled { opacity: 0.6; cursor: progress; }
.tb-pos-close-spacer { display: inline-block; }

/* — Audit — */
.tb-export { margin-top: 0 !important; }
.tb-audit-row {
	display: grid; grid-template-columns: 0.7fr 1.4fr 1fr 0.7fr auto; gap: 10px; align-items: center;
	padding: 8px 12px; border-radius: var(--radius-md, 10px);
	background: var(--surface-1, rgba(255, 255, 255, 0.03)); border: 1px solid var(--stroke);
	font-size: var(--text-md, 0.8125rem);
}
.tb-audit-time { color: var(--ink-faint, rgba(255, 255, 255, 0.45)); font-size: var(--text-2xs, 0.6875rem); }
.tb-audit-what { color: var(--ink, #e8e8e8); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tb-audit-amt { color: var(--ink-dim, #888); font-variant-numeric: tabular-nums; }
.tb-audit-status { font-size: var(--text-2xs, 0.6875rem); text-align: center; }
.tb-audit-confirmed { color: var(--success, #4ade80); }
.tb-audit-failed { color: var(--danger, #f87171); }
.tb-audit-pending { color: var(--warn, #fbbf24); }
.tb-audit-tx { color: var(--ink-dim, #888); text-decoration: none; }
.tb-audit-tx:hover { color: var(--ink-bright, #fff); }

.tb-skel { height: 280px; border-radius: var(--radius-lg, 14px); background: var(--surface-1, rgba(255, 255, 255, 0.03)); animation: mny-pulse 1.4s ease-in-out infinite; }
.tb-skel.small { height: 90px; }

@media (max-width: 540px) {
	.tb-pos-row { grid-template-columns: 1fr 1fr; }
	.tb-pos-close { grid-column: 1 / -1; justify-self: stretch; text-align: center; }
	.tb-pos-close-spacer { display: none; }
	.tb-audit-row { grid-template-columns: 1fr auto; }
	.tb-audit-time, .tb-audit-amt { display: none; }
	.tb-cand { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
	.tb-skel, .mny-skel-line { animation: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Trading Brain — presets, risk meter, backtest viz, shortcuts (advanced UX)
   ═══════════════════════════════════════════════════════════════════════════ */

/* — Preset launcher — */
.tb-presets { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.tb-presets-l { font-size: var(--text-2xs, 0.6875rem); text-transform: uppercase; letter-spacing: 0.08em; color: var(--ink-faint, #666); padding-top: 10px; white-space: nowrap; }
.tb-preset-chips { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; flex: 1; min-width: 0; }
.tb-preset {
	display: flex; flex-direction: column; gap: 3px; text-align: left; cursor: pointer;
	padding: 10px 12px; border-radius: var(--radius-md, 10px);
	background: var(--surface-1, rgba(255,255,255,0.03)); border: 1px solid var(--stroke);
	transition: border-color var(--duration-fast) var(--ease-out, var(--ease-standard)), background-color var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard);
}
.tb-preset:hover { transform: translateY(-2px); border-color: var(--stroke-strong, rgba(255,255,255,0.2)); background: var(--surface-2, rgba(255,255,255,0.06)); }
.tb-preset:focus-visible { outline: 2px solid var(--focus-ring-color, var(--accent, #6366f1)); outline-offset: 2px; }
.tb-preset.is-on {
	border-color: var(--accent, #6366f1);
	background: linear-gradient(180deg, color-mix(in srgb, var(--accent, #6366f1) 16%, transparent), color-mix(in srgb, var(--accent, #6366f1) 5%, transparent));
	box-shadow: 0 0 0 1px var(--accent, #6366f1) inset, 0 6px 20px -8px color-mix(in srgb, var(--accent, #6366f1) 50%, transparent);
}
.tb-preset-name { font-weight: var(--weight-semibold, 600); color: var(--ink-bright, #fff); font-size: var(--text-md, 0.8125rem); }
.tb-preset-tag { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim, #888); line-height: 1.3; }

/* — Top line: name + risk meter — */
.tb-topline { display: grid; grid-template-columns: 1.2fr 1fr; gap: 16px; align-items: end; margin-bottom: 18px; }
.tb-risk { display: flex; flex-direction: column; gap: 6px; }
.tb-risk-top { display: flex; align-items: baseline; justify-content: space-between; }
.tb-risk-l { font-size: var(--text-2xs, 0.6875rem); text-transform: uppercase; letter-spacing: 0.08em; color: var(--ink-faint, #666); }
.tb-risk-label { font-size: var(--text-md, 0.8125rem); font-weight: var(--weight-semibold, 600); color: var(--ink-bright, #fff); }
.tb-risk-track { height: 8px; border-radius: 6px; background: var(--surface-2, rgba(255,255,255,0.06)); overflow: hidden; box-shadow: inset 0 1px 2px rgba(0,0,0,0.3); }
.tb-risk-fill { height: 100%; border-radius: 6px; transition: width var(--duration-slow) var(--ease-out, cubic-bezier(0.16,1,0.3,1)), background var(--duration-slow) var(--ease-standard); }
.tb-risk-calm .tb-risk-fill { background: linear-gradient(90deg, #34d399, #10b981); }
.tb-risk-calm .tb-risk-label { color: #34d399; }
.tb-risk-balanced .tb-risk-fill { background: linear-gradient(90deg, #38bdf8, #6366f1); }
.tb-risk-balanced .tb-risk-label { color: #60a5fa; }
.tb-risk-warm .tb-risk-fill { background: linear-gradient(90deg, var(--warn), #f97316); }
.tb-risk-warm .tb-risk-label { color: var(--warn); }
.tb-risk-hot .tb-risk-fill { background: linear-gradient(90deg, #f97316, #ef4444); }
.tb-risk-hot .tb-risk-label { color: var(--danger); }

/* — Keyboard hints on action buttons — */
.tb-kbd {
	display: inline-block; margin-left: 8px; padding: 1px 6px; border-radius: 5px;
	font-family: var(--font-mono, ui-monospace, monospace); font-size: 0.625rem; line-height: 1.5;
	color: var(--ink-dim, #999); background: var(--surface-2, rgba(255,255,255,0.08));
	border: 1px solid var(--stroke); vertical-align: middle;
}
.studio-btn-primary .tb-kbd, .studio-btn-danger .tb-kbd { color: rgba(255,255,255,0.85); background: rgba(255,255,255,0.15); border-color: rgba(255,255,255,0.2); }
@media (max-width: 540px) { .tb-kbd { display: none; } }

/* — Backtest outcome distribution — */
.tb-dist { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.tb-dist-l { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim, #888); }
.tb-dist-bar { display: flex; height: 12px; border-radius: 6px; overflow: hidden; background: var(--surface-2, rgba(255,255,255,0.06)); gap: 2px; }
.tb-dist-seg { min-width: 3px; transition: flex var(--duration-slow) var(--ease-out, var(--ease-standard)); }
.tb-dist-grad { background: #34d399; }
.tb-dist-pump { background: #60a5fa; }
.tb-dist-flat { background: #94a3b8; }
.tb-dist-rug { background: var(--danger); }
.tb-dist-legend { display: flex; flex-wrap: wrap; gap: 12px; }
.tb-dist-key { display: inline-flex; align-items: center; gap: 5px; font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim, #999); }
.tb-dist-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }

/* — Backtest sample trades — */
.tb-samples { margin-top: 12px; }
.tb-samples summary { cursor: pointer; font-size: var(--text-md, 0.8125rem); color: var(--ink-dim, #999); }
.tb-samples summary:hover { color: var(--ink-bright, #fff); }
.tb-samples-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 10px; }
.tb-samples-h { font-size: var(--text-2xs, 0.6875rem); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 6px; }
.tb-samples-h.pos { color: var(--success, #4ade80); }
.tb-samples-h.neg { color: var(--danger, #f87171); }
.tb-sample-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.tb-sample-row { display: grid; grid-template-columns: 1fr auto auto; gap: 8px; align-items: center; font-size: var(--text-2xs, 0.6875rem); }
.tb-sample-name { color: var(--ink, #e8e8e8); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tb-sample-out { color: var(--ink-faint, #666); }
.tb-sample-roi { font-variant-numeric: tabular-nums; text-align: right; }
.tb-sample-roi.pos { color: var(--success, #4ade80); }
.tb-sample-roi.neg { color: var(--danger, #f87171); }
@media (max-width: 540px) { .tb-topline, .tb-samples-cols { grid-template-columns: 1fr; } .tb-preset-chips { grid-template-columns: 1fr 1fr; } }

/* — Money tab: balance count-up flash — */
.mny-bal b { transition: color var(--duration-base) var(--ease-standard); font-variant-numeric: tabular-nums; }
@keyframes mnyBalUp { 0% { color: var(--success, #4ade80); } 100% { color: var(--ink-bright, #fff); } }
@keyframes mnyBalDown { 0% { color: var(--danger, #f87171); } 100% { color: var(--ink-bright, #fff); } }
.mny-bal-up { animation: mnyBalUp 1.1s ease-out; }
.mny-bal-down { animation: mnyBalDown 1.1s ease-out; }

@media (prefers-reduced-motion: reduce) {
	.tb-preset, .tb-risk-fill, .tb-dist-seg { transition: none; }
	.mny-bal-up, .mny-bal-down { animation: none; }
}

/* — Money tab: pricing summary + one-tap price chips — */
.mny-price-summary { display: flex; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.mny-price-stat {
	flex: 1 1 80px; padding: 10px 12px; border-radius: var(--radius-md, 10px);
	background: var(--surface-1, rgba(255,255,255,0.03)); border: 1px solid var(--stroke);
	display: flex; flex-direction: column; gap: 2px;
}
.mny-price-stat b { font-size: var(--text-lg, 1rem); color: var(--ink-bright, #fff); font-variant-numeric: tabular-nums; }
.mny-price-stat-of { font-size: var(--text-md, 0.8125rem); color: var(--ink-faint, #666); font-weight: var(--weight-normal, 400); }
.mny-price-stat span { font-size: var(--text-2xs, 0.6875rem); color: var(--ink-dim, #888); }
.mny-price-controls { display: flex; flex-direction: column; gap: 8px; align-items: flex-end; }
.mny-price-quick { display: inline-flex; gap: 4px; }
.mny-price-chip {
	appearance: none; cursor: pointer; padding: 3px 10px; border-radius: var(--radius-pill, 999px);
	font-size: var(--text-2xs, 0.6875rem); font-variant-numeric: tabular-nums; font-weight: var(--weight-medium, 500);
	color: var(--ink-dim, #999); background: var(--surface-2, rgba(255,255,255,0.06)); border: 1px solid var(--stroke);
	transition: color var(--duration-fast) var(--ease-standard), background-color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard), transform var(--duration-instant) var(--ease-standard);
}
.mny-price-chip:hover { color: var(--ink-bright, #fff); border-color: var(--stroke-strong, rgba(255,255,255,0.2)); }
.mny-price-chip:active { transform: scale(0.94); }
.mny-price-chip.is-on { color: #fff; background: var(--accent, #6366f1); border-color: var(--accent, #6366f1); }
.mny-price-chip-free.is-on { background: var(--surface-3, rgba(255,255,255,0.1)); color: var(--ink, #e8e8e8); border-color: var(--stroke-strong, rgba(255,255,255,0.2)); }
@media (max-width: 540px) { .mny-price-controls { align-items: stretch; } .mny-price-quick { justify-content: flex-end; } }
@media (prefers-reduced-motion: reduce) { .mny-price-chip { transition: none; } }

/* ── Interactive states (QB-07) ────────────────────────────────────────────
   Four controls set cursor: pointer with no hover rule. The switch already had
   the transition and the checked colour; what it was missing was the resting
   hover, which is what tells you the track is the hit target. */
.bdy-chip-play,
.tb-caveats summary,
.tb-mode-btn {
	transition:
		background var(--duration-fast) var(--ease-standard),
		color var(--duration-fast) var(--ease-standard);
}

.bdy-chip-play:hover {
	background: var(--surface-1);
	color: var(--ink-bright);
}

.skl-switch:hover {
	border-color: var(--stroke-strong);
	background: var(--surface-3);
}

.skl-switch[aria-checked='true']:hover {
	background: var(--wallet-accent-strong);
}

.tb-caveats summary:hover {
	color: var(--ink-bright);
}

.tb-mode-btn:hover {
	color: var(--ink-bright);
	background: var(--surface-1);
}
