/*
 * trenaly/assets/css/smart_wallets.css — «حركة المحافظ الذكية» (Smart Wallets) page.
 * Scoped to .sw-* only. Dark tokens follow assets/style.css (Futuristic Fluidity); a light
 * token set is provided behind .sw-page[data-theme="light"] (opt-in — the site chrome is dark).
 * RTL-aware (logical properties); every canvas / tooltip / text gauge is forced LTR by .sw-ltr.
 */

.sw-page {
    /* ---- dark tokens (default, matches the site) ---- */
    --sw-bg: rgba(255, 255, 255, 0.03);
    --sw-bg-2: rgba(255, 255, 255, 0.05);
    --sw-bg-3: rgba(0, 0, 0, 0.25);
    --sw-border: rgba(255, 255, 255, 0.07);
    --sw-border-2: rgba(255, 255, 255, 0.14);
    --sw-text: #ffffff;
    --sw-muted: #a1a1aa;
    --sw-dim: rgba(255, 255, 255, 0.55);
    --sw-cyan: #00f2ea;
    --sw-violet: #a855f7;
    --sw-up: #00ff9d;
    --sw-down: #ff0055;
    --sw-warn: #ffbe00;
    --sw-btc: #f7931a;
    --sw-eth: #627eea;
    --sw-up-bg: rgba(0, 255, 157, 0.10);
    --sw-down-bg: rgba(255, 0, 85, 0.10);
    --sw-warn-bg: rgba(255, 190, 0, 0.10);
    --sw-cyan-bg: rgba(0, 242, 234, 0.10);
    --sw-violet-bg: rgba(168, 85, 247, 0.12);
    --sw-tip-bg: #12162e;
    --sw-radius: 18px;
    padding-top: 100px;
    min-height: 100vh;
    padding-bottom: 3rem;
}

.sw-page[data-theme="light"] {
    /* ---- light tokens (opt-in) ---- */
    --sw-bg: #ffffff;
    --sw-bg-2: #f3f4f8;
    --sw-bg-3: #eef0f6;
    --sw-border: rgba(0, 0, 0, 0.08);
    --sw-border-2: rgba(0, 0, 0, 0.16);
    --sw-text: #111827;
    --sw-muted: #5b6172;
    --sw-dim: rgba(0, 0, 0, 0.55);
    --sw-cyan: #0891b2;
    --sw-violet: #7c3aed;
    --sw-up: #059669;
    --sw-down: #dc2626;
    --sw-warn: #b45309;
    --sw-up-bg: rgba(5, 150, 105, 0.10);
    --sw-down-bg: rgba(220, 38, 38, 0.10);
    --sw-warn-bg: rgba(180, 83, 9, 0.10);
    --sw-cyan-bg: rgba(8, 145, 178, 0.10);
    --sw-violet-bg: rgba(124, 58, 237, 0.10);
    --sw-tip-bg: #ffffff;
    color: var(--sw-text);
}

/* ---------------------------------------------------------------- hero */
.sw-hero { text-align: center; margin-bottom: 1.4rem; }
.sw-hero h1 {
    font-size: clamp(1.5rem, 4vw, 2.3rem);
    display: inline-flex; align-items: center; gap: .6rem; flex-wrap: wrap; justify-content: center;
}
.sw-hero h1 .sw-hl {
    background: linear-gradient(45deg, var(--sw-cyan), var(--sw-violet));
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.sw-badge {
    font-size: .68rem; font-weight: 800; letter-spacing: .4px; vertical-align: middle;
    padding: .25rem .7rem; border-radius: 100px; color: #000;
    background: linear-gradient(45deg, var(--sw-cyan), var(--sw-violet));
}
.sw-hero p { color: var(--sw-muted); max-width: 760px; margin: .7rem auto 0; line-height: 1.8; font-size: .93rem; }
.sw-tags { display: flex; gap: .45rem; justify-content: center; flex-wrap: wrap; margin-top: .8rem; }
.sw-tag {
    font-size: .72rem; padding: .25rem .7rem; border-radius: 100px;
    border: 1px solid var(--sw-border-2); color: var(--sw-muted); background: var(--sw-bg);
}
.sw-tag.sw-tag-warn { color: var(--sw-warn); border-color: rgba(255, 190, 0, .35); background: var(--sw-warn-bg); }

/* ---------------------------------------------------------------- cards */
.sw-card {
    background: var(--sw-bg); border: 1px solid var(--sw-border);
    border-radius: var(--sw-radius); padding: 1.3rem; backdrop-filter: blur(10px);
    margin-bottom: 1.2rem; min-width: 0;
}
.sw-card-head { display: flex; align-items: center; justify-content: space-between; gap: .6rem; flex-wrap: wrap; margin-bottom: .8rem; }
.sw-card-head h2 { font-size: 1.02rem; margin: 0; display: flex; align-items: center; gap: .45rem; }
.sw-card-head .sw-tag { font-size: .66rem; }
.sw-sub { color: var(--sw-muted); font-size: .8rem; line-height: 1.7; }
.sw-note { color: var(--sw-dim); font-size: .76rem; line-height: 1.7; margin-top: .6rem; }
.sw-empty { color: var(--sw-muted); font-size: .86rem; padding: 1.2rem .5rem; text-align: center; line-height: 1.7; }
.sw-error { color: var(--sw-down); font-size: .86rem; padding: .8rem; text-align: center; }
.sw-error button { margin-inline-start: .6rem; }
.sw-loading { display: flex; align-items: center; justify-content: center; gap: .6rem; padding: 1.4rem; color: var(--sw-muted); font-size: .85rem; }
.sw-spinner {
    width: 18px; height: 18px; border-radius: 50%;
    border: 3px solid rgba(0, 242, 234, .2); border-top-color: var(--sw-cyan);
    animation: swSpin .8s linear infinite;
}
@keyframes swSpin { to { transform: rotate(360deg); } }

.sw-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.sw-grid-2 > .sw-card { margin-bottom: 0; }
.sw-grid-2 { margin-bottom: 1.2rem; }

/* ---------------------------------------------------------------- asset tabs */
.sw-tabs { display: flex; gap: .5rem; justify-content: center; margin-bottom: 1.2rem; flex-wrap: wrap; }
.sw-tab {
    padding: .55rem 1.3rem; border-radius: 100px; cursor: pointer; font-family: inherit;
    background: var(--sw-bg); border: 1px solid var(--sw-border-2); color: var(--sw-muted);
    font-size: .95rem; font-weight: 700; transition: all .2s ease; display: inline-flex; align-items: center; gap: .4rem;
}
.sw-tab .sw-coin { font-size: 1.05rem; }
.sw-tab[data-asset="BTC"].active { border-color: var(--sw-btc); color: var(--sw-btc); background: rgba(247, 147, 26, .12); }
.sw-tab[data-asset="ETH"].active { border-color: var(--sw-eth); color: var(--sw-eth); background: rgba(98, 126, 234, .14); }
.sw-tab:hover { color: var(--sw-text); }

/* ---------------------------------------------------------------- status strip */
.sw-status { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .7rem; }
.sw-stat {
    background: var(--sw-bg-2); border: 1px solid var(--sw-border); border-radius: 14px;
    padding: .7rem .8rem; min-width: 0;
}
.sw-stat-l { font-size: .7rem; color: var(--sw-muted); margin-bottom: .2rem; }
.sw-stat-v { font-size: 1.15rem; font-weight: 800; line-height: 1.3; word-break: break-word; }
.sw-stat-s { font-size: .7rem; color: var(--sw-dim); margin-top: .2rem; line-height: 1.5; }
.sw-fresh { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .8rem; }
.sw-chip {
    display: inline-flex; align-items: center; gap: .35rem; font-size: .72rem; padding: .28rem .65rem;
    border-radius: 100px; border: 1px solid var(--sw-border-2); color: var(--sw-muted); background: var(--sw-bg); line-height: 1.4;
}
.sw-chip .sw-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--sw-muted); flex: 0 0 auto; }
.sw-chip.ok { color: var(--sw-up); border-color: rgba(0, 255, 157, .35); }
.sw-chip.ok .sw-dot { background: var(--sw-up); }
.sw-chip.warn { color: var(--sw-warn); border-color: rgba(255, 190, 0, .35); }
.sw-chip.warn .sw-dot { background: var(--sw-warn); }
.sw-chip.bad { color: var(--sw-down); border-color: rgba(255, 0, 85, .35); }
.sw-chip.bad .sw-dot { background: var(--sw-down); }
.sw-chip.info { color: var(--sw-cyan); border-color: rgba(0, 242, 234, .35); }
.sw-sources { margin-top: .8rem; }
.sw-sources-t { font-size: .74rem; color: var(--sw-muted); margin-bottom: .4rem; }
.sw-disclaimer {
    margin-top: 1rem; padding: .8rem 1rem; border-radius: 12px; font-size: .8rem; line-height: 1.9;
    background: var(--sw-warn-bg); border: 1px solid rgba(255, 190, 0, .3); color: var(--sw-text);
}
.sw-disclaimer .sw-disc-en { display: block; margin-top: .4rem; color: var(--sw-muted); font-size: .76rem; }
.sw-banner {
    display: none; margin-bottom: 1.2rem; padding: .8rem 1rem; border-radius: 12px; font-size: .86rem; line-height: 1.7;
    background: var(--sw-warn-bg); border: 1px solid rgba(255, 190, 0, .35); color: var(--sw-warn);
}
.sw-banner.show { display: block; }
.sw-banner.sw-banner-err { background: var(--sw-down-bg); border-color: rgba(255, 0, 85, .35); color: var(--sw-down); }

/* ---------------------------------------------------------------- moves feed */
.sw-feed { display: flex; flex-direction: column; gap: .5rem; max-height: 520px; overflow-y: auto; padding-inline-end: .2rem; }
.sw-ev {
    display: flex; gap: .7rem; align-items: flex-start; padding: .65rem .8rem; border-radius: 12px;
    background: var(--sw-bg-2); border: 1px solid var(--sw-border); border-inline-start: 3px solid var(--sw-muted);
    font-size: .85rem; line-height: 1.7;
}
.sw-ev.up { border-inline-start-color: var(--sw-up); }
.sw-ev.down { border-inline-start-color: var(--sw-down); }
.sw-ev.flip { border-inline-start-color: var(--sw-warn); }
.sw-ev.neutral { border-inline-start-color: var(--sw-cyan); }
.sw-ev-body { flex: 1; min-width: 0; word-break: break-word; }
.sw-ev-meta { display: flex; gap: .6rem; flex-wrap: wrap; font-size: .7rem; color: var(--sw-dim); margin-top: .2rem; }
.sw-ev-asset { font-weight: 800; }
.sw-ev-asset.BTC { color: var(--sw-btc); }
.sw-ev-asset.ETH { color: var(--sw-eth); }
.sw-more { text-align: center; margin-top: .8rem; }

/* ---------------------------------------------------------------- buttons */
.sw-btn {
    padding: .5rem 1.1rem; border-radius: 100px; font-size: .84rem; cursor: pointer; font-family: inherit;
    background: var(--sw-bg-2); border: 1px solid var(--sw-border-2); color: var(--sw-text); transition: all .2s ease;
}
.sw-btn:hover { border-color: var(--sw-cyan); }
.sw-btn:disabled { opacity: .5; cursor: not-allowed; }
.sw-btn-primary { color: #000; border: none; font-weight: 800; background: linear-gradient(45deg, var(--sw-cyan), var(--sw-violet)); }
.sw-btn-danger { color: var(--sw-down); border-color: rgba(255, 0, 85, .4); }
.sw-btn-sm { padding: .35rem .8rem; font-size: .76rem; }
.sw-ranges { display: flex; gap: .35rem; flex-wrap: wrap; }
.sw-range { padding: .3rem .75rem; border-radius: 100px; font-size: .76rem; cursor: pointer; font-family: inherit;
    background: var(--sw-bg); border: 1px solid var(--sw-border-2); color: var(--sw-muted); }
.sw-range.active { background: var(--sw-cyan-bg); border-color: var(--sw-cyan); color: var(--sw-cyan); font-weight: 700; }

/* ---------------------------------------------------------------- gauge */
.sw-gauge-box { position: relative; width: 100%; max-width: 420px; margin: 0 auto; }
.sw-gauge-box canvas { width: 100%; height: 230px; display: block; }
.sw-gauge-sentence { text-align: center; font-size: .9rem; margin-top: .3rem; line-height: 1.7; }
.sw-gauge-sentence .sw-strong { font-weight: 800; }
.sw-textbar {
    display: block; text-align: center; font-family: "Courier New", monospace; font-size: .95rem; letter-spacing: .5px;
    margin: .5rem auto 0; color: var(--sw-text); white-space: pre; overflow-x: auto;
}
.sw-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; margin-top: .9rem; }
.sw-tile { background: var(--sw-bg-2); border: 1px solid var(--sw-border); border-radius: 12px; padding: .6rem .4rem; text-align: center; min-width: 0; }
.sw-tile-v { font-size: 1.15rem; font-weight: 800; }
.sw-tile-l { font-size: .68rem; color: var(--sw-muted); line-height: 1.4; }
.sw-tile.long .sw-tile-v { color: var(--sw-up); }
.sw-tile.short .sw-tile-v { color: var(--sw-down); }
.sw-chips-row { display: flex; gap: .4rem; flex-wrap: wrap; justify-content: center; margin-top: .7rem; }
.sw-comps { margin-top: 1rem; }
.sw-comps-t { font-size: .78rem; color: var(--sw-muted); margin-bottom: .5rem; display: flex; justify-content: space-between; gap: .5rem; flex-wrap: wrap; }
.sw-comp { display: grid; grid-template-columns: minmax(90px, 1.2fr) 2fr auto; gap: .5rem; align-items: center; font-size: .78rem; padding: .28rem 0; }
.sw-comp-name { color: var(--sw-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sw-comp-name small { color: var(--sw-muted); font-size: .68rem; }
.sw-comp-bar { position: relative; height: 10px; border-radius: 6px; background: var(--sw-bg-3); overflow: hidden; direction: ltr; }
.sw-comp-bar::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; background: var(--sw-border-2); }
.sw-comp-fill { position: absolute; top: 0; bottom: 0; background: var(--sw-up); }
.sw-comp-fill.neg { background: var(--sw-down); }
.sw-comp.off .sw-comp-fill { background: var(--sw-muted); opacity: .5; }
.sw-comp.off .sw-comp-name, .sw-comp.off .sw-comp-v { color: var(--sw-muted); }
.sw-comp-v { font-variant-numeric: tabular-nums; white-space: nowrap; min-width: 52px; text-align: end; }

/* ---------------------------------------------------------------- conditions */
.sw-conds { display: flex; flex-direction: column; gap: .4rem; counter-reset: sw-cond; }
.sw-cond { display: grid; grid-template-columns: 26px 1fr; gap: .6rem; padding: .55rem .7rem; border-radius: 12px; background: var(--sw-bg-2); border: 1px solid var(--sw-border); align-items: start; }
.sw-cond-mark { width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: .9rem; }
.sw-cond.ok .sw-cond-mark { background: var(--sw-up-bg); color: var(--sw-up); }
.sw-cond.bad .sw-cond-mark { background: var(--sw-down-bg); color: var(--sw-down); }
.sw-cond-t { font-size: .85rem; font-weight: 600; line-height: 1.5; }
.sw-cond-t small { color: var(--sw-muted); font-weight: 400; margin-inline-end: .3rem; }
.sw-cond-d { font-size: .77rem; color: var(--sw-muted); line-height: 1.6; margin-top: .1rem; }
.sw-signal { margin-top: .9rem; padding: .75rem .9rem; border-radius: 12px; font-size: .88rem; line-height: 1.7;
    background: var(--sw-bg-2); border: 1px solid var(--sw-border-2); }
.sw-signal.active { background: var(--sw-up-bg); border-color: rgba(0, 255, 157, .35); }
.sw-signal .sw-strength { display: block; font-size: .78rem; color: var(--sw-muted); margin-top: .2rem; }
.sw-pick { margin-top: .8rem; }
.sw-pick-cap { font-size: .76rem; color: var(--sw-warn); margin-bottom: .4rem; }
.sw-pick-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: .4rem; }
.sw-pick-cell { background: var(--sw-bg-2); border: 1px solid var(--sw-border); border-radius: 10px; padding: .45rem .6rem; }
.sw-pick-cell .l { font-size: .66rem; color: var(--sw-muted); }
.sw-pick-cell .v { font-size: .86rem; font-weight: 700; word-break: break-all; }

/* ---------------------------------------------------------------- charts */
.sw-canvas-box { position: relative; height: 300px; border-radius: 12px; background: var(--sw-bg-3); overflow: hidden; }
.sw-canvas-box canvas { width: 100%; height: 100%; display: block; }
.sw-canvas-box.sw-sm { height: 200px; }
.sw-ltr { direction: ltr; text-align: left; unicode-bidi: isolate; }
.sw-tip {
    position: absolute; pointer-events: none; z-index: 5; display: none;
    background: var(--sw-tip-bg); border: 1px solid var(--sw-border-2); border-radius: 10px;
    padding: .45rem .6rem; font-size: .72rem; line-height: 1.6; color: var(--sw-text); white-space: nowrap;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .35); direction: ltr; text-align: left;
}
.sw-tip.show { display: block; }
.sw-legend { display: flex; gap: .7rem; flex-wrap: wrap; font-size: .7rem; color: var(--sw-muted); margin-top: .6rem; }
.sw-legend span { display: inline-flex; align-items: center; gap: .3rem; }
.sw-legend i { display: inline-block; width: 14px; height: 3px; border-radius: 2px; }
.sw-legend i.dash { background: repeating-linear-gradient(90deg, currentColor 0 4px, transparent 4px 7px); height: 2px; }
.sw-stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-top: .7rem; }
.sw-stats-row .sw-tile-v { font-size: 1rem; }

/* ---------------------------------------------------------------- PCDR mini gauges */
.sw-minis { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-top: .8rem; }
.sw-mini { background: var(--sw-bg-2); border: 1px solid var(--sw-border); border-radius: 12px; padding: .5rem .4rem; text-align: center; min-width: 0; }
.sw-mini canvas { width: 100%; height: 56px; display: block; }
.sw-mini .l { font-size: .66rem; color: var(--sw-muted); line-height: 1.4; }
.sw-mini .v { font-size: .9rem; font-weight: 800; }
.sw-mini.off .v { color: var(--sw-muted); }

/* ---------------------------------------------------------------- tables */
.sw-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sw-table { width: 100%; border-collapse: collapse; min-width: 640px; }
.sw-table th { font-size: .7rem; color: var(--sw-muted); font-weight: 600; text-align: center; padding: .55rem .4rem; border-bottom: 1px solid var(--sw-border); white-space: nowrap; }
.sw-table td { padding: .5rem .4rem; text-align: center; font-size: .8rem; border-bottom: 1px solid var(--sw-border); white-space: nowrap; font-variant-numeric: tabular-nums; }
.sw-table td.sw-td-start { text-align: start; }
.sw-score { position: relative; height: 8px; width: 70px; border-radius: 5px; background: var(--sw-bg-3); display: inline-block; vertical-align: middle; overflow: hidden; direction: ltr; }
.sw-score i { position: absolute; left: 0; top: 0; bottom: 0; background: linear-gradient(90deg, var(--sw-cyan), var(--sw-violet)); }
.sw-pos { display: inline-block; padding: .15rem .55rem; border-radius: 100px; font-size: .72rem; font-weight: 700; }
.sw-pos.long { background: var(--sw-up-bg); color: var(--sw-up); }
.sw-pos.short { background: var(--sw-down-bg); color: var(--sw-down); }
.sw-pos.flat { background: var(--sw-bg-2); color: var(--sw-muted); }
.sw-pos small { font-weight: 400; opacity: .85; }
.sw-up { color: var(--sw-up); }
.sw-down { color: var(--sw-down); }
.sw-muted { color: var(--sw-muted); }
.sw-mono { font-family: "Courier New", monospace; font-size: .78rem; }
.sw-foot { display: flex; gap: .6rem; flex-wrap: wrap; font-size: .74rem; color: var(--sw-muted); margin-top: .7rem; }
.sw-method { margin-top: .7rem; padding: .7rem .9rem; border-radius: 12px; background: var(--sw-violet-bg); border: 1px solid rgba(168, 85, 247, .3); font-size: .78rem; line-height: 1.8; }
.sw-method strong { display: block; color: var(--sw-text); margin-bottom: .2rem; }

/* ---------------------------------------------------------------- reference book / sim */
.sw-book-badge { font-size: .76rem; color: var(--sw-muted); line-height: 1.7; margin-bottom: .8rem; padding: .6rem .8rem; border-radius: 10px; background: var(--sw-bg-2); border: 1px solid var(--sw-border); }
.sw-book-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: .5rem; }
.sw-book-h { font-size: .84rem; font-weight: 700; margin: 1rem 0 .5rem; display: flex; align-items: center; gap: .5rem; }
.sw-reason { display: inline-block; padding: .12rem .5rem; border-radius: 100px; font-size: .68rem; background: var(--sw-bg-2); border: 1px solid var(--sw-border-2); color: var(--sw-muted); white-space: nowrap; }
.sw-reason.tp { color: var(--sw-up); border-color: rgba(0, 255, 157, .35); }
.sw-reason.sl { color: var(--sw-down); border-color: rgba(255, 0, 85, .35); }
.sw-reason.expiry, .sw-reason.gap { color: var(--sw-warn); border-color: rgba(255, 190, 0, .35); }
.sw-mix { display: flex; gap: .4rem; flex-wrap: wrap; }
.sw-limits { margin-top: 1rem; padding: .8rem 1rem; border-radius: 12px; background: var(--sw-bg-2); border: 1px solid var(--sw-border); }
.sw-limits strong { display: block; margin-bottom: .4rem; font-size: .84rem; }
.sw-limits ol { margin: 0; padding-inline-start: 1.2rem; font-size: .76rem; color: var(--sw-muted); line-height: 1.8; }
.sw-sim-actions { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; margin: .8rem 0; }
.sw-switch { display: inline-flex; align-items: center; gap: .45rem; font-size: .84rem; cursor: pointer; padding: .4rem .8rem; border-radius: 100px; background: var(--sw-bg-2); border: 1px solid var(--sw-border-2); }
.sw-switch input { accent-color: var(--sw-cyan); width: 16px; height: 16px; margin: 0; }
.sw-switch.disabled { opacity: .5; cursor: not-allowed; }
.sw-sim-state { font-size: .84rem; padding: .6rem .9rem; border-radius: 10px; background: var(--sw-bg-2); border: 1px solid var(--sw-border); line-height: 1.7; }
.sw-sim-state.active { border-color: rgba(0, 255, 157, .35); color: var(--sw-up); }
.sw-sim-state.paused { border-color: rgba(255, 190, 0, .35); color: var(--sw-warn); }
.sw-sim-state.frozen { border-color: rgba(255, 0, 85, .35); color: var(--sw-down); }
.sw-vs { display: grid; grid-template-columns: 1fr auto 1fr; gap: .6rem; align-items: center; margin-top: .9rem; padding: .7rem .9rem; border-radius: 12px; background: var(--sw-violet-bg); border: 1px solid rgba(168, 85, 247, .3); }
.sw-vs .l { font-size: .68rem; color: var(--sw-muted); }
.sw-vs .v { font-size: 1.05rem; font-weight: 800; }
.sw-vs .sw-vs-mid { font-size: .8rem; color: var(--sw-muted); font-weight: 700; }
.sw-vs > div { text-align: center; min-width: 0; }
.sw-skips { display: flex; flex-direction: column; gap: .3rem; font-size: .78rem; }
.sw-skip { display: flex; gap: .6rem; justify-content: space-between; padding: .4rem .7rem; border-radius: 8px; background: var(--sw-bg-2); border: 1px solid var(--sw-border); flex-wrap: wrap; }
.sw-skip .t { color: var(--sw-dim); font-size: .7rem; }
.sw-toast { position: fixed; bottom: 1.2rem; inset-inline-start: 50%; transform: translateX(-50%); z-index: 1200; padding: .6rem 1.1rem; border-radius: 100px; font-size: .84rem;
    background: var(--sw-tip-bg); border: 1px solid var(--sw-border-2); color: var(--sw-text); box-shadow: 0 8px 24px rgba(0, 0, 0, .4); display: none; }
[dir="rtl"] .sw-toast { transform: translateX(50%); }
.sw-toast.show { display: block; }
.sw-toast.err { color: var(--sw-down); }

/* ---------------------------------------------------------------- locked / soon */
.sw-locked, .sw-soon { text-align: center; padding: 3rem 1.5rem; }
.sw-locked-icon { font-size: 3rem; margin-bottom: 1rem; }
.sw-locked h2, .sw-soon h2 { margin-bottom: .8rem; }
.sw-locked p, .sw-soon p { color: var(--sw-muted); max-width: 560px; margin: 0 auto 1.5rem; line-height: 1.8; }
.sw-locked-feats { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: .8rem; max-width: 700px; margin: 0 auto 2rem; text-align: start; }
.sw-locked-feat { display: flex; gap: .6rem; align-items: flex-start; font-size: .88rem; color: var(--sw-muted); }
.sw-locked-feat .ck { color: var(--sw-cyan); font-weight: 800; }
.sw-locked-cta {
    display: inline-block; padding: 1rem 2.6rem; border-radius: 100px; text-decoration: none;
    font-weight: 800; color: #000; background: linear-gradient(45deg, var(--sw-cyan), var(--sw-violet));
    transition: transform .2s ease, box-shadow .2s ease;
}
.sw-locked-cta:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(0, 242, 234, .25); }
.sw-soon { display: none; }
.sw-soon.show { display: block; }
.sw-hidden { display: none !important; }

/* ---------------------------------------------------------------- responsive */
@media (max-width: 992px) {
    .sw-grid-2 { grid-template-columns: 1fr; }
    .sw-grid-2 > .sw-card { margin-bottom: 0; }
}
@media (max-width: 768px) {
    .sw-page { padding-top: 90px; }
    .sw-card { padding: 1rem; border-radius: 14px; }
    .sw-canvas-box { height: 240px; }
    .sw-canvas-box.sw-sm { height: 180px; }
    .sw-tiles { grid-template-columns: repeat(2, 1fr); }
    .sw-comp { grid-template-columns: minmax(80px, 1fr) 1.4fr auto; }
}
@media (max-width: 480px) {
    .sw-hero h1 { font-size: 1.35rem; }
    .sw-status { grid-template-columns: repeat(2, 1fr); }
    .sw-stat-v { font-size: 1rem; }
    .sw-canvas-box { height: 210px; }
    .sw-canvas-box.sw-sm { height: 160px; }
    .sw-stats-row { grid-template-columns: repeat(3, 1fr); gap: .35rem; }
    .sw-stats-row .sw-tile-v { font-size: .9rem; }
    .sw-minis { gap: .35rem; }
    .sw-textbar { font-size: .8rem; }
    .sw-vs { grid-template-columns: 1fr; }
    .sw-vs .sw-vs-mid { order: -1; }
    .sw-feed { max-height: 420px; }
    .sw-cond { grid-template-columns: 22px 1fr; padding: .5rem .55rem; }
    .sw-cond-mark { width: 20px; height: 20px; font-size: .8rem; }
    .sw-tab { padding: .45rem 1rem; font-size: .88rem; }
    .sw-book-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 375px) {
    .sw-status { grid-template-columns: 1fr 1fr; gap: .45rem; }
    .sw-stat { padding: .55rem .6rem; }
    .sw-tiles { gap: .35rem; }
    .sw-tile-v { font-size: 1rem; }
    .sw-comp { grid-template-columns: 1fr; gap: .2rem; }
    .sw-comp-v { text-align: start; min-width: 0; }
    .sw-legend { gap: .45rem; }
}

/* Formula-hidden (count mode): compact "N of 8 conditions met" card */
.sw-cond-summary{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid var(--sw-border,#1e2a3a);border-radius:12px;background:var(--sw-panel2,rgba(255,255,255,.03))}
.sw-cond-summary-n{font-size:26px;font-weight:800;color:var(--sw-accent,#10b981);direction:ltr;unicode-bidi:isolate}
.sw-cond-summary-l{font-size:14px;color:var(--sw-text,#cbd5e1)}

/* Public landing (guests): login CTA + guide cards under the locked card */
.sw-locked-login { background: transparent; color: var(--accent-cyan, #00f2ea); border: 1px solid rgba(0, 242, 234, .5); margin-inline-start: .6rem; }
.sw-landing-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: .9rem; max-width: 900px; margin: 1.6rem auto 0; text-align: start; }
.sw-landing-card { background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08); border-radius: 12px; padding: 1rem 1.1rem; }
.sw-landing-card h3 { font-size: .98rem; margin: 0 0 .4rem; }
.sw-landing-card p { font-size: .85rem; color: var(--text-muted, #94a3b8); margin: 0; line-height: 1.7; }
@media (max-width: 768px) { .sw-landing-cards { grid-template-columns: 1fr; } }