/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V4 */
/* ===== wcb.css — shared, unscoped ===== */
/* ============================================================
   wcb.css — World Class Broker shared stylesheet (single source)
   Design tokens + base + shared components:
   Header (mega-menu) · mobile drawer · bottom tabs · Ticker ·
   Footer · Toast · buttons · cursor cloud.
   Page-specific styles stay in each page's own <style>.
   ============================================================ */

:root{
  /* greens (V3 — deep & luxe) */
  --green-950:#04100A;--green-900:#071A11;--green-800:#0B281A;--green-700:#163C2C;--green-600:#236046;--green:#0E2A1E;
  --hero-bg:radial-gradient(115% 130% at 84% -20%, #16432E, var(--green) 46%, var(--green-950)); /* single source for hero backgrounds */
  /* neutrals */
  --canvas:#FEFAFA;--cream:#F1EDE2;--cream-2:var(--canvas);--surface:#fff;--surface-muted:#F3F0E7;--border:#D9D2BE;--border-2:#C8BFA4;
  --ink:#132019;--ink-2:#46534B;--ink-3:#627067;
  /* gold (V3 — warmer, more luxe) */
  --gold:#C9A227;--gold-bright:#E8C457;--gold-deep:#7A5A0A;--gold-soft:#F5EBCF;
  /* luxe accents */
  --hair:rgba(201,162,39,.30);
  --gold-line:linear-gradient(90deg,transparent,rgba(201,162,39,.6),transparent);
  /* score graph: orange (low) -> green (full) */
  --orange:#E07B2E;--orange-soft:#FBEAD9;--score-lo:#E0712A;--score-mid:#C9A227;--score-hi:#2A7D54;
  /* status / accents */
  --up:#2A7D54;--up-soft:#E6F1EA;--down:#B42318;--down-soft:#FBEBE9;
  --warn:#C0341D;--warn-soft:#FBEBE9;--breaking:#C0341D;
  --recv:#2A7D54;--pay:#B42318;--risk:#B42318;
  --maroon:#7C1F1F;--rose-1:#FDEEF2;--rose-2:#F6E6F3;--rose-cta:#D6336C;
  --gold-t:#9A6A00;--forex-t:#1C4D38;--stock-t:#1E63C4;--crypto-t:#9A5B12;
  /* spacing scale (4-based) — canonical --space-*; --s* kept as short aliases */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;
  --s1:var(--space-1);--s2:var(--space-2);--s3:var(--space-3);--s4:var(--space-4);--s5:var(--space-5);--s6:var(--space-6);--s7:var(--space-7);--s8:var(--space-8);
  --fs-xs:12.5px;--fs-sm:14px;--fs-base:16px;--fs-lg:19px;--fs-xl:24px;--fs-2xl:30px;--fs-3xl:42px;
  --r:14px;--r-lg:18px;--pill:999px;--tap:44px;--hh:62px;
  /* Button Size System — height is set by SIZE (default/sm/xs), never by color (primary/secondary).
     Primary and Secondary at the same size tier always share the same outer height. */
  --btn-h-default:40px;--btn-h-sm:36px;--btn-h-xs:32px;
  /* type — sitewide single typeface: Noto Sans Thai everywhere (headings, body, mono/numeric contexts included) */
  --serif:'Noto Sans Thai',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --thai:'Noto Sans Thai',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'Noto Sans Thai',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --shadow:none; /* shadows stripped globally — re-add per component. was: 0 1px 2px rgba(7,21,14,.07),0 8px 22px rgba(7,21,14,.07) */
  --shadow-lg:none; /* was: 0 22px 54px rgba(7,21,14,.22) */
}

/* ===== base ===== */
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth;scroll-padding-top:74px;overflow-x:clip}
body{font-family:var(--thai);background:var(--canvas);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip;overflow-wrap:break-word;word-break:break-word}
.serif{font-family:var(--serif)}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--gold-deep);outline-offset:2px;border-radius:4px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.wrap-wide{max-width:1180px;margin:0 auto;padding:0 20px} /* full-width container even where a page narrows .wrap (e.g. news-item article col) */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}

/* ===== cursor cloud ===== */
#cursorCloud{position:fixed;left:0;top:0;width:26vmin;height:26vmin;min-width:200px;min-height:200px;pointer-events:none;z-index:4;opacity:0;transition:opacity .45s;will-change:transform;background:radial-gradient(circle at 50% 50%,rgba(40,120,60,.5),rgba(60,150,80,.14)55%,transparent 72%);filter:blur(26px);mix-blend-mode:multiply}
@media(prefers-reduced-motion:reduce){#cursorCloud{display:none}}

/* ===== buttons — Button Size System =====
   Height comes ONLY from size class (.btn = Default 40px, .btn-sm = Small 36px,
   .btn-xs = Extra Small 32px). Color classes (.btn-gold/.btn-green/.btn-outline/
   .btn-ghost) NEVER set height — a Primary and Secondary button at the same size
   tier are always the same outer height, differing only in fill/border/color.
   Pick the tier by context: standalone/hero CTAs = default; card/sidebar CTAs =
   sm; dense table-row/tag actions = xs. Never mix tiers on buttons sitting side
   by side in the same row. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:var(--btn-h-default);padding:0 18px;border-radius:10px;border:1.5px solid transparent;font-family:var(--thai);font-size:14px;font-weight:700;cursor:pointer;line-height:1;white-space:nowrap}
.btn-gold{background:var(--gold);color:var(--green-900)}.btn-gold:hover{background:var(--gold-bright)}
.btn-green{background:var(--green-700);color:#fff}.btn-green:hover{background:var(--green-800)}
.btn-outline{background:transparent;color:var(--ink);border-color:var(--border-2)}.btn-outline:hover{border-color:var(--ink-3)}
.btn-outline.on-dark{color:#fff;border-color:rgba(255,255,255,.5)}.btn-outline.on-dark:hover{border-color:#fff}
.btn-sm{height:var(--btn-h-sm);padding:0 14px;font-size:13px}
.btn-xs{height:var(--btn-h-xs);padding:0 11px;font-size:11.5px;border-radius:8px;font-weight:800}
.btn:active{transform:translateY(1px)}
.btn[aria-busy="true"]{cursor:wait;opacity:.72}
.btn-block{width:100%}.btn:disabled{opacity:.55;cursor:not-allowed}
/* ghost = surface fill, gold text + border (was brk-btn.sec / info-btn / react-btn / share-btn / tool-btn) */
.btn-ghost{background:var(--surface);color:var(--gold-deep);border-color:var(--gold)}.btn-ghost:hover{background:var(--gold-soft)}
.btn-ghost.on-dark{background:rgba(255,255,255,.06);color:#fff;border-color:rgba(255,255,255,.22)}.btn-ghost.on-dark:hover{background:rgba(255,255,255,.12)}
/* pill = fully rounded (was infopill / info-btn) */
.btn-pill{border-radius:999px}
/* green outline (was morebtn) */
.btn-outline.green{color:var(--green-700);border-color:var(--green-700)}.btn-outline.green:hover{background:var(--green-700);color:#fff}
/* selected/voted state for any gold button (was .voted on votebtn / snews-cta) */
.btn-gold.is-active,.btn-gold.voted{background:var(--gold-soft);color:var(--gold-deep);box-shadow:none;cursor:default}
.btn-gold.is-active:hover,.btn-gold.voted:hover{background:var(--gold-soft)}
/* vote button tone on the community-ranking pages only (wcb-ranking*.html) — leaves .btn-gold everywhere else untouched */
[data-page="ranking"] [data-vote].btn-gold:not(.voted){background:var(--green-700);color:#fff}
[data-page="ranking"] [data-vote].btn-gold:not(.voted):hover{background:var(--green-800)}
/* icons inside shared buttons default to a consistent size */
.btn>svg{width:16px;height:16px;flex:none}

/* ============================================================
   UNIVERSAL PAGE LAYOUT  (canonical — pages must NOT redeclare)
   hero · breadcrumb · section head · ranking toolbar ·
   filter chips · broker link · rank-movement arrow.
   Page <style> keeps only page-specific rules + hero add-ons
   (e.g. .hero-cta, .hero-chips, .champ, .tldr-*).
   ============================================================ */
/* --- hero --- */
.hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
.hero .glow{position:absolute;width:55vw;height:55vw;right:-16vw;top:-24vw;border-radius:50%;background:none;pointer-events:none}
.hero-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:30px 20px 36px;display:flex;flex-direction:column;gap:32px}
/* flex gap (32px) now governs hero spacing to match home/news — child margins removed below so they don't stack on the gap */
.crumb{font-size:12.5px;color:rgba(255,255,255,.55);margin-bottom:14px}
.crumb a:hover{color:var(--gold-bright)}.crumb b{color:#fff}
.eyebrow{display:inline-block;font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--gold-bright);font-weight:700;text-transform:uppercase}
.hero h1{font-family:var(--serif);font-weight:800;font-size:clamp(28px,5vw,46px);line-height:1.4}
.hero h1 .gold{color:var(--gold-bright)}
.hero .sub{color:rgba(255,255,255,.78);font-size:15px;max-width:60ch}
.hero .meta{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:rgba(255,255,255,.6)}
.hero .meta b{color:var(--gold-bright);font-weight:600}
.hero .meta .byline{color:var(--gold-bright);font-weight:700;border-bottom:1px dashed rgba(227,190,74,.5)}
/* --- section + section head --- */
.section{padding:40px 0}
.shead{margin-bottom:16px;max-width:760px}
.s-eyebrow{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);display:flex;align-items:center;gap:9px;margin-bottom:9px}
.s-eyebrow::before{content:"";width:22px;height:2px;background:var(--gold)}
.shead h2{font-family:var(--serif);font-size:clamp(22px,3vw,28px);color:var(--green-900)}
.shead p{color:var(--ink-2);font-size:14.5px;margin-top:7px}
/* --- ranking toolbar (asset/filter left · year right) --- */
/* ===== unified filter-bar container — every bar shares this chrome ===== */
.wcb-filterbar,.rtoolbar,.filters,.rtt-controls,.filterbar,.pfilters{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:11px 14px;margin:0 0 14px}
.rtoolbar{justify-content:space-between}
.rtoolbar .typechips{display:flex;gap:7px;flex-wrap:wrap;flex:1 1 auto}
/* ===== unified filter chip — every chip class shares ONE look (edit here = all chips) ===== */
.wcb-chip,.tchip,.fchip,.rtt-fchip,.anom-fchip,.inst,.nhub-chip,.dep-chip,.pf-chip{border:1px solid var(--border-2);background:var(--surface);border-radius:9px;padding:8px 14px;font-weight:600;font-size:13px;color:var(--ink-2);cursor:pointer;min-height:38px;display:inline-flex;align-items:center;gap:6px;font-family:var(--thai);white-space:nowrap;transition:border-color .15s,background .15s,color .15s}
.wcb-chip:hover,.tchip:hover,.fchip:hover,.rtt-fchip:hover,.anom-fchip:hover,.inst:hover,.nhub-chip:hover,.dep-chip:hover,.pf-chip:hover{border-color:var(--gold)}
.wcb-chip .e,.tchip .e,.nhub-chip .e{font-size:14px;line-height:1}
.wcb-chip[aria-pressed="true"],.wcb-chip[aria-selected="true"],.wcb-chip.on,.tchip[aria-selected="true"],.tchip[aria-pressed="true"],.fchip.on,.fchip[aria-pressed="true"],.rtt-fchip[aria-pressed="true"],.anom-fchip[aria-pressed="true"],.inst[aria-pressed="true"],.nhub-chip[aria-pressed="true"],.dep-chip.on,.pf-chip.on{background:var(--green-700);color:#fff;border-color:var(--green-700)}
/* ===== unified mobile filter dropdown (deposit + promotion share this) ===== */
.dep-ddbtn,.pf-ddbtn{display:flex;width:100%;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:0 14px;border:1px solid var(--border-2);background:var(--surface);border-radius:9px;font-family:var(--thai);font-weight:700;font-size:14px;color:var(--ink);cursor:pointer}
.dep-ddbtn[aria-expanded="true"],.pf-ddbtn[aria-expanded="true"]{background:var(--green-700);border-color:var(--green-700);color:#fff}
.dep-ddbtn .cv,.pf-ddbtn .cv{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .2s;flex:none}
.dep-ddbtn[aria-expanded="true"] .cv,.pf-ddbtn[aria-expanded="true"] .cv{transform:rotate(180deg)}
.dep-panel,.pf-panel{position:absolute;top:calc(100% + 8px);left:0;z-index:40;width:min(320px,88vw);background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lg);padding:16px 18px;display:none}
.dep-panel.open,.pf-panel.open{display:block}
.dep-chips,.pf-chips{display:flex;flex-wrap:wrap;gap:8px}
.yearctl{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto}
.yearctl button{border:1px solid var(--border-2);background:var(--surface);color:var(--ink-2);font-family:var(--thai);font-weight:700;font-size:13px;padding:7px 13px;border-radius:9px;cursor:pointer;min-height:38px}
.yearctl button:hover{border-color:var(--green-600);color:var(--green-700)}
.yearctl button[aria-pressed="true"]{background:var(--green-700);border-color:var(--green-700);color:#fff}
.yearctl-mob{display:none} /* mobile-only combined year <select>, injected by wcb-components.js */
/* --- mobile table filter (Figma 684:2409): typechips → dropdown (left) · year → dropdown (right) --- */
.chips-mob{display:none} /* mobile-only asset <select>, injected by wcb-components.js */
.noresult{padding:36px;text-align:center;color:var(--ink-3);background:var(--surface);border:1px dashed var(--border);border-radius:12px;font-size:14px}
@media(max-width:640px){
  .rtoolbar{gap:8px}
  .rtoolbar .filters{flex:1 1 100%}
  /* replaced by the chips-mob <select> — 2-class specificity to beat each page's inline base `.typechips{display:flex}` */
  .rtoolbar .typechips,.rtoolbar .insts,.filterbar .typechips,.filterbar .insts{display:none}
  .chips-mob{display:block;flex:1 1 40%;min-width:0}
  .yearctl{display:flex;gap:8px;flex:1 1 40%;min-width:0}
  .yearctl button{display:none}
  .yearctl > select:not(.yearctl-mob){display:none}  /* hide older #yearMore — merged into the combined select */
  .yearctl .yearctl-mob{display:block;flex:1 1 0;min-width:0}
}
/* ===== generalized dropdown — every <select> uses this (class .wcb-select + legacy aliases) ===== */
.wcb-select,.rtt-select,.wcb-cmt-select,.yearctl select{appearance:none;-webkit-appearance:none;-moz-appearance:none;font-family:var(--thai);font-weight:600;font-size:13px;color:var(--ink-2);background:var(--cream-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%238A988F' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;border:1px solid var(--border-2);border-radius:9px;padding:8px 34px 8px 13px;min-height:38px;cursor:pointer}
.wcb-select:hover,.rtt-select:hover,.wcb-cmt-select:hover,.yearctl select:hover{border-color:var(--green-600)}
.wcb-select:focus-visible,.rtt-select:focus-visible,.wcb-cmt-select:focus-visible,.yearctl select:focus-visible{outline:2px solid var(--gold-deep);outline-offset:1px;border-color:var(--green-600)}
/* --- filter chips --- */

.filters .lbl{font-size:12.5px;color:var(--ink-3);font-weight:600}




/* license chip — ranking uses .licchip, forex uses .t-lic span (single source) */
.lic-cell,.t-lic{display:flex;gap:6px;flex-wrap:wrap}
.licchip,.t-lic span{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:600;color:var(--forex-t);background:#E7EFE9;border:1px solid #D5E3D9;border-radius:99px;padding:3px 9px;white-space:nowrap}
/* methodology cards — home & ranking (cheapest overrides locally) */
.mgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:8px 0 8px}
.mcard{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:var(--shadow)}
.mcard .mi{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:20px;background:var(--gold-soft);color:var(--gold-deep);margin-bottom:12px}
.mcard h3{font-size:18px;margin:0 0 6px}.mcard p{font-size:13px;margin:0}
/* info-section heading — ranking & deposit */
.info-sec{margin-top:14px}
.info-sec h4{font-size:11px;font-weight:800;letter-spacing:.4px;color:var(--ink-2);margin-bottom:7px;text-transform:uppercase}
.fcount{font-size:12.5px;color:var(--ink-3);margin-left:auto}
/* --- broker link (logo+name → review) --- */
.brk-link{display:flex;align-items:center;gap:12px;min-width:0;color:inherit;text-decoration:none;cursor:pointer}
.brk-link:hover .t-nm,.brk-link:hover .bname,.brk-link:hover .t-nm *{color:var(--gold-deep);text-decoration:underline}
/* --- universal rank-movement arrow --- */
.mv{font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.mv.up{color:var(--up)}.mv.dn{color:var(--down)}.mv.fl{color:var(--ink-3)}

/* ============================================================
   HEADER  (mega-menu)
   ============================================================ */
/* static (does NOT follow scroll) — a fixed floating burger provides persistent menu access */
.wcb-topbar{position:relative;z-index:50;background:linear-gradient(166deg,rgb(10,31,22) 7%,rgb(18,55,37) 44%,rgb(10,31,22) 81%);border-bottom:0.25px solid var(--gold)}
.wcb-topbar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:0.25px;background:var(--gold-line);pointer-events:none}
.wcb-topbar-in{display:flex;flex-direction:column;gap:12px;max-width:1400px;margin:0 auto;padding:20px 32px 16px}
/* shared icon (WCB.icon) + broker logo (WCB.brokerLogo) — single source */
.wcb-ic{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;flex:none}
.wcb-logo{position:relative;display:grid;place-items:center;width:var(--sz,48px);height:var(--sz,48px);border-radius:calc(var(--sz,48px)/4);overflow:hidden;flex:none}
.wcb-logo .init{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-family:var(--serif);font-weight:800;font-size:calc(var(--sz,48px)*.29);border-radius:inherit}
.wcb-logo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:inherit;opacity:0}
.wcb-brand{display:flex;align-items:center;gap:11px;flex:0 0 auto}
.wcb-logo-img{height:30px;width:auto;display:block;flex:0 0 auto}
.wcb-seal{display:grid;place-items:center;flex:0 0 auto;height:30px}
.wcb-seal svg,.wcb-logomark{width:auto;height:30px;display:block}
.wcb-bt{display:flex;flex-direction:column;justify-content:center;line-height:1}
.wcb-bt .w{font-family:'Noto Sans Thai',sans-serif;font-weight:700;font-size:21px;letter-spacing:.2px;background:linear-gradient(180deg,#F8ECB4,#E8C457 45%,#C9A227);-webkit-background-clip:text;background-clip:text;color:transparent}
.wcb-bt .w em{font-style:normal}
.wcb-bt .b{font-family:var(--thai);font-size:10.5px;letter-spacing:5px;color:var(--gold);font-weight:600;margin-top:2px}
.wcb-spacer{flex:1}

/* desktop nav */
.wcb-nav{display:flex;align-items:center;gap:0}
.wcb-navitem{position:relative;flex:0 0 auto}
.wcb-navlink{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;background:none;border:none;cursor:pointer;font-family:var(--thai);color:rgba(255,255,255,.82);font-size:13px;font-weight:600;padding:0 8px;height:var(--hh);position:relative}
.wcb-navlink:hover{color:var(--gold-bright)}
.wcb-navlink .caret{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .2s;opacity:.7}
.wcb-navitem.on>.wcb-navlink{color:#fff}
.wcb-navitem.on>.wcb-navlink::after{content:"";position:absolute;left:9px;right:9px;bottom:0;height:2px;background:var(--gold);border-radius:2px}
.wcb-navitem.open>.wcb-navlink .caret{transform:rotate(180deg)}
/* dropdown panel */
.wcb-drop{position:absolute;top:calc(var(--hh) - 6px);left:0;min-width:248px;background:var(--surface);border:1px solid var(--border);border-top:2px solid var(--gold);border-radius:4px 4px 12px 12px;box-shadow:var(--shadow-lg);padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .16s,transform .16s,visibility .16s;z-index:60}
.wcb-navitem:hover>.wcb-drop,.wcb-navitem.open>.wcb-drop{opacity:1;visibility:visible;transform:none}
.wcb-drop a{display:flex;flex-direction:column;gap:2px;padding:9px 12px;border-radius:9px;color:var(--ink);font-size:13.5px;font-weight:600;min-height:0}
.wcb-drop a:hover{background:var(--cream-2);color:var(--green-900)}
.wcb-drop a .d{font-size:11.5px;font-weight:500;color:var(--ink-3)}
.wcb-drop a.soon{color:var(--ink-3)}
.wcb-drop a .tag{font-size:10px;font-weight:700;color:var(--gold-deep);background:var(--gold-soft);border-radius:var(--pill);padding:1px 6px;margin-left:6px;align-self:flex-start}

/* header actions */
.wcb-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.wcb-world{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);color:#fff;border-radius:var(--pill);padding:0 12px;height:38px;cursor:pointer;font-weight:600;font-size:13px;font-family:var(--thai)}
.wcb-world svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.wcb-userarea{display:flex;align-items:center}
.wcb-usermenu{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:var(--pill);padding:4px 12px 4px 5px;cursor:pointer;color:#fff;min-height:44px;font-family:var(--thai)}
.wcb-usermenu:hover{background:rgba(255,255,255,.12);border-color:rgba(232,196,87,.72)}
.wcb-usermenu:active{background:rgba(255,255,255,.16)}
.wcb-usermenu .av{width:28px;height:28px;border-radius:50%;background:var(--gold);color:var(--green-900);display:grid;place-items:center;font-weight:800;font-size:12px;flex:0 0 28px}
.wcb-usermenu .un{font-size:13px;font-weight:700;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wcb-usermenu svg{width:14px;height:14px;stroke:rgba(255,255,255,.7);fill:none;stroke-width:2}
.wcb-burger{display:none;background:none;border:none;color:#fff;cursor:pointer;width:42px;height:42px;border-radius:9px;align-items:center;justify-content:center}
.wcb-burger svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2}

/* ---- header row 1: logo + search + Login (Figma 312:48) ---- */
.wcb-hrow{display:flex;align-items:center;gap:16px;width:100%;justify-content:space-between}
.wcb-search{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:8px;height:44px;background:rgba(255,255,255,.06);border:1px solid rgba(197,160,46,.45);border-radius:10px;padding:0 16px;transition:border-color .15s,background .15s,box-shadow .15s}
.wcb-search:focus-within{border-color:var(--gold-bright);background:rgba(255,255,255,.11);box-shadow:none}
.wcb-search svg{width:16px;height:16px;stroke:var(--gold);opacity:.8;fill:none;stroke-width:2;flex:none;transition:stroke .15s,opacity .15s}
.wcb-search:focus-within svg{opacity:1;stroke:var(--gold-bright)}
.wcb-search input{flex:1;min-width:0;background:none;border:none;outline:none;color:#fff;font-family:var(--thai);font-size:14px}
.wcb-search input::placeholder{color:#9db3a6}
.wcb-login{display:inline-flex;align-items:center;justify-content:center;height:var(--btn-h-sm);padding:0 18px;border:1px solid rgba(197,160,46,.45);border-radius:10px;background:transparent;color:#f9ebbf;font-family:var(--thai);font-weight:700;font-size:14px;cursor:pointer;white-space:nowrap;flex:none;transition:border-color .15s,background .15s,box-shadow .15s}
.wcb-login:hover{background:rgba(249,235,191,.12);border-color:var(--gold-bright);box-shadow:none}
/* ---- header row 2: flat pill nav ---- */
.wcb-pills{display:flex;flex-wrap:wrap;gap:8px;width:100%}
.wcb-pill{display:inline-flex;align-items:center;background:rgba(255,255,255,.05);border:1px solid rgba(197,160,46,.45);border-radius:10px;padding:7px 13px;color:#c7d6cc;font-family:var(--thai);font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap;text-decoration:none;transition:background .15s,color .15s,border-color .15s}
.wcb-pill:hover{background:rgba(255,255,255,.1);color:#fff;border-color:var(--gold)}
.wcb-pill.on{background:rgba(255,255,255,.05);border-color:var(--gold);color:var(--gold);font-weight:700}
/* header dropdowns (desktop) — open on HOVER; sourced from the same NAV as drawer + footer */
.wcb-navitem{position:relative;display:inline-flex}
.wcb-pill-dd{gap:5px;font-family:var(--thai)}
.wcb-pill-dd .caret{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.2;transition:transform .15s}
.wcb-navitem:hover>.wcb-pill-dd{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(201,162,39,.5)}
.wcb-navitem:hover>.wcb-pill-dd:not(.on) .caret{transform:rotate(180deg)}
.wcb-dd-panel{position:absolute;top:calc(100% + 8px);left:0;min-width:264px;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lg);padding:6px;z-index:60;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .16s ease,transform .16s ease}
/* invisible bridge over the 8px gap so the pointer can travel pill→panel without closing */
.wcb-dd-panel::before{content:"";position:absolute;top:-8px;left:0;right:0;height:8px}
.wcb-navitem:hover>.wcb-dd-panel{opacity:1;visibility:visible;transform:none}
.wcb-dd-link{display:block;padding:9px 12px;border-radius:8px;text-decoration:none;transition:background .12s}
.wcb-dd-link:hover{background:var(--cream-2)}
.wcb-dd-lb{display:block;font-size:13.5px;font-weight:600;color:var(--ink)}
.wcb-dd-desc{display:block;font-size:11.5px;color:var(--ink-3);margin-top:2px}
.wcb-dd-link.soon{opacity:.62}
.wcb-dd-link .tag{display:inline-block;margin-left:6px;font-size:10px;font-weight:700;color:var(--gold-deep);background:var(--gold-soft);border-radius:99px;padding:1px 7px;vertical-align:middle}
/* level-3 sub-flyout — a topic (.has-sub) flies its sub-categories out to the right on hover */
.wcb-dd-row{position:relative}
.wcb-dd-link.has-sub{display:flex;align-items:center;justify-content:space-between;gap:10px}
.wcb-dd-link.has-sub .subcaret{width:14px;height:14px;flex:0 0 auto;stroke:var(--ink-3);fill:none;stroke-width:2.2}
.wcb-dd-row:hover>.wcb-dd-link.has-sub{background:var(--cream-2)}
.wcb-dd-sub{position:absolute;top:-6px;left:100%;margin-left:3px;min-width:224px;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lg);padding:6px;z-index:61;opacity:0;visibility:hidden;transform:translateX(-6px);transition:opacity .16s ease,transform .16s ease}
/* bridge over the 3px gap between topic row and its sub-panel */
.wcb-dd-sub::before{content:"";position:absolute;top:0;left:-6px;width:6px;height:100%}
.wcb-dd-row:hover>.wcb-dd-sub{opacity:1;visibility:visible;transform:none}
@media (prefers-reduced-motion:reduce){.wcb-dd-panel,.wcb-dd-sub{transition:none;transform:none}}
/* ---- floating burger (fixed, follows screen) ---- */
.wcb-fab{position:fixed;top:14px;right:14px;z-index:70;width:48px;height:48px;border-radius:14px;background:var(--green-800);border:1px solid var(--gold);color:#fff;cursor:pointer;display:none;align-items:center;justify-content:center;box-shadow:var(--shadow-lg)}
.wcb-fab:hover{background:var(--green-700)}
.wcb-fab:active{transform:translateY(1px)}
.wcb-fab svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2}
body.wcb-scrolled .wcb-fab{display:flex}
body.wcb-drawer-open .wcb-fab{display:none}
/* in-header burger (mobile/tablet): sits in the header row at the top, scrolls away with it — same look as the fixed FAB */
.wcb-hburger{display:none;flex:none;margin-left:auto;width:44px;height:44px;border-radius:12px;background:var(--green-800);border:1px solid var(--gold);color:#fff;cursor:pointer;align-items:center;justify-content:center}
.wcb-hburger:hover{background:var(--green-700)}
.wcb-hburger:active{transform:translateY(1px)}
.wcb-hburger svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2}
/* ---- responsive: ≤1024 header collapses to logo + in-header burger; search/Login/nav move into the drawer. The fixed FAB then takes over once you scroll past the header. ---- */
@media(max-width:1024px){ .wcb-pills{display:none} .wcb-search{display:none} .wcb-hrow .wcb-userarea{display:none} .wcb-hburger{display:inline-flex} }
@media(max-width:640px){ .wcb-topbar-in{padding:14px 16px} }
@media(max-width:640px){
  .wcb-logo-img,.wcb-seal,.wcb-seal svg,.wcb-logomark{height:26px}
  .wcb-hburger{width:40px;height:40px;border-radius:10px}
  .wcb-hburger svg{width:21px;height:21px}
  .wcb-fab{top:10px;right:10px;width:42px;height:42px;border-radius:11px}
  .wcb-fab svg{width:21px;height:21px}
}

/* ===== mobile drawer ===== */
.wcb-scrim{position:fixed;inset:0;background:rgba(11,32,21,.55);z-index:58;opacity:0;visibility:hidden;transition:opacity .25s}
.wcb-scrim.open{opacity:1;visibility:visible}
.wcb-drawer{position:fixed;top:0;right:0;bottom:0;width:min(86vw,360px);background:var(--surface);z-index:59;transform:translateX(100%);transition:transform .26s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column;box-shadow:var(--shadow-lg)}
.wcb-drawer.open{transform:none}
@media(max-width:640px){.wcb-drawer{width:100vw;max-width:none}}
.wcb-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:var(--green-800);color:#fff}
.wcb-drawer-head .wcb-bt .w{font-size:17px}
.wcb-drawer-close{width:36px;height:36px;border:none;background:rgba(255,255,255,.1);border-radius:50%;cursor:pointer;display:grid;place-items:center;flex:0 0 36px}
.wcb-drawer-close svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2}
.wcb-drawer-body{flex:1;overflow:auto;padding:6px 0 calc(20px + env(safe-area-inset-bottom))}
.wcb-acc{border-bottom:1px solid var(--border)}
.wcb-acc-top{display:flex;align-items:center;gap:0;width:100%;text-align:left;background:none;border:none;font-family:var(--thai);font-size:15px;font-weight:700;color:var(--ink);padding:14px 18px;cursor:pointer;min-height:var(--tap)}
.wcb-acc-top.is-link{color:var(--ink)}
.wcb-acc-top .dw-ic{width:20px;height:20px;stroke:var(--green-700);fill:none;stroke-width:1.8;flex:none;margin-right:12px}
.wcb-acc-top .dw-lb{flex:1}
.wcb-acc-top[aria-current="page"] .dw-lb{color:var(--green-700)}
/* account block */
.wcb-drawer-account{padding:16px;background:var(--cream-2);border-bottom:1px solid var(--border)}
.dw-hi{display:flex;align-items:center;gap:11px;margin-bottom:12px}
.dw-av{width:44px;height:44px;border-radius:50%;background:var(--cream-2);border:1px solid var(--border);color:var(--ink-3);display:grid;place-items:center;font-weight:800;font-size:18px;flex:none}
.dw-av.on{background:var(--green-700);border-color:var(--green-700);color:#fff;font-size:16px}
.dw-hi-t b{display:block;font-family:var(--serif);font-size:16px;color:var(--green-900)}
.dw-hi-t span{font-size:12px;color:var(--ink-3);line-height:1.4}
.dw-acct-btns{display:flex;gap:8px}.dw-acct-btns .btn{flex:1}
.dw-acct-in{display:flex;align-items:center;gap:11px}
.dw-who{flex:1;min-width:0}.dw-who b{display:block;font-size:14.5px;color:var(--ink)}.dw-who span{font-size:11.5px;color:var(--ink-3)}
.dw-logout{background:none;border:1px solid var(--border-2);border-radius:9px;padding:8px 12px;font-family:var(--thai);font-size:12.5px;font-weight:700;color:var(--ink-2);cursor:pointer;flex:none}
.dw-quick{display:flex;flex-direction:column;margin-top:12px;border-top:1px solid var(--border);padding-top:8px}
.dw-quick a{padding:8px 2px;font-size:13.5px;font-weight:600;color:var(--ink-2)}
/* search */
.wcb-drawer-search{padding:13px 16px;position:relative;border-bottom:1px solid var(--border)}
.wcb-drawer-search svg{position:absolute;left:28px;top:24px;width:17px;height:17px;stroke:var(--ink-3);fill:none;stroke-width:2}
.wcb-drawer-search input{width:100%;box-sizing:border-box;border:1px solid var(--border-2);border-radius:10px;padding:11px 12px 11px 38px;font-family:var(--thai);font-size:14px;background:var(--surface);color:var(--ink)}
.wcb-drawer-search input:focus{outline:none;border-color:var(--gold-deep)}
.wcb-acc-top .chev{width:18px;height:18px;stroke:var(--ink-3);fill:none;stroke-width:2;transition:transform .2s;flex:0 0 18px}
.wcb-acc.open .wcb-acc-top .chev{transform:rotate(180deg)}
.wcb-acc-panel{display:none;padding:0 0 8px}
.wcb-acc.open .wcb-acc-panel{display:block}
.wcb-acc-panel a{display:flex;align-items:center;gap:8px;padding:11px 18px 11px 50px;font-size:14px;font-weight:600;color:var(--ink-2);min-height:var(--tap)}
.wcb-acc-panel a:hover{background:var(--cream-2);color:var(--green-900)}
.wcb-acc-panel a.soon{color:var(--ink-3)}
.wcb-acc-panel a .tag{font-size:10px;font-weight:700;color:var(--gold-deep);background:var(--gold-soft);border-radius:var(--pill);padding:1px 6px}
.wcb-drawer-foot{padding:14px 18px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:8px}


/* ===== ticker tape ===== */
.wcb-ticker{background:var(--green-950);border-bottom:1px solid rgba(201,162,39,.2);overflow:hidden;height:38px}
.wcb-tt-track{display:flex;gap:30px;align-items:center;height:38px;white-space:nowrap;width:max-content;animation:wcb-tt 38s linear infinite}
.wcb-ticker:hover .wcb-tt-track{animation-play-state:paused}
@keyframes wcb-tt{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.wcb-tt-track{animation:none}}
.wcb-tt-item{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:rgba(255,255,255,.82)}
.wcb-tt-item .s{font-weight:700;color:#fff}
.wcb-tt-item .p,.wcb-tt-item .c{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums}
.wcb-tt-item .c{font-size:11.5px}.wcb-tt-item .c.up{color:#6FD39B}.wcb-tt-item .c.down{color:#F0907F}
@media(max-width:640px){
  .wcb-ticker,.wcb-tt-track{height:32px}
  .wcb-tt-track{gap:24px}
  .wcb-tt-item{gap:6px;font-size:12px}
  .wcb-tt-item .c{font-size:11px}
}

/* ============================================================
   FOOTER  (sitemap, mirrors nav)
   ============================================================ */
.wcb-foot{background:var(--green-900);color:rgba(255,255,255,.7);border-top:3px solid var(--gold)}
.wcb-foot-top{max-width:1180px;margin:0 auto;padding:34px 20px 30px;display:grid;grid-template-columns:1.45fr 3.3fr;gap:34px}
.wcb-foot-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 20px}
.wcb-foot .fcol h4 a{color:var(--gold)}
.wcb-foot .fcol-flat h4 a{font-family:var(--serif);font-size:16px;font-weight:400} /* match .fcol-h (was inheriting .fl's 13px + h4 bold) */
.wcb-foot-brandcol .wcb-brand{margin-bottom:10px}
.wcb-foot .ftag{color:rgba(255,255,255,.6);font-size:13px;margin-top:4px;max-width:34ch;line-height:1.55}
.wcb-foot .social-ico{display:flex;gap:9px;margin-top:14px}
.wcb-foot .social-ico a{width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.3);display:grid;place-items:center;color:#fff}
.wcb-foot .social-ico svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.wcb-foot h4{font-family:var(--serif);color:var(--gold);font-size:16px;margin-bottom:11px}
/* section heading — a real <button> so it can toggle the accordion on mobile; looks like an h4 */
.wcb-foot .fcol-h{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;font-family:var(--serif);color:var(--gold);font-size:16px;margin-bottom:11px;cursor:default}
.wcb-foot .fcol-chev{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;flex:0 0 auto;display:none;transition:transform .2s}
.wcb-foot a.fl{display:block;color:rgba(255,255,255,.82);font-size:13px;padding:5px 0}
.wcb-foot a.fl:hover{color:#fff}
/* columns with more than 4 links show only the first 4 — the rest sit behind an inline
   "+ อีก N รายการ" toggle so every column reads the same height until expanded */
.wcb-foot a.fl.fl-more{display:none}
.wcb-foot .fcol-panel.expanded a.fl.fl-more{display:block}
.wcb-foot .fcol-more{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:4px;cursor:pointer;margin-top:4px;font-size:11.5px;font-weight:700;color:var(--gold-bright)}
.wcb-foot .fcol-more:hover{color:#fff}
.wcb-foot .fcol-more .m-less{display:none}
.wcb-foot .fcol-panel.expanded .fcol-more .m-more{display:none}
.wcb-foot .fcol-panel.expanded .fcol-more .m-less{display:inline}
.wcb-riskbar{background:#0b2015;color:rgba(255,255,255,.85);border-top:1px solid rgba(255,255,255,.1);padding:16px 20px;font-size:12.5px;line-height:1.55}
.wcb-riskbar .wrap{max-width:1180px;margin:0 auto}.wcb-riskbar b{color:var(--gold)}
.wcb-copyr{background:#0b2015;color:rgba(255,255,255,.5);text-align:center;padding:14px 20px;font-size:12px;border-top:1px solid rgba(255,255,255,.08)}

/* ============================================================
   LUXE utilities + SCORE BAR (orange low -> green full)
   ============================================================ */
.wcb-gold-divider{height:1px;border:none;background:var(--gold-line);margin:0}
.wcb-eyebrow{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);display:inline-flex;align-items:center;gap:9px}
.wcb-eyebrow::before{content:"";width:22px;height:2px;background:var(--gold)}
/* section heading */
.wcb-shead{margin-bottom:18px;max-width:760px}
.wcb-shead h2{font-family:var(--serif);font-size:clamp(22px,3vw,28px);color:var(--green-900);margin-top:9px}
.wcb-shead p{color:var(--ink-2);font-size:14.5px;margin-top:7px}
.wcb-shead.center{max-width:640px;margin-left:auto;margin-right:auto;text-align:center}
.wcb-shead.center .wcb-eyebrow::before{display:none}
/* score bar: full track is the orange->green gradient; an overlay hides the unfilled part,
   so low scores reveal only orange and high scores reveal into green */
.wcb-score{position:relative;height:8px;border-radius:99px;overflow:hidden;background:linear-gradient(90deg,var(--score-lo),var(--score-mid) 50%,#37A24A);box-shadow:none}
.wcb-score::after{content:"";position:absolute;top:0;bottom:0;right:0;left:var(--v,50%);background:#E9EFEA}
.wcb-score.lg{height:11px}.wcb-score.ondark::after{background:rgba(255,255,255,.14)}
.wcb-scorewrap{display:flex;align-items:center;gap:10px}
.wcb-scorewrap .sv{font-family:var(--mono);font-weight:800;font-size:15px;color:var(--green-900);min-width:38px;text-align:right}
.wcb-scorewrap .wcb-score{flex:1}

/* ============================================================
   BYLINE  (E-E-A-T: updated + author/reviewer with portraits)
   ============================================================ */
.wcb-byline{margin-top:14px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.wcb-byline .wb-upd{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:rgba(255,255,255,.62)}
.wcb-byline .wb-upd .wb-clk{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2}
.wcb-byline .wb-upd b{color:var(--gold-bright);font-weight:600}
.wcb-byline .wb-ago{color:rgba(255,255,255,.45)}
.wcb-byline .wb-people{display:flex;gap:12px;flex-wrap:nowrap}
.wcb-byline .wb-person{display:flex;align-items:center;gap:6px}
.wcb-byline .wb-av{width:22px;height:22px;border-radius:50%;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:10px;flex:none;box-shadow:none}
.wcb-byline .wb-txt{line-height:1.2}
.wcb-byline .wb-r{display:block;font-size:9px;color:rgba(255,255,255,.5)}
.wcb-byline .wb-n{font-size:11.5px;font-weight:700;color:#fff;border-bottom:1px dashed rgba(227,190,74,.55)}
/* light-background variant (e.g. review summary card) */
.wcb-byline.on-light .wb-upd{color:var(--ink-3)}
.wcb-byline.on-light .wb-upd b{color:var(--gold-deep)}
.wcb-byline.on-light .wb-ago{color:var(--ink-3)}
.wcb-byline.on-light .wb-r{color:var(--ink-3)}
.wcb-byline.on-light .wb-n{color:var(--ink);border-bottom-color:var(--gold)}

/* byline + inline share row (article pages: News / Analysis) */
.wcb-byrow{display:flex;justify-content:space-between;align-items:flex-end;gap:14px 24px;flex-wrap:wrap;margin-top:16px}
.wcb-byrow .wcb-byline{margin-top:0}
.wcb-share{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.wcb-share .sh-lbl{font-size:12px;font-weight:600;color:var(--ink-3);margin-right:2px}
.wcb-share button{width:38px;height:38px;border-radius:9px;border:1px solid var(--border-2);background:var(--surface);display:grid;place-items:center;cursor:pointer;color:var(--ink-2)}
.wcb-share button:hover{border-color:var(--gold);color:var(--green-900)}
.wcb-share button svg{width:17px;height:17px}
.wcb-share.on-dark .sh-lbl{color:rgba(255,255,255,.6)}
.wcb-share.on-dark button{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.2);color:rgba(255,255,255,.85)}
.wcb-share.on-dark button:hover{background:rgba(255,255,255,.12);border-color:var(--gold-bright);color:#fff}

/* ============================================================
   BREADCRUMB · DISCLAIMER · CHIPS · MODAL SHELL
   ============================================================ */
/* breadcrumb */
/* default = light background (ink); every page uses this. Add .on-dark for a dark hero. */
.wcb-crumb{font-size:12.5px;color:var(--ink-3);margin-bottom:14px}
.wcb-crumb a:hover{color:var(--gold-deep)}
.wcb-crumb b{color:var(--ink)}
.wcb-crumb .sep{opacity:.55;margin:0 3px}
.wcb-crumb.on-dark{color:rgba(255,255,255,.55)}
.wcb-crumb.on-dark a:hover{color:var(--gold-bright)}
.wcb-crumb.on-dark b{color:#fff}
/* legacy alias — kept so existing markup with .on-light stays explicit and correct */
.wcb-crumb.on-light{color:var(--ink-3)}
.wcb-crumb.on-light a:hover{color:var(--gold-deep)}
.wcb-crumb.on-light b{color:var(--ink)}

/* disclaimer (composable clauses · variants) */
.wcb-disc{font-size:12px;line-height:1.55}
.wcb-disc.box{display:flex;gap:9px;align-items:flex-start;background:var(--warn-soft);border:1px solid #f3c9c4;border-radius:12px;padding:13px 16px;color:var(--ink-2)}
.wcb-disc.box .ic{color:var(--warn);flex:none;font-size:15px;line-height:1.3}
.wcb-disc b{color:var(--ink)}
.wcb-disc.inline{display:inline-flex;gap:7px;align-items:flex-start;color:var(--risk);background:#FDECEA;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:600}
.wcb-disc.inline .ic{flex:none}
.wcb-disc.plain{color:var(--ink-3);font-weight:400}
.wcb-disc.on-dark{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14);color:rgba(255,255,255,.6)}
.wcb-disc.on-dark b{color:rgba(255,255,255,.85)}

/* internal-link chips */
.wcb-chips-title{font-family:var(--serif);font-size:22px;color:var(--green-900);margin-bottom:14px}
.wcb-chips{display:flex;gap:9px;flex-wrap:wrap}
.wcb-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border-2);background:var(--surface);border-radius:var(--pill);padding:9px 15px;font-weight:600;font-size:13px;color:var(--ink-2);cursor:pointer}
.wcb-chip:hover{border-color:var(--gold);color:var(--green-900)}
.wcb-chip.strong{font-weight:700;color:var(--green-900)}
.wcb-chip .dot{width:12px;height:12px;border-radius:3px;flex:none}

/* modal shell */
.wcb-modal{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:20px}
.wcb-modal[hidden]{display:none}
.wcb-modal-scrim{position:absolute;inset:0;background:rgba(7,21,14,.55)}
.wcb-modal-card{position:relative;background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);max-width:460px;width:100%;max-height:88vh;overflow:auto;padding:22px;border-top:3px solid var(--gold);animation:wcb-rise .24s}
.wcb-modal-card.wide{max-width:880px}
@keyframes wcb-rise{from{transform:translateY(16px);opacity:.6}to{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){.wcb-modal-card{animation:none}}
.wcb-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.wcb-modal-head h3{font-family:var(--serif);font-size:21px;color:var(--green-900)}
.wcb-modal-head p{font-size:12.5px;color:var(--ink-2);margin-top:3px}
.wcb-modal-close{width:36px;height:36px;border:none;background:var(--cream-2);border-radius:50%;cursor:pointer;display:grid;place-items:center;flex:none}
.wcb-modal-close svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:2}
/* login modal content */
.wcb-slogins{display:flex;flex-direction:column;gap:8px}
.wcb-slogin{display:flex;align-items:center;justify-content:center;gap:10px;min-height:var(--tap);border:1px solid var(--border);background:#fff;border-radius:10px;cursor:pointer;font-family:var(--thai);font-size:14px;font-weight:700;color:var(--ink)}
.wcb-slogin:hover{background:var(--cream-2)}.wcb-slogin svg{width:18px;height:18px;flex:none}
.wcb-divider{display:flex;align-items:center;gap:12px;margin:16px 0;color:var(--ink-2);font-size:11px;font-weight:700}
.wcb-divider::before,.wcb-divider::after{content:"";flex:1;border-top:1px solid var(--border)}
.wcb-field{margin-bottom:12px}.wcb-field label{display:block;font-size:12px;font-weight:700;color:var(--ink-2);margin-bottom:5px}
.wcb-field input{width:100%;min-height:var(--tap);border:1.5px solid var(--border);border-radius:10px;padding:0 12px;font-family:var(--thai);font-size:14px;color:var(--ink);background:#fff}
.wcb-field input:focus{outline:none;border-color:var(--gold-deep)}
.wcb-modal-fine{font-size:11px;color:var(--ink-2);margin-top:12px;line-height:1.5}

/* ============================================================
   COMMENTS  (unified: plain + rating · thumb-up · 1-level reply)
   ============================================================ */
.wcb-cmt{background:var(--canvas);border-top:1px solid var(--border);padding:48px 0}
.wcb-cmt-wrap{max-width:760px;margin:0 auto;padding:0 20px}
.wcb-cmt-head h2{font-family:var(--serif);font-size:clamp(22px,3vw,28px);color:var(--green-900)}
.wcb-cmt-head .cnt{font-size:16px;color:var(--ink-3);font-weight:400}
.wcb-cmt-sub{font-size:13.5px;color:var(--ink-2);margin:6px 0 0}.wcb-cmt-sub b{color:var(--ink)}
.wcb-cmt-agg{display:flex;align-items:baseline;gap:7px;margin:10px 0 0;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:9px 13px;width:max-content;max-width:100%}
.wcb-cmt-agg .big{font-family:var(--mono);font-weight:800;font-size:24px;color:var(--gold-deep);line-height:1}
.wcb-cmt-agg .of{font-size:13px;color:var(--ink-3)}
.wcb-cmt-agg .st{color:var(--gold)}.wcb-cmt-agg .st .e{color:var(--border-2)}
.wcb-cmt-agg .n{font-size:12.5px;color:var(--ink-2)}
.wcb-cmt-compose{margin:16px 0 18px}
.wcb-cmt-gate{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:15px 18px}
.wcb-cmt-gate svg{width:22px;height:22px;stroke:var(--gold-deep);fill:none;stroke-width:1.8;flex:none;transform:translateY(-1px)}
.wcb-cmt-gate span{font-size:14px;color:var(--ink-2);font-weight:600;flex:1;min-width:150px}
.wcb-cmt-editor{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px;box-shadow:var(--shadow)}
.wcb-cmt-editor textarea{width:100%;box-sizing:border-box;border:1px solid var(--border-2);border-radius:10px;padding:11px 13px;font-family:var(--thai);font-size:14.5px;resize:vertical;min-height:74px;color:var(--ink)}
.wcb-cmt-editor textarea:focus{outline:none;border-color:var(--gold-deep)}
.wcb-cmt-rate{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.wcb-cmt-rate .lbl{font-size:13px;font-weight:700;color:var(--ink-2)}
.wcb-stars{display:inline-flex;gap:4px}
/* ★ glyph rating: tintable text star (no border) — off = gray, on = gold */
.wcb-stars button{background:none;border:none;cursor:pointer;font-size:26px;line-height:1;padding:0;width:36px;height:36px;display:inline-grid;place-items:center;color:var(--border-2);transition:color .12s,transform .12s}
.wcb-stars button:hover{transform:scale(1.14)}
.wcb-stars button.on{color:var(--gold)}
.wcb-cmt-tools{display:flex;align-items:center;gap:10px;margin-top:11px;flex-wrap:wrap}
.wcb-cmt-hint{font-size:12px;color:var(--ink-3);flex:1;min-width:120px}
.wcb-cmt-warn{display:flex;gap:10px;align-items:flex-start;background:var(--gold-soft);border:1px solid #ecd9a8;border-radius:12px;padding:13px 16px;font-size:13.5px;color:var(--gold-deep);font-weight:600}
.wcb-cmt-warn svg{width:18px;height:18px;stroke:var(--gold-deep);fill:none;stroke-width:2;flex:none;margin-top:1px}
.wcb-cmt-list{display:grid;gap:12px}
.wcb-cmt-item{display:flex;gap:12px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:14px 16px}
.wcb-cmt-item.mine{border-color:var(--gold);box-shadow:none}
.wcb-cmt-av{width:38px;height:38px;border-radius:50%;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:14px;flex:none;position:relative;overflow:visible}
.wcb-cmt-av.sm{width:30px;height:30px;font-size:12px}
/* comment camp/broker (opt-in via data-broker — used on the ranking page) */
.wcb-cmt-badge{position:absolute;right:-3px;bottom:-3px;width:17px;height:17px;border-radius:var(--pill);border:2px solid var(--surface);color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:8px}
.wcb-cmt-campof{display:inline-flex;align-items:center;gap:8px;margin:3px 0 6px;background:var(--cream-2);border:1px solid var(--border);border-radius:11px;padding:4px 10px 4px 5px;max-width:100%}
.wcb-cmt-campof .wcb-logo{border-radius:7px}
.wcb-cmt-campof .cl{font-size:10.5px;font-weight:700;color:var(--ink-3);flex:none}
.wcb-cmt-campof .nm{font-size:12px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wcb-cmt-campof .rk{font-size:10px;font-weight:800;color:var(--gold-deep);background:var(--gold-soft);border:1px solid #ecd9a8;border-radius:var(--pill);padding:1px 7px;flex:none}
.wcb-cmt-camprow{display:inline-flex;align-items:center;gap:9px;flex-wrap:wrap}
.wcb-cmt-camprow .cl{font-size:12.5px;color:var(--ink-2);font-weight:600}
.wcb-cmt-camprow .chg{background:none;border:none;color:var(--gold-deep);font-family:var(--thai);font-size:12px;font-weight:700;cursor:pointer;text-decoration:underline;padding:0}
.wcb-cmt-chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--green-900);background:var(--cream-2);border:1px solid var(--border);border-radius:var(--pill);padding:3px 12px 3px 4px}
.wcb-cmt-chip .l{width:20px;height:20px;border-radius:6px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:9px}
/* .wcb-cmt-select → generalized dropdown (see .wcb-select group above) */
.wcb-cmt-select:focus{outline:none;border-color:var(--gold-deep)}

/* ============================================================
   RANKING TRUST BLOCKS — Warning (danger signals) · Methodology
   Shared components: data-wcb="warning" / data-wcb="methodology"
   ============================================================ */
.wcb-redflags{background:var(--surface,#fff);border:2px solid var(--maroon);border-radius:var(--r-lg);padding:22px 24px;margin:24px 0}
.wcb-redflags .rf-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px}
.wcb-redflags .rf-flag{width:34px;height:34px;border-radius:9px;background:#fff;border:1px solid #f2c9c3;display:grid;place-items:center;flex:none;font-size:16px;line-height:1}
.wcb-redflags .rf-head h3{font-family:var(--serif);font-size:clamp(18px,2.4vw,22px);color:var(--maroon);line-height:1.25}
.wcb-redflags .rf-head p{font-size:13px;color:var(--ink-2);margin-top:4px}
.wcb-redflags .rf-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.wcb-redflags .rf-item{display:flex;gap:11px;align-items:flex-start;background:var(--surface);border:1px solid var(--maroon);border-radius:var(--r);padding:14px 16px}
.wcb-redflags .rf-item .x{width:22px;height:22px;border-radius:6px;background:var(--rose-1,#FDECEA);color:var(--risk);display:grid;place-items:center;flex:none;font-size:11px;font-weight:800;margin-top:1px}
.wcb-redflags .rf-item b{display:block;font-size:14px;color:var(--ink);margin-bottom:3px}
.wcb-redflags .rf-item span{font-size:12.5px;color:var(--ink-2);line-height:1.5}
@media(max-width:720px){.wcb-redflags .rf-grid{grid-template-columns:1fr}}

.wcb-howto{margin:24px 0}
.wcb-howto .ht-head{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.wcb-howto .ht-head::before{content:"";width:5px;height:26px;border-radius:3px;background:var(--gold);flex:none}
.wcb-howto .ht-head h3{font-family:var(--serif);font-size:clamp(19px,2.6vw,24px);color:var(--green-900)}
.wcb-howto .ht-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:6px 24px 20px;box-shadow:var(--shadow)}
.wcb-howto .ht-item{display:flex;gap:13px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--border)}
.wcb-howto .ht-item:last-of-type{border-bottom:none}
.wcb-howto .ht-n{width:24px;height:24px;border-radius:50%;background:var(--cream-2);border:1px solid var(--border-2);color:var(--ink-2);display:grid;place-items:center;flex:none;font-family:var(--mono);font-weight:700;font-size:12px;margin-top:1px}
.wcb-howto .ht-item p{font-size:14px;color:var(--ink-2);line-height:1.6}.wcb-howto .ht-item p b{color:var(--ink)}
.wcb-howto .ht-note{display:flex;gap:8px;align-items:flex-start;border:1px dashed var(--border-2);border-radius:10px;padding:11px 14px;margin-top:14px;font-size:12px;color:var(--ink-3);line-height:1.55}
.wcb-howto .ht-note>*{min-width:0;overflow-wrap:anywhere;word-break:break-word}
.wcb-howto .ht-note>span{flex:1 1 0}

.wcb-cmt-b{flex:1;min-width:0}
.wcb-cmt-meta{display:flex;align-items:center;gap:8px;margin-bottom:4px;flex-wrap:wrap}
.wcb-cmt-name{font-weight:700;font-size:13.5px;color:var(--ink)}
.wcb-cmt-you{font-size:11px;font-weight:700;color:#fff;background:var(--green-700);padding:1px 8px;border-radius:99px}
.wcb-cmt-yr{font-size:11px;font-weight:600;color:var(--green-700);background:var(--cream);border:1px solid var(--border);padding:1px 8px;border-radius:99px}
.wcb-cmt-time{font-size:11.5px;color:var(--ink-3)}
.wcb-cmt-rowstars{color:var(--gold);font-size:13px;margin-bottom:3px}.wcb-cmt-rowstars .e{color:var(--border-2)}
.wcb-cmt-text{font-size:14px;color:var(--ink-2);overflow-wrap:anywhere}
.wcb-cmt-acts{display:flex;gap:16px;margin-top:8px}
.wcb-cmt-acts button{display:inline-flex;align-items:center;gap:5px;background:none;border:none;cursor:pointer;color:var(--ink-3);font-size:12px;font-weight:700;font-family:var(--thai);min-height:40px;padding:0 6px}
.wcb-cmt-acts button:hover{color:var(--gold-deep)}
.wcb-cmt-acts .like svg,.wcb-cmt-acts .reply svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.2}
.wcb-cmt-acts .like.on{color:var(--rose-cta)}.wcb-cmt-acts .like.on svg{fill:currentColor}
.wcb-cmt-replies{margin-top:10px;display:grid;gap:9px;border-left:2px solid var(--border);padding-left:12px}
.wcb-cmt-reply{display:flex;gap:9px}
.wcb-cmt-reply .wcb-cmt-text{font-size:13.5px}
.wcb-cmt-replybox{margin-top:9px;display:flex;gap:8px;align-items:flex-start}
.wcb-cmt-replybox textarea{flex:1;box-sizing:border-box;border:1px solid var(--border-2);border-radius:9px;padding:8px 11px;font-family:var(--thai);font-size:13.5px;resize:vertical;min-height:40px;color:var(--ink)}
.wcb-cmt-replybox textarea:focus{outline:none;border-color:var(--gold-deep)}
.wcb-cmt-pager{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid var(--border)}
.wcb-cmt-pager .ps{display:flex;align-items:center;gap:5px;margin-right:auto;font-size:12.5px;color:var(--ink-3);flex-wrap:wrap}
.wcb-cmt-pager .ps .lab{font-weight:600}
.wcb-cmt-pager .ps button{min-width:34px;height:32px;border:1px solid var(--border-2);background:var(--surface);border-radius:8px;cursor:pointer;font-family:var(--mono);font-weight:700;font-size:12.5px;color:var(--ink-2)}
.wcb-cmt-pager .ps button.on{background:var(--green-700);color:#fff;border-color:var(--green-700)}
.wcb-cmt-pager .pg{display:flex;gap:5px;align-items:center}
.wcb-cmt-pager .pg button{min-width:36px;height:36px;border:1px solid var(--border-2);background:var(--surface);border-radius:9px;cursor:pointer;font-family:var(--thai);font-weight:700;font-size:13.5px;color:var(--ink-2)}
.wcb-cmt-pager .pg button[aria-current="true"]{background:var(--green-700);color:#fff;border-color:var(--green-700)}
.wcb-cmt-pager .pg button:disabled{opacity:.4;cursor:default}
@media(max-width:640px){
  .wcb-cmt-pager{gap:8px}
  .wcb-cmt-pager .ps{gap:4px;font-size:12px}
  .wcb-cmt-pager .ps button{min-width:30px;height:30px;padding:0 7px;font-size:12px}
  .wcb-cmt-pager .pg{gap:4px}
  .wcb-cmt-pager .pg button{min-width:32px;height:32px;padding:0 8px;font-size:12.5px}
}
/* shared list pager (ranking tables) — same look as the comment pager */
.wcb-pager{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px;width:100%}
.wcb-pager:empty{display:none}
.wcb-pager .ps{display:flex;align-items:center;gap:5px;margin-right:auto;font-size:12.5px;color:var(--ink-3);flex-wrap:wrap}
.wcb-pager .ps .lab{font-weight:600}
.wcb-pager .ps button{min-width:34px;height:32px;border:1px solid var(--border-2);background:var(--surface);border-radius:8px;cursor:pointer;font-family:var(--mono);font-weight:700;font-size:12.5px;color:var(--ink-2)}
.wcb-pager .ps button.on{background:var(--green-700);color:#fff;border-color:var(--green-700)}
.wcb-pager .pg{display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.wcb-pager .pg button{min-width:36px;height:36px;border:1px solid var(--border-2);background:var(--surface);border-radius:9px;cursor:pointer;font-family:var(--thai);font-weight:700;font-size:13.5px;color:var(--ink-2)}
.wcb-pager .pg button[aria-current="true"]{background:var(--green-700);color:#fff;border-color:var(--green-700)}
.wcb-pager .pg button:disabled{opacity:.4;cursor:default}
.wcb-pager .gap{color:var(--ink-3)}

/* ============================================================
   CARDS  (BrokerIdentity · BrokerCard · ContentCard)
   ============================================================ */
/* BrokerIdentity — shared logo + name atom */
.wcb-bid{display:flex;align-items:center;gap:11px;min-width:0}
.wcb-bid-logo{width:42px;height:42px;border-radius:11px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:12px;flex:none;position:relative;overflow:hidden;background:var(--bk,#2A6B4F)}
.wcb-bid-logo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:7px;background:#fff}
.wcb-bid-nm{font-family:var(--serif);font-weight:700;font-size:16px;color:var(--green-900)}
.wcb-bid-sub{font-size:11.5px;color:var(--ink-3)}

/* BrokerCard — affiliate broker strip (dark section) */
.wcb-bstrip{background:var(--green-900);color:#fff;padding:48px 0}
.wcb-bstrip h3{font-family:var(--serif);font-size:26px;color:#fff;text-align:center}
.wcb-bstrip .bsub{text-align:center;color:rgba(255,255,255,.66);font-size:14px;margin:8px auto 24px;max-width:50ch}
.wcb-bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1180px;margin:0 auto;padding:0 20px}
.wcb-bcard{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:var(--r);padding:18px}
.wcb-bcard .bc-top{display:flex;align-items:center;gap:11px;margin-bottom:12px}
.wcb-bcard .bc-logo{width:42px;height:42px;border-radius:11px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:13px;flex:none}
.wcb-bcard .bc-name{font-family:var(--serif);font-weight:700;font-size:16px;color:#fff}
.wcb-bcard .bc-stars{font-size:12px;color:var(--gold-bright);margin-top:2px}
.wcb-bcard .bc-feat{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.wcb-bcard .bc-feat span{font-size:11px;color:rgba(255,255,255,.8);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);padding:3px 9px;border-radius:var(--pill)}
.wcb-bcard .bc-btns{display:flex;gap:8px}.wcb-bcard .bc-btns .btn{flex:1}
.wcb-bstrip .disc-note{text-align:center;font-size:11.5px;color:rgba(255,255,255,.5);margin:20px auto 0;max-width:1180px;padding:0 20px;line-height:1.6}

/* ContentCard — related article / news card */
/* .wcb-related — canonical wrapper for the "อ่านต่อ / เรื่องที่เกี่ยวข้อง" section
   (replaces the repeated inline: padding:32px 0 8px;border-top;margin-top:34px) */
.wcb-related{padding:0 0 40px;margin:0;border:0}
.wcb-cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.wcb-ccard{background:var(--surface);border:1px solid rgba(201,162,39,.28);border-radius:var(--r);overflow:hidden;cursor:pointer;box-shadow:var(--shadow);display:block}
.wcb-ccard:hover{border-color:var(--gold);transform:translateY(-3px);transition:.2s}
.wcb-ccard .thumb{height:96px;background:linear-gradient(135deg,var(--green-700),var(--green-900));position:relative;display:flex;align-items:flex-end;padding:10px}
.wcb-ccard .thumb .cat{background:var(--gold);color:var(--green-900);font-size:11px;font-weight:700;padding:3px 9px;border-radius:var(--pill)}
.wcb-ccard .cbody{padding:13px 15px}
.wcb-ccard .ct{font-family:var(--serif);font-weight:700;font-size:15px;color:var(--green-900);line-height:1.3;margin-bottom:8px}
.wcb-ccard .cm{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink-3)}
.wcb-ccard .cm .hot{color:var(--breaking);font-weight:700}
@media(max-width:980px){.wcb-bgrid,.wcb-cgrid{grid-template-columns:1fr}}

/* ===== toast ===== */
.wcb-toast-wrap{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:70;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;width:max-content;max-width:90vw}
.wcb-toast{background:var(--green-900);color:#fff;font-size:12.5px;font-weight:600;padding:11px 18px;border-radius:var(--pill);box-shadow:var(--shadow-lg);opacity:0;transform:translateY(8px);transition:.2s;text-align:center}
.wcb-toast.show{opacity:1;transform:none}

/* ============================================================
   REAL-TIME TESTING SET  (เปรียบเทียบ: Spread · EA · Slippage)
   Shared layout for wcb-compare-*.html — one template, three pages.
   ============================================================ */
/* section banner — dark hero-bg strip with title + EN subtitle (compare-* pages) */
.cmp-banner{display:flex;align-items:center;gap:13px;background:var(--hero-bg);border:1px solid rgba(201,162,39,.28);border-radius:var(--r-lg);padding:18px 22px;margin-bottom:16px;box-shadow:var(--shadow)}
.cmp-banner .ic{font-size:22px;flex:none;line-height:1}
.cmp-banner h2{font-family:var(--serif);font-weight:800;font-size:clamp(17px,2.5vw,22px);color:#fff;line-height:1.3}
.cmp-banner .en{color:var(--gold-bright);font-weight:600;font-size:.82em;white-space:nowrap}
/* section padding + divider (compare-* pages): chart/why/links/method */
.sec-chart,.sec-why,.sec-links,.sec-method{padding:0 0 40px}
.sec-why,.sec-method{border-top:1px solid var(--border);margin-top:0;padding-top:32px}
/* LIVE badge — pulsing green dot + "อัปเดตล่าสุด" (on the dark hero) */
.rtt-live{display:inline-flex;align-items:center;gap:8px;background:rgba(42,125,84,.18);border:1px solid rgba(127,201,166,.5);color:#CFEFDD;font-size:12.5px;font-weight:700;padding:5px 12px;border-radius:var(--pill);white-space:nowrap}
.rtt-live .dot{width:9px;height:9px;border-radius:50%;background:#57D08A;box-shadow:none;animation:rttPulse 1.8s infinite}
.rtt-live b{color:#fff;font-weight:700}
@keyframes rttPulse{0%{box-shadow:none}70%{box-shadow:none}100%{box-shadow:none}}
@media(prefers-reduced-motion:reduce){.rtt-live .dot{animation:none}}
.rtt-heroline{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rtt-heroline .sub{color:rgba(255,255,255,.8);font-size:15px;max-width:56ch}
/* trust strip in hero */
.rtt-trust{display:flex;gap:10px 22px;flex-wrap:wrap;font-size:12.5px;color:rgba(255,255,255,.62)}
.rtt-trust .t{display:inline-flex;align-items:center;gap:7px}
.rtt-trust .t b{color:#fff;font-weight:600}
.rtt-trust .t svg{width:15px;height:15px;stroke:var(--gold-bright);fill:none;stroke-width:2;flex:none}

/* tab set — Spread · EA · Slippage (sticky under header) */
.rtt-tabsbar{background:var(--surface);border-bottom:1px solid var(--border);position:static}
.rtt-tabs{max-width:1180px;margin:0 auto;padding:0 20px;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.rtt-tabs::-webkit-scrollbar{display:none}
.rtt-tab{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;padding:14px 16px;font-family:var(--thai);font-weight:700;font-size:14px;color:var(--ink-3);border-bottom:3px solid transparent;text-decoration:none;white-space:nowrap;min-height:var(--tap)}
.rtt-tab:hover{color:var(--green-900)}
.rtt-tab .ic{font-size:16px}
.rtt-tab.on{color:var(--green-900);border-bottom-color:var(--gold)}
.rtt-tab .kicker{font-size:10.5px;font-weight:600;color:var(--ink-3);background:var(--cream-2);border:1px solid var(--border);border-radius:var(--pill);padding:1px 7px}

/* section B — explainer + summary + hook + methodology accordion */
main.rtt{padding:32px 0 8px}
.rtt-intro{display:flex;gap:14px;align-items:flex-start;background:var(--gold-soft);border:1px solid #ecd9a8;border-radius:var(--r);padding:16px 18px;margin-bottom:16px}
.rtt-intro .ii{font-size:22px;flex:none;line-height:1.2}
.rtt-intro p{font-size:14px;color:var(--ink-2)}.rtt-intro p b{color:var(--ink)}
.rtt-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}
.rtt-summary>div{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:13px 14px;text-align:center}
.rtt-summary span{display:block;font-size:11.5px;color:var(--ink-3);font-weight:600;margin-bottom:5px}
.rtt-summary b{font-family:var(--mono);font-size:20px;color:var(--green-900);font-variant-numeric:tabular-nums}
.rtt-summary b.lo{color:var(--recv)}.rtt-summary b.hi{color:var(--pay)}
/* compare-spread/compare-ea only have 3 summary cards now — fill the row instead of reserving a 4th empty column */
[data-page="compare-spread"] .rtt-summary,[data-page="compare-ea"] .rtt-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
.rtt-hook{display:flex;align-items:center;gap:10px;background:var(--cream-2);border:1px solid var(--border);border-left:4px solid var(--gold);border-radius:var(--r);padding:12px 16px;font-size:14px;color:var(--ink);font-weight:600;margin-bottom:16px}
.rtt-hook .z{font-size:18px;flex:none}.rtt-hook b{color:var(--pay)}
.rtt-acc{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);margin-bottom:18px;overflow:hidden}
.rtt-acc>summary{list-style:none;cursor:pointer;padding:14px 18px;font-weight:700;font-size:14px;color:var(--green-900);display:flex;align-items:center;gap:9px;min-height:var(--tap)}
.rtt-acc>summary::-webkit-details-marker{display:none}
.rtt-acc>summary .tw{margin-left:auto;transition:transform .2s;color:var(--ink-3)}
.rtt-acc[open]>summary .tw{transform:rotate(90deg)}
.rtt-acc .body{padding:0 18px 18px;font-size:13.5px;color:var(--ink-2);line-height:1.7}
.rtt-acc .body b{color:var(--ink)}
.rtt-acc .body ul{margin:6px 0 0;padding-left:20px}.rtt-acc .body li{margin:3px 0}

/* controls — filter chips (left) separate from sort (right) */

.rtt-fchips{display:flex;gap:7px;flex-wrap:wrap}


.rtt-sortbox{margin-left:auto;display:flex;align-items:center;gap:9px}
.rtt-sortbox .lbl{font-size:12.5px;color:var(--ink-3);font-weight:600}
/* --- mobile table filter (Figma 681:7232): filter chips scroll in one row · sort → full-width dropdown --- */
@media(max-width:640px){
  .rtt-controls{flex-direction:column;align-items:stretch;gap:10px}
  /* filter chips → mobile <select> (injected by wcb-components.js), same as the ranking pages */
  .rtt-controls .rtt-fchips{display:none}
  .rtt-controls .chips-mob{display:block;width:100%;flex:0 0 auto}
  .rtt-sortbox{margin-left:0;width:100%}
  .rtt-sortbox .lbl{display:none}                 /* drop "เรียงตาม" so the select spans edge-to-edge */
  .rtt-sortbox .rtt-select{flex:1 1 0;min-width:0}
}
/* .rtt-select → generalized dropdown (see .wcb-select group above) */
.rtt-showing{font-size:12px;color:var(--ink-3);margin:0 0 14px}.rtt-showing b{color:var(--green-900);font-weight:700}

/* main table — responsive: table on desktop, card list on mobile */
/* compare table → shared .wcb-table chrome; .rtt-tbl modifier keeps right-align cells + per-page columns */
.rtt-tbl{font-size:13.5px}
.rtt-tbl .wcb-thead{font-size:12px;white-space:nowrap}
.rtt-tbl .wcb-thead>*{text-align:right}
.rtt-tbl .wcb-thead .l{text-align:left;padding-left:60px}
.rtt-tbl .wcb-thead>*:first-child{text-align:center}
.rtt-tbl .wcb-row>*{text-align:right}
.rtt-tbl .wcb-row>*:first-child{text-align:center}
.rtt-help{display:inline-grid;place-items:center;width:15px;height:15px;border-radius:50%;background:var(--cream-2);border:1px solid var(--border-2);color:var(--ink-3);font-size:10px;font-weight:800;cursor:help;margin-left:4px;vertical-align:middle}
[data-page="compare-spread"] .eyebrow,[data-page="compare-ea"] .eyebrow,[data-page="compare-slippage"] .eyebrow,[data-page="compare-chart"] .eyebrow{color:#e8c457}
[data-page="compare-spread"] .wcb-thead,[data-page="compare-spread"] .wcb-row{grid-template-columns:30px 290px 150px 150px 68px 300px;gap:24px;padding-left:16px;padding-right:16px}
[data-page="compare-ea"] .wcb-thead,[data-page="compare-ea"] .wcb-row{grid-template-columns:30px minmax(110px,1.2fr) 90px 90px 90px 90px 80px 200px;padding-left:16px;padding-right:16px}
[data-page="compare-ea"] .rtt-tbl .wcb-thead .l{padding-left:0}
[data-page="compare-spread"] .rtt-tbl .wcb-thead .l{padding-left:0}
[data-page="compare-spread"] .rtt-tbl .wcb-thead .rtt-c-info{text-align:center}
/* CTA cell: broker names here (e.g. "Traders Trust", "Fusion Markets") make the review-button label
   longer than compare-spread's — let the button group shrink within its column instead of overflowing
   it (the ellipsis on .rv-t already exists for exactly this, it just wasn't reachable because
   .rtt-review was locked to a rigid 150px and .bacts never filled/clipped to its cell). This table has
   8 columns total, so it also switches to the card layout at a wider breakpoint (1024px, see below)
   than the other compare-* tables (760px) — 8 columns of real data just can't be squeezed
   past a phone/small-tablet width without becoming unreadable. */
[data-page="compare-ea"] .rtt-c-cta .bacts{display:flex;width:100%}
[data-page="compare-ea"] .rtt-c-cta .btn-gold{flex:0 0 auto}
[data-page="compare-ea"] .rtt-c-cta .rtt-review{flex:1 1 0;width:auto;min-width:56px}
[data-page="compare-ea"] .rtt-mobile-more{display:none}
@media(max-width:1024px){
  [data-page="compare-ea"] .rtt-tbl .wcb-thead{display:none}
  [data-page="compare-ea"] .rtt-tbl{border:none;border-radius:0;background:none}
  [data-page="compare-ea"] .rtt-tbl .wcb-tbody{display:flex;flex-direction:column;gap:12px}
  [data-page="compare-ea"] .rtt-tbl .wcb-row{display:block;position:relative;background:#fff;border:1px solid #e6ede7;border-radius:12px;box-shadow:none;padding:13px 16px 14px}
  [data-page="compare-ea"] .rtt-tbl .wcb-row.top1{border-color:var(--gold);background:#f6edd2}
  [data-page="compare-ea"] .rtt-tbl .wcb-row>*{background:none;border:none;border-top:1px dashed #e6ede7;border-radius:0;padding:9px 0;text-align:right;display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0}
  [data-page="compare-ea"] .rtt-tbl .wcb-row>*::before{content:attr(data-label);font-size:12.5px;color:var(--ink-2);font-weight:600;text-align:left;flex:none}
  [data-page="compare-ea"] .rtt-tbl .wcb-row>*>*:last-child{min-width:0;text-align:right}
  [data-page="compare-ea"] .rtt-tbl .wcb-row>*:first-child{position:absolute;top:13px;left:14px;padding:0;margin:0;width:auto;border-top:none}
  [data-page="compare-ea"] .rtt-tbl .wcb-row>*:first-child::before{display:none}
  [data-page="compare-ea"] .rtt-tbl .rtt-rank{display:grid;place-items:center;width:26px;height:26px;border-radius:9px;background:#8c968c;color:#fff;font-family:var(--serif);font-weight:800;font-size:14px;line-height:1}
  [data-page="compare-ea"] .rtt-tbl .wcb-row.top1 .rtt-rank{background:var(--gold)}
  [data-page="compare-ea"] .rtt-tbl .rtt-c-broker{border-top:none;padding:0 0 2px 36px;min-height:26px}
  [data-page="compare-ea"] .rtt-tbl .rtt-c-broker::before{display:none}
  [data-page="compare-ea"] .rtt-tbl .rtt-metric{align-items:flex-end;flex:1;min-width:0}
  [data-page="compare-ea"] .rtt-tbl .rtt-c-cta{border-top:none;padding-top:12px}
  [data-page="compare-ea"] .rtt-tbl .rtt-c-cta::before{display:none}
  [data-page="compare-ea"] .rtt-tbl .rtt-c-cta .bacts{display:flex;flex-direction:column;gap:6px;width:100%}
  [data-page="compare-ea"] .rtt-tbl .rtt-c-cta .bacts .btn{flex:none;width:100%;max-width:none;min-height:44px;height:auto;font-size:14px}
  [data-page="compare-ea"] .rtt-tbl .rtt-c-cta .rtt-review{border-color:var(--gold);color:var(--gold)}
  [data-page="compare-ea"] .rtt-mobile-more{display:flex;justify-content:center;margin:16px 0 4px}
  [data-page="compare-ea"] .rtt-mobile-more[hidden]{display:none}
  [data-page="compare-ea"] .rtt-mobile-more .btn{width:min(100%,360px);min-height:44px;border-color:var(--gold);color:var(--gold-deep);background:#fff}
}
[data-page="compare-slippage"] .wcb-thead,[data-page="compare-slippage"] .wcb-row{grid-template-columns:30px minmax(120px,1.2fr) 112px 88px 110px 132px 104px 245px}
[data-page="compare-slippage"] .rtt-tbl .wcb-thead .l{padding-left:0}
.rtt-rank{font-family:var(--mono);font-weight:800;font-size:16px;color:var(--ink-3)}
.rtt-tbl tr.top1 .rtt-rank,.rtt-tbl tr.top2 .rtt-rank,.rtt-tbl tr.top3 .rtt-rank{color:var(--gold-deep)}
.rtt-rank .medal{display:block;font-size:12px;line-height:1}
/* broker cell */
.rtt-bk{display:flex;align-items:center;gap:10px}
.rtt-bk .logo{width:38px;height:38px;border-radius:10px;background:var(--bk,#333);color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:11px;flex:none}
.rtt-bk .nm{display:flex;flex-direction:column;gap:3px;min-width:0;align-items:flex-start}
.rtt-bk .nm b{font-family:var(--serif);font-size:15px;color:var(--green-900);line-height:1.15}
.rtt-bk .acct{font-size:10.5px;color:var(--ink-3);background:var(--cream-2);border:1px solid var(--border);padding:1px 7px;border-radius:var(--pill)}
/* hero metric cell (cost / return / slippage) */
.rtt-metric{display:inline-flex;flex-direction:column;align-items:flex-end;gap:6px;min-width:120px}
.rtt-metric .v{font-family:var(--mono);font-weight:800;font-size:19px;color:var(--green-900);font-variant-numeric:tabular-nums;white-space:nowrap}
.rtt-metric .v small{font-size:11px;font-weight:600;color:var(--ink-3)}
.rtt-metric .v.good{color:var(--recv)}.rtt-metric .v.bad{color:var(--pay)}
.rtt-bar{width:100%;height:7px;border-radius:99px;background:var(--cream-2);overflow:hidden}
.rtt-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--gold-deep),var(--gold),var(--gold-bright));width:0;transition:width .9s cubic-bezier(.2,.7,.2,1)}
.rtt-bar.good i{background:linear-gradient(90deg,#1d8a5e,#2A7D54)}
.rtt-bar.bad i{background:linear-gradient(90deg,#d9584a,#B42318)}
.rtt-num{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink)}
.rtt-num.good{color:var(--recv)}.rtt-num.bad{color:var(--pay)}
.rtt-pill{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:3px 10px;border-radius:var(--pill);white-space:nowrap}
.rtt-pill.good{background:var(--up-soft);color:var(--recv)}
.rtt-pill.warn{background:var(--gold-soft);color:var(--gold-deep)}
.rtt-pill.bad{background:var(--down-soft);color:var(--pay)}
.rtt-c-cta{white-space:nowrap}
.rtt-c-cta .bacts{display:inline-flex;gap:7px;justify-content:flex-end}
/* review button carries the broker name; fixed width + truncate so all rows align */
.rtt-c-cta .bacts .rv-btn{width:138px;max-width:138px;flex:none}
.rtt-c-cta .bacts .rv-btn .rv-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rtt-updated{font-size:11.5px;color:var(--ink-3);font-variant-numeric:tabular-nums}

/* Section D — Top-10 comparison bar chart */
.rtt-chart{display:grid;gap:9px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:20px 22px}
.rtt-chart .cr{display:grid;grid-template-columns:130px 1fr 78px;align-items:center;gap:14px}
.rtt-chart .cl{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:7px}
.rtt-chart .cl .r{font-family:var(--mono);color:var(--ink-3);font-size:12px}
.rtt-chart .ct{height:22px;border-radius:6px;background:var(--cream-2);overflow:hidden}
.rtt-chart .ct i{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,var(--gold-deep),var(--gold));width:0;transition:width 1s cubic-bezier(.2,.7,.2,1)}
.rtt-chart .ct.good i{background:linear-gradient(90deg,#1d8a5e,#2A7D54)}
.rtt-chart .ct.bad i{background:linear-gradient(90deg,#d9584a,#B42318)}
.rtt-chart .cv{font-family:var(--mono);font-weight:800;font-size:14px;color:var(--green-900);text-align:right;font-variant-numeric:tabular-nums}

/* Section E — why results differ (icon cards) */
.rtt-why{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rtt-why-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:22px;box-shadow:var(--shadow)}
.rtt-why-card .wi{width:44px;height:44px;border-radius:12px;background:var(--gold-soft);color:var(--gold-deep);display:grid;place-items:center;font-size:22px;margin-bottom:13px}
.rtt-why-card h3{font-family:var(--serif);font-size:18px;color:var(--green-900);margin-bottom:8px}
.rtt-why-card p{font-size:13.5px;color:var(--ink-2)}.rtt-why-card p b{color:var(--ink)}

@media(max-width:920px){
  .rtt-summary{grid-template-columns:repeat(2,1fr)}
  [data-page="compare-spread"] .rtt-summary,[data-page="compare-ea"] .rtt-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .rtt-why{grid-template-columns:1fr}
}
@media(max-width:1024px){
  /* grid table -> card list (data-label rows) */
  .rtt-tbl .wcb-thead{display:none}
  .rtt-tbl{border:none;border-radius:0;background:none}
  .rtt-tbl .wcb-tbody{display:flex;flex-direction:column;gap:12px}
  .rtt-tbl .wcb-row{display:block;position:relative;background:#fff;border:1px solid #e6ede7;border-radius:12px;box-shadow:none;padding:13px 16px 14px}
  .rtt-tbl .wcb-row.top1{border-color:var(--gold);background:#f6edd2}
  .rtt-tbl .wcb-row>*{background:none;border:none;border-top:1px dashed #e6ede7;border-radius:0;padding:9px 0;text-align:right;display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0}
  .rtt-tbl .wcb-row>*::before{content:attr(data-label);font-size:12.5px;color:var(--ink-2);font-weight:600;text-align:left;flex:none}
  .rtt-tbl .wcb-row>*>*:last-child{min-width:0;text-align:right}
  /* rank → badge, top-left of the card header (matches ranking-forex) */
  .rtt-tbl .wcb-row>*:first-child{position:absolute;top:13px;left:14px;padding:0;margin:0;width:auto;border-top:none}
  .rtt-tbl .wcb-row>*:first-child::before{display:none}
  .rtt-tbl .rtt-rank{display:grid;place-items:center;width:26px;height:26px;border-radius:9px;background:#8c968c;color:#fff;font-family:var(--serif);font-weight:800;font-size:14px;line-height:1}
  .rtt-tbl .wcb-row.top1 .rtt-rank{background:var(--gold)}
  .rtt-tbl .rtt-c-broker{border-top:none;padding:0 0 2px 36px;min-height:26px}
  .rtt-tbl .rtt-c-broker::before{display:none}
  .rtt-tbl .rtt-metric{align-items:flex-end;flex:1;min-width:0}
  /* CTA → stacked full-width gold + outline-gold review (matches ranking-forex) */
  .rtt-tbl .rtt-c-cta{border-top:none;padding-top:12px}
  .rtt-tbl .rtt-c-cta::before{display:none}
  .rtt-tbl .rtt-c-cta .bacts{display:flex;flex-direction:column;gap:6px;width:100%}
  .rtt-tbl .rtt-c-cta .bacts .btn{flex:none;width:100%;max-width:none;min-height:44px;height:auto;font-size:14px}
  .rtt-tbl .rtt-c-cta .rtt-review{border-color:var(--gold);color:var(--gold)}
  .rtt-chart .cr{grid-template-columns:96px 1fr 62px;gap:10px}
  .rtt-chart{padding:16px}
}

/* ============================================================
   GOLD BROKERS SECTION  (data-wcb="gold-brokers")
   Brokers that trade XAU/USD — shared across asset + analysis pages.
   All rules scoped under .wcb-gbrk to avoid collisions with page CSS.
   ============================================================ */
.wcb-gbrk{padding:32px 0}
.wcb-gbrk .brk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.wcb-gbrk .bcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;position:relative}
.wcb-gbrk .bcard.feat{border-color:var(--gold);box-shadow:none}
.wcb-gbrk .bcard .rk{position:absolute;top:-10px;left:16px;background:var(--green-900);color:#fff;font-family:var(--mono);font-weight:800;font-size:11px;padding:3px 9px;border-radius:var(--pill)}
.wcb-gbrk .bcard.feat .rk{background:var(--gold);color:var(--green-900)}
.wcb-gbrk .bcard .bh{display:flex;align-items:center;gap:11px;margin-bottom:12px;margin-top:4px}
.wcb-gbrk .blogo{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;color:#fff;font-family:var(--serif);font-weight:800;font-size:13px;flex:none}
.wcb-gbrk .bcard .bn{font-family:var(--serif);font-weight:700;font-size:17px;color:var(--green-900)}
.wcb-gbrk .bcard .sc{margin-left:auto;text-align:center;background:var(--gold-soft);border:1px solid #ecd9a8;border-radius:10px;padding:4px 10px}
.wcb-gbrk .bcard .sc .v{font-family:var(--mono);font-weight:800;font-size:17px;color:var(--gold-deep);line-height:1}
.wcb-gbrk .bcard .sc .l{font-size:9.5px;color:var(--ink-3);font-weight:600}
.wcb-gbrk .bspecs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:13px}
.wcb-gbrk .bspec{background:var(--cream-2);border-radius:9px;padding:8px 10px}
.wcb-gbrk .bspec .l{font-size:10.5px;color:var(--ink-3);font-weight:600}
.wcb-gbrk .bspec .v{font-size:12.5px;font-weight:700;color:var(--ink);margin-top:1px}
.wcb-gbrk .bspec .v.mono{font-family:var(--mono)}
.wcb-gbrk .lic-spec{position:relative}
.wcb-gbrk .lic-spec .v{display:flex;align-items:center;gap:6px}
.wcb-gbrk .lic-info{width:40px;height:40px;flex:none;border:none;background:none;padding:0;cursor:pointer;color:var(--green-700);display:inline-grid;place-items:center;border-radius:9px}
.wcb-gbrk .lic-info svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.wcb-gbrk .lic-info:hover{color:var(--gold-deep)}
.wcb-gbrk .lic-pop{position:absolute;top:calc(100% + 7px);left:0;z-index:30;min-width:160px;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:none;padding:11px 13px;display:none}
.wcb-gbrk .lic-pop.open{display:block}
.wcb-gbrk .lic-pop::before{content:"";position:absolute;top:-6px;left:14px;width:11px;height:11px;background:var(--surface);border-left:1px solid var(--border);border-top:1px solid var(--border);transform:rotate(45deg)}
.wcb-gbrk .lic-pop-h{font-size:10.5px;color:var(--ink-3);font-weight:700;margin-bottom:8px}
.wcb-gbrk .lic-chips{display:flex;gap:5px;flex-wrap:wrap}
.wcb-gbrk .lic-chips span{font-size:10.5px;font-weight:700;color:var(--green-700);background:var(--up-soft);border:1px solid #c5e2d2;padding:2px 7px;border-radius:6px}
.wcb-gbrk .bacts{display:flex;gap:8px;margin-top:auto}
.wcb-gbrk .bacts .btn{flex:1}
[data-page="analysis-pair"] .wcb-gbrk .bacts{flex-direction:column}
[data-page="analysis-pair"] .wcb-gbrk .bacts .btn{flex:none;width:100%}
.wcb-gbrk .cta-mini{font-size:10.5px;color:var(--ink-3);margin-top:9px;display:flex;gap:5px;align-items:flex-start;line-height:1.4}
.wcb-gbrk .cta-mini svg{width:13px;height:13px;flex:none;margin-top:1px;stroke:currentColor;fill:none;stroke-width:2}
@media(max-width:980px){.wcb-gbrk .brk-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.wcb-gbrk .brk-grid{grid-template-columns:1fr}}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1200px){
  .wcb-nav{display:none}
  .wcb-burger{display:flex}
  .wcb-world{display:none}
}
@media(max-width:980px){
  /* tablet: brand column stacks on top, link grid stays 4×2 (matches Figma) */
  .wcb-foot-top{grid-template-columns:1fr;gap:26px}
}
@media(max-width:760px){
  .wcb-world .lbl{display:none}
  .wcb-world{padding:0 10px}
  /* tablet portrait: 2 roomy columns before collapsing to accordions */
  .wcb-foot-cols{grid-template-columns:1fr 1fr;gap:20px}
}
@media(max-width:620px){
  .wcb-bt .w{font-size:17px}
  .wcb-logo-img{height:30px}
  .wcb-seal{height:30px}.wcb-seal svg{height:30px;width:auto}
  /* mobile: each section becomes a tap-to-expand accordion row */
  .wcb-foot-cols{grid-template-columns:1fr;gap:0}
  .wcb-foot-cols .fcol{border-top:1px solid rgba(255,255,255,.12)}
  .wcb-foot .fcol-h{cursor:pointer;margin:0;padding:14px 2px;font-size:15px}
  .wcb-foot .fcol-chev{display:block}
  .wcb-foot .fcol.open .fcol-chev{transform:rotate(180deg)}
  .wcb-foot .fcol-panel{display:none;padding:0 2px 12px}
  .wcb-foot .fcol.open .fcol-panel{display:block}
  .wcb-foot .fcol-flat h4{margin:0}
  .wcb-foot .fcol-flat h4 a{display:flex;align-items:center;min-height:24px;padding:14px 2px;font-size:15px} /* match mobile .fcol-h size */
  .wcb-foot a.fl{padding:7px 0}
}

/* COMMENTS component: hoisted from 8 pages' inline styles */
.cmt-band .cmt-wrap{max-width:760px;margin:0 auto;padding:0 20px}
.cmt-head h2{font-family:var(--serif);font-size:clamp(22px,3vw,28px);color:var(--green-900)}
.cmt-head .cmt-count{font-size:16px;color:var(--ink-3);font-weight:400}
.cmt-sub{font-size:13.5px;color:var(--ink-2);margin:6px 0 18px}
.cmt-sub b{color:var(--ink)}
.cmt-compose{margin-bottom:18px}
.cmt-gate{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:15px 18px}
.cmt-gate svg{width:22px;height:22px;stroke:var(--gold-deep);fill:none;stroke-width:1.8;flex:none}
.cmt-gate span{font-size:14px;color:var(--ink-2);font-weight:600;flex:1;min-width:150px}
.cmt-editor{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px;box-shadow:var(--shadow)}
.cmt-editor textarea{width:100%;box-sizing:border-box;border:1px solid var(--border-2);border-radius:10px;padding:11px 13px;font-family:var(--thai);font-size:14.5px;resize:vertical;min-height:74px;color:var(--ink)}
.cmt-editor textarea:focus{outline:none;border-color:var(--gold-deep)}
.cmt-tools{display:flex;align-items:center;gap:10px;margin-top:11px;flex-wrap:wrap}
.cmt-hint{font-size:12px;color:var(--ink-3);flex:1;min-width:120px}
.cmt-warn{display:flex;gap:10px;align-items:flex-start;background:var(--gold-soft);border:1px solid #ecd9a8;border-radius:12px;padding:13px 16px;font-size:13.5px;color:var(--gold-deep);font-weight:600}
.cmt-warn svg{width:18px;height:18px;stroke:var(--gold-deep);fill:none;stroke-width:2;flex:none;margin-top:1px}
.cmt-list{display:grid;gap:12px}
.cmt-item{display:flex;gap:12px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:14px 16px}
.cmt-item.cmt-mine{border-color:var(--gold);box-shadow:none}
.cmt-av{width:38px;height:38px;border-radius:50%;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:14px;flex:none}
.cmt-b{flex:1;min-width:0}
.cmt-meta{display:flex;align-items:center;gap:8px;margin-bottom:4px;flex-wrap:wrap}
.cmt-name{font-weight:700;font-size:13.5px;color:var(--ink)}
.cmt-you{font-size:11px;font-weight:700;color:#fff;background:var(--green-700);padding:1px 8px;border-radius:99px}
.cmt-yr{font-size:11px;font-weight:600;color:var(--green-700);background:var(--cream);border:1px solid var(--border);padding:1px 8px;border-radius:99px}
.cmt-time{font-size:11.5px;color:var(--ink-3)}
.cmt-text{font-size:14px;color:var(--ink-2)}
.cmt-band [hidden]{display:none!important}
.cmt-band{background:var(--canvas);border-top:1px solid var(--border);padding:48px 0}
.cmt{background:#fff;border-radius:12px;box-shadow:var(--shadow);padding:16px;display:flex;gap:12px}
.cmt .av{width:40px;height:40px;border-radius:10px;flex:0 0 40px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:14px;position:relative}
.cmt .av .badge{position:absolute;right:-4px;bottom:-4px;width:18px;height:18px;border-radius:var(--pill);border:2px solid #fff;display:grid;place-items:center;font-size:8px;font-weight:900;color:#fff}
.cmt .b{flex:1;min-width:0}
.cmt .camp{font-size:11px;color:var(--ink-2)}
.cmt .camp b{font-weight:800}
.cmt .clike{display:inline-flex;align-items:center;gap:5px;background:none;border:none;cursor:pointer;color:var(--ink-2);font-size:11px;font-weight:700;font-family:var(--thai);min-height:40px;padding:0 6px}
.cmt .clike svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2}
.cmt .clike.on{color:var(--rose-cta)}
.cmt .clike.on svg{fill:currentColor}
.cmt .creply{display:inline-flex;align-items:center;gap:5px;background:none;border:none;cursor:pointer;color:var(--ink-2);font-size:11px;font-weight:700;font-family:var(--thai);min-height:40px;padding:0 6px}
.cmt .creply svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2}
.cmt .crow{display:flex;gap:16px;margin-top:8px}
.cmt .txt{font-size:13.5px;margin-top:6px;line-height:1.55;overflow-wrap:anywhere}
.cmt .who{font-weight:800;font-size:14px}

/* ns component: hoisted duplicated rules into shared wcb.css */
.ns-col h4{font-size:11px;font-weight:800;letter-spacing:.4px;color:var(--ink-2);margin-bottom:8px;text-transform:uppercase}
.ns-card{background:#fff;border:1px solid var(--border);border-radius:10px;padding:11px}
.ns-card .src{font-size:11px;font-weight:700;color:var(--ink-3);display:flex;align-items:center;gap:5px}
.ns-card .hl{font-weight:700;font-size:13px;margin-top:4px;line-height:1.35}
.ns-card .sub{font-size:12px;color:var(--ink-2);margin-top:3px;line-height:1.45}
.ns-card .tm{font-size:11px;color:var(--ink-3);margin-top:7px}
.ns-social{display:flex;gap:9px}
.ns-social .av{width:28px;height:28px;border-radius:50%;flex:0 0 28px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:11px}
.ns-social .who{font-size:12px;font-weight:800}
.ns-social .handle{font-size:11px;color:var(--ink-3)}
.ns-social .q{font-size:12px;margin-top:3px;line-height:1.4}
.ns-meta{font-size:12px;color:var(--ink-2);line-height:1.7}
.ns-meta b{color:var(--ink)}
.ns-related{margin-top:9px;display:flex;flex-direction:column;gap:5px}
.ns-related .r{display:flex;justify-content:space-between;gap:10px;font-size:11.5px;color:var(--ink-3);border-top:1px dashed var(--border);padding-top:5px}
.ns-related .r b{color:var(--ink);font-weight:600}
.ns-body{display:none;border-top:1px solid var(--border);background:var(--cream-2);padding:14px 16px}

/* composer component: hoisted duplicated rules into shared wcb.css */
.composer{background:#fff;border-radius:12px;box-shadow:var(--shadow);padding:16px;display:flex;gap:12px}
.composer .av{width:40px;height:40px;border-radius:10px;flex:0 0 40px;display:grid;place-items:center;background:var(--gold);color:var(--green-900);font-weight:800;font-size:14px}
.composer .grow{flex:1;min-width:0}
.composer textarea{width:100%;min-height:54px;resize:vertical;border:1px solid var(--border);border-radius:8px;padding:10px;font-family:var(--thai);font-size:14px;color:var(--ink);background:#fff}
.composer textarea:focus{outline:none;border-color:var(--gold-deep)}
.composer .crow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px}
.composer .hint{font-size:11px;color:var(--ink-2)}
.composer .hint b{color:var(--maroon)}
.composer .post{background:var(--rose-cta);color:#fff;border:none;border-radius:8px;padding:0 18px;height:var(--btn-h-default);font-weight:800;font-size:14px;cursor:pointer;font-family:var(--thai)}
.composer.locked .editor{display:none}
.composer .lock{display:none;align-items:center;justify-content:space-between;gap:12px;width:100%}
.composer.locked .lock{display:flex}
.composer .lock span{font-size:14px;color:var(--ink-2);font-weight:600}

/* rcard component: hoisted duplicated rules into shared wcb.css */
.rcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;position:relative}
.rcard::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:4px;border-radius:0 4px 4px 0;background:var(--bk,var(--green-600));opacity:.5}
.rcard.top1{border-color:var(--gold);box-shadow:none;background:linear-gradient(180deg,#FFFDF6,#fff)}
.rcard.top1 .rank{color:#fff;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;margin:0 auto;font-size:17px}
.rcard.top2 .rank{color:#fff;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;margin:0 auto;font-size:17px}
.rcard.top3 .rank{color:#fff;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;margin:0 auto;font-size:17px}
.rcard.top1 .rank{background:radial-gradient(circle at 35% 30%,var(--gold-bright),var(--gold) 60%,var(--gold-deep))}
.rcard.top2 .rank{background:linear-gradient(135deg,#B9C2C9,#8794A0)}
.rcard.top3 .rank{background:linear-gradient(135deg,#CD9A6A,#A66E3F)}
.rcard.open .nstoggle svg{transform:rotate(180deg)}
.rcard.open .ns-body{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
@media(max-width:980px){
.rcard.open .ns-body{grid-template-columns:1fr}
}

/* (trow medal/hover rules removed — now provided by shared .wcb-table / .wcb-rank) */

/* ============================================================
   .wcb-table — UNIFIED comparison/ranking table (grid-div).
   Every table (ranking, forex, deposit, cheapest, compare) uses this
   chrome. Each page sets only grid-template-columns + mobile areas +
   its own data-cell classes under its [data-page] scope.
   ============================================================ */
.wcb-table{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden}
.wcb-thead,.wcb-row{display:grid;gap:12px;align-items:center;padding:14px 20px}
.wcb-thead{background:#F4F6F3;border-bottom:1px solid var(--border);color:var(--ink-3);font-weight:700;font-size:12.5px;padding:13px 20px}
.wcb-row{border-bottom:1px solid var(--border)}
.wcb-row>*{min-width:0}
.wcb-row:last-child{border-bottom:none}
.wcb-row:hover{background:#F8F8F8}
.wcb-row.top1{background:linear-gradient(90deg,#FFFDF6,#fff)}
/* rank badge + medals (shared across every table) */
.wcb-rank{font-family:var(--serif);font-weight:800;font-size:15px;color:var(--ink-3);width:28px;height:28px;display:grid;place-items:center}
.wcb-row.top1 .wcb-rank,.wcb-row.top2 .wcb-rank,.wcb-row.top3 .wcb-rank{color:#fff;border-radius:8px}
.wcb-row.top1 .wcb-rank{background:radial-gradient(circle at 35% 30%,var(--gold-bright),var(--gold) 60%,var(--gold-deep))}
.wcb-row.top2 .wcb-rank{background:linear-gradient(135deg,#B9C2C9,#8794A0)}
.wcb-row.top3 .wcb-rank{background:linear-gradient(135deg,#CD9A6A,#A66E3F)}

/* vote component: hoisted duplicated rules into shared wcb.css */
.vote-btn{display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:0 16px;border-radius:10px;cursor:pointer;font-family:var(--thai);font-size:13.5px;font-weight:800;border:1.5px solid var(--gold);background:#fff;color:var(--gold-deep)}
.vote-btn:hover{background:var(--gold-soft)}
.vote-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.6}
.vote-btn .vc{font-variant-numeric:tabular-nums}
.vote-btn.voted{background:var(--green-700);color:#fff;border-color:var(--green-700);cursor:default}
.vote-btn.voted svg{fill:#fff}

/* weight component: hoisted duplicated rules into shared wcb.css */
.weight-table{width:100%;border-collapse:collapse;margin:16px 0;background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden}
.weight-table th{background:var(--green-900);color:#fff;text-align:left;padding:10px 12px;font-size:12.5px}
.weight-table td{padding:10px 12px;border-bottom:1px solid var(--border);font-size:13.5px}
.weight-table td:last-child{text-align:left;font-weight:800;color:var(--gold-deep);font-variant-numeric:tabular-nums}

/* t component: hoisted duplicated rules into shared wcb.css */
.t-rank{display:flex;flex-direction:column;align-items:center;gap:3px}
.t-rank .rkn{font-family:var(--serif);font-weight:800;font-size:15px;color:var(--ink-3);width:28px;height:28px;display:grid;place-items:center}
@media(max-width:640px){
.t-brk{grid-area:brk;min-width:0}
.t-cta{grid-area:cta}
}

/* social component: hoisted duplicated rules into shared wcb.css */
.social-ico a{width:34px;height:34px;border-radius:9px;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center}
.social-ico svg{width:17px;height:17px;stroke:#fff;fill:none;stroke-width:1.8}
.social-band{background:#F8F8F8;padding:48px 0}
.social-ico{display:flex;gap:10px;margin-top:14px}

/* pager component: hoisted duplicated rules into shared wcb.css */
.pager{display:flex;gap:6px;align-items:center}
.pager button{min-width:40px;height:40px;border:1px solid var(--border-2);background:#fff;border-radius:9px;cursor:pointer;font-family:var(--thai);font-weight:700;font-size:14px;color:var(--ink-2)}
.pager button[aria-current="true"]{background:var(--green-700);color:#fff;border-color:var(--green-700)}
.pager button:disabled{opacity:.4;cursor:default}

/* slogin component: hoisted duplicated rules into shared wcb.css */
.slogin{display:flex;align-items:center;justify-content:center;gap:10px;min-height:var(--tap);border:1px solid var(--border);background:#fff;border-radius:10px;cursor:pointer;font-family:var(--thai);font-size:14px;font-weight:700;color:var(--ink)}
.slogin:hover{background:var(--cream-2)}
.slogin svg{width:18px;height:18px;flex:0 0 18px}

/* rtt component: hoisted duplicated rules into shared wcb.css */
.rtt-c-cta .bacts{justify-content:flex-end}
.rtt-c-cta .rtt-review{flex:0 0 150px;width:150px;justify-content:center;overflow:hidden}
.rtt-c-cta .rtt-review .rv-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}

/* cfilter component: hoisted duplicated rules into shared wcb.css */
.cfilter{background:#fff;border:1px solid var(--border);border-radius:var(--pill);padding:7px 13px;font-size:12.5px;font-weight:700;cursor:pointer;min-height:36px;display:inline-flex;align-items:center;gap:6px;color:var(--ink);font-family:var(--thai)}
.cfilter .dot{width:8px;height:8px;border-radius:50%}
.cfilter.active{background:var(--green-900);color:#fff;border-color:transparent}

/* ============================================================
   Generalized primitives — 2026-07-04 audit
   Byte-identical inline blocks hoisted from pages. Pages that
   need a size/context tweak keep a small local override (inline
   <style> loads after this file, so page rules win).
   ============================================================ */

/* internal-link chips: deposit / forex / cheapest ranking pages */
.ilinks{display:flex;gap:9px;flex-wrap:wrap}
.ichip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border-2);background:var(--surface);border-radius:var(--pill);padding:9px 15px;font-weight:600;font-size:13px;color:var(--ink-2);cursor:pointer}
.ichip:hover{border-color:var(--gold);color:var(--green-900)}

/* board heading: 4 compare pages (cheapest overrides margin + h2 size locally) */
.board-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:6px 0 12px}
.board-head .title{display:flex;align-items:center;gap:12px}
.board-head .ic{width:40px;height:40px;border-radius:11px;background:var(--gold-soft);color:var(--gold-deep);display:grid;place-items:center;font-size:20px;flex:none}
.board-head h2{font-family:var(--serif);font-size:23px;color:var(--green-900)}
.board-head h2 small{display:block;font-family:var(--thai);font-size:12.5px;color:var(--ink-3);font-weight:400}

/* segmented control: home / ranking (cheapest overrides to a smaller size locally) */
.seg{display:inline-flex;background:var(--cream-2);border:1px solid var(--border-2);border-radius:11px;padding:3px}
.seg button{border:none;background:none;font-family:var(--thai);font-weight:600;font-size:13px;color:var(--ink-2);padding:8px 14px;border-radius:8px;cursor:pointer;min-height:38px}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--green-700);box-shadow:var(--shadow)}

/* stat strip: home / ranking (mobile fine-tuning stays in each page's mobile media block) */
.statbar{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;margin-top:-28px;position:relative;z-index:2;box-shadow:var(--shadow-lg)}
.stat{background:var(--surface);padding:18px 14px;text-align:center}
.stat .v{font-family:var(--serif);font-weight:800;font-size:26px;color:var(--green-900);line-height:1;font-variant-numeric:tabular-nums}
.stat .v .ic{color:var(--gold-deep)}
.stat .k{font-size:12.5px;color:var(--ink-2);margin-top:5px;font-weight:600}
@media(max-width:820px){.statbar{grid-template-columns:1fr 1fr}}
/* NOTE: .topic and .pill deferred — asset vs asset-review diverge too much
   (structural .tx wrapper, ellipsis, size deltas / dark-vs-light context)
   to share safely. Revisit if a third page needs the same card. */

/* ===== wcb-header.css — shared, unscoped ===== */
/* ============================================================
   wcb-header.css — Site header skin: "Gold Hairline Luxe" (variant 17)
   Loads AFTER wcb.css and overrides the shared header only.
   Everything is scoped to .wcb-h17 so nothing else is affected.
   Three tiers: utility bar · brand + login · caps nav (dropdowns kept).
   Header search: #91 Ghost style, centered in the brand row (see wcb-components.js).
   ============================================================ */

/* full-bleed shell: utility strip spans edge-to-edge; each tier caps its own content width */
.wcb-h17 .wcb-topbar-in{max-width:none;padding:0;gap:0}

/* ---- tier 1: brand + login ---- */
.wcb-h17 .wcb-hrow{max-width:1160px;margin:0 auto;width:100%;padding:16px 32px;gap:16px}
.wcb-h17 .wcb-login{height:var(--btn-h-sm);padding:0 22px;border-radius:8px;border:1px solid rgba(255,255,255,.4);background:transparent;color:#fff;font-weight:700;letter-spacing:.3px}
.wcb-h17 .wcb-login:hover{background:rgba(255,255,255,.08);border-color:var(--gold-bright);box-shadow:none}

/* ---- tier 2: caps nav (dropdown / mega-menu preserved, just restyled) ---- */
.wcb-h17 .wcb-pills{max-width:1160px;margin:0 auto;width:100%;padding:0 32px 15px;gap:26px;flex-wrap:wrap}
.wcb-h17 .wcb-pill{position:relative;background:none;border:none;border-radius:0;padding:6px 2px;color:rgba(255,255,255,.78);font-size:12px;font-weight:600;letter-spacing:1px;white-space:nowrap}
.wcb-h17 .wcb-pill:hover{background:none;border:none;color:var(--gold-bright)}
.wcb-h17 .wcb-pill.on{background:none;border:none;color:var(--gold-bright)}
.wcb-h17 .wcb-pill.on::after{content:"";position:absolute;left:2px;right:2px;bottom:-3px;height:0.25px;background:var(--gold-bright)}
/* dropdown trigger: neutralise the pill hover chip from wcb.css so it reads as caps text */
.wcb-h17 .wcb-navitem:hover>.wcb-pill-dd{background:none;border:none;color:var(--gold-bright)}
.wcb-h17 .wcb-pill-dd{gap:6px}
.wcb-h17 .wcb-pill-dd .caret{width:11px;height:11px}

/* ---- responsive ---- */
@media(max-width:1024px){
  .wcb-h17 .wcb-hrow{padding:12px 16px}
}
@media(max-width:640px){
  .wcb-h17 .wcb-hrow{padding:8px 16px}
}

/* ---- header search (#91 Ghost) — faint centered bar in the brand row, all pages ---- */
.wcb-h17 .hs-slot{flex:1 1 auto;display:flex;justify-content:center;min-width:0;padding:0 10px}
.wcb-h17 .hs{display:flex;align-items:center;gap:9px;width:100%;max-width:520px;height:42px;padding:0 14px;border-radius:10px;
  background:none;border:1px solid rgba(255,255,255,.22);transition:border-color .15s,background .15s,box-shadow .15s}
.wcb-h17 .hs:focus-within{border-color:var(--gold-bright);background:rgba(255,255,255,.05);box-shadow:none}
.wcb-h17 .hs svg{width:17px;height:17px;stroke:var(--gold);opacity:.85;fill:none;stroke-width:2;flex:none}
.wcb-h17 .hs input{flex:1;min-width:0;background:none;border:none;outline:none;color:#fff;font-family:var(--thai);font-size:13.5px}
.wcb-h17 .hs input::placeholder{color:#9db3a6}
.wcb-h17 .hs-clr{flex:none;width:18px;height:18px;border:none;background:rgba(255,255,255,.12);border-radius:50%;color:#cfe0d5;cursor:pointer;font-size:11px;line-height:1;display:none;place-items:center}
/* clear (✕) only appears once the field has text */
.wcb-h17 .hs input:not(:placeholder-shown)~.hs-clr{display:grid}
/* hide the header search on tablet/mobile (nav collapses to the drawer there) */
@media(max-width:1024px){ .wcb-h17 .hs-slot{display:none} }

/* ===== wcb-asset.css — shared, unscoped ===== */
/* ===================================================================
   wcb-asset.css - shared styles for every asset page (XAU/USD, AAPL,
   PTT, S&P500...). Extracted verbatim from wcb-asset.html so thin
   per-asset shells + wcb-asset-engine.js can reuse one stylesheet.
   =================================================================== */

/* base html/body/.wrap → wcb.css UNIVERSAL */

.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* cursor cloud */

/* ===== header (WCB shell) ===== */

.btn-login{min-height:40px}

/* ===== buttons ===== */

/* ===== ticker tape ===== */

.tt-item .p{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums}

/* comments band */
.cmt-band{background:var(--cream-2);border-top:1px solid var(--border);padding:48px 0}

/* ===== breadcrumb + hero ===== */
.asset-hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
.asset-hero .glow{position:absolute;width:55vw;height:55vw;right:-16vw;top:-22vw;border-radius:50%;background:none;pointer-events:none;animation:pulse 7s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
.asset-hero-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:18px 20px 26px}
.crumb{font-size:12.5px;color:rgba(255,255,255,.6);margin-bottom:16px;font-weight:500}
.crumb a:hover{color:var(--gold-bright)}.crumb b{color:#fff;font-weight:600}
.htitle{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.pair-ic{width:62px;height:62px;border-radius:16px;display:grid;place-items:center;font-family:var(--mono);font-weight:800;font-size:14px;flex:none;line-height:1.05;text-align:center;background:linear-gradient(135deg,var(--gold-bright),var(--gold) 60%,var(--gold-deep));color:#3a2a00;box-shadow:none}
.htitle h1{font-family:var(--serif);font-weight:800;font-size:clamp(28px,4.4vw,42px);line-height:1.08}
.htitle h1 .th{font-weight:600;font-size:.46em;color:rgba(255,255,255,.62);font-family:var(--thai)}
.htitle .sub{font-size:14px;color:rgba(255,255,255,.72);margin-top:3px;max-width:46ch}
.hprice{margin-left:auto;text-align:right}
.hprice .pv{font-family:var(--mono);font-weight:800;font-size:clamp(30px,5vw,42px);line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.hprice .chg{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-weight:700;font-size:14px;padding:4px 10px;border-radius:8px;margin-top:8px}
.chg.up{color:#6FD39B;background:rgba(111,211,155,.14)}
.chg.down{color:#F0907F;background:rgba(240,144,127,.14)}
.tag-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.pill{font-size:12px;font-weight:600;padding:5px 12px;border-radius:var(--pill);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.85)}
.pill.gold{background:rgba(201,162,39,.18);border-color:rgba(201,162,39,.5);color:var(--gold-bright)}
.pill.dot::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#6FD39B;margin-right:7px;vertical-align:middle;animation:blink 1.7s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}

/* ===== chart card ===== */
.shell{max-width:1180px;margin:0 auto;padding:32px 20px 40px}
.chart-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;margin-top:0;position:relative;z-index:2}
.cc-head{display:flex;align-items:center;gap:16px;padding:16px 20px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.cc-head .lab{font-family:var(--serif);font-weight:700;font-size:16px;color:var(--green-900)}
.cc-head .slot{font-size:11px;color:var(--ink-3);font-weight:600;background:var(--cream-2);border:1px solid var(--border);padding:3px 9px;border-radius:var(--pill)}
.cc-tools{margin-left:auto;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.tf,.mode{display:flex;gap:3px;background:var(--cream-2);border:1px solid var(--border-2);border-radius:10px;padding:3px}
.tf button{font-family:var(--mono);font-weight:700;font-size:12.5px;padding:6px 12px;border:none;background:none;border-radius:7px;cursor:pointer;color:var(--ink-2)}
.tf button.active{background:var(--green-900);color:#fff}
.mode button{padding:6px 9px;border:none;background:none;border-radius:7px;cursor:pointer;color:var(--ink-3);display:grid;place-items:center}
.mode button.active{background:var(--surface);color:var(--green-700);box-shadow:var(--shadow)}
.mode button svg{width:17px;height:17px}
.chart-wrap{position:relative;padding:6px 8px 0}
#chart{width:100%;height:360px;display:block;cursor:crosshair}
.ohlc{position:absolute;left:16px;top:12px;display:flex;gap:13px;font-family:var(--mono);font-size:11.5px;font-weight:600;pointer-events:none;flex-wrap:wrap;color:var(--ink-3)}
.ohlc b{color:var(--ink);font-weight:800;margin-left:3px}
.chart-tip{position:absolute;pointer-events:none;background:var(--green-900);color:#fff;border-radius:9px;padding:9px 12px;font-size:11px;font-family:var(--mono);opacity:0;transition:opacity .12s;z-index:5;white-space:nowrap;box-shadow:var(--shadow-lg)}
.chart-tip .d{color:var(--gold-bright);margin-bottom:4px}
.chart-tip .row{display:flex;justify-content:space-between;gap:14px}.chart-tip .row .l{color:rgba(255,255,255,.6)}
.sim-note{font-size:11px;color:var(--ink-3);padding:6px 20px 0;line-height:1.5}
.cc-foot{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--border);margin-top:8px}
.cstat{padding:13px 16px;border-right:1px solid var(--border)}
.cstat:last-child{border-right:none}
.cstat .l{font-size:11px;color:var(--ink-3);font-weight:500}
.cstat .v{font-family:var(--mono);font-weight:800;font-size:15px;margin-top:3px;color:var(--ink)}

/* ===== technical analysis — score rings, own section below the chart card ===== */
[data-page="asset-detail"] .ta-section{border-top:1px solid var(--border)}
[data-page="asset-detail"] .ta-card{background:linear-gradient(180deg,var(--gold-soft) 0%,var(--surface) 55%);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);padding:20px 22px 24px;position:relative;overflow:hidden}
[data-page="asset-detail"] .b-glow{position:absolute;top:-60px;right:-40px;width:220px;height:220px;background:radial-gradient(circle,rgba(201,162,39,.22),transparent 70%);pointer-events:none}
[data-page="asset-detail"] .b-tf{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;margin-bottom:22px;position:relative;scrollbar-width:none}
[data-page="asset-detail"] .b-tf::-webkit-scrollbar{display:none}
[data-page="asset-detail"] .b-tf button{flex:none;font-family:inherit;font-size:12px;font-weight:700;color:var(--ink-2);background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:7px 14px;cursor:pointer;white-space:nowrap}
[data-page="asset-detail"] .b-tf button.on{background:var(--gold);border-color:var(--gold);color:#fff}
[data-page="asset-detail"] .b-rings{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;position:relative}
[data-page="asset-detail"] .b-ring{text-align:center;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 10px 14px}
[data-page="asset-detail"] .b-ring .rh{font-size:11.5px;font-weight:700;color:var(--ink-2);margin-bottom:10px}
[data-page="asset-detail"] .b-ring svg{width:88px;height:88px}
[data-page="asset-detail"] .b-ring .num{font-family:var(--serif);font-weight:800;font-size:15px;fill:var(--down)}
[data-page="asset-detail"] .b-ring .rlb{display:block;margin-top:10px;font-size:12px;font-weight:800;color:var(--down)}
[data-page="asset-detail"] .b-ring.main{border-color:var(--gold)}
[data-page="asset-detail"] .b-ring.main .rh{font-size:13px}
[data-page="asset-detail"] .b-ring.main svg{width:104px;height:104px}
[data-page="asset-detail"] .b-ring.main .rlb{font-size:13.5px}
[data-page="asset-detail"] .b-legend{display:flex;justify-content:center;gap:16px;margin-top:18px;font-size:10.5px;color:var(--ink-3)}
[data-page="asset-detail"] .b-legend span{display:inline-flex;align-items:center;gap:5px}
[data-page="asset-detail"] .b-legend i{width:8px;height:8px;border-radius:50%;display:inline-block}
[data-page="asset-detail"] .b-legend i.s{background:var(--down)}
[data-page="asset-detail"] .b-legend i.n{background:var(--border-2)}
[data-page="asset-detail"] .b-legend i.b{background:var(--up)}
@media(max-width:520px){
  [data-page="asset-detail"] .b-rings{grid-template-columns:1fr;gap:10px}
  [data-page="asset-detail"] .b-ring{display:flex;align-items:center;gap:16px;text-align:left;padding:12px 14px}
  [data-page="asset-detail"] .b-ring .rh{margin-bottom:0;flex:1}
  [data-page="asset-detail"] .b-ring.main svg{width:88px;height:88px}
}

/* ===== widget row ===== */
.wrow{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
.wcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.wcard .wh{padding:13px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:9px;font-family:var(--serif);font-weight:700;font-size:15px;color:var(--green-900)}
.wcard .wh .ic{width:30px;height:30px;border-radius:8px;background:var(--gold-soft);display:grid;place-items:center;color:var(--gold-deep);flex:none}
.wcard .wh .ic svg{width:16px;height:16px}
.wcard .wb{padding:16px}
.tech-verdict{text-align:center;margin-bottom:14px}
.tech-verdict .badge{display:inline-block;font-family:var(--serif);font-weight:800;font-size:18px;padding:8px 22px;border-radius:var(--pill);background:var(--cream-2);color:var(--ink-2)}
.tech-verdict .badge.buy{background:var(--up-soft);color:var(--up)}
.tech-verdict .badge.sell{background:var(--down-soft);color:var(--down)}
.tech-verdict .sum{font-size:12px;color:var(--ink-3);margin-top:8px}
.tech-row,.lvl{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--cream-2);font-size:13.5px}
.tech-row:last-child,.lvl:last-child{border:none}
.tech-row .k{color:var(--ink-2)}
.tech-row .v{font-weight:700;font-size:12px;padding:2px 10px;border-radius:var(--pill)}
.v.buy{color:var(--up);background:var(--up-soft)}.v.sell{color:var(--down);background:var(--down-soft)}.v.neu{color:var(--ink-2);background:var(--cream-2)}
.lvl .k{font-weight:600}.lvl .k.r{color:var(--down)}.lvl .k.s{color:var(--up)}.lvl .k.p{color:var(--ink-2)}
.lvl .v{font-family:var(--mono);font-weight:800;font-size:14.5px}
.drv{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid var(--cream-2);font-size:13px;align-items:flex-start}
.drv:last-child{border:none}
.drv .ar{font-family:var(--mono);font-weight:800;font-size:12px;flex:none;margin-top:1px}
.drv .ar.up{color:var(--up)}.drv .ar.down{color:var(--down)}
.drv .t{color:var(--ink-2)}.drv .t b{color:var(--ink);font-weight:700}

/* ===== sections ===== */
section{padding:0 0 40px}
.shead{margin-bottom:22px;max-width:760px}
.eyebrow{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);display:flex;align-items:center;gap:9px;margin-bottom:9px}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--gold)}
.shead h2{font-family:var(--serif);font-size:clamp(23px,3vw,30px);color:var(--green-900)}
.shead p{color:var(--ink-2);font-size:15px;margin-top:8px}
.prose-lead{max-width:760px;color:var(--ink-2);font-size:15px;margin-bottom:22px}
.prose-lead p{margin-bottom:12px}.prose-lead b{color:var(--ink);font-weight:700}

/* topics */
.topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.topic{display:flex;align-items:center;gap:13px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:15px 16px;cursor:pointer;transition:border .18s,transform .18s,box-shadow .2s}
.topic:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:var(--shadow)}
.topic .ic{width:40px;height:40px;border-radius:10px;background:var(--gold-soft);display:grid;place-items:center;color:var(--gold-deep);flex:none;transition:.18s}
.topic:hover .ic{background:var(--gold);color:var(--green-900)}
.topic .ic svg{width:20px;height:20px}
.topic .tt{font-family:var(--serif);font-weight:700;font-size:14.5px;line-height:1.25;color:var(--green-900)}
.topic .ts{font-size:11.5px;color:var(--ink-3);margin-top:2px}
.topic .arr{margin-left:auto;color:var(--ink-3);transition:.18s}.topic:hover .arr{color:var(--gold-deep);transform:translateX(3px)}
.topic .arr svg{width:16px;height:16px}

/* calendar */
.cal{border:1px solid var(--border);border-radius:var(--r);overflow:hidden;background:var(--surface);box-shadow:var(--shadow)}
.cal-row{display:grid;grid-template-columns:140px 60px 1fr 110px 130px;align-items:center;gap:14px;padding:14px 18px;border-bottom:1px solid var(--cream-2)}
.cal-row:last-child{border:none}.cal-row:hover{background:var(--cream-2)}
.cal-row .when{font-family:var(--mono);font-weight:700;font-size:12.5px;color:var(--ink-2)}
.cal-row .ccy{font-family:var(--mono);font-weight:800;font-size:11.5px;padding:3px 8px;border-radius:6px;text-align:center;background:var(--cream-2);border:1px solid var(--border)}
.cal-row .ev{font-weight:600;font-size:14px}
.cal-row .imp{display:flex;gap:3px;align-items:center;font-size:12px;color:var(--ink-3)}
.cal-row .imp i{width:7px;height:7px;border-radius:50%;background:var(--border-2)}
.cal-row .imp.high i:nth-child(-n+3){background:var(--down)}
.cal-row .imp.med i:nth-child(-n+2){background:var(--gold)}
.cal-row .fc{font-family:var(--mono);font-size:12px;color:var(--ink-2);text-align:right}.cal-row .fc b{color:var(--ink)}

/* broker cards */
.brk-disc{font-size:12px;color:var(--ink-3);background:var(--cream-2);border:1px solid var(--border);border-radius:10px;padding:9px 13px;margin-bottom:18px;display:flex;gap:8px;align-items:flex-start}
.brk-disc svg{width:15px;height:15px;flex:none;margin-top:2px;color:var(--gold-deep);stroke:currentColor;fill:none;stroke-width:2}
/* broker cards → shared component (.wcb-gbrk in wcb.css) */

/* internal links · .ilinks / .ichip → wcb.css (generalized primitives) */
.ichip .d{width:9px;height:9px;border-radius:3px}

/* ===== footer (WCB shell) ===== */

.social-ico{display:flex;gap:10px;margin-top:14px}

/* ===== mobile bottom tabs ===== */

.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ===== responsive ===== */
@media(max-width:980px){
  .wrow{grid-template-columns:1fr}
  .topic-grid{grid-template-columns:1fr 1fr}
  
  .cal-row{grid-template-columns:auto auto 1fr;grid-template-areas:"when ccy imp" "ev ev ev" "fc fc fc";gap:5px 10px}
  .cal-row .when{grid-area:when}.cal-row .ccy{grid-area:ccy}.cal-row .imp{grid-area:imp;justify-self:start}
  .cal-row .ev{grid-area:ev}.cal-row .fc{grid-area:fc;text-align:left;color:var(--ink-3)}
}
@media(max-width:820px){

  body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .hprice{margin-left:0;text-align:left;width:100%}
}
@media(max-width:640px){
  .wrap,.shell{padding:0 16px}
  [data-page="asset-detail"] .shell{padding:32px 16px 40px}

  .htitle{gap:13px}.pair-ic{width:52px;height:52px}
  #chart{height:280px}
  .ohlc{font-size:10px;gap:8px;background:rgba(255,255,255,.86);padding:3px 7px;border-radius:7px;left:10px;top:8px} /* narrower + readout chip so it clears/masks the right price-axis label at 320 */
  .cc-foot{grid-template-columns:repeat(6,1fr)}
  .cstat{grid-column:span 2}
  .cstat:nth-child(4),.cstat:nth-child(5){grid-column:span 3}
  .cstat:nth-child(3n){border-right:none}.cstat:nth-child(n+4){border-top:1px solid var(--border)}
  .cstat{padding:11px 9px}.cstat .v{font-size:13px;white-space:nowrap} /* fit mono price in narrow 3-col cell (no mid-number wrap) */
  .topic-grid{grid-template-columns:1fr}
  
  .cal-row{grid-template-columns:auto 1fr;grid-template-areas:"when imp" "ev ev" "fc fc";gap:5px 10px}.cal-row .ccy{display:none}
  .cc-tools{margin-left:0;width:100%}
}
.wb-drivers{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:560px){.wb-drivers{grid-template-columns:1fr}}

/* ===== wcb-newshub.css — shared, unscoped ===== */
/* ===================================================================
   WCB News Hub — shared stylesheet for all category news hubs.
   Config-driven engine lives in wcb-newshub.js; each thin page sets
   <body data-hub="…">. Tokens come from wcb.css.
   =================================================================== */
/* .wrap-wide → wcb.css UNIVERSAL (wcb.css loads before this sheet) */

/* ===== category switcher (merged hub — one page, 7 categories) ===== */
.ch-hubbar{background:var(--surface);border-bottom:1px solid var(--border)}
.ch-hubbar-in{max-width:1180px;margin:0 auto;padding:0 20px;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.ch-hubbar-in::-webkit-scrollbar{display:none}
.ch-hubtab{flex:0 0 auto;background:none;border:none;cursor:pointer;padding:14px 16px;font-family:var(--thai);font-weight:700;font-size:14px;color:var(--ink-3);border-bottom:3px solid transparent;white-space:nowrap;min-height:var(--tap)}
.ch-hubtab:hover{color:var(--green-900)}
.ch-hubtab.on{color:var(--green-900);border-bottom-color:var(--gold)}

/* ===== hub hero (category header) ===== */
.ch-hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
.ch-hero::before{content:"";position:absolute;inset:0;background:none;pointer-events:none}
.ch-hero-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:26px 20px 24px}
.ch-crumb{font-size:12.5px;color:rgba(255,255,255,.62);margin-bottom:12px}
.ch-crumb a{color:rgba(255,255,255,.62);text-decoration:none}.ch-crumb a:hover{color:var(--gold-bright)}.ch-crumb b{color:#fff}
.ch-hero .eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.14em;color:var(--gold-bright);font-weight:600;text-transform:uppercase}
.ch-hero h1{font-family:var(--serif);font-weight:800;font-size:clamp(28px,5vw,46px);line-height:1.16;margin:10px 0 8px}
.ch-hero h1 .gold{color:var(--gold-bright)}
.ch-hero p{font-size:clamp(14px,2vw,16px);color:rgba(255,255,255,.78);max-width:64ch;line-height:1.6}
.ch-fresh{display:inline-flex;align-items:center;flex-wrap:wrap;gap:8px 14px;margin-top:16px;font-size:12.5px;color:rgba(255,255,255,.82);font-family:var(--mono);font-weight:600}
.ch-fresh .dot{width:7px;height:7px;border-radius:50%;background:var(--up);box-shadow:none;animation:chpulse 1.8s infinite}
@keyframes chpulse{0%,100%{opacity:1}50%{opacity:.4}}
.ch-fresh .sep{opacity:.4}

/* ===== filter tabs (sits above the feed, not sticky) ===== */
.ch-tabs-wrap{margin:0 0 16px}
.ch-tabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.ch-tabs::-webkit-scrollbar{display:none}
.ch-tab{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border-2);background:var(--surface);border-radius:10px;padding:8px 15px;font-family:var(--thai);font-size:13.5px;font-weight:600;color:var(--ink-2);cursor:pointer;min-height:40px;white-space:nowrap;transition:.15s}
.ch-tab:hover{border-color:var(--gold)}
.ch-tab[aria-pressed="true"]{background:var(--green-700);color:#fff;border-color:var(--green-700)}

/* ===== section heading ===== */
.ch-sec-h{display:flex;align-items:center;gap:9px;font-family:var(--serif);font-weight:800;font-size:20px;color:var(--green-900);margin:0 0 15px}

/* ===== category chip ===== */
.ch-chip{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;padding:4px 10px;border-radius:var(--pill);color:#fff;background:var(--cd,#3B5C27);box-shadow:none;white-space:nowrap}
.ch-chip.soft{background:color-mix(in srgb,var(--cd) 13%,#fff);color:var(--cd)}
.tag-breaking{display:inline-flex;align-items:center;gap:5px;background:var(--breaking,#C0341D);color:#fff;font-size:10.5px;font-weight:800;letter-spacing:.04em;padding:4px 9px;border-radius:var(--pill)}
.tag-breaking .pd{width:6px;height:6px;border-radius:50%;background:#fff;animation:chpulse 1.3s infinite}

/* ===== byline ===== */
.ch-au{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--ink-2);font-family:var(--mono);font-weight:600}
.ch-av{width:22px;height:22px;border-radius:50%;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:10px;flex:none}
.ch-au .nm{color:var(--ink-2)}

/* ===== featured ===== */
.ch-featured{max-width:1180px;margin:0 auto;padding:32px 20px 8px}
.ch-fgrid{display:grid;grid-template-columns:1.7fr 1fr;gap:18px}
.ch-lead{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);text-decoration:none;color:inherit;transition:transform .18s,box-shadow .18s,border-color .18s}
.ch-lead:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
.ch-lead-thumb{position:relative;aspect-ratio:16/8;background:var(--bk);display:flex;align-items:flex-start;justify-content:space-between;padding:14px}
.ch-lead-thumb::after{content:"";position:absolute;inset:0;background:none;pointer-events:none}
.ch-lead-b{padding:18px 20px 20px;display:flex;flex-direction:column;gap:10px}
.ch-lead-t{font-family:var(--serif);font-weight:800;font-size:clamp(19px,2.6vw,26px);color:var(--green-900);line-height:1.28}
.ch-lead-d{font-size:14px;color:var(--ink-2);line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ch-lead-m{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:2px}
.ch-feat-side{display:flex;flex-direction:column;gap:14px}
.ch-scard{position:relative;z-index:1;display:grid;grid-template-columns:96px 1fr;gap:12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);text-decoration:none;color:inherit;transition:transform .16s,border-color .16s}
.ch-scard:hover{transform:translateY(-2px);border-color:var(--gold)}
.ch-scard-th{position:relative;background:var(--bk)}
.ch-scard-b{padding:11px 12px 11px 0;display:flex;flex-direction:column;gap:6px;min-width:0}
.ch-scard-t{font-family:var(--serif);font-weight:700;font-size:14px;color:var(--green-900);line-height:1.34;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ch-scard-time{font-size:11px;color:var(--ink-2);font-family:var(--mono);font-weight:600}

/* ===== main: feed + sidebar ===== */
.ch-main{max-width:1180px;margin:0 auto;padding:26px 20px 40px;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start}
.ch-main>div{min-width:0}
.ch-feed-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:15px}
.ch-count{font-size:12.5px;color:var(--ink-2);font-weight:600;font-family:var(--mono)}
.ch-feed{display:flex;flex-direction:column;gap:14px}
.ch-row{display:grid;grid-template-columns:158px 1fr;gap:16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);text-decoration:none;color:inherit;transition:transform .16s,box-shadow .16s,border-color .16s}
.ch-row:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
.ch-row-th{position:relative;background:var(--bk);min-height:112px}
.ch-row-th::after{content:"";position:absolute;inset:0;background:none;pointer-events:none}
.ch-row-b{padding:14px 16px 14px 0;display:flex;flex-direction:column;gap:8px;min-width:0}
.ch-row-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ch-row-t{font-family:var(--serif);font-weight:700;font-size:16.5px;color:var(--green-900);line-height:1.33;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ch-row-d{font-size:12.5px;color:var(--ink-2);line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ch-row-m{display:flex;align-items:center;gap:8px;margin-top:2px}
.ch-empty{padding:50px 20px;text-align:center;color:var(--ink-3);background:var(--surface);border:1px dashed var(--border);border-radius:var(--r);font-size:14px}
.ch-more{margin-top:24px;display:flex;justify-content:center}
.ch-pager{display:flex;align-items:center;gap:8px}
.ch-pager button{min-width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;font-size:20px;line-height:1;color:var(--green-900);background:var(--surface);border:1.5px solid var(--border-2);border-radius:10px;cursor:pointer;transition:.15s}
.ch-pager button:hover:not([disabled]){border-color:var(--green-900);background:var(--green-900);color:#fff}
.ch-pager button[disabled]{opacity:.4;cursor:default;pointer-events:none}
.ch-pager .pg-ind{font-family:var(--mono);font-weight:700;font-size:13.5px;color:var(--ink-2);padding:0 12px;white-space:nowrap}

/* ===== sidebar ===== */
.ch-aside{display:flex;flex-direction:column;gap:18px;position:sticky;top:74px}
.ch-side{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.ch-side-h{display:flex;align-items:center;gap:8px;padding:13px 16px;font-family:var(--serif);font-weight:800;font-size:15px;color:var(--green-900);border-bottom:1px solid var(--border);background:var(--cream-2,#faf6ec)}
.ch-prow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 16px;text-decoration:none;color:inherit;border-bottom:1px solid var(--border);transition:background .12s}
.ch-prow:last-child{border-bottom:none}.ch-prow:hover{background:var(--cream-2,#faf6ec)}
.ch-prow .nm{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--ink)}
.ch-prow .px{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-weight:700;font-size:13px;font-variant-numeric:tabular-nums}
.ch-prow .val{color:var(--ink)}
.ch-prow .chg{font-size:11.5px;font-weight:700;color:var(--ink-3)}
.ch-prow .chg.up{color:var(--up)}.ch-prow .chg.down{color:var(--down)}
.ch-hot a{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:center;padding:11px 16px;text-decoration:none;color:inherit;border-bottom:1px solid var(--border);transition:background .12s}
.ch-hot a:last-child{border-bottom:none}.ch-hot a:hover{background:var(--cream-2,#faf6ec)}
.ch-hot .rk{font-family:var(--serif);font-weight:800;font-size:17px;color:var(--gold-deep);text-align:center}
.ch-hot .ht{font-size:13px;font-weight:600;color:var(--green-900);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ch-anl a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;text-decoration:none;color:inherit;border-bottom:1px solid var(--border);transition:background .12s}
.ch-anl a:last-child{border-bottom:none}.ch-anl a:hover{background:var(--cream-2,#faf6ec)}
.ch-anl .at{font-size:13.5px;font-weight:600;color:var(--green-900);line-height:1.4}
.ch-anl .ar{color:var(--gold-deep);font-weight:800;flex:none}

@media(max-width:980px){
  .ch-main{grid-template-columns:1fr;gap:24px}
  .ch-aside{position:static}
  .ch-fgrid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .ch-row{grid-template-columns:104px 1fr;gap:12px}
  .ch-row-th{min-height:96px}
  .ch-row-b{padding:12px 13px 12px 0}
  .ch-lead-b{padding:15px 16px 17px}
}

/* ===== page: analysis-eurusd — scoped [data-page="analysis-eurusd"] ===== */
[data-page="analysis-eurusd"] .an-wrap{max-width:760px;margin:0 auto;padding:0 20px}
[data-page="analysis-eurusd"] .an-top{padding:24px 0 8px}
[data-page="analysis-eurusd"] .an-cat{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--forex-t);background:var(--up-soft);border:1px solid #cfe3d6;border-radius:var(--pill);padding:4px 12px;margin-bottom:14px}
[data-page="analysis-eurusd"] .an-h1{font-family:var(--serif);font-weight:800;font-size:clamp(26px,4vw,40px);line-height:1.16;color:var(--green-900);margin-bottom:14px}
[data-page="analysis-eurusd"] .tldr{background:var(--cream-2);border:1px solid var(--border);border-left:4px solid var(--gold);border-radius:var(--r);padding:16px 20px;margin:22px 0}
[data-page="analysis-eurusd"] .tldr h2{font-family:var(--serif);font-size:16px;color:var(--green-900);display:flex;align-items:center;gap:8px;margin-bottom:10px}
[data-page="analysis-eurusd"] .tldr ul{list-style:none;display:grid;gap:9px}
[data-page="analysis-eurusd"] .tldr li{display:flex;gap:10px;font-size:14px;color:var(--ink);line-height:1.55}
[data-page="analysis-eurusd"] .tldr li::before{content:"▸";color:var(--gold-deep);font-weight:800;flex:none}
[data-page="analysis-eurusd"] .tldr li b{color:var(--green-900)}
[data-page="analysis-eurusd"] .tldr li .num{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums}
[data-page="analysis-eurusd"] .an-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:20px;margin:26px 0}
[data-page="analysis-eurusd"] .an-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow)}
[data-page="analysis-eurusd"] .an-panel h3{font-family:var(--serif);font-size:16px;color:var(--green-900);margin-bottom:12px;display:flex;align-items:center;gap:8px}
[data-page="analysis-eurusd"] .an-chart{width:100%;height:auto;display:block;border-radius:10px;background:linear-gradient(180deg,#fff,var(--cream-2));border:1px solid var(--border)}
[data-page="analysis-eurusd"] .an-fig{margin:22px 0}
[data-page="analysis-eurusd"] .an-fig figcaption{font-size:12.5px;color:var(--ink-3);line-height:1.65;margin-top:10px}
[data-page="analysis-eurusd"] .an-readhow{margin-top:12px;display:grid;gap:7px}
[data-page="analysis-eurusd"] .an-readhow li{display:flex;gap:8px;font-size:12.5px;color:var(--ink-2);line-height:1.5}
[data-page="analysis-eurusd"] .an-readhow li::before{content:"•";color:var(--gold-deep);font-weight:800;flex:none}
[data-page="analysis-eurusd"] .lvl-tbl{width:100%;border-collapse:collapse;font-size:13px}
[data-page="analysis-eurusd"] .lvl-tbl th{text-align:left;font-size:11px;color:var(--ink-3);font-weight:700;padding:0 8px 8px;border-bottom:1px solid var(--border)}
[data-page="analysis-eurusd"] .lvl-tbl td{padding:10px 8px;border-bottom:1px solid var(--border);vertical-align:middle}
[data-page="analysis-eurusd"] .lvl-tbl tr:last-child td{border-bottom:none}
[data-page="analysis-eurusd"] .lvl-px{font-family:var(--mono);font-weight:800;font-size:14px;font-variant-numeric:tabular-nums;color:var(--ink)}
[data-page="analysis-eurusd"] .lvl-tag{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:var(--pill);white-space:nowrap}
[data-page="analysis-eurusd"] .lvl-tag.sup{background:var(--up-soft);color:var(--up)}
[data-page="analysis-eurusd"] .lvl-tag.res{background:var(--down-soft);color:var(--pay)}
[data-page="analysis-eurusd"] .lvl-tag.piv{background:var(--gold-soft);color:var(--gold-deep)}
[data-page="analysis-eurusd"] .lvl-tag.tgt{background:#EEF2F8;color:var(--stock-t)}
[data-page="analysis-eurusd"] .lvl-tbl .then{font-size:11.5px;color:var(--ink-2);line-height:1.4}
[data-page="analysis-eurusd"] .lvl-tbl tr.now td{background:var(--gold-soft)}
[data-page="analysis-eurusd"] .lvl-tbl tr.now .lvl-px::after{content:" ← ราคาปัจจุบัน";font-family:var(--thai);font-size:9.5px;font-weight:700;color:var(--gold-deep)}
[data-page="analysis-eurusd"] .an-body{max-width:760px;margin:8px auto 0}
[data-page="analysis-eurusd"] .an-body h2{font-family:var(--serif);font-weight:800;font-size:23px;color:var(--green-900);margin:30px 0 12px;padding-top:8px}
[data-page="analysis-eurusd"] .an-body h3{font-family:var(--serif);font-weight:700;font-size:18px;color:var(--ink);margin:20px 0 9px}
[data-page="analysis-eurusd"] .an-body p{font-size:15.5px;color:var(--ink);line-height:1.78;margin-bottom:14px}
[data-page="analysis-eurusd"] .an-body p b{color:var(--green-900)}
[data-page="analysis-eurusd"] .an-body .num{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums}
[data-page="analysis-eurusd"] .term{border-bottom:1px dotted var(--gold-deep);cursor:help;position:relative;font-weight:600;color:var(--ink)}
[data-page="analysis-eurusd"] .term:hover::after,[data-page="analysis-eurusd"] .term:focus::after{content:attr(data-tip);position:absolute;left:0;bottom:calc(100% + 8px);width:min(260px,72vw);background:var(--green-900);color:#fff;font-family:var(--thai);font-size:12px;font-weight:500;line-height:1.5;padding:10px 12px;border-radius:10px;box-shadow:var(--shadow-lg);z-index:20}
[data-page="analysis-eurusd"] .callout{display:flex;gap:12px;background:var(--gold-soft);border:1px solid #ecd9a8;border-radius:var(--r);padding:14px 16px;margin:16px 0;font-size:14px;color:var(--ink)}
[data-page="analysis-eurusd"] .callout .ci{font-size:20px;flex:none}
[data-page="analysis-eurusd"] .callout b{color:var(--green-900)}
[data-page="analysis-eurusd"] .scen-head{max-width:760px;margin:34px auto 0}
[data-page="analysis-eurusd"] .scen{max-width:760px;margin:14px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
[data-page="analysis-eurusd"] .scen-card{border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;background:var(--surface);box-shadow:var(--shadow)}
[data-page="analysis-eurusd"] .scen-card.bull{border-top:4px solid var(--up)}
[data-page="analysis-eurusd"] .scen-card.bear{border-top:4px solid var(--pay)}
[data-page="analysis-eurusd"] .scen-card h4{font-family:var(--serif);font-size:15px;margin-bottom:9px;display:flex;align-items:center;gap:8px}
[data-page="analysis-eurusd"] .scen-card.bull h4{color:var(--up)}
[data-page="analysis-eurusd"] .scen-card.bear h4{color:var(--pay)}
[data-page="analysis-eurusd"] .scen-card p{font-size:13.5px;color:var(--ink-2);line-height:1.6}
[data-page="analysis-eurusd"] .scen-card .num{font-family:var(--mono);font-weight:700;color:var(--ink)}
[data-page="analysis-eurusd"] .scen-card .arw{color:var(--green-900);font-weight:800}
[data-page="analysis-eurusd"] .scen-disc{max-width:760px;margin:12px auto 0;display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--ink-3);background:var(--cream-2);border:1px solid var(--border);border-radius:10px;padding:10px 14px}
[data-page="analysis-eurusd"] .scen-disc svg{width:15px;height:15px;stroke:var(--gold-deep);fill:none;stroke-width:2;flex:none}
[data-page="analysis-eurusd"] .author-box{max-width:760px;margin:34px auto 0;display:flex;gap:16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow)}
[data-page="analysis-eurusd"] .author-box .av{width:62px;height:62px;border-radius:50%;flex:none;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:24px;color:#fff;background:linear-gradient(135deg,#1d8a5e,#0f5c3d)}
[data-page="analysis-eurusd"] .author-box .who b{font-family:var(--serif);font-size:17px;color:var(--green-900)}
[data-page="analysis-eurusd"] .author-box .who .role{font-size:12.5px;color:var(--gold-deep);font-weight:700;margin:2px 0 7px}
[data-page="analysis-eurusd"] .author-box .who p{font-size:13px;color:var(--ink-2);line-height:1.6;margin-bottom:8px}
[data-page="analysis-eurusd"] .author-box .who{flex:1;min-width:0}
[data-page="analysis-eurusd"] .author-box .who a{font-size:12.5px;font-weight:700;color:var(--forex-t)}
[data-page="analysis-eurusd"] .author-box .author-acts{display:flex;gap:8px;margin-left:auto;align-self:flex-start;flex-wrap:wrap;flex:none}
[data-page="analysis-eurusd"] .ymyl{max-width:760px;margin:16px auto 0;background:#FCFAF2;border:1px solid #E5D8AE;border-left:4px solid var(--gold);border-radius:var(--r);padding:15px 18px;font-size:13px;color:var(--ink-2);line-height:1.7}
[data-page="analysis-eurusd"] .ymyl b{color:var(--ink)}
[data-page="analysis-eurusd"] .ymyl .h{display:flex;align-items:center;gap:8px;font-family:var(--serif);font-weight:800;font-size:14.5px;color:var(--green-900);margin-bottom:7px}
[data-page="analysis-eurusd"] .an-cta{max-width:760px;margin:30px auto 0;display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:space-between;background:var(--green-900);color:#fff;border-radius:var(--r-lg);padding:22px 26px}
[data-page="analysis-eurusd"] .an-cta .t h3{font-family:var(--serif);font-size:19px;margin-bottom:5px}
[data-page="analysis-eurusd"] .an-cta .t p{font-size:13px;color:rgba(255,255,255,.8);max-width:46ch}
@media(max-width:820px){[data-page="analysis-eurusd"] .an-grid{grid-template-columns:1fr}[data-page="analysis-eurusd"] .scen{grid-template-columns:1fr}}
@media(max-width:600px){[data-page="analysis-eurusd"] .an-cta{flex-direction:column;align-items:flex-start}[data-page="analysis-eurusd"] .an-cta .btn{width:100%}[data-page="analysis-eurusd"] .author-box{flex-direction:column}[data-page="analysis-eurusd"] .author-box .author-acts{margin-left:0;margin-top:4px}}

/* ===== page: analysis-pair — scoped [data-page="analysis-pair"] =====
   Shared silo template for every currency-pair deep-dive under "บทวิเคราะห์ › สกุลเงิน".
   Deliberately NOT the news layout: chart-first, TL;DR box, level table, scenario
   cards, sticky research sidebar — reading/analysis rhythm, not a headline feed.
   One template, many pages (EUR/USD, USD/JPY, GBP/USD) — only data differs. */
[data-page="analysis-pair"] .brk-hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
[data-page="analysis-pair"] .brk-hero-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:26px 20px 26px}
[data-page="analysis-pair"] .brk-crumb{font-size:12.5px;color:rgba(255,255,255,.62);margin-bottom:12px}
[data-page="analysis-pair"] .brk-crumb a{color:rgba(255,255,255,.62);text-decoration:none}
[data-page="analysis-pair"] .brk-crumb a:hover{color:var(--gold-bright)}
[data-page="analysis-pair"] .brk-crumb b{color:#fff}
[data-page="analysis-pair"] .brk-hero .eyebrow{display:inline-block;font-size:12px;letter-spacing:.16em;color:var(--gold-bright);font-weight:600;text-transform:uppercase}
[data-page="analysis-pair"] .brk-hero h1{font-family:var(--serif);font-weight:800;font-size:clamp(26px,4vw,38px);line-height:1.2;margin:10px 0 8px;max-width:26ch}
[data-page="analysis-pair"] .brk-hero h1 .gold{color:var(--gold-bright)}
[data-page="analysis-pair"] .brk-hero p{font-size:clamp(14px,2vw,15.5px);color:rgba(255,255,255,.8);max-width:70ch;line-height:1.6;margin-bottom:4px}
[data-page="analysis-pair"] .brk-hero .wcb-byrow{margin-top:16px}

[data-page="news-item"] .brk-hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
[data-page="news-item"] .brk-hero-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:26px 20px 26px}
[data-page="news-item"] .brk-crumb{font-size:12.5px;color:rgba(255,255,255,.62);margin-bottom:12px}
[data-page="news-item"] .brk-crumb a{color:rgba(255,255,255,.62);text-decoration:none}
[data-page="news-item"] .brk-crumb a:hover{color:var(--gold-bright)}
[data-page="news-item"] .brk-crumb b{color:#fff}
[data-page="news-item"] .brk-hero .eyebrow{display:inline-block;font-size:12px;letter-spacing:.16em;color:var(--gold-bright);font-weight:600;text-transform:uppercase}
[data-page="news-item"] .brk-hero h1{font-family:var(--serif);font-weight:800;font-size:clamp(26px,4vw,38px);line-height:1.2;margin:10px 0 8px;max-width:26ch}
[data-page="news-item"] .brk-hero h1 .gold{color:var(--gold-bright)}
[data-page="news-item"] .brk-hero p{font-size:clamp(14px,2vw,15.5px);color:rgba(255,255,255,.8);max-width:70ch;line-height:1.6;margin-bottom:4px}
[data-page="news-item"] .brk-hero .wcb-byrow{margin-top:16px}
[data-page="analysis-pair"] .an2-top{max-width:1180px;margin:0 auto;padding:24px 20px 0}
[data-page="analysis-pair"] .an2-cat{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--forex-t);background:var(--up-soft);border:1px solid #cfe3d6;border-radius:var(--pill);padding:4px 12px;margin-bottom:14px}
[data-page="analysis-pair"] .an2-h1{font-family:var(--serif);font-weight:800;font-size:clamp(26px,4vw,38px);line-height:1.16;color:var(--green-900);margin-bottom:10px}
[data-page="analysis-pair"] .an2-desc{font-size:15px;color:var(--ink-2);line-height:1.6;max-width:70ch;margin-bottom:18px}
[data-page="analysis-pair"] .an2-layout,[data-page="news-item"] .an2-layout,[data-page="analysis-eurusd-hub"] .an2-layout,[data-page="analysis-hub"] .an2-layout{max-width:1180px;margin:0 auto;padding:32px 20px 48px;display:grid;grid-template-columns:1fr 340px;gap:28px;align-items:start}
[data-page="analysis-pair"] .an2-main,[data-page="news-item"] .an2-main,[data-page="analysis-eurusd-hub"] .an2-main,[data-page="analysis-hub"] .an2-main{min-width:0;max-width:760px}
[data-page="analysis-pair"] .an-fig{margin:0 0 22px}
[data-page="analysis-pair"] .an-chart{width:100%;height:auto;display:block;border-radius:10px;background:linear-gradient(180deg,#fff,var(--cream-2));border:1px solid var(--border)}
[data-page="analysis-pair"] .an-fig figcaption{font-size:12.5px;color:var(--ink-3);line-height:1.65;margin-top:10px}
[data-page="analysis-pair"] .tldr{background:var(--cream-2);border:1px solid var(--border);border-left:4px solid var(--gold);border-radius:var(--r);padding:16px 20px;margin:0 0 22px}
[data-page="analysis-pair"] .tldr h2{font-family:var(--serif);font-size:16px;color:var(--green-900);display:flex;align-items:center;gap:8px;margin-bottom:10px}
[data-page="analysis-pair"] .tldr ul{list-style:none;display:grid;gap:9px}
[data-page="analysis-pair"] .tldr li{display:flex;gap:10px;font-size:14px;color:var(--ink);line-height:1.55}
[data-page="analysis-pair"] .tldr li::before{content:"▸";color:var(--gold-deep);font-weight:800;flex:none}
[data-page="analysis-pair"] .tldr li b{color:var(--green-900)}
[data-page="analysis-pair"] .tldr li .num{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums}
[data-page="analysis-pair"] .an-body h2{font-family:var(--serif);font-weight:800;font-size:22px;color:var(--green-900);margin:28px 0 12px}
[data-page="analysis-pair"] .an-body h2:first-child{margin-top:0}
[data-page="analysis-pair"] .an-body h3{font-family:var(--serif);font-weight:700;font-size:17px;color:var(--ink);margin:18px 0 9px}
[data-page="analysis-pair"] .an-body p{font-size:15.5px;color:var(--ink);line-height:1.78;margin-bottom:14px}
[data-page="analysis-pair"] .an-body p b{color:var(--green-900)}
[data-page="analysis-pair"] .an-body .num{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums}
[data-page="analysis-pair"] .an-body ul.an-list{list-style:none;display:grid;gap:10px;margin:0 0 20px}
[data-page="analysis-pair"] .an-body ul.an-list li{display:flex;gap:10px;font-size:14.5px;color:var(--ink);line-height:1.6;padding-left:2px}
[data-page="analysis-pair"] .an-body ul.an-list li::before{content:"●";font-size:8px;color:var(--gold-deep);line-height:2.1;flex:none}
[data-page="analysis-pair"] .term{border-bottom:1px dotted var(--gold-deep);cursor:help;position:relative;font-weight:600;color:var(--ink)}
[data-page="analysis-pair"] .term:hover::after,[data-page="analysis-pair"] .term:focus::after{content:attr(data-tip);position:absolute;left:0;bottom:calc(100% + 8px);width:min(260px,72vw);background:var(--green-900);color:#fff;font-family:var(--thai);font-size:12px;font-weight:500;line-height:1.5;padding:10px 12px;border-radius:10px;box-shadow:var(--shadow-lg);z-index:20}
[data-page="analysis-pair"] .an-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow);margin:0 0 22px}
[data-page="analysis-pair"] .an-panel h3{font-family:var(--serif);font-size:16px;color:var(--green-900);margin-bottom:12px;display:flex;align-items:center;gap:8px}
[data-page="analysis-pair"] .an-panel .tbl-scroll{overflow-x:auto}
[data-page="analysis-pair"] .lvl-tbl{width:100%;min-width:460px;border-collapse:collapse;font-size:13px}
[data-page="analysis-pair"] .lvl-tbl th{text-align:left;font-size:11px;color:var(--ink-3);font-weight:700;padding:0 8px 8px;border-bottom:1px solid var(--border);white-space:nowrap}
[data-page="analysis-pair"] .lvl-tbl td{padding:10px 8px;border-bottom:1px solid var(--border);vertical-align:middle;overflow-wrap:break-word}
[data-page="analysis-pair"] .lvl-tbl .then{max-width:220px}
[data-page="analysis-pair"] .lvl-tbl tr:last-child td{border-bottom:none}
[data-page="analysis-pair"] .lvl-px{font-family:var(--mono);font-weight:800;font-size:14px;font-variant-numeric:tabular-nums;color:var(--ink)}
[data-page="analysis-pair"] .lvl-tag{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:var(--pill);white-space:nowrap}
[data-page="analysis-pair"] .lvl-tag.sup{background:var(--up-soft);color:var(--up)}
[data-page="analysis-pair"] .lvl-tag.res{background:var(--down-soft);color:var(--pay)}
[data-page="analysis-pair"] .lvl-tag.piv{background:var(--gold-soft);color:var(--gold-deep)}
[data-page="analysis-pair"] .lvl-tbl tr.now td{background:var(--gold-soft)}
[data-page="analysis-pair"] .lvl-tbl tr.now .lvl-px::after{content:" ← ราคาปัจจุบัน";font-family:var(--thai);font-size:9.5px;font-weight:700;color:var(--gold-deep)}
[data-page="analysis-pair"] .an2-quote{margin:8px 0 22px;padding:6px 0 6px 20px;border-left:3px solid var(--gold);font-family:var(--serif);font-style:normal;font-size:18px;line-height:1.55;color:var(--green-900)}
[data-page="analysis-pair"] .an2-quote cite{display:block;margin-top:9px;font-family:var(--thai);font-style:normal;font-size:12.5px;font-weight:700;color:var(--ink-3)}
[data-page="analysis-pair"] .an2-imgbox{margin:0 0 22px;border:1px solid var(--border);border-radius:var(--r);background:var(--surface);box-shadow:var(--shadow);padding:18px 20px 14px}
[data-page="analysis-pair"] .an2-imgbox svg{width:100%;height:auto;display:block}
[data-page="analysis-pair"] .an2-imgbox figcaption{font-size:12.5px;color:var(--ink-3);line-height:1.6;margin-top:10px;text-align:center}
[data-page="analysis-pair"] .callout{display:flex;gap:12px;background:var(--gold-soft);border:1px solid #ecd9a8;border-radius:var(--r);padding:14px 16px;margin:0 0 22px;font-size:14px;color:var(--ink)}
[data-page="analysis-pair"] .callout .ci{font-size:20px;flex:none}
[data-page="analysis-pair"] .callout b{color:var(--green-900)}
[data-page="analysis-pair"] .scen-head{margin:30px 0 0}
[data-page="analysis-pair"] .scen{margin:14px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
[data-page="analysis-pair"] .scen-card{border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;background:var(--surface);box-shadow:var(--shadow)}
[data-page="analysis-pair"] .scen-card.bull{border-top:4px solid var(--up)}
[data-page="analysis-pair"] .scen-card.bear{border-top:4px solid var(--pay)}
[data-page="analysis-pair"] .scen-card h4{font-family:var(--serif);font-size:15px;margin-bottom:9px;display:flex;align-items:center;gap:8px}
[data-page="analysis-pair"] .scen-card.bull h4{color:var(--up)}
[data-page="analysis-pair"] .scen-card.bear h4{color:var(--pay)}
[data-page="analysis-pair"] .scen-card p{font-size:13.5px;color:var(--ink-2);line-height:1.6}
[data-page="analysis-pair"] .scen-card .num{font-family:var(--mono);font-weight:700;color:var(--ink)}
[data-page="analysis-pair"] .scen-disc{margin:12px 0 0;display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--ink-3);background:var(--cream-2);border:1px solid var(--border);border-radius:10px;padding:10px 14px}
[data-page="analysis-pair"] .scen-disc svg{width:15px;height:15px;stroke:var(--gold-deep);fill:none;stroke-width:2;flex:none}
[data-page="analysis-pair"] .author-box{margin:34px 0 0;display:flex;gap:16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow)}
[data-page="analysis-pair"] .author-box .av{width:62px;height:62px;border-radius:50%;flex:none;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:24px;color:#fff;background:linear-gradient(135deg,#1d8a5e,#0f5c3d)}
[data-page="analysis-pair"] .author-box .who b{font-family:var(--serif);font-size:17px;color:var(--green-900)}
[data-page="analysis-pair"] .author-box .who .role{font-size:12.5px;color:var(--gold-deep);font-weight:700;margin:2px 0 7px}
[data-page="analysis-pair"] .author-box .who p{font-size:13px;color:var(--ink-2);line-height:1.6;margin-bottom:8px}
[data-page="analysis-pair"] .author-box .who{flex:1;min-width:0}
[data-page="analysis-pair"] .author-box .who a{font-size:12.5px;font-weight:700;color:var(--forex-t)}
[data-page="analysis-pair"] .author-box .author-acts{display:flex;gap:8px;margin-left:auto;align-self:flex-start;flex-wrap:wrap;flex:none}
/* ---- sticky research sidebar: 2 sections × 5 rows (thumb + title + date) ---- */
[data-page="analysis-pair"] .an2-aside,[data-page="news-item"] .an2-aside,[data-page="analysis-eurusd-hub"] .an2-aside,[data-page="analysis-hub"] .an2-aside{display:flex;flex-direction:column;gap:18px;position:sticky;top:20px}
[data-page="analysis-pair"] .an2-side,[data-page="news-item"] .an2-side,[data-page="analysis-eurusd-hub"] .an2-side,[data-page="analysis-hub"] .an2-side{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
[data-page="analysis-pair"] .an2-side-h,[data-page="news-item"] .an2-side-h,[data-page="analysis-eurusd-hub"] .an2-side-h,[data-page="analysis-hub"] .an2-side-h{display:flex;align-items:center;gap:8px;padding:13px 16px;font-family:var(--serif);font-weight:800;font-size:14.5px;color:var(--green-900);border-bottom:1px solid var(--border);background:var(--cream-2,#faf6ec)}
[data-page="analysis-pair"] .an2-prow,[data-page="news-item"] .an2-prow,[data-page="analysis-eurusd-hub"] .an2-prow,[data-page="analysis-hub"] .an2-prow{display:flex;align-items:center;gap:11px;padding:10px 16px;text-decoration:none;color:inherit;border-bottom:1px solid var(--border);transition:background .12s}
[data-page="analysis-pair"] .an2-prow:last-child,[data-page="news-item"] .an2-prow:last-child,[data-page="analysis-eurusd-hub"] .an2-prow:last-child,[data-page="analysis-hub"] .an2-prow:last-child{border-bottom:none}
[data-page="analysis-pair"] .an2-prow:hover,[data-page="news-item"] .an2-prow:hover,[data-page="analysis-eurusd-hub"] .an2-prow:hover,[data-page="analysis-hub"] .an2-prow:hover{background:var(--cream-2,#faf6ec)}
[data-page="analysis-pair"] .an2-prow .th,[data-page="news-item"] .an2-prow .th,[data-page="analysis-eurusd-hub"] .an2-prow .th,[data-page="analysis-hub"] .an2-prow .th{width:44px;height:44px;flex:none;border-radius:9px;display:grid;place-items:center;color:#fff;background-size:cover;background-position:center}
[data-page="analysis-pair"] .an2-prow .th svg,[data-page="news-item"] .an2-prow .th svg,[data-page="analysis-eurusd-hub"] .an2-prow .th svg,[data-page="analysis-hub"] .an2-prow .th svg{width:19px;height:19px}
[data-page="analysis-pair"] .an2-prow .tx,[data-page="news-item"] .an2-prow .tx,[data-page="analysis-eurusd-hub"] .an2-prow .tx,[data-page="analysis-hub"] .an2-prow .tx{min-width:0}
[data-page="analysis-pair"] .an2-prow .tt,[data-page="news-item"] .an2-prow .tt,[data-page="analysis-eurusd-hub"] .an2-prow .tt,[data-page="analysis-hub"] .an2-prow .tt{font-size:12.5px;font-weight:700;color:var(--green-900);line-height:1.38;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:3px}
[data-page="analysis-pair"] .an2-prow .dt,[data-page="news-item"] .an2-prow .dt,[data-page="analysis-eurusd-hub"] .an2-prow .dt,[data-page="analysis-hub"] .an2-prow .dt{font-size:11px;color:var(--ink-3);font-family:var(--mono)}
@media(max-width:980px){
  [data-page="analysis-pair"] .an2-layout,[data-page="news-item"] .an2-layout,[data-page="analysis-eurusd-hub"] .an2-layout,[data-page="analysis-hub"] .an2-layout{grid-template-columns:1fr}
  [data-page="analysis-pair"] .an2-aside,[data-page="news-item"] .an2-aside,[data-page="analysis-eurusd-hub"] .an2-aside,[data-page="analysis-hub"] .an2-aside{position:static}
  [data-page="analysis-pair"] .an2-main,[data-page="news-item"] .an2-main,[data-page="analysis-eurusd-hub"] .an2-main,[data-page="analysis-hub"] .an2-main{max-width:none}
}
@media(max-width:820px){[data-page="analysis-pair"] .scen{grid-template-columns:1fr}}
@media(max-width:600px){[data-page="analysis-pair"] .author-box{flex-direction:column}[data-page="analysis-pair"] .author-box .author-acts{margin-left:0;margin-top:4px}}

/* ===== page: analysis-currency — scoped [data-page="analysis-currency"] =====
   Silo hub for "บทวิเคราะห์ › สกุลเงิน": hero (same brk-hero language as the
   broker silo hubs) + grid linking out to each pair's own analysis-pair page.
   Distinct card language from wcb-brokers/news silos — quieter, fewer cards,
   research framing (last-updated + short thesis line). */
[data-page="analysis-currency"] .brk-hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
[data-page="analysis-currency"] .brk-hero-in{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:26px 20px 26px}
[data-page="analysis-currency"] .brk-crumb{font-size:12.5px;color:rgba(255,255,255,.62);margin-bottom:12px}
[data-page="analysis-currency"] .brk-crumb a{color:rgba(255,255,255,.62);text-decoration:none}
[data-page="analysis-currency"] .brk-crumb a:hover{color:var(--gold-bright)}
[data-page="analysis-currency"] .brk-crumb b{color:#fff}
[data-page="analysis-currency"] .brk-hero .eyebrow{display:inline-block;font-size:12px;letter-spacing:.16em;color:var(--gold-bright);font-weight:600;text-transform:uppercase}
[data-page="analysis-currency"] .brk-hero h1{font-family:var(--serif);font-weight:800;font-size:clamp(27px,4.6vw,44px);line-height:1.18;margin:10px 0 8px;max-width:22ch}
[data-page="analysis-currency"] .brk-hero h1 .gold{color:var(--gold-bright)}
[data-page="analysis-currency"] .brk-hero p{font-size:clamp(14px,2vw,16px);color:rgba(255,255,255,.8);max-width:66ch;line-height:1.6;margin-bottom:14px}
[data-page="analysis-currency"] .acx-wrap{max-width:1180px;margin:0 auto;padding:32px 20px 56px}
[data-page="analysis-currency"] .acx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
[data-page="analysis-currency"] .acx-card{position:relative;display:flex;flex-direction:column;gap:12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:22px 22px 20px;text-decoration:none;color:inherit;cursor:pointer;overflow:hidden;transition:transform .18s,box-shadow .18s,border-color .18s}
[data-page="analysis-currency"] .acx-card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--ink-3),var(--ink-3))}
[data-page="analysis-currency"] .acx-card:has(.acx-chg.up)::before{background:linear-gradient(90deg,var(--up),#7fd39a)}
[data-page="analysis-currency"] .acx-card:has(.acx-chg.down)::before{background:linear-gradient(90deg,var(--pay),#e8a68f)}
[data-page="analysis-currency"] .acx-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
[data-page="analysis-currency"] .acx-top{display:flex;align-items:center;gap:11px}
[data-page="analysis-currency"] .acx-badge{width:36px;height:36px;flex:none;border-radius:11px;display:grid;place-items:center;color:#fff;font-family:var(--mono);font-weight:800;font-size:12.5px;letter-spacing:.01em;box-shadow:0 3px 8px rgba(11,32,21,.22)}
[data-page="analysis-currency"] .acx-pair{flex:1;min-width:0;font-family:var(--mono);font-weight:800;font-size:18px;color:var(--green-900);letter-spacing:-.01em}
[data-page="analysis-currency"] .acx-chg{flex:none;font-family:var(--mono);font-weight:700;font-size:12.5px;padding:4px 10px;border-radius:var(--pill)}
[data-page="analysis-currency"] .acx-chg.up{color:var(--up);background:var(--up-soft)}
[data-page="analysis-currency"] .acx-chg.down{color:var(--pay);background:var(--down-soft)}
[data-page="analysis-currency"] .acx-title{font-family:var(--serif);font-weight:700;font-size:16px;color:var(--green-900);line-height:1.38}
[data-page="analysis-currency"] .acx-excerpt{font-size:12.5px;color:var(--ink-2);line-height:1.65;flex:1}
[data-page="analysis-currency"] .acx-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:12px;border-top:1px dashed var(--border)}
[data-page="analysis-currency"] .acx-date{font-size:11px;color:var(--ink-3);font-family:var(--mono)}
[data-page="analysis-currency"] .acx-more{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#fff;background:var(--green-800);padding:6px 12px;border-radius:9px;transition:background .16s}
[data-page="analysis-currency"] .acx-more svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.6;transition:transform .16s}
[data-page="analysis-currency"] .acx-card:hover .acx-more{background:var(--gold-deep)}
[data-page="analysis-currency"] .acx-card:hover .acx-more svg{transform:translateX(3px)}
[data-page="analysis-currency"] .acx-card.soon{cursor:default;border-style:dashed;box-shadow:none;background:var(--cream-2)}
[data-page="analysis-currency"] .acx-card.soon::before{background:var(--border-2)}
[data-page="analysis-currency"] .acx-card.soon .acx-badge{background:var(--border-2)!important;color:var(--ink-3)}
[data-page="analysis-currency"] .acx-card.soon .acx-title,[data-page="analysis-currency"] .acx-card.soon .acx-excerpt{opacity:.7}
[data-page="analysis-currency"] .acx-card.soon:hover{transform:none;box-shadow:none;border-color:var(--border-2)}
[data-page="analysis-currency"] .acx-soontag{flex:none;font-size:11px;font-weight:700;color:var(--ink-3);background:#fff;border:1px solid var(--border-2);padding:3px 9px;border-radius:var(--pill)}
@media(max-width:900px){[data-page="analysis-currency"] .acx-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){[data-page="analysis-currency"] .acx-grid{grid-template-columns:1fr}}

/* ===== page: asset-review — scoped [data-page="asset-review"] ===== */
[data-page="asset-review"] .mono{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
[data-page="asset-review"] #progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--gold-deep),var(--gold-bright));z-index:200;transition:width .08s linear}
[data-page="asset-review"] .hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
[data-page="asset-review"] .hero::after{content:"";position:absolute;inset:0;background:none;pointer-events:none}
[data-page="asset-review"] .hero .wrap{position:relative;z-index:1;padding-top:26px;padding-bottom:42px}
[data-page="asset-review"] .hero .tag-row{display:flex;gap:8px;flex-wrap:wrap;margin:0}
[data-page="asset-review"] .hero .pill{font-size:12px;font-weight:600;padding:5px 12px;border-radius:var(--pill);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.82)}
[data-page="asset-review"] .hero .pill.gold{background:var(--gold);color:var(--green-900);border-color:var(--gold);font-weight:700}
[data-page="asset-review"] .hero .pill.dot::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#6FD39B;margin-right:7px;vertical-align:middle}
[data-page="asset-review"] .hero-ranks{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
[data-page="asset-review"] .hero-ranks a{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:99px;padding:6px 13px;font-size:12.5px;font-weight:600;color:rgba(255,255,255,.85);text-decoration:none}
[data-page="asset-review"] .hero-ranks a:hover{border-color:var(--gold);color:#fff}
[data-page="asset-review"] .hero-ranks a .rk{font-family:var(--mono);font-weight:800;color:var(--gold-bright)}
[data-page="asset-review"] .cmt-band{background:var(--canvas);border-top:1px solid var(--border);padding:48px 0}
[data-page="asset-review"] .top-sec{padding:32px 0 40px}
[data-page="asset-review"] .crumb{font-size:12.5px;color:var(--ink-3);margin-bottom:14px;font-weight:500}
[data-page="asset-review"] .crumb a:hover{color:var(--gold-deep)}
[data-page="asset-review"] .crumb b{color:var(--ink);font-weight:600}
[data-page="asset-review"] .summary{display:block}
[data-page="asset-review"] .sum-head{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;margin-top:16px}
[data-page="asset-review"] .sum-main{min-width:0}
[data-page="asset-review"] .sum-head h1{font-family:var(--serif);font-weight:800;font-size:clamp(28px,4.4vw,44px);line-height:1.12;letter-spacing:-.3px;color:#fff;overflow-wrap:anywhere}
[data-page="asset-review"] .sum-head h1 em{font-style:normal;color:var(--gold-bright)}
[data-page="asset-review"] .verdict-line{font-size:16px;color:rgba(255,255,255,.78);line-height:1.6;margin-top:14px;max-width:62ch}
[data-page="asset-review"] .verdict-line b{color:#fff}
[data-page="asset-review"] .score-badge{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:22px 24px;text-align:center;align-self:center;min-width:236px}
[data-page="asset-review"] .score-badge .exlogo{width:104px;height:104px;margin:0 auto 14px;display:grid;place-items:center;overflow:hidden}
[data-page="asset-review"] .score-badge .exlogo img{width:100%;height:100%;object-fit:contain}
[data-page="asset-review"] .score-badge .exlogo span{font-family:var(--serif);font-weight:800;font-size:21px;color:#fff}
[data-page="asset-review"] .score-badge .sb-cols{display:grid;grid-template-columns:1fr auto 1fr;grid-template-rows:auto auto auto;align-items:center;justify-items:center;column-gap:14px;row-gap:9px}
[data-page="asset-review"] .score-badge .sb-col{display:contents}
[data-page="asset-review"] .score-badge .sb-col:first-child>*:nth-child(1){grid-row:1;grid-column:1}
[data-page="asset-review"] .score-badge .sb-col:first-child>*:nth-child(2){grid-row:2;grid-column:1}
[data-page="asset-review"] .score-badge .sb-col:first-child>*:nth-child(3){grid-row:3;grid-column:1}
[data-page="asset-review"] .score-badge .sb-col:last-child>*:nth-child(1){grid-row:1;grid-column:3}
[data-page="asset-review"] .score-badge .sb-col:last-child>*:nth-child(2){grid-row:2;grid-column:3}
[data-page="asset-review"] .score-badge .sb-col:last-child>*:nth-child(3){grid-row:3;grid-column:3}
[data-page="asset-review"] .score-badge .sb-vdiv{grid-row:1/4;grid-column:2;align-self:stretch;width:1px;background:rgba(255,255,255,.16)}
[data-page="asset-review"] .score-badge .sb-label{display:flex;align-items:flex-start;justify-content:center;gap:5px;text-align:center;font-size:13px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:rgba(255,255,255,.72);line-height:1.3;min-height:2.6em}
[data-page="asset-review"] .score-badge .sb-label .lbl-tx{padding-top:1px}
[data-page="asset-review"] .score-badge .sb-info{position:relative;flex:none;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;margin:-8px -8px -8px 0;padding:0;border:none;background:none;color:rgba(255,255,255,.55);cursor:help;-webkit-tap-highlight-color:transparent}
[data-page="asset-review"] .score-badge .sb-info svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
[data-page="asset-review"] .score-badge .sb-info:hover,[data-page="asset-review"] .score-badge .sb-info:focus-visible{color:var(--gold-bright)}
[data-page="asset-review"] .score-badge .sb-info:hover::after,[data-page="asset-review"] .score-badge .sb-info:focus-visible::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 9px);transform:translateX(-50%);width:172px;background:var(--green-950);color:#fff;font-family:var(--thai);font-size:11.5px;font-weight:500;text-transform:none;letter-spacing:normal;line-height:1.5;padding:10px 12px;border-radius:10px;box-shadow:0 10px 24px rgba(0,0,0,.4);z-index:30}
[data-page="asset-review"] .score-badge .row1{display:flex;align-items:baseline;gap:4px}
[data-page="asset-review"] .score-badge .big{font-family:var(--serif);font-weight:800;font-size:30px;color:#fff;line-height:1}
[data-page="asset-review"] .score-badge .max{font-family:var(--mono);font-weight:700;font-size:12.5px;color:rgba(255,255,255,.5)}
[data-page="asset-review"] .score-badge .grade{display:inline-flex;align-items:center;font-size:11px;font-weight:800;color:var(--green-950);background:var(--gold-bright);padding:4px 10px;border-radius:99px;white-space:nowrap}
[data-page="asset-review"] .score-badge .grade.trust{color:var(--green-900);background:rgba(255,255,255,.9)}
[data-page="asset-review"] .score-badge .stars{display:flex;gap:3px}
[data-page="asset-review"] .score-badge .stars svg{width:15px;height:15px}
[data-page="asset-review"] .score-badge .btn{width:100%;margin-top:18px}
[data-page="asset-review"] .sum-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;position:relative;box-shadow:var(--shadow)}
[data-page="asset-review"] .fact{background:var(--surface);padding:14px 16px;display:flex;align-items:center;gap:11px}
[data-page="asset-review"] .fact .ic{width:30px;height:30px;border-radius:8px;background:var(--gold-soft);display:grid;place-items:center;color:var(--gold-deep);flex:none}
[data-page="asset-review"] .fact .ic svg{width:16px;height:16px}
[data-page="asset-review"] .fact .k{font-size:11px;color:var(--ink-3);font-weight:500}
[data-page="asset-review"] .fact .v{font-size:13.5px;font-weight:700;line-height:1.25;color:var(--ink)}
[data-page="asset-review"] .sum-mid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px}
[data-page="asset-review"] .sum-stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow)}
[data-page="asset-review"] .mstat{background:var(--surface);padding:18px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
[data-page="asset-review"] .mstat .n{font-family:var(--mono);font-weight:800;font-size:26px;color:var(--green-900);line-height:1}
[data-page="asset-review"] .mstat .n .u{color:var(--gold-deep);font-size:18px}
[data-page="asset-review"] .mstat .l{font-size:12px;color:var(--ink-2);margin-top:6px;font-weight:600}
[data-page="asset-review"] .mstat .s{font-size:10.5px;color:var(--ink-3)}
[data-page="asset-review"] .sum-scores{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:18px 24px}
[data-page="asset-review"] .sum-scores .ttl{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:14px}
[data-page="asset-review"] .bar-row{margin-bottom:13px}
[data-page="asset-review"] .bar-row .t{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;margin-bottom:6px}
[data-page="asset-review"] .bar-row .t .lab{font-weight:600;color:var(--ink)}
[data-page="asset-review"] .bar-row .t .sc{font-family:var(--mono);font-weight:800;font-size:14px;color:var(--ink)}
[data-page="asset-review"] .track{position:relative;height:8px;border-radius:99px;overflow:hidden;background:linear-gradient(90deg,var(--score-lo),var(--score-mid) 50%,#37A24A);box-shadow:none}
[data-page="asset-review"] .fill{position:absolute;top:0;bottom:0;right:0;left:0;background:#E9EFEA;transition:left 1.1s cubic-bezier(.2,.7,.2,1)}
[data-page="asset-review"] .sum-foot{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}
[data-page="asset-review"] .pc{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:18px 24px}
[data-page="asset-review"] .pc h4{font-size:13px;display:flex;align-items:center;gap:8px;margin-bottom:10px;text-transform:uppercase;letter-spacing:.04em}
[data-page="asset-review"] .pc.pro h4{color:var(--up)}
[data-page="asset-review"] .pc.con h4{color:var(--down)}
[data-page="asset-review"] .pc h4 svg{width:16px;height:16px}
[data-page="asset-review"] .pc ul{list-style:none;display:grid;gap:7px}
[data-page="asset-review"] .pc li{display:flex;gap:8px;font-size:13.5px;color:var(--ink-2);align-items:flex-start}
[data-page="asset-review"] .pc li svg{width:15px;height:15px;flex:none;margin-top:3px}
[data-page="asset-review"] .pc.pro li svg{color:var(--up)}
[data-page="asset-review"] .pc.con li svg{color:var(--down)}
[data-page="asset-review"] section.band{padding:0 0 40px}
[data-page="asset-review"] .band.alt{background:var(--cream-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
[data-page="asset-review"] #news{padding-top:32px}
[data-page="asset-review"] .shead{margin-bottom:20px;max-width:760px}
[data-page="asset-review"] .eyebrow{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);display:flex;align-items:center;gap:9px;margin-bottom:9px}
[data-page="asset-review"] .eyebrow::before{content:"";width:22px;height:2px;background:var(--gold)}
[data-page="asset-review"] .shead h2{font-family:var(--serif);font-size:clamp(22px,3vw,28px);color:var(--green-900)}
[data-page="asset-review"] .shead p{color:var(--ink-2);font-size:15px;margin-top:7px}
[data-page="asset-review"] .rframe{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);padding:28px 32px}
[data-page="asset-review"] .rframe .wcb-shead{margin-bottom:18px}
[data-page="asset-review"] .rbody{max-width:760px;color:var(--ink-2);font-size:15.5px}
[data-page="asset-review"] .rbody h3{font-family:var(--serif);font-size:20px;color:var(--green-900);margin:22px 0 10px}
[data-page="asset-review"] .rbody p{margin-bottom:13px}
[data-page="asset-review"] .rbody b{color:var(--ink);font-weight:700}
[data-page="asset-review"] .rbody .pq{border-left:3px solid var(--gold);background:var(--gold-soft);padding:14px 18px;border-radius:0 10px 10px 0;font-family:var(--serif);font-size:18px;color:var(--green-900);margin:18px 0}
[data-page="asset-review"] .ltable{border:1px solid var(--border);border-radius:var(--r);overflow:hidden;background:var(--surface);box-shadow:var(--shadow)}
[data-page="asset-review"] .ltable .lh,[data-page="asset-review"] .ltable .lr{display:grid;grid-template-columns:1.4fr 1fr 1.1fr 100px;gap:12px;padding:13px 18px;align-items:center}
[data-page="asset-review"] .ltable .lh{background:var(--green-900);color:#fff;font-size:12px;font-weight:700;letter-spacing:.02em}
[data-page="asset-review"] .ltable .lr{border-bottom:1px solid var(--cream-2);font-size:13.5px}
[data-page="asset-review"] .ltable .lr:last-child{border:none}
[data-page="asset-review"] .ltable .lr:hover{background:var(--cream-2)}
[data-page="asset-review"] .ltable .ag{font-weight:700;color:var(--ink)}
[data-page="asset-review"] .ltable .no{font-family:var(--mono);font-size:12.5px;color:var(--ink-2)}
[data-page="asset-review"] .tier{font-size:11px;font-weight:700;padding:3px 9px;border-radius:var(--pill);text-align:center}
[data-page="asset-review"] .tier.t1{background:var(--up-soft);color:var(--up)}
[data-page="asset-review"] .tier.t2{background:var(--gold-soft);color:var(--gold-deep)}
[data-page="asset-review"] .tier.off{background:var(--cream-2);color:var(--ink-3)}
[data-page="asset-review"] .byline{display:flex;gap:14px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px 20px;box-shadow:var(--shadow);align-items:center}
[data-page="asset-review"] .bperson{display:flex;align-items:center;gap:10px;padding-right:18px;border-right:1px solid var(--border)}
[data-page="asset-review"] .bperson:last-of-type{border-right:none}
[data-page="asset-review"] .bperson .av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--green-800),var(--green-600));color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:14px;flex:none}
[data-page="asset-review"] .bperson .role{font-size:11px;color:var(--ink-3);font-weight:600}
[data-page="asset-review"] .bperson .nm{font-size:13.5px;font-weight:700;color:var(--ink)}
[data-page="asset-review"] .byline .upd{margin-left:auto;font-size:12.5px;color:var(--ink-2)}
[data-page="asset-review"] .byline .upd b{color:var(--green-900)}
[data-page="asset-review"] .topic-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
[data-page="asset-review"] .topic{display:flex;align-items:center;gap:11px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:13px 14px;cursor:pointer;transition:border .18s,transform .18s,box-shadow .2s}
[data-page="asset-review"] .topic:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:var(--shadow)}
[data-page="asset-review"] .topic .ic{width:38px;height:38px;border-radius:10px;background:var(--gold-soft);display:grid;place-items:center;color:var(--gold-deep);flex:none;transition:.18s}
[data-page="asset-review"] .topic:hover .ic{background:var(--gold);color:var(--green-900)}
[data-page="asset-review"] .topic .ic svg{width:19px;height:19px}
[data-page="asset-review"] .topic .tx{flex:1;min-width:0}
[data-page="asset-review"] .topic .tt{display:block;font-family:var(--serif);font-weight:700;font-size:14px;line-height:1.25;color:var(--green-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
[data-page="asset-review"] .topic .ts{display:block;font-size:11px;color:var(--ink-3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
[data-page="asset-review"] .topic .arr{display:flex;align-items:center;justify-content:center;align-self:center;margin-left:auto;color:var(--ink-3);flex:none;transition:.18s}
[data-page="asset-review"] .topic:hover .arr{color:var(--gold-deep);transform:translateX(3px)}
[data-page="asset-review"] .topic .arr svg{width:16px;height:16px}
[data-page="asset-review"] .layout{display:grid;grid-template-columns:1fr 300px;gap:26px;align-items:start}
[data-page="asset-review"] .list{display:grid;gap:11px}
[data-page="asset-review"] .arow{display:flex;align-items:stretch;background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;cursor:pointer;transition:border .18s,transform .18s,box-shadow .2s}
[data-page="asset-review"] .arow:hover{border-color:var(--gold);transform:translateX(3px);box-shadow:var(--shadow)}
[data-page="asset-review"] .arow .thumb{width:96px;flex:0 0 96px;background-size:cover;background-position:center;align-self:stretch;border-right:1px solid var(--border)}
[data-page="asset-review"] .arow .main{flex:1;min-width:0;padding:15px 18px}
[data-page="asset-review"] .arow .meta{display:flex;align-items:center;gap:10px;font-size:11.5px;margin-bottom:5px;flex-wrap:wrap}
[data-page="asset-review"] .arow .cat{font-weight:600;color:var(--gold-deep);background:var(--gold-soft);padding:2px 9px;border-radius:99px}
[data-page="asset-review"] .arow .time{display:inline-flex;align-items:center;gap:5px;color:var(--ink-3)}
[data-page="asset-review"] .arow .time svg{width:13px;height:13px}
[data-page="asset-review"] .arow h3{font-family:var(--serif);font-size:16px;line-height:1.35;margin-bottom:3px;color:var(--green-900)}
[data-page="asset-review"] .arow p{font-size:13px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
[data-page="asset-review"] .arow .go{flex:none;display:grid;place-items:center;padding:0 16px;color:var(--ink-3);transition:.18s}
[data-page="asset-review"] .arow:hover .go{color:var(--gold-deep);transform:translateX(3px)}
[data-page="asset-review"] .arow .go svg{width:20px;height:20px}
[data-page="asset-review"] .list-foot{text-align:center;margin-top:18px}
[data-page="asset-review"] .side{display:grid;gap:18px;position:sticky;top:74px}
[data-page="asset-review"] .wbox{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
[data-page="asset-review"] .wbox-h{padding:13px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:9px;font-family:var(--serif);font-weight:700;font-size:15px;color:var(--green-900)}
[data-page="asset-review"] .wbox-h .ic{width:30px;height:30px;border-radius:8px;background:var(--gold-soft);display:grid;place-items:center;color:var(--gold-deep);flex:none}
[data-page="asset-review"] .wbox-h .ic svg{width:16px;height:16px}
[data-page="asset-review"] .wbox-b.links a{display:flex;align-items:center;gap:11px;padding:11px 18px;border-bottom:1px solid var(--cream-2);font-size:13.5px;color:inherit;text-decoration:none;cursor:pointer;transition:.15s}
[data-page="asset-review"] .wbox-b.links a:last-child{border-bottom:none}
[data-page="asset-review"] .wbox-b.links a:hover{background:var(--cream-2)}
[data-page="asset-review"] .wbox-b.links a .nm{flex:1;min-width:0;font-weight:600;color:var(--ink)}
[data-page="asset-review"] .wbox-b.links a svg{width:16px;height:16px;color:var(--ink-3);flex:none}
[data-page="asset-review"] .side-signup{background:linear-gradient(160deg,var(--green-800),var(--green-950));border:1px solid rgba(201,162,39,.4);border-radius:var(--r-lg);padding:20px;color:#fff;box-shadow:var(--shadow);position:relative;overflow:hidden}
[data-page="asset-review"] .side-signup::before{content:"";position:absolute;width:180px;height:180px;right:-70px;top:-80px;border-radius:50%;background:none;pointer-events:none}
[data-page="asset-review"] .side-signup>*{position:relative}
[data-page="asset-review"] .ss-top{display:flex;align-items:center;gap:11px;margin-bottom:12px}
[data-page="asset-review"] .ss-logo{width:42px;height:42px;border-radius:11px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:13px;flex:none;box-shadow:none}
[data-page="asset-review"] .ss-eyebrow{display:block;font-size:10.5px;letter-spacing:.08em;color:var(--gold-bright);font-weight:700;text-transform:uppercase;margin-bottom:1px}
[data-page="asset-review"] .ss-top b{font-family:var(--serif);font-size:20px;color:#fff;line-height:1.1}
[data-page="asset-review"] .ss-rating{display:flex;align-items:center;gap:7px;font-size:12px;color:rgba(255,255,255,.7);margin-bottom:13px}
[data-page="asset-review"] .ss-rating .stars{display:inline-flex;gap:1px}
[data-page="asset-review"] .ss-rating .stars svg{width:14px;height:14px}
[data-page="asset-review"] .ss-rating b{font-family:var(--mono);color:var(--gold-bright);font-weight:800;font-size:13px}
[data-page="asset-review"] .ss-head{font-family:var(--serif);font-size:16.5px;font-weight:700;color:var(--gold-bright);margin-bottom:13px;line-height:1.35}
[data-page="asset-review"] .ss-perks{list-style:none;display:grid;gap:9px;margin:0 0 16px;padding:0}
[data-page="asset-review"] .ss-perks li{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:rgba(255,255,255,.85);line-height:1.4}
[data-page="asset-review"] .ss-perks li svg{width:16px;height:16px;stroke:#7FC9A6;fill:none;stroke-width:2.6;flex:none;margin-top:2px}
[data-page="asset-review"] .side-signup .btn-block{width:100%}
[data-page="asset-review"] .ss-fine{font-size:10.5px;color:rgba(255,255,255,.5);text-align:center;margin-top:11px;line-height:1.5}
[data-page="asset-review"] .social-ico{display:flex;gap:10px;margin-top:14px}
[data-page="asset-review"] .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
[data-page="asset-review"] .reveal.in{opacity:1;transform:none}
@media(max-width:980px){[data-page="asset-review"] .sum-head{grid-template-columns:1fr;gap:18px}[data-page="asset-review"] .sum-mid{grid-template-columns:1fr}[data-page="asset-review"] .topic-grid{grid-template-columns:1fr 1fr}[data-page="asset-review"] .layout{grid-template-columns:1fr}[data-page="asset-review"] .side{position:static}}
@media(max-width:820px){body[data-page="asset-review"]{padding-bottom:calc(64px + env(safe-area-inset-bottom))}}
@media(max-width:640px){[data-page="asset-review"] .wrap{padding:0 16px}[data-page="asset-review"] .hero .wrap{padding-bottom:32px}[data-page="asset-review"] .sum-head{gap:16px}[data-page="asset-review"] .sum-head h1{font-size:clamp(24px,6.6vw,32px)}[data-page="asset-review"] .score-badge{min-width:0}[data-page="asset-review"] .sum-facts{grid-template-columns:1fr}[data-page="asset-review"] .sum-stats{grid-template-columns:1fr}[data-page="asset-review"] .sum-foot{grid-template-columns:1fr}[data-page="asset-review"] .topic-grid{grid-template-columns:1fr}[data-page="asset-review"] .ltable{border:none;background:none;box-shadow:none;overflow:visible}[data-page="asset-review"] .ltable .lh{display:none}[data-page="asset-review"] .ltable .lr{display:block;padding:0;border:1px solid var(--border);border-radius:12px;background:var(--surface);box-shadow:var(--shadow);margin-bottom:10px}[data-page="asset-review"] .ltable .lr:last-child{margin-bottom:0}[data-page="asset-review"] .ltable .lr:hover{background:var(--surface)}[data-page="asset-review"] .ltable .lr>span{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 16px;border-bottom:1px solid var(--cream-2);font-size:13.5px}[data-page="asset-review"] .ltable .lr>span:last-child{border-bottom:none}[data-page="asset-review"] .ltable .lr>span::before{content:attr(data-label);font-weight:600;color:var(--ink-3);font-size:12px;flex:none}[data-page="asset-review"] .ltable .no{display:block;text-align:right}[data-page="asset-review"] .byline{flex-direction:column;align-items:flex-start;gap:10px}[data-page="asset-review"] .bperson{border-right:none;padding-right:0}[data-page="asset-review"] .byline .upd{margin-left:0}}
[data-page="asset-review"] .sum-chans{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;margin-top:24px;box-shadow:var(--shadow)}
[data-page="asset-review"] .chan-grp{background:var(--surface);padding:18px 24px}
[data-page="asset-review"] .chan-grp .ck{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--ink-3);letter-spacing:.04em;margin-bottom:11px}
[data-page="asset-review"] .chan-grp .ck .fl{font-size:14px;line-height:1}
[data-page="asset-review"] .chan-grp .cchs{display:flex;gap:7px;flex-wrap:wrap}
[data-page="asset-review"] .chan-grp .cch{font-size:11.5px;font-weight:600;color:var(--ink-2);background:var(--cream-2);border:1px solid var(--border);padding:4px 10px;border-radius:99px}
@media(max-width:640px){[data-page="asset-review"] .sum-chans{grid-template-columns:1fr}}
@media(max-width:640px){[data-page="asset-review"] .rframe{padding:20px 18px}}
[data-page="asset-review"] .rv-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:linear-gradient(160deg,var(--green-800),var(--green-950));border:1px solid rgba(201,162,39,.4);border-radius:var(--r-lg);padding:18px 22px;color:#fff}
[data-page="asset-review"] .rv-banner .rvb-t b{font-family:var(--serif);font-size:18px;color:var(--gold-bright);display:block}
[data-page="asset-review"] .rv-banner .rvb-t span{font-size:12.5px;color:rgba(255,255,255,.7)}

/* ===== page: brokers — scoped [data-page="brokers"] ===== */
[data-page="brokers"] .wrap{max-width:1200px;margin:0 auto;padding:0 20px}
[data-page="brokers"] .brk-hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
[data-page="brokers"] .brk-hero::before{content:"";position:absolute;inset:0;background:none;pointer-events:none}
[data-page="brokers"] .brk-hero-in{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:26px 20px 26px}
[data-page="brokers"] .brk-crumb{font-size:12.5px;color:rgba(255,255,255,.62);margin-bottom:12px}
[data-page="brokers"] .brk-crumb a{color:rgba(255,255,255,.62);text-decoration:none}
[data-page="brokers"] .brk-crumb a:hover{color:var(--gold-bright)}
[data-page="brokers"] .brk-crumb b{color:#fff}
[data-page="brokers"] .brk-hero .eyebrow{display:inline-block;font-size:12px;letter-spacing:.16em;color:var(--gold-bright);font-weight:600;text-transform:uppercase}
[data-page="brokers"] .brk-hero h1{font-family:var(--serif);font-weight:800;font-size:clamp(27px,4.6vw,44px);line-height:1.18;margin:10px 0 8px;max-width:32ch;white-space:nowrap}
@media(max-width:560px){[data-page="brokers"] .brk-hero h1{white-space:normal}}
[data-page="brokers"] .brk-hero h1 .gold{color:var(--gold-bright)}
[data-page="brokers"] .brk-hero p{font-size:clamp(14px,2vw,16px);color:rgba(255,255,255,.8);max-width:66ch;line-height:1.6}
[data-page="brokers"] .brk-risk{margin:40px 0 0}
[data-page="brokers"] .brk-risk-in{display:flex;gap:12px;background:var(--gold-soft);border:1px solid #E7D9A6;border-left:4px solid var(--gold);border-radius:12px;padding:14px 18px;font-size:12.5px;color:#5B4708;line-height:1.6}
[data-page="brokers"] .brk-risk-in svg{width:20px;height:20px;flex:none;stroke:var(--gold-deep);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:1px}
[data-page="brokers"] .brk-wrap{max-width:1200px;margin:0 auto;padding:32px 20px 44px}
[data-page="brokers"] .brk-main{min-width:0}
[data-page="brokers"] .brk-count{font-size:12.5px;color:var(--ink-2);font-weight:600;margin:0 0 14px;font-family:var(--mono)}
[data-page="brokers"] .brk-list{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;align-items:stretch}
[data-page="brokers"] .brk-card{position:relative;height:100%;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;transition:transform .16s,box-shadow .16s,border-color .16s,background .16s}
[data-page="brokers"] .brk-card.feat{border-color:#E7D9A6;box-shadow:none;background:var(--surface)}
[data-page="brokers"] .brk-card[data-review]{cursor:pointer}
[data-page="brokers"] .brk-card[data-review]:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
[data-page="brokers"] .brk-card-in{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:24px 14px 18px}
[data-page="brokers"] .brk-card.feat .brk-card-in{padding-top:30px}
[data-page="brokers"] .brk-brand{display:flex;flex-direction:column;align-items:center;gap:10px}
[data-page="brokers"] .brk-brand .wcb-logo{--sz:56px}
[data-page="brokers"] .brk-name{font-family:var(--serif);font-weight:800;font-size:15.5px;color:var(--green-900);line-height:1.25}
[data-page="brokers"] .brk-rate-wrap{display:flex;flex-direction:column;align-items:center;gap:5px}
[data-page="brokers"] .brk-rate{display:flex;flex-direction:column;align-items:center;gap:5px}
[data-page="brokers"] .brk-stars{display:flex;gap:2px;line-height:0}
[data-page="brokers"] .brk-star svg{width:17px;height:17px;fill:#dcd7c4}
[data-page="brokers"] .brk-star.on svg{fill:var(--gold)}
[data-page="brokers"] .brk-score{font-weight:800;font-size:10px;color:var(--ink-2)}
[data-page="brokers"] .brk-score10{display:inline-flex;align-items:baseline;gap:2px;font-family:var(--mono);font-weight:800;font-size:11.5px;color:var(--gold-deep);background:var(--gold-soft);border-radius:var(--pill);padding:2px 9px}
[data-page="brokers"] .brk-of10{font-size:9.5px;font-weight:700;color:var(--gold-deep);opacity:.8}
[data-page="brokers"] .brk-norate{font-size:11.5px;font-weight:600;color:var(--ink-2);background:var(--cream-2);border:1px solid var(--border);border-radius:var(--pill);padding:4px 11px}
[data-page="brokers"] .brk-edlabel{font-size:10px;color:var(--ink-2);font-weight:600}
[data-page="brokers"] .brk-cta{width:100%;margin-top:auto;padding-top:4px}
[data-page="brokers"] .brk-cta .btn{width:100%}
[data-page="brokers"] .brk-cta .btn-green{background:var(--green-700)}
[data-page="brokers"] .brk-cta .btn-green:hover{background:var(--green-800)}
[data-page="brokers"] .brk-soon{display:flex;align-items:center;justify-content:center;min-height:40px;padding:9px 12px;border-radius:11px;background:var(--cream-2);color:var(--ink-2);font-size:12px;font-weight:700;border:1px dashed var(--border-2)}
[data-page="brokers"] .brk-empty{padding:50px 20px;text-align:center;color:var(--ink-2);background:var(--surface);border:1px dashed var(--border);border-radius:var(--r);font-size:14px}
[data-page="brokers"] .brk-guides{margin-top:40px}
[data-page="brokers"] .brk-guide{display:grid;grid-template-columns:minmax(260px,.42fr) minmax(0,.58fr);column-gap:48px;padding:32px 0;border-top:1px solid var(--border)}
[data-page="brokers"] .brk-guide:last-child{border-bottom:1px solid var(--border)}
[data-page="brokers"] .brk-guide h2{position:relative;grid-column:1;grid-row:1 / span 3;align-self:start;max-width:17ch;padding-left:24px;font-family:var(--serif);font-weight:800;font-size:27px;line-height:1.28;color:var(--green-900);scroll-margin-top:20px;overflow-wrap:anywhere;min-width:0}
[data-page="brokers"] .brk-guide h2::before{content:"";position:absolute;left:0;top:.58em;width:7px;height:7px;background:var(--gold)}
[data-page="brokers"] .brk-guide p{grid-column:2;max-width:75ch;font-size:15px;color:var(--ink-2);line-height:1.75;margin-bottom:12px}
[data-page="brokers"] .brk-guide p:last-child{margin-bottom:0}
[data-page="brokers"] .brk-guide ul{grid-column:2;margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
[data-page="brokers"] .brk-guide li{display:block;font-size:14.5px;color:var(--ink-2);line-height:1.65}
@media(max-width:820px){
  [data-page="brokers"] .brk-guide{display:block;padding:28px 0}
  [data-page="brokers"] .brk-guide h2{max-width:none;margin-bottom:16px;font-size:24px}
}
@media(max-width:1100px){[data-page="brokers"] .brk-list{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:820px){[data-page="brokers"] .brk-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){[data-page="brokers"] .brk-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:400px){[data-page="brokers"] .brk-list{grid-template-columns:1fr}}

/* ===== page: compare-chart — scoped [data-page="compare-chart"] ===== */
[data-page="compare-chart"] .hero-disc{display:flex;align-items:flex-start;gap:8px;margin-top:16px;font-size:12.5px;color:rgba(255,255,255,.72);max-width:64ch}
[data-page="compare-chart"] .hero-disc svg{width:15px;height:15px;stroke:var(--gold-bright);fill:none;stroke-width:2;flex:none;margin-top:2px}
body[data-page="compare-chart"]{
  --sym-spike-bg:#FBECEA;--sym-spike-fg:#B4443A;--sym-spike-line:#D9584A;
  --sym-dev-bg:#FBF3DC;--sym-dev-fg:#8C6A12;--sym-dev-line:#C9A227;
  --sym-freeze-bg:#EAF1F5;--sym-freeze-fg:#3C6485;--sym-freeze-line:#5B87A8;
  --sym-gap-bg:#F1ECF6;--sym-gap-fg:#6A4E8C;--sym-gap-line:#8B6BB0;
  --consensus:#8A988F;
}
[data-page="compare-chart"] .anom-feedwrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;margin-bottom:18px;box-shadow:var(--shadow)}
[data-page="compare-chart"] .anom-feedhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px 16px;border-bottom:1px solid var(--border);background:var(--cream-2)}
[data-page="compare-chart"] .anom-feedhead .lbl{display:inline-flex;align-items:center;gap:8px;font-family:var(--serif);font-weight:800;font-size:15px;color:var(--green-900)}
[data-page="compare-chart"] .anom-feedhead .live{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--pay)}
[data-page="compare-chart"] .anom-feedhead .live .dot{width:8px;height:8px;border-radius:50%;background:#D9584A;animation:rttPulse 1.8s infinite}
[data-page="compare-chart"] .anom-filters{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}


[data-page="compare-chart"] .anom-selectrow{display:flex;gap:10px;flex-wrap:wrap;padding:11px 16px;border-bottom:1px solid var(--border);align-items:center}
[data-page="compare-chart"] .anom-selectrow label{font-size:12px;font-weight:600;color:var(--ink-3)}
@media(max-width:640px){
  [data-page="compare-chart"] .anom-selectrow{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 12px}
  [data-page="compare-chart"] .anom-selectrow .rtt-select{width:100%;min-width:0}
}
[data-page="compare-chart"] .anom-list{max-height:430px;overflow-y:auto}
[data-page="compare-chart"] .anom-ev{display:grid;grid-template-columns:58px 86px minmax(130px,.7fr) minmax(0,1.6fr) auto;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--border);cursor:pointer;transition:background .15s}
[data-page="compare-chart"] .anom-ev:hover{background:var(--cream-2)}
[data-page="compare-chart"] .anom-ev:last-child{border-bottom:none}
[data-page="compare-chart"] .anom-ev .time{font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--ink-3);width:auto;text-align:left;font-variant-numeric:tabular-nums}
[data-page="compare-chart"] .anom-badge{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:var(--pill);white-space:nowrap;flex:none}
[data-page="compare-chart"] .anom-badge.spike{background:var(--sym-spike-bg);color:var(--sym-spike-fg)}
[data-page="compare-chart"] .anom-badge.dev{background:var(--sym-dev-bg);color:var(--sym-dev-fg)}
[data-page="compare-chart"] .anom-badge.freeze{background:var(--sym-freeze-bg);color:var(--sym-freeze-fg)}
[data-page="compare-chart"] .anom-badge.gap{background:var(--sym-gap-bg);color:var(--sym-gap-fg)}
[data-page="compare-chart"] .anom-ev .bk{display:flex;align-items:center;gap:8px;min-width:0}
[data-page="compare-chart"] .anom-ev .bk .logo{width:30px;height:30px;border-radius:8px;background:var(--bk,#333);color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:9px;flex:none}
[data-page="compare-chart"] .anom-ev .bk b{font-family:var(--serif);font-size:14px;color:var(--green-900);white-space:nowrap}
[data-page="compare-chart"] .anom-ev .desc{font-size:13px;color:var(--ink-2);min-width:0;padding-left:12px;border-left:1px solid var(--border)}
[data-page="compare-chart"] .anom-ev .desc .num{font-family:var(--mono);font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
[data-page="compare-chart"] .anom-ev .desc .aset{font-size:11px;color:var(--ink-3);font-weight:600}
[data-page="compare-chart"] .anom-ev .see{flex:none;font-size:12px;font-weight:700;color:var(--gold-deep);display:inline-flex;align-items:center;gap:5px;white-space:nowrap;border:1px solid var(--border-2);border-radius:9px;padding:6px 11px;background:var(--surface)}
[data-page="compare-chart"] .anom-ev .see svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}
[data-page="compare-chart"] .anom-empty{padding:26px 16px;text-align:center;color:var(--ink-3);font-size:13.5px}
[data-page="compare-chart"] .anom-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:13.5px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow)}
[data-page="compare-chart"] .anom-tbl thead th{text-align:center;font-size:12px;color:var(--ink-3);font-weight:700;padding:13px 10px;white-space:nowrap;background:#F4F6F3;border-bottom:1px solid var(--border)}
[data-page="compare-chart"] .anom-tbl thead th:first-child{border-top-left-radius:var(--r);text-align:left}
[data-page="compare-chart"] .anom-tbl thead th:last-child{border-top-right-radius:var(--r)}
[data-page="compare-chart"] .anom-tbl thead th.l{text-align:left;padding-left:10px}
[data-page="compare-chart"] .anom-tbl tbody td{background:transparent;padding:13px 10px;border-bottom:1px solid var(--border);text-align:center;vertical-align:middle}
[data-page="compare-chart"] .anom-tbl tbody tr:last-child td{border-bottom:none}
[data-page="compare-chart"] .anom-tbl tbody tr:hover td{background:#F8F8F8}
[data-page="compare-chart"] .anom-tbl tbody td:first-child{text-align:left}
[data-page="compare-chart"] .anom-tbl tbody td:last-child{color:var(--ink-3);font-size:12px}
[data-page="compare-chart"] .anom-tbl tbody tr:last-child td:first-child{border-bottom-left-radius:var(--r)}
[data-page="compare-chart"] .anom-tbl tbody tr:last-child td:last-child{border-bottom-right-radius:var(--r)}
[data-page="compare-chart"] .anom-bk{display:flex;align-items:center;gap:10px}
[data-page="compare-chart"] .anom-bk .logo{width:34px;height:34px;border-radius:9px;background:var(--bk,#333);color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:10px;flex:none}
[data-page="compare-chart"] .anom-bk b{font-family:var(--serif);font-size:14.5px;color:var(--green-900)}
[data-page="compare-chart"] .anom-bk .aff{font-size:9.5px;color:var(--gold-deep);background:var(--gold-soft);border:1px solid #ecd9a8;border-radius:var(--pill);padding:1px 6px;font-weight:700;margin-left:2px}
[data-page="compare-chart"] .anom-cell{display:inline-flex;align-items:center;justify-content:center;min-width:46px;font-family:var(--mono);font-weight:700;font-size:14px;font-variant-numeric:tabular-nums;padding:5px 10px;border-radius:9px}
[data-page="compare-chart"] .anom-cell.t0{background:var(--up-soft);color:var(--up)}
[data-page="compare-chart"] .anom-cell.t1{background:#F4F5EC;color:var(--ink-2)}
[data-page="compare-chart"] .anom-cell.t2{background:var(--sym-dev-bg);color:var(--sym-dev-fg);outline:1px solid var(--border-2)}
[data-page="compare-chart"] .anom-cell.t3{background:var(--sym-spike-bg);color:var(--sym-spike-fg);outline:2px solid var(--sym-spike-line);outline-offset:-1px}
[data-page="compare-chart"] .anom-note{font-size:12px;color:var(--ink-3);margin:2px 0 16px}
[data-page="compare-chart"] .anom-note b{color:var(--green-900)}
[data-page="compare-chart"] .ovl{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:18px 20px 20px;box-shadow:var(--shadow)}
[data-page="compare-chart"] .ovl-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:6px}
[data-page="compare-chart"] .ovl-head .ev{font-size:13px;color:var(--ink-2)}
[data-page="compare-chart"] .ovl-head .ev b{color:var(--green-900)}
[data-page="compare-chart"] .ovl-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--ink-2);margin-bottom:10px}
[data-page="compare-chart"] .ovl-legend span{display:inline-flex;align-items:center;gap:7px}
[data-page="compare-chart"] .ovl-legend i{width:22px;height:3px;border-radius:2px;flex:none}
[data-page="compare-chart"] .ovl-legend i.cons{background:var(--consensus)}
[data-page="compare-chart"] .ovl-legend i.dev{background:var(--sym-spike-line);height:4px}
[data-page="compare-chart"] .ovl-chart{width:100%;height:auto;display:block;border-radius:10px;background:linear-gradient(180deg,#fff,var(--cream-2))}
[data-page="compare-chart"] .ovl-cap{display:flex;align-items:flex-start;gap:9px;margin-top:12px;background:var(--cream-2);border:1px solid var(--border);border-left:4px solid var(--sym-spike-line);border-radius:var(--r);padding:11px 15px;font-size:13.5px;color:var(--ink)}
[data-page="compare-chart"] .ovl-cap .num{font-family:var(--mono);font-weight:800;color:var(--sym-spike-fg)}
[data-page="compare-chart"] .ovl-cap .num.c{color:var(--ink-2)}
[data-page="compare-chart"] .anom-disc{background:#FCFAF2;border:1px solid #E5D8AE;border-left:4px solid var(--gold);border-radius:var(--r);padding:18px 20px;margin:6px 0 22px}
[data-page="compare-chart"] .anom-disc h3{font-family:var(--serif);font-size:16px;color:var(--green-900);display:flex;align-items:center;gap:8px;margin-bottom:9px}
[data-page="compare-chart"] .anom-disc p{font-size:13px;color:var(--ink-2);line-height:1.72;margin-bottom:9px}
[data-page="compare-chart"] .anom-disc p:last-child{margin-bottom:0}
[data-page="compare-chart"] .anom-disc b{color:var(--ink)}
[data-page="compare-chart"] .anom-cta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:space-between;background:var(--green-900);color:#fff;border-radius:var(--r-lg);padding:22px 26px;margin-bottom:8px}
[data-page="compare-chart"] .anom-cta .t h3{font-family:var(--serif);font-size:20px;margin-bottom:5px}
[data-page="compare-chart"] .anom-cta .t p{font-size:13.5px;color:rgba(255,255,255,.8);max-width:52ch}
[data-page="compare-chart"] .anom-cta .btn{flex:none}
@media(max-width:760px){[data-page="compare-chart"] .anom-filters{margin-left:0;width:100%}[data-page="compare-chart"] .anom-ev{grid-template-columns:auto auto minmax(0,1fr);grid-template-areas:"time badge broker" "desc desc desc" "see see see";gap:8px 10px;align-items:start}[data-page="compare-chart"] .anom-ev .time{grid-area:time}[data-page="compare-chart"] .anom-ev .anom-badge{grid-area:badge}[data-page="compare-chart"] .anom-ev .bk{grid-area:broker}[data-page="compare-chart"] .anom-ev .desc{grid-area:desc;padding:9px 0 0;border-left:0;border-top:1px solid var(--border)}[data-page="compare-chart"] .anom-ev .see{grid-area:see;justify-content:center;margin:0;width:100%;min-height:44px}[data-page="compare-chart"] .anom-tbl thead{display:none}[data-page="compare-chart"] .anom-tbl{border:none;border-radius:0;box-shadow:none;background:none}[data-page="compare-chart"] .anom-tbl,[data-page="compare-chart"] .anom-tbl tbody,[data-page="compare-chart"] .anom-tbl tr,[data-page="compare-chart"] .anom-tbl td{display:block;width:auto}[data-page="compare-chart"] .anom-tbl tr{position:relative;background:#fff;border:1px solid #e6ede7;border-radius:12px;box-shadow:none;padding:13px 16px 14px;margin-bottom:12px}[data-page="compare-chart"] .anom-tbl tbody td{background:none;border:none;border-top:1px dashed #e6ede7;border-radius:0;padding:9px 0;text-align:right;display:flex;align-items:center;justify-content:space-between;gap:14px}[data-page="compare-chart"] .anom-tbl tbody td::before{content:attr(data-label);font-size:12.5px;color:var(--ink-2);font-weight:600;text-align:left;flex:none}[data-page="compare-chart"] .anom-tbl tbody td:first-child{border-top:none;padding:0 0 2px}[data-page="compare-chart"] .anom-tbl tbody td:first-child::before{display:none}[data-page="compare-chart"] .anom-cta{flex-direction:column;align-items:flex-start}[data-page="compare-chart"] .anom-cta .btn{width:100%}}

/* ===== page: compare-ea — scoped [data-page="compare-ea"] ===== */
[data-page="compare-ea"] .rtt-pill{display:inline-flex;align-items:center;padding:4px 12px;border-radius:var(--pill);font-family:var(--mono);font-weight:800;font-size:14px;font-variant-numeric:tabular-nums}
[data-page="compare-ea"] .rtt-pill.good{background:var(--up-soft);color:var(--up)}
[data-page="compare-ea"] .rtt-pill.bad{background:var(--down-soft);color:var(--pay)}
[data-page="compare-ea"] .ea-brief{background:var(--cream-2);border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;margin-bottom:18px}
[data-page="compare-ea"] .ea-brief p{font-size:14px;color:var(--ink-2);line-height:1.75}
[data-page="compare-ea"] .ea-brief p b{color:var(--ink)}
[data-page="compare-ea"] .ea-brief .ln2{margin-top:9px;display:flex;align-items:flex-start;gap:8px}
[data-page="compare-ea"] .ea-brief .ln2 .ic{flex:none;line-height:1.4}
[data-page="compare-ea"] .ea-brief mark{background:var(--gold-soft);color:var(--gold-deep);font-weight:700;padding:1px 5px;border-radius:5px}

/* ===== page: compare-slippage — scoped [data-page="compare-slippage"] ===== */
[data-page="compare-slippage"] .slp-intro{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;margin-bottom:16px;font-size:14px;color:var(--ink-2);line-height:1.7}
[data-page="compare-slippage"] .slp-intro b{color:var(--ink)}
[data-page="compare-slippage"] .slp-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
[data-page="compare-slippage"] .slp-card{display:flex;gap:14px;align-items:flex-start;border-radius:var(--r);padding:18px 20px;border:1px solid}
[data-page="compare-slippage"] .slp-card.good{background:var(--up-soft);border-color:#bcdcc8}
[data-page="compare-slippage"] .slp-card.bad{background:var(--down-soft);border-color:#eecdc9}
[data-page="compare-slippage"] .slp-card .ar{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;flex:none}
[data-page="compare-slippage"] .slp-card.good .ar{background:#d6ebdd;color:var(--up)}
[data-page="compare-slippage"] .slp-card.bad .ar{background:#f6d6d2;color:var(--down)}
[data-page="compare-slippage"] .slp-card .ar svg{width:22px;height:22px;stroke:currentColor;stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
[data-page="compare-slippage"] .slp-card h3{font-family:var(--serif);font-size:16px;margin-bottom:5px}
[data-page="compare-slippage"] .slp-card.good h3{color:var(--up)}
[data-page="compare-slippage"] .slp-card.bad h3{color:var(--down)}
[data-page="compare-slippage"] .slp-card p{font-size:13.5px;color:var(--ink-2);line-height:1.6}
[data-page="compare-slippage"] .slp-card p b{color:var(--ink)}
[data-page="compare-slippage"] .slp-resulthead{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:6px 0 10px}
[data-page="compare-slippage"] .slp-resulthead .title{display:flex;align-items:center;gap:10px}
[data-page="compare-slippage"] .slp-resulthead .ic{font-size:20px;line-height:1}
[data-page="compare-slippage"] .slp-resulthead h2{font-family:var(--serif);font-size:22px;color:var(--green-900)}
[data-page="compare-slippage"] .slp-resulthead .upd{font-size:12.5px;color:var(--ink-3)}
[data-page="compare-slippage"] .slp-resulthead .upd b{color:var(--ink-2);font-family:var(--mono);font-weight:700}
[data-page="compare-slippage"] .slp-legend{display:flex;align-items:center;gap:8px 18px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-2);background:var(--cream-2);border:1px solid var(--border);border-radius:var(--r);padding:10px 15px;margin-bottom:16px}
[data-page="compare-slippage"] .slp-legend .lg{display:inline-flex;align-items:center;gap:7px}
[data-page="compare-slippage"] .slp-legend .dot{width:9px;height:9px;border-radius:50%;flex:none}
[data-page="compare-slippage"] .slp-legend .dot.g{background:var(--up)}
[data-page="compare-slippage"] .slp-legend .dot.r{background:var(--down)}
[data-page="compare-slippage"] .slp-legend b{color:var(--ink)}
[data-page="compare-slippage"] .slp-legend .meta{color:var(--ink-3)}
@media(max-width:640px){[data-page="compare-slippage"] .slp-cards{grid-template-columns:1fr}}
[data-page="compare-slippage"] .slp-occ{font-family:var(--mono);font-weight:700;font-size:13.5px;color:var(--ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
[data-page="compare-slippage"] .slp-occ b{color:var(--down)}
[data-page="compare-slippage"] .slp-rate{display:inline-flex;align-items:center;padding:3px 11px;border-radius:var(--pill);font-family:var(--mono);font-weight:800;font-size:13px;font-variant-numeric:tabular-nums}
[data-page="compare-slippage"] .slp-rate.lo{background:var(--gold-soft);color:var(--gold-deep)}
[data-page="compare-slippage"] .slp-rate.hi{background:var(--down-soft);color:var(--down)}
[data-page="compare-slippage"] .slp-sz{font-family:var(--mono);font-weight:700;font-size:13.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
[data-page="compare-slippage"] .slp-sz.g{color:var(--up)}
[data-page="compare-slippage"] .slp-sz.o{color:var(--orange)}
[data-page="compare-slippage"] .slp-sz.r{color:var(--down)}
[data-page="compare-slippage"] .slp-score{font-family:var(--mono);font-weight:800;font-size:16px;color:var(--green-900);font-variant-numeric:tabular-nums}

/* ===== page: compare-spread — scoped [data-page="compare-spread"] ===== */
[data-page="compare-spread"] .pairrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
[data-page="compare-spread"] .pairrow label{font-size:13px;font-weight:600;color:var(--ink-2)}
[data-page="compare-spread"] .rtt-c-cta .bacts{justify-content:flex-end}
[data-page="compare-spread"] .swap-cell{display:inline-flex;flex-direction:column;gap:4px;align-items:flex-end}
[data-page="compare-spread"] .swap-line{display:flex;align-items:center;gap:10px;justify-content:flex-end}
[data-page="compare-spread"] .swap-line .k{font-size:11px;color:var(--ink-3);font-weight:600}
[data-page="compare-spread"] .swap-line .sv{font-family:var(--mono);font-weight:700;font-size:13px;font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;gap:4px;min-width:78px;justify-content:flex-end}
[data-page="compare-spread"] .swap-line .sv.neg{color:var(--pay)}
[data-page="compare-spread"] .swap-line .sv.pos{color:var(--recv)}
[data-page="compare-spread"] .cheapest-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:var(--up);margin-top:3px}
[data-page="compare-spread"] .btn-viewdata{display:inline-flex;align-items:center;justify-content:center;height:var(--btn-h-default);padding:0 14px;border:1.5px solid #CCC6AE;border-radius:10px;background:#FFFFFF;color:#1D2219;font-family:var(--thai);font-weight:700;font-size:13px;white-space:nowrap;cursor:pointer}
[data-page="compare-spread"] .rtt-tbl th.rtt-c-info,[data-page="compare-spread"] .rtt-tbl td.rtt-c-info{box-sizing:border-box;width:170px;text-align:center;padding-left:56px}
[data-page="compare-spread"] .acct-modal-card{padding:32px 24px}
[data-page="compare-spread"] .acct-tbl{width:100%;border-collapse:collapse;margin-top:6px}
[data-page="compare-spread"] .acct-tbl th{font-size:12px;font-weight:700;color:var(--ink-3);text-align:left;padding:0 10px 10px}
[data-page="compare-spread"] .acct-tbl th:not(:first-child){text-align:right}
[data-page="compare-spread"] .acct-tbl td{padding:14px 10px;border-top:1px solid var(--cream-2);vertical-align:middle}
[data-page="compare-spread"] .acct-tbl td:not(:first-child){text-align:right}
[data-page="compare-spread"] .acct-tbl .acct-nm{font-weight:700;color:var(--green-900);font-size:13.5px;white-space:nowrap}
@media(max-width:640px){
  [data-page="compare-spread"] .acct-modal-card{padding:24px 16px}
  [data-page="compare-spread"] .acct-tbl thead{display:none}
  [data-page="compare-spread"] .acct-tbl tbody{display:grid}
  [data-page="compare-spread"] .acct-tbl tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 14px;padding:14px 0;border-top:1px solid var(--cream-2)}
  [data-page="compare-spread"] .acct-tbl td{display:block;padding:0;border-top:0;text-align:left!important;min-width:0}
  [data-page="compare-spread"] .acct-tbl td:first-child{grid-column:1/-1}
  [data-page="compare-spread"] .acct-tbl .rtt-metric{align-items:flex-start;min-width:0;width:100%}
  [data-page="compare-spread"] .swap-cell{width:100%;align-items:stretch}
  [data-page="compare-spread"] .swap-line{gap:4px;justify-content:space-between}
  [data-page="compare-spread"] .swap-line .k{font-size:10px;white-space:nowrap}
  [data-page="compare-spread"] .swap-line .sv{min-width:0;font-size:11.5px;white-space:nowrap}
}

/* ===== page: home — scoped [data-page="home"] ===== */
@keyframes pulse-home{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes scroll-home{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes spin-home{100%{transform:rotate(360deg)}}
@keyframes rise-home{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
/* ---- homepage preview sections (news → ranking → reviews → analysis → assets) ---- */
[data-page="home"] .hp-sec{padding:50px 0}
[data-page="home"] .hp-sec:first-of-type{padding-top:32px}
[data-page="home"] .hp-sec + .hp-sec{box-shadow:inset 0 1px 0 #D8E6DC}
[data-page="home"] .hp-sec.alt{background:#EEF4F0}
[data-page="home"] .hp-sec-in{max-width:1180px;margin:0 auto;padding:0 20px}
[data-page="home"] .hp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
[data-page="home"] .hp-eyebrow{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);display:flex;align-items:center;gap:9px;margin-bottom:6px}
[data-page="home"] .hp-eyebrow::before{content:"";width:22px;height:2px;background:var(--gold)}
[data-page="home"] .hp-head h2{font-family:var(--serif);font-weight:800;font-size:24px;color:var(--green-900)}
[data-page="home"] .hp-head p{font-size:13.5px;color:var(--ink-2);margin-top:4px;max-width:60ch}
[data-page="home"] .hp-more{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--gold-deep);text-decoration:none;white-space:nowrap}
[data-page="home"] .hp-more svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .16s}
[data-page="home"] .hp-more:hover svg{transform:translateX(3px)}

/* -- 1. featured news: 1 big + 4 small -- */
[data-page="home"] .news-feat-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:18px}
[data-page="home"] .news-feat{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:340px;border-radius:var(--r-lg);overflow:hidden;background:linear-gradient(160deg,var(--green-800),var(--green-950));color:#fff;text-decoration:none;padding:26px;box-shadow:var(--shadow)}
[data-page="home"] .news-feat::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 85% -10%,rgba(201,162,39,.28),transparent 60%);pointer-events:none}
[data-page="home"] .news-feat-tag{position:relative;align-self:flex-start;font-size:11px;font-weight:800;color:var(--green-950);background:var(--gold-bright);padding:4px 11px;border-radius:var(--pill);margin-bottom:14px;text-transform:uppercase;letter-spacing:.03em}
[data-page="home"] .news-feat-title{position:relative;font-family:var(--serif);font-weight:800;font-size:clamp(20px,2.4vw,27px);line-height:1.32;margin-bottom:10px}
[data-page="home"] .news-feat-excerpt{position:relative;font-size:13.5px;color:rgba(255,255,255,.78);line-height:1.6;margin-bottom:14px;max-width:52ch}
[data-page="home"] .news-feat-meta{position:relative;display:flex;align-items:center;gap:8px;font-size:11.5px;color:rgba(255,255,255,.65);font-family:var(--mono)}
[data-page="home"] .news-mini-col{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:10px;height:100%}
[data-page="home"] .news-mini{display:flex;flex-direction:column;border:0.5px solid #86600A;border-radius:10px;overflow:hidden;background:var(--cream-2);text-decoration:none;color:inherit}
[data-page="home"] .news-mini-thumb{display:block;position:relative;flex:1;min-height:56px;background-size:cover;background-position:center}
[data-page="home"] .news-mini-cat{position:absolute;top:7px;left:7px;display:inline-flex;align-items:center;min-height:24px;box-sizing:border-box;font-size:10px;line-height:1;font-weight:800;color:var(--green-950);background:var(--gold-bright);padding:0 10px;border-radius:999px;letter-spacing:.02em}
[data-page="home"] .news-mini-body{display:block;flex:none;padding:8px 10px 10px}
[data-page="home"] .news-mini-title{display:block;font-family:var(--serif);font-weight:700;font-size:12.5px;color:var(--green-900);line-height:1.32;margin-bottom:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
[data-page="home"] .news-mini-title:hover{color:var(--gold-deep)}
[data-page="home"] .news-mini-meta{display:block;font-size:9.5px;color:var(--ink-3);font-family:var(--mono)}

/* -- 2. community ranking: top-3 mini leaderboard -- */
[data-page="home"] .rank-row{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:8px}
[data-page="home"] .rank-item{display:flex;align-items:center;gap:14px;padding:14px;border-radius:12px;text-decoration:none;color:inherit;transition:background .14s}
[data-page="home"] .rank-item:not(:last-child){border-bottom:1px dashed var(--border-2)}
[data-page="home"] .rank-item:hover{background:var(--cream-2)}
[data-page="home"] .rk-top{flex:1;min-width:0;display:flex;align-items:center;gap:14px}
[data-page="home"] .rk-tile{width:50px;height:50px;flex:none;border-radius:50%;overflow:hidden;display:grid;place-items:center;font-weight:800;font-size:13px;color:var(--green-900);position:relative}
[data-page="home"] .rk-tile-init{position:relative}
[data-page="home"] .rk-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0}
[data-page="home"] .rk-body{flex:1;min-width:0;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
[data-page="home"] .rk-name{font-family:var(--serif);font-weight:700;font-size:15.5px;color:var(--green-900)}
[data-page="home"] .rk-toprank{display:inline-flex;align-items:center;gap:3px;font-size:9.5px;font-weight:800;color:#fff;background:linear-gradient(90deg,var(--up),var(--gold-deep));padding:2px 8px;border-radius:999px}
[data-page="home"] .rk-lic{display:flex;gap:4px;flex-wrap:wrap;width:100%}
[data-page="home"] .rk-pill{font-size:10px;font-weight:600;color:var(--forex-t);background:#E7EFE9;border:1px solid #D5E3D9;padding:2px 7px;border-radius:999px}
[data-page="home"] .rank-votes{text-align:right;flex:none}
[data-page="home"] .rank-votes b{display:flex;align-items:center;justify-content:flex-end;gap:5px;font-family:var(--mono);font-weight:800;font-size:15px;color:var(--ink)}
[data-page="home"] .rank-votes span{font-size:10.5px;color:var(--ink-3)}
[data-page="home"] .rk-delta{display:inline-flex;align-items:center;font-family:var(--mono);font-size:9.5px;font-weight:800;padding:2px 5px;border-radius:999px}
[data-page="home"] .rk-delta.up{color:var(--up);background:var(--up-soft)}
[data-page="home"] .rk-delta.dn{color:var(--pay);background:var(--down-soft)}

/* -- 3. broker review cards — same "brk-card feat" component as wcb-brokers.html -- */
[data-page="home"] .brk-card{position:relative;height:100%;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;transition:transform .16s,box-shadow .16s,border-color .16s,background .16s}
[data-page="home"] .brk-card.feat{border-color:#E7D9A6;box-shadow:none;background:var(--surface)}
[data-page="home"] .brk-card{cursor:pointer;text-decoration:none;color:inherit}
[data-page="home"] .brk-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
[data-page="home"] .brk-card-in{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:24px 14px 18px}
[data-page="home"] .brk-card.feat .brk-card-in{padding-top:30px}
[data-page="home"] .brk-brand{display:flex;flex-direction:column;align-items:center;gap:10px}
[data-page="home"] .brk-brand .wcb-logo{--sz:56px}
[data-page="home"] .brk-name{font-family:var(--serif);font-weight:800;font-size:15.5px;color:var(--green-900);line-height:1.25}
[data-page="home"] .brk-rate-wrap{display:flex;flex-direction:column;align-items:center;gap:5px}
[data-page="home"] .brk-rate{display:flex;flex-direction:column;align-items:center;gap:5px}
[data-page="home"] .brk-stars{display:flex;gap:2px;line-height:0}
[data-page="home"] .brk-star svg{width:14px;height:14px;fill:#dcd7c4}
[data-page="home"] .brk-star.on svg{fill:var(--gold)}
[data-page="home"] .brk-score{font-weight:800;font-size:10px;color:var(--ink-2)}
[data-page="home"] .brk-score10{display:inline-flex;align-items:baseline;gap:2px;font-family:var(--mono);font-weight:800;font-size:11.5px;color:var(--gold-deep);background:var(--gold-soft);border-radius:var(--pill);padding:2px 9px}
[data-page="home"] .brk-of10{font-size:9.5px;font-weight:700;color:var(--gold-deep);opacity:.8}
[data-page="home"] .brk-edlabel{font-size:10px;color:var(--ink-2);font-weight:600}
[data-page="home"] .brk-cta{width:100%;margin-top:auto;padding-top:4px}
[data-page="home"] .brk-cta .btn{width:100%}
[data-page="home"] .brk-cta .btn-green{background:var(--green-700)}
[data-page="home"] .brk-cta .btn-green:hover{background:var(--green-800)}

/* -- 4. analysis preview cards — same "acx-card" component as wcb-analysis-currency.html -- */
[data-page="home"] .acx-card{position:relative;display:flex;flex-direction:column;gap:10px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:22px 16px 20px;text-decoration:none;color:inherit;cursor:pointer;overflow:hidden;transition:transform .18s,box-shadow .18s,border-color .18s}
[data-page="home"] .acx-card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--ink-3),var(--ink-3))}
[data-page="home"] .acx-card:has(.acx-chg.up)::before{background:linear-gradient(90deg,var(--up),#7fd39a)}
[data-page="home"] .acx-card:has(.acx-chg.down)::before{background:linear-gradient(90deg,var(--pay),#e8a68f)}
[data-page="home"] .acx-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
[data-page="home"] .acx-top{display:flex;align-items:center;gap:11px}
[data-page="home"] .acx-badge{width:44px;height:44px;flex:none;border-radius:50%;object-fit:cover;background:var(--green-800);display:block}
[data-page="home"] .acx-pair{flex:1;min-width:0;font-family:var(--mono);font-weight:800;font-size:18px;color:var(--green-900);letter-spacing:-.01em}
[data-page="home"] .acx-chg{flex:none;font-family:var(--mono);font-weight:700;font-size:12.5px;padding:4px 10px;border-radius:var(--pill)}
[data-page="home"] .acx-chg.up{color:var(--up);background:var(--up-soft)}
[data-page="home"] .acx-chg.down{color:var(--pay);background:var(--down-soft)}
[data-page="home"] .acx-title{font-family:var(--serif);font-weight:700;font-size:14px;color:var(--green-900);line-height:1.38}
[data-page="home"] .acx-excerpt{font-size:12px;color:var(--ink-2);line-height:1.65;flex:1}
[data-page="home"] .acx-foot{padding-top:12px;border-top:1px dashed var(--border)}
[data-page="home"] .acx-meta{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--ink-3)}
[data-page="home"] .acx-date{flex:1;min-width:0;font-size:11px;color:var(--ink-3);font-family:var(--mono)}
[data-page="home"] .acx-analyst{color:var(--green-800);font-weight:600;text-decoration:none}
[data-page="home"] .acx-analyst:hover{text-decoration:underline;color:var(--gold-deep)}
[data-page="home"] .acx-more{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;height:40px;font-size:12px;font-weight:700;color:#fff;background:var(--green-800);border-radius:10px;transition:background .16s}
[data-page="home"] .acx-more svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.6;transition:transform .16s}
[data-page="home"] .acx-card:hover .acx-more{background:var(--gold-deep)}
[data-page="home"] .acx-card:hover .acx-more svg{transform:translateX(3px)}
[data-page="home"] .acx-card.has-author-link{cursor:default}
[data-page="home"] .acx-card.has-author-link .acx-card-link{position:absolute;inset:0;z-index:1;border-radius:inherit}
[data-page="home"] .acx-card.has-author-link .acx-author-link{position:relative;z-index:2;display:block;width:44px;height:44px;flex:none;border-radius:50%}
[data-page="home"] .acx-card.has-author-link .acx-author-link::after{content:"ดูโปรไฟล์";position:absolute;left:50%;bottom:calc(100% + 8px);transform:translate(-50%,4px);padding:5px 9px;border-radius:8px;background:var(--green-950);color:var(--surface);font-size:10.5px;font-weight:700;line-height:1;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .14s,transform .14s}
[data-page="home"] .acx-card.has-author-link .acx-author-link:hover::after,[data-page="home"] .acx-card.has-author-link .acx-author-link:focus-visible::after{opacity:1;transform:translate(-50%,0)}
[data-page="home"] .acx-card.has-author-link .acx-author-link:hover .acx-badge{box-shadow:0 0 0 3px var(--gold)}
[data-page="home"] .acx-card.has-author-link .acx-author-link:focus-visible{outline:3px solid var(--gold-deep);outline-offset:3px}
[data-page="home"] .acx-card.has-author-link .acx-title,[data-page="home"] .acx-card.has-author-link .acx-meta,[data-page="home"] .acx-card.has-author-link .acx-foot{position:relative;z-index:0}
[data-page="home"] .acx-card.soon{cursor:default;border-style:dashed;box-shadow:none;background:var(--cream-2)}
[data-page="home"] .acx-card.soon::before{background:var(--border-2)}
[data-page="home"] .acx-card.soon .acx-badge{width:44px;height:44px;border-radius:50%;background:var(--cream-2);border:1px dashed var(--border-2);display:block;font-size:0}
[data-page="home"] .acx-card.soon .acx-title,[data-page="home"] .acx-card.soon .acx-excerpt{opacity:.7}
[data-page="home"] .acx-card.soon:hover{transform:none;box-shadow:none;border-color:var(--border-2)}
[data-page="home"] .acx-soontag{flex:none;font-size:11px;font-weight:700;color:var(--ink-3);background:#fff;border:1px solid var(--border-2);padding:3px 9px;border-radius:var(--pill)}

/* -- 5. asset category cards — same "silo-card" component as wcb-news-forex.html -- */
[data-page="home"] .hp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
[data-page="home"] .hp-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
[data-page="home"] .silo-card,[data-page="analysis-hub"] .silo-card,[data-page="asset-hub"] .silo-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;text-decoration:none;color:inherit;cursor:pointer;transition:transform .16s,box-shadow .16s,border-color .16s}
[data-page="home"] .silo-card:hover,[data-page="analysis-hub"] .silo-card:hover,[data-page="asset-hub"] .silo-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
[data-page="home"] .silo-thumb,[data-page="analysis-hub"] .silo-thumb,[data-page="asset-hub"] .silo-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--cream-2)}
[data-page="home"] .silo-thumb img,[data-page="analysis-hub"] .silo-thumb img,[data-page="asset-hub"] .silo-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
[data-page="home"] .silo-card:hover .silo-thumb img,[data-page="analysis-hub"] .silo-card:hover .silo-thumb img,[data-page="asset-hub"] .silo-card:hover .silo-thumb img{transform:scale(1.06)}
[data-page="home"] .silo-tag,[data-page="analysis-hub"] .silo-tag,[data-page="asset-hub"] .silo-tag{position:absolute;top:10px;left:10px;z-index:1;font-family:var(--mono);font-size:10px;font-weight:800;color:var(--green-950);background:var(--gold-bright);padding:3px 9px;border-radius:var(--pill);letter-spacing:.03em}
[data-page="home"] .silo-body,[data-page="analysis-hub"] .silo-body,[data-page="asset-hub"] .silo-body{flex:1;display:flex;flex-direction:column;padding:14px 16px 16px}
[data-page="home"] .silo-title,[data-page="analysis-hub"] .silo-title,[data-page="asset-hub"] .silo-title{font-family:var(--serif);font-weight:800;font-size:15.5px;color:var(--green-900);line-height:1.28;margin-bottom:6px}
[data-page="home"] .silo-excerpt,[data-page="analysis-hub"] .silo-excerpt,[data-page="asset-hub"] .silo-excerpt{font-size:12px;color:var(--ink-2);line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:10px}
[data-page="home"] .silo-more,[data-page="analysis-hub"] .silo-more,[data-page="asset-hub"] .silo-more{margin-top:auto;display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--gold-deep)}
[data-page="home"] .silo-more svg,[data-page="analysis-hub"] .silo-more svg,[data-page="asset-hub"] .silo-more svg{width:13px;height:13px;flex:none;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .16s}
[data-page="home"] .silo-card:hover .silo-more svg,[data-page="analysis-hub"] .silo-card:hover .silo-more svg,[data-page="asset-hub"] .silo-card:hover .silo-more svg{transform:translateX(3px)}

@media(max-width:980px){
  [data-page="home"] .news-feat-grid{grid-template-columns:1fr}
  [data-page="home"] .hp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  [data-page="home"] .hp-grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  [data-page="home"] .hp-grid,[data-page="home"] .hp-grid.cols-3{grid-template-columns:1fr}
  [data-page="home"] .rank-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:0 12px}
  [data-page="home"] .rk-top{display:contents}
  [data-page="home"] .rk-tile{width:46px;height:46px}
  [data-page="home"] .rk-body{align-self:center;gap:4px 6px}
  [data-page="home"] .rank-votes{align-self:center;text-align:right;margin-left:0}
  [data-page="home"] .rank-votes b{font-size:14px}
}
@media(max-width:640px){
  .wcb-drawer-search{padding:9px 16px}
  .wcb-drawer-search svg{top:18px}
  .wcb-drawer-search input{height:36px;min-height:36px;padding:6px 12px 6px 38px}
  [data-page="home"] #view-method .mcard{padding:16px 18px}
  [data-page="home"] #view-method .mcard h3{line-height:1.35}
  [data-page="home"] .news-section .hp-sec-in{display:flex;flex-direction:column}
  [data-page="home"] .news-section .hp-head{display:contents}
  [data-page="home"] .news-section .hp-head>div{order:1;margin-bottom:18px}
  [data-page="home"] .news-section .news-feat-grid{order:2}
  [data-page="home"] .news-section .hp-more{order:3;align-self:flex-start;margin-top:18px}
}
[data-page="home"] .view{display:none}
[data-page="home"] .view.active{display:block}
[data-page="home"] .hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
[data-page="home"] .hero .glow{position:absolute;width:60vw;height:60vw;right:-18vw;top:-26vw;border-radius:50%;background:none;pointer-events:none}
[data-page="home"] .hero-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:54px 20px 56px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:32px}
[data-page="home"] .hero .eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:13px;letter-spacing:2px;color:var(--gold-bright);font-weight:600}
[data-page="home"] .hero h1{font-family:var(--serif);font-weight:800;font-size:clamp(30px,5.6vw,52px);line-height:1.4}
[data-page="home"] .hero h1 .gold{color:var(--gold-bright)}
[data-page="home"] .hero p.sub{margin:0 auto;max-width:620px;color:#c7d6cc;font-size:16px}
[data-page="home"] .hero .cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
[data-page="home"] .countdown{display:flex;gap:10px;justify-content:center;margin-top:26px;flex-wrap:wrap}
[data-page="home"] .cd-lab{width:100%;text-align:center;font-size:13px;color:var(--gold-bright);font-weight:600;margin-bottom:2px}
[data-page="home"] .cd-box{background:rgba(255,255,255,.06);border:1px solid rgba(201,162,39,.4);border-radius:12px;padding:10px 14px;min-width:74px}
[data-page="home"] .cd-box .v{font-family:var(--serif);font-weight:800;font-size:30px;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
[data-page="home"] .cd-box .k{font-size:11px;color:rgba(255,255,255,.6);margin-top:4px}
[data-page="home"] .score-head{text-align:center;padding:48px 0 10px}
[data-page="home"] .score-head .ic{font-size:22px}
[data-page="home"] .score-head h2{font-family:var(--serif);font-size:28px;color:var(--green-900)}
[data-page="home"] .score-head p{color:var(--ink-2);font-size:14px;margin-top:6px;max-width:60ch;margin-left:auto;margin-right:auto}
[data-page="home"] .boardfilter{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:space-between;padding:8px 0 4px}
[data-page="home"] .typechips{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none}
[data-page="home"] .typechips::-webkit-scrollbar{display:none}
[data-page="home"] .ticker{margin:14px 0 6px;background:var(--green-900);border-radius:12px;overflow:hidden;position:relative;border:1px solid rgba(201,162,39,.3)}
[data-page="home"] .ticker .lead{position:absolute;left:0;top:0;bottom:0;z-index:2;display:flex;align-items:center;gap:7px;background:var(--gold);color:var(--green-900);padding:0 14px;font-weight:800;font-size:12.5px;white-space:nowrap}
[data-page="home"] .ticker .lead .dot{width:8px;height:8px;border-radius:50%;background:var(--green-900);animation:pulse-home 1.4s infinite}
[data-page="home"] .ticker-track{display:flex;gap:30px;white-space:nowrap;padding:11px 0 11px 130px;animation:scroll-home 32s linear infinite;width:max-content}
[data-page="home"] .ticker:hover .ticker-track{animation-play-state:paused}
[data-page="home"] .tk{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.86)}
[data-page="home"] .tk .av{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:10px;flex:0 0 22px}
[data-page="home"] .tk b{color:#fff;font-weight:700}
[data-page="home"] .tk .vt{color:var(--gold-bright);font-weight:700}
[data-page="home"] .tk .sw{color:#7FC9A6;font-weight:700}
[data-page="home"] .board{display:flex;flex-direction:column;gap:9px;margin-top:10px}
[data-page="home"] .rrow{display:grid;grid-template-columns:40px 84px 1fr auto;gap:14px;align-items:center;padding:14px 16px}
[data-page="home"] .rank{font-family:var(--serif);font-weight:800;font-size:22px;color:var(--ink-3);text-align:center}
[data-page="home"] .logo-col{display:flex;flex-direction:column;align-items:center;gap:7px;width:84px}
[data-page="home"] .logo-link{display:block}
[data-page="home"] .logo{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;color:#fff;font-family:var(--serif);font-weight:800;font-size:14px;background:var(--bk,#2A6B4F)}
[data-page="home"] .logo-link:hover .logo{filter:brightness(1.07)}
[data-page="home"] .logo-wrap{position:relative;overflow:hidden;background:transparent}
[data-page="home"] .logo-wrap .logo-init{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-family:var(--serif);font-weight:800;font-size:14px;border-radius:inherit}
[data-page="home"] .logo-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:inherit;opacity:0}
[data-page="home"] #infoModal .modal-card{max-height:86vh;overflow:auto}
[data-page="home"] .ident{min-width:0}
[data-page="home"] .ident .nm{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
[data-page="home"] .ident .nm .full{font-family:var(--serif);font-weight:700;font-size:18px;color:var(--green-900)}
[data-page="home"] .ident .nm .init{font-size:11px;font-weight:700;color:var(--ink-2);background:var(--cream-2);border:1px solid var(--border);border-radius:var(--pill);padding:1px 7px}
[data-page="home"] .ident .nm .crown{color:var(--gold)}
[data-page="home"] .ident .types{display:flex;gap:5px;margin-top:5px;flex-wrap:wrap}
[data-page="home"] .tbadge{font-size:11px;font-weight:700;padding:2px 8px;border-radius:var(--pill);display:inline-flex;align-items:center;gap:4px}
[data-page="home"] .tbadge.gold{color:var(--gold-t);background:var(--gold-soft)}
[data-page="home"] .tbadge.forex{color:var(--forex-t);background:#E3EDE6}
[data-page="home"] .tbadge.stock{color:var(--stock-t);background:#E4ECF8}
[data-page="home"] .tbadge.crypto{color:var(--crypto-t);background:#FBEEDD}
[data-page="home"] .ident .votes{font-size:12.5px;color:var(--ink-3);margin-top:6px}
[data-page="home"] .ident .votes b{color:var(--ink-2);font-weight:700;font-variant-numeric:tabular-nums}
[data-page="home"] .racts{display:flex;align-items:center;gap:8px}
[data-page="home"] .nstoggle{width:42px;height:42px;border:1px solid var(--border-2);background:#fff;border-radius:10px;cursor:pointer;display:grid;place-items:center;color:var(--ink-2)}
[data-page="home"] .nstoggle svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .2s}
[data-page="home"] .cta-mini{font-size:11px;color:var(--risk);background:#FDECEA;border-radius:7px;padding:5px 9px;margin:0 16px 12px;display:flex;gap:6px;align-items:flex-start}
[data-page="home"] .cta-mini svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;flex:0 0 12px;margin-top:1px}
[data-page="home"] .ns-body{display:none;border-top:1px solid var(--border);background:var(--cream-2);padding:14px 16px}
[data-page="home"] .board-foot{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:18px}
[data-page="home"] .rank-intro{background:var(--green-900);color:#fff;padding:20px 0}
[data-page="home"] .disclosure{display:flex;gap:10px;align-items:flex-start;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:12px 14px;font-size:12.5px;color:rgba(255,255,255,.82);line-height:1.55}
[data-page="home"] .disclosure svg{width:16px;height:16px;stroke:var(--gold);fill:none;stroke-width:2;flex:0 0 16px;margin-top:2px}
[data-page="home"] .disclosure b{color:#fff}
[data-page="home"] .social-band{background:#F8F8F8;padding:48px 0}
[data-page="home"] .comments-band{background:linear-gradient(160deg,var(--rose-1),var(--rose-2));padding:48px 0}
[data-page="home"] .band-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
[data-page="home"] .band-head h2{font-family:var(--serif);font-weight:800;font-size:24px;color:var(--green-900);display:flex;align-items:center;gap:10px}
[data-page="home"] .band-head h2 svg{width:24px;height:24px;stroke:var(--green-900);fill:none;stroke-width:1.8}
[data-page="home"] .band-head .note{font-size:12.5px;color:var(--ink-2);text-align:right;max-width:40ch;line-height:1.5}
[data-page="home"] .snews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
[data-page="home"] .snews-card{background:#fff;border-radius:12px;box-shadow:var(--shadow);overflow:hidden;border-top:4px solid var(--ac,#888);display:flex;flex-direction:column}
[data-page="home"] .snews-card .top{display:flex;align-items:center;gap:8px;padding:12px 14px 6px}
[data-page="home"] .snews-card .blogo{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:11px;flex:0 0 28px}
[data-page="home"] .snews-card .bn{font-weight:800;font-size:13.5px}
[data-page="home"] .snews-card .srctag{margin-left:auto;display:inline-flex;align-items:center;gap:5px;background:var(--cream-2);border-radius:var(--pill);padding:3px 9px;font-size:11px;font-weight:700;color:var(--ink-2)}
[data-page="home"] .snews-card .srctag .d{width:12px;height:12px;border-radius:3px}
[data-page="home"] .snews-card .body{padding:2px 14px 12px;flex:1}
[data-page="home"] .snews-card .hl{font-weight:700;font-size:13.5px;line-height:1.35}
[data-page="home"] .snews-card .sub{font-size:12px;color:var(--ink-2);margin-top:6px;line-height:1.5}
[data-page="home"] .snews-card .foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-top:1px solid var(--border)}
[data-page="home"] .snews-card .tm{font-size:11px;color:var(--ink-3)}
[data-page="home"] .cfilters{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}
[data-page="home"] .cgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
[data-page="home"] .sentinel{height:1px}
[data-page="home"] .cloader{display:none;align-items:center;justify-content:center;gap:10px;padding:24px;color:var(--ink-2);font-size:12.5px;font-weight:600}
[data-page="home"] .cloader.on{display:flex}
[data-page="home"] .spinner{width:18px;height:18px;border:2.5px solid var(--border);border-top-color:var(--green-700);border-radius:50%;animation:spin-home .8s linear infinite}
[data-page="home"] .cend{display:none;text-align:center;padding:24px;color:var(--ink-2);font-size:12.5px;font-weight:700}
[data-page="home"] .cend.on{display:block}
[data-page="home"] .page-hd{background:var(--green-900);color:#fff;padding:48px 0}
[data-page="home"] .page-hd h1{font-family:var(--serif);font-size:30px}
[data-page="home"] .page-hd p{color:rgba(255,255,255,.82);margin-top:8px;max-width:64ch}
[data-page="home"] .prose{max-width:760px;margin:0 auto;padding:36px 20px}
[data-page="home"] .prose h3{font-family:var(--serif);font-size:22px;color:var(--green-900);margin:24px 0 8px}
[data-page="home"] .prose p{color:var(--ink-2);margin-bottom:12px}
[data-page="home"] .verdict{background:#fff;border:1px solid var(--border);border-left:5px solid var(--gold);border-radius:12px;padding:24px;box-shadow:var(--shadow)}
[data-page="home"] .verdict .big{font-family:var(--serif);font-weight:900;font-size:42px;color:var(--gold-deep);line-height:1}
[data-page="home"] .modal{position:fixed;inset:0;z-index:60;display:none;align-items:flex-end;justify-content:center;background:rgba(11,32,21,.55)}
[data-page="home"] .modal.open{display:flex}
[data-page="home"] .modal-card{background:#fff;width:100%;max-width:420px;border-radius:18px 18px 0 0;box-shadow:var(--shadow-lg);padding:24px 16px calc(24px + env(safe-area-inset-bottom));animation:rise-home .26s}
[data-page="home"] .modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
[data-page="home"] .modal-head h3{font-family:var(--serif);font-size:22px;color:var(--green-900)}
[data-page="home"] .modal-head p{font-size:12px;color:var(--ink-2);margin-top:3px}
[data-page="home"] .modal-close{background:var(--cream-2);border:none;cursor:pointer;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex:0 0 36px}
[data-page="home"] .modal-close svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:2}
[data-page="home"] .slogins{display:flex;flex-direction:column;gap:8px;margin-top:16px}
[data-page="home"] .divider{display:flex;align-items:center;gap:12px;margin:16px 0;color:var(--ink-2);font-size:11px;font-weight:700}
[data-page="home"] .divider::before,[data-page="home"] .divider::after{content:"";flex:1;border-top:1px solid var(--border)}
[data-page="home"] .field{margin-bottom:12px}
[data-page="home"] .field label{display:block;font-size:12px;font-weight:700;color:var(--ink-2);margin-bottom:5px}
[data-page="home"] .field input{width:100%;min-height:var(--tap);border:1.5px solid var(--border);border-radius:10px;padding:0 12px;font-family:var(--thai);font-size:14px;color:var(--ink);background:#fff}
[data-page="home"] .field input:focus{outline:none;border-color:var(--gold-deep)}
[data-page="home"] .modal-fine{font-size:11px;color:var(--ink-2);margin-top:12px;line-height:1.5}
@media(max-width:980px){[data-page="home"] .snews-grid{grid-template-columns:1fr 1fr}[data-page="home"] .mgrid{grid-template-columns:1fr}[data-page="home"] .rcard.open .ns-body{grid-template-columns:1fr}}
@media(max-width:640px){[data-page="home"] .rrow{grid-template-columns:38px 84px 1fr;gap:11px}[data-page="home"] .racts{grid-column:1/-1;flex-wrap:wrap;border-top:1px dashed var(--border-2);padding-top:11px;margin-top:3px}[data-page="home"] .racts .vote-btn,[data-page="home"] .racts .btn{flex:1;min-width:96px}[data-page="home"] .snews-grid{grid-template-columns:1fr}[data-page="home"] .cgrid{grid-template-columns:1fr}[data-page="home"] .band-head .note{text-align:left}[data-page="home"] .cd-box{min-width:64px;padding:9px 11px}[data-page="home"] .cd-box .v{font-size:25px}}
@media(max-width:820px){[data-page="home"] .brand .seal{width:34px;height:34px;flex:0 0 34px}[data-page="home"] .brand .seal svg{width:19px;height:19px}}
@media(max-width:640px){[data-page="home"] #view-rank .hero-in{padding:24px 18px 24px}[data-page="home"] #view-rank .hero h1{font-size:clamp(19px,5.2vw,26px);line-height:1.16}[data-page="home"] #view-rank .hero .eyebrow{margin-bottom:8px;font-size:11px}[data-page="home"] #view-rank .hero p.sub{font-size:13.5px;margin-top:9px}[data-page="home"] .countdown{margin-top:15px;gap:7px}[data-page="home"] .cd-box{min-width:0;flex:1;padding:7px 4px}[data-page="home"] .cd-box .v{font-size:21px}[data-page="home"] .cd-box .k{font-size:10px;margin-top:2px}[data-page="home"] .cd-lab{font-size:12px;margin-bottom:0}[data-page="home"] .statbar{margin-top:-16px}[data-page="home"] .stat{padding:13px 8px}[data-page="home"] .stat .v{font-size:21px}[data-page="home"] .stat .k{font-size:11px}[data-page="home"] #view-rank > .wrap{display:flex;flex-direction:column;padding-top:28px}[data-page="home"] #view-rank .score-head{padding:20px 0 6px}[data-page="home"] #view-rank .score-head h2{font-size:22px}[data-page="home"] #view-rank .ticker{order:1;margin:14px 0 4px}[data-page="home"] #view-rank .board-foot{order:2}[data-page="home"] .filter-bar{display:flex}[data-page="home"] .boardfilter{position:fixed;left:0;right:0;bottom:0;z-index:59;background:#fff;border-radius:18px 18px 0 0;box-shadow:var(--shadow-lg);transform:translateY(100%);transition:transform .26s;padding:16px 16px calc(20px + env(safe-area-inset-bottom));display:block;max-height:80vh;overflow:auto}[data-page="home"] .boardfilter.open{transform:none}[data-page="home"] .boardfilter .sheet-head{display:block;margin-bottom:6px}[data-page="home"] .boardfilter .sheet-head-row{display:flex;align-items:center;justify-content:space-between}[data-page="home"] .boardfilter .seg{display:flex;width:100%;margin-bottom:14px}[data-page="home"] .boardfilter .seg button{flex:1}[data-page="home"] .boardfilter .typechips{flex-wrap:wrap;overflow:visible}[data-page="home"] .rrow{padding:12px 11px}[data-page="home"] .racts{gap:7px}[data-page="home"] .racts .vote-btn{flex:2 1 0;min-width:130px;font-size:14px}[data-page="home"] .racts .btn-outline{flex:1 1 0;min-width:0;font-size:12.5px}[data-page="home"] .cta-mini{background:transparent;color:var(--ink-3);font-size:10px;padding:4px 2px 0;margin:0 11px 11px;border-top:1px dashed var(--border)}[data-page="home"] #view-home .prose h3{font-size:21px!important}[data-page="home"] .page-hd h1{font-size:24px}}

/* ===== page: news-item — scoped [data-page="news-item"] ===== */
@keyframes blink-news-item{0%,100%{opacity:1}50%{opacity:.25}}
html:has(body[data-page="news-item"]){font-size:16px;scroll-behavior:smooth;scroll-padding-top:108px}
body[data-page="news-item"].easy{font-size:18px}
[data-page="news-item"] .mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
[data-page="news-item"] .wrap{max-width:760px;margin:0 auto;padding:0 20px}
[data-page="news-item"] .wcb-related .wrap{max-width:1180px}
[data-page="news-item"] .wcb-related .wcb-ccard .thumb{height:auto;aspect-ratio:16/9}
[data-page="news-item"] .wcb-ccard .thumb .cat{position:absolute;top:10px;left:10px}
[data-page="news-item"] #progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--gold-deep),var(--gold-bright));z-index:200;transition:width .08s linear}
[data-page="news-item"] .cmt-band{background:var(--cream-2);border-top:1px solid var(--border);padding:48px 0}
[data-page="news-item"] .hero-icons{display:flex;gap:10px;flex-wrap:wrap}
[data-page="news-item"] .hicon{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:8px 12px;font-size:12.5px}
[data-page="news-item"] .hicon .v{font-family:var(--mono);font-weight:700}
[data-page="news-item"] .hicon .v.up{color:#6FD39B}
[data-page="news-item"] .hicon .v.down{color:#F0907F}
[data-page="news-item"] .meta-strip{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:var(--hh);z-index:30}
[data-page="news-item"] .meta-in{max-width:760px;margin:0 auto;padding:11px 20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--ink-2)}
[data-page="news-item"] .now-reading{display:inline-flex;align-items:center;gap:7px;font-weight:600;color:var(--green-700)}
[data-page="news-item"] .now-reading .pd{width:8px;height:8px;border-radius:50%;background:var(--up);animation:blink-news-item 1.6s infinite}
[data-page="news-item"] .meta-in .dot{color:var(--ink-3)}
[data-page="news-item"] .toolbar{background:var(--cream-2);border-bottom:1px solid var(--border);position:static}
[data-page="news-item"] .toolbar-in{max-width:760px;margin:0 auto;padding:9px 20px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
[data-page="news-item"] .tool-label{font-size:11.5px;font-weight:700;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
[data-page="news-item"] .tool-btn{display:inline-flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--border-2);border-radius:9px;padding:7px 12px;font-family:var(--thai);font-size:13px;font-weight:600;color:var(--ink-2);cursor:pointer;min-height:38px}
[data-page="news-item"] .tool-btn:hover{border-color:var(--gold)}
[data-page="news-item"] .tool-btn.on{background:var(--green-700);color:#fff;border-color:var(--green-700)}
[data-page="news-item"] .tool-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
[data-page="news-item"] .tool-sep{width:1px;height:22px;background:var(--border-2);margin:0 4px}
[data-page="news-item"] .share-btn{width:44px;height:44px;border-radius:9px;border:1px solid var(--border-2);background:var(--surface);display:grid;place-items:center;cursor:pointer;color:var(--ink-2)}
[data-page="news-item"] .share-btn:hover{border-color:var(--gold);color:var(--green-900)}
[data-page="news-item"] .share-btn svg{width:17px;height:17px}
[data-page="news-item"] .tool-flag{margin-left:auto;font-size:11px;color:var(--ink-3)}
[data-page="news-item"] article{padding:0}
[data-page="news-item"] article p{margin-bottom:17px;font-size:17px;color:var(--ink);line-height:1.78}
[data-page="news-item"] article p.lead{font-size:19px;font-weight:500}
[data-page="news-item"] article h2{font-family:var(--serif);font-size:26px;color:var(--green-900);margin:28px 0 12px}
[data-page="news-item"] .entity{color:var(--gold-deep);font-weight:700;cursor:pointer;border-bottom:1.5px dotted var(--gold)}
[data-page="news-item"] .entity:hover{background:var(--gold-soft)}
[data-page="news-item"] .pull{border-left:5px solid var(--gold);background:var(--gold-soft);padding:20px 26px;border-radius:0 14px 14px 0;font-family:var(--serif);font-size:clamp(18px,2.2vw,24px);font-weight:800;color:var(--green-900);margin:30px 0;line-height:1.32}
[data-page="news-item"] .news-adimg{float:none;width:100%;max-width:none;margin:0 0 22px}
[data-page="news-item"] .news-adimg .ri-frame{width:100%;aspect-ratio:16/11;border-radius:var(--r);overflow:hidden;border:1px solid var(--border);background:var(--cream-2) center/cover;box-shadow:var(--shadow)}
[data-page="news-item"] .hl-on article p{cursor:text}
[data-page="news-item"] .hl-mark{background:var(--gold-bright);border-radius:2px;padding:0 1px}
[data-page="news-item"] .block{padding:0 0 40px}
[data-page="news-item"] .reactions{clear:both;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow);margin:0}
[data-page="news-item"] .reactions .q{font-family:var(--serif);font-weight:700;font-size:16px;color:var(--green-900);display:block;margin-bottom:13px}
[data-page="news-item"] .react-row{display:flex;gap:10px;flex-wrap:wrap}
[data-page="news-item"] .react-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:1;background:var(--cream-2);border:1.5px solid var(--border);border-radius:10px;padding:9px 16px;font-family:var(--thai);font-size:14px;font-weight:600;color:var(--ink-2);cursor:pointer;min-height:42px}
[data-page="news-item"] .react-btn:hover{border-color:var(--gold)}
[data-page="news-item"] .react-btn .em{font-size:19px}
[data-page="news-item"] .react-btn .n{font-family:var(--mono);font-weight:700;color:var(--ink-3)}
[data-page="news-item"] .react-btn.on{background:var(--up-soft);border-color:var(--up);color:var(--up)}
[data-page="news-item"] .react-btn.on .n{color:var(--up)}
@media(max-width:640px){
  [data-page="news-item"] .react-btn{flex:1 1 calc(50% - 5px);white-space:nowrap}
}
[data-page="news-item"] .people .lbl{font-size:12.5px;color:var(--ink-2);font-weight:600;margin-bottom:12px}
[data-page="news-item"] .people-row{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
[data-page="news-item"] .people-row::-webkit-scrollbar{display:none}
[data-page="news-item"] .person{flex:0 0 150px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:15px;text-align:center;cursor:pointer;box-shadow:var(--shadow)}
[data-page="news-item"] .person:hover{border-color:var(--gold)}
[data-page="news-item"] .pav{width:48px;height:48px;border-radius:50%;margin:0 auto 9px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:15px}
[data-page="news-item"] .person .pn{font-weight:700;font-size:13.5px;color:var(--ink)}
[data-page="news-item"] .person .pr{font-size:11px;color:var(--ink-3);margin-bottom:8px}
[data-page="news-item"] .rel-bar{height:5px;border-radius:99px;background:var(--cream-2);overflow:hidden;margin-bottom:5px}
[data-page="news-item"] .rel-bar i{display:block;height:100%;background:var(--gold)}
[data-page="news-item"] .rel-pct{font-size:10.5px;color:var(--ink-3);font-family:var(--mono)}
[data-page="news-item"] .comments h3{font-family:var(--serif);font-size:22px;color:var(--green-900);margin-bottom:5px}
[data-page="news-item"] .comments .csub{font-size:13.5px;color:var(--ink-2);margin-bottom:16px}
[data-page="news-item"] .c-compose{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:14px;box-shadow:var(--shadow);margin-bottom:18px}
[data-page="news-item"] .c-compose textarea{width:100%;border:1px solid var(--border-2);border-radius:10px;padding:11px 13px;font-family:var(--thai);font-size:14.5px;resize:vertical;min-height:70px;color:var(--ink)}
[data-page="news-item"] .c-compose textarea:focus{outline:none;border-color:var(--gold-deep)}
[data-page="news-item"] .c-tools{display:flex;align-items:center;gap:10px;margin-top:11px;flex-wrap:wrap}
[data-page="news-item"] .c-attach{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ink-2);cursor:pointer;font-weight:600}
[data-page="news-item"] .c-attach svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
[data-page="news-item"] .c-dir{display:flex;gap:6px}
[data-page="news-item"] .c-dir button{border:1.5px solid var(--border-2);background:var(--surface);border-radius:var(--pill);padding:7px 14px;font-family:var(--thai);font-size:13px;font-weight:600;cursor:pointer;min-height:38px}
[data-page="news-item"] .c-dir button.up.sel{background:var(--up-soft);border-color:var(--up);color:var(--up)}
[data-page="news-item"] .c-dir button.dn.sel{background:var(--down-soft);border-color:var(--down);color:var(--down)}
[data-page="news-item"] .c-post{margin-left:auto;background:var(--green-700);color:#fff;border:none;border-radius:10px;padding:0 20px;height:var(--btn-h-default);font-family:var(--thai);font-weight:700;font-size:14px;cursor:pointer}
[data-page="news-item"] .c-item{display:flex;gap:12px;padding:15px 0;border-bottom:1px solid var(--border)}
[data-page="news-item"] .c-av{width:38px;height:38px;border-radius:50%;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:14px;flex:none}
[data-page="news-item"] .c-body{flex:1;min-width:0}
[data-page="news-item"] .c-meta{display:flex;align-items:center;gap:9px;margin-bottom:5px;flex-wrap:wrap}
[data-page="news-item"] .c-name{font-weight:700;font-size:13.5px;color:var(--ink)}
[data-page="news-item"] .c-tag{font-size:11px;font-weight:700;color:#fff;padding:2px 9px;border-radius:var(--pill)}
[data-page="news-item"] .c-tag.up{background:var(--up)}
[data-page="news-item"] .c-tag.dn{background:var(--down)}
[data-page="news-item"] .c-time{font-size:11.5px;color:var(--ink-3)}
[data-page="news-item"] .c-text{font-size:14.5px;color:var(--ink-2)}
[data-page="news-item"] .c-actions{display:flex;gap:16px;margin-top:9px;font-size:12.5px;color:var(--ink-3)}
[data-page="news-item"] .c-actions span{cursor:pointer;display:inline-flex;align-items:center;gap:4px}
[data-page="news-item"] .c-actions span:hover{color:var(--gold-deep)}
[data-page="news-item"] .related h3,[data-page="news-item"] .kgraph .lbl{font-family:var(--serif);font-size:20px;color:var(--green-900);margin-bottom:14px}
[data-page="news-item"] .rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
[data-page="news-item"] .rel-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;cursor:pointer;box-shadow:var(--shadow)}
[data-page="news-item"] .rel-card:hover{border-color:var(--gold);transform:translateY(-3px);transition:.2s}
[data-page="news-item"] .rel-thumb{height:96px;background:linear-gradient(135deg,var(--green-700),var(--green-900));position:relative;display:flex;align-items:flex-end;padding:10px}
[data-page="news-item"] .rel-thumb .cat{background:var(--gold);color:var(--green-900);font-size:11px;font-weight:700;padding:3px 9px;border-radius:var(--pill)}
[data-page="news-item"] .rel-body{padding:13px 15px}
[data-page="news-item"] .rel-body .rt{font-family:var(--serif);font-weight:700;font-size:15px;color:var(--green-900);line-height:1.3;margin-bottom:8px}
[data-page="news-item"] .rel-body .rm{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink-3)}
[data-page="news-item"] .rel-body .rm .hot{color:var(--breaking);font-weight:700}
[data-page="news-item"] .kgraph{padding-top:8px}
[data-page="news-item"] .kchips{display:flex;gap:9px;flex-wrap:wrap}
[data-page="news-item"] .kchip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border-2);background:var(--surface);border-radius:var(--pill);padding:9px 15px;font-weight:600;font-size:13px;color:var(--ink-2);cursor:pointer}
[data-page="news-item"] .kchip:hover{border-color:var(--gold);color:var(--green-900)}
[data-page="news-item"] .kchip .n{font-family:var(--mono);font-size:11px;color:var(--ink-3)}
[data-page="news-item"] .brokers{background:var(--green-900);color:#fff;padding:48px 0}
[data-page="news-item"] .brokers h3{font-family:var(--serif);font-size:26px;color:#fff;text-align:center}
[data-page="news-item"] .brokers .bsub{text-align:center;color:rgba(255,255,255,.66);font-size:14px;margin:8px auto 24px;max-width:50ch}
[data-page="news-item"] .broker-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
[data-page="news-item"] .broker-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:var(--r);padding:18px}
[data-page="news-item"] .bc-top{display:flex;align-items:center;gap:11px;margin-bottom:12px}
[data-page="news-item"] .bc-logo{width:42px;height:42px;border-radius:11px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:13px;flex:none}
[data-page="news-item"] .bc-name{font-family:var(--serif);font-weight:700;font-size:16px;color:#fff}
[data-page="news-item"] .bc-stars{font-size:12px;color:var(--gold-bright);margin-top:2px}
[data-page="news-item"] .bc-feat{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
[data-page="news-item"] .bc-feat span{font-size:11px;color:rgba(255,255,255,.8);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);padding:3px 9px;border-radius:var(--pill)}
[data-page="news-item"] .bc-btns{display:flex;gap:8px}
[data-page="news-item"] .bc-btns .btn{flex:1}
[data-page="news-item"] .disc-note{text-align:center;font-size:11.5px;color:rgba(255,255,255,.5);margin-top:20px;line-height:1.6}
[data-page="news-item"] .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
[data-page="news-item"] .reveal.in{opacity:1;transform:none}
@media(max-width:980px){[data-page="news-item"] .rel-grid,[data-page="news-item"] .broker-grid{grid-template-columns:1fr}}
@media(max-width:820px){body[data-page="news-item"]{padding-bottom:calc(64px + env(safe-area-inset-bottom))}[data-page="news-item"] .rel-grid{grid-template-columns:1fr}}
@media(max-width:640px){[data-page="news-item"] article p{font-size:16px}[data-page="news-item"] .meta-strip,[data-page="news-item"] .toolbar{position:static}[data-page="news-item"] .c-post{margin-left:0;width:100%}}

/* ===== page: news — scoped [data-page="news"] ===== */
@keyframes nhblink{0%,100%{opacity:1}50%{opacity:.25}}
[data-page="news"] .nhub-hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
[data-page="news"] .nhub-hero::before{content:"";position:absolute;inset:0;background:none;pointer-events:none}
[data-page="news"] .nhub-hero-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:34px 20px 30px}
[data-page="news"] .nhub-hero .eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;letter-spacing:.14em;color:var(--gold-bright);font-weight:600;text-transform:uppercase}
[data-page="news"] .nhub-hero h1{font-family:var(--serif);font-weight:800;font-size:clamp(28px,5vw,46px);line-height:1.18;margin:12px 0 10px}
[data-page="news"] .nhub-hero h1 .gold{color:var(--gold-bright)}
[data-page="news"] .nhub-hero p{font-size:clamp(14px,2vw,16px);color:rgba(255,255,255,.78);max-width:60ch;line-height:1.6}
[data-page="news"] .nhub-search{display:flex;align-items:center;gap:10px;margin-top:20px;max-width:520px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:0 14px}
[data-page="news"] .nhub-search svg{width:18px;height:18px;stroke:rgba(255,255,255,.7);fill:none;stroke-width:2;flex:none}
[data-page="news"] .nhub-search input{flex:1;background:none;border:none;outline:none;color:#fff;font-family:var(--thai);font-size:15px;padding:13px 0}
[data-page="news"] .nhub-search input::placeholder{color:rgba(255,255,255,.5)}
[data-page="news"] .nhub-tools{background:var(--surface);border-bottom:1px solid var(--border);margin-top:32px}
[data-page="news"] .nhub-tin{display:flex;align-items:center;gap:12px;padding:12px 20px;flex-wrap:wrap}
[data-page="news"] .nhub-chips{display:flex;gap:8px;flex-wrap:wrap;flex:1 1 auto;min-width:0}




[data-page="news"] .nhub-count{font-size:12.5px;color:var(--ink-3);font-weight:600;white-space:nowrap;flex:none}
[data-page="news"] .nhub-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
[data-page="news"] .ncard{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);cursor:pointer;color:inherit;text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s}
[data-page="news"] .ncard:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
[data-page="news"] .ncard-thumb{position:relative;aspect-ratio:16/10;background:var(--bk,linear-gradient(135deg,#2E7D5B,#0A3B24));overflow:hidden;display:flex;align-items:flex-end;padding:11px}
[data-page="news"] .ncard-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
[data-page="news"] .ncard-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.32) 100%);pointer-events:none}
[data-page="news"] .ncard-glyph{position:absolute;top:50%;left:50%;transform:translate(-50%,-52%);font-size:52px;opacity:.9;filter:none;line-height:1}
[data-page="news"] .ncard-tag{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:30px;box-sizing:border-box;background:rgba(255,255,255,.92);color:var(--green-900);font-size:11px;line-height:1.2;font-weight:800;padding:0 12px;border-radius:var(--pill);box-shadow:none}
[data-page="news"] .ncard-hot{position:absolute;top:11px;right:11px;z-index:1;display:inline-flex;align-items:center;gap:5px;background:var(--breaking,#C0341D);color:#fff;font-size:10px;font-weight:800;letter-spacing:.05em;padding:4px 9px;border-radius:var(--pill)}
[data-page="news"] .ncard-hot .pd{width:6px;height:6px;border-radius:50%;background:#fff;animation:nhblink 1.3s infinite}
[data-page="news"] .ncard-b{display:flex;flex-direction:column;gap:8px;padding:14px 15px 15px;flex:1}
[data-page="news"] .ncard-date{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-3);font-family:var(--mono);font-weight:600}
[data-page="news"] .ncard-t{font-family:var(--serif);font-weight:700;font-size:16px;color:var(--green-900);line-height:1.32;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
[data-page="news"] .ncard-d{font-size:12.5px;color:var(--ink-2);line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
[data-page="news"] .ncard-au{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:10px;border-top:1px solid var(--border)}
[data-page="news"] .ncard-av{width:26px;height:26px;border-radius:50%;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:11px;flex:none}
[data-page="news"] .ncard-an{font-size:12px;color:var(--ink-2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
[data-page="news"] .nhub-empty{padding:60px 20px;text-align:center;color:var(--ink-3);background:var(--surface);border:1px dashed var(--border);border-radius:var(--r);font-size:14.5px}
@media(max-width:1080px){[data-page="news"] .nhub-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){[data-page="news"] .nhub-grid{grid-template-columns:repeat(2,1fr);gap:14px}}
@media(max-width:460px){[data-page="news"] .nhub-grid{grid-template-columns:1fr}}

/* ===== page: promotion — scoped [data-page="promotion"] ===== */
[data-page="promotion"] .wcb-ccard .thumb .cat{position:absolute;top:10px;left:10px}
[data-page="promotion"] .hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
[data-page="promotion"] .hero .glow{position:absolute;width:55vw;height:55vw;right:-16vw;top:-24vw;border-radius:50%;background:none;pointer-events:none}
[data-page="promotion"] .hero-in{position:relative;z-index:1;max-width:820px;margin:0 auto;padding:34px 20px 40px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:32px}
[data-page="promotion"] .hero .tag{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--gold-bright);background:rgba(201,162,39,.14);border:1px solid rgba(201,162,39,.4);border-radius:var(--pill);padding:5px 13px}
[data-page="promotion"] .hero h1{font-family:var(--serif);font-weight:800;font-size:clamp(27px,4.6vw,40px);line-height:1.4}
[data-page="promotion"] .hero h1 .gold{color:var(--gold-bright)}
[data-page="promotion"] .hero .sub{margin:0 auto;color:rgba(255,255,255,.78);font-size:15px;max-width:64ch;line-height:1.6}
[data-page="promotion"] .hstats{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
[data-page="promotion"] .hstat{background:rgba(255,255,255,.05);border:1px solid rgba(201,162,39,.3);border-radius:14px;padding:14px 24px;min-width:96px}
[data-page="promotion"] .hstat b{display:block;font-family:var(--mono);font-weight:800;font-size:30px;color:var(--gold-bright);line-height:1}
[data-page="promotion"] .hstat span{display:block;font-size:11.5px;color:rgba(255,255,255,.65);margin-top:7px}
[data-page="promotion"] .warn-banner{display:flex;gap:12px;background:var(--gold-soft);border:1px solid #ecd9a8;border-radius:var(--r);padding:14px 16px;margin:8px 0 4px}
[data-page="promotion"] .warn-banner .wi{font-size:20px;flex:none;line-height:1.3}
[data-page="promotion"] .warn-banner b{color:var(--green-900)}
[data-page="promotion"] .warn-banner p{font-size:13.5px;color:var(--ink);line-height:1.6}
[data-page="promotion"] .pfilters{flex-direction:column;align-items:stretch;margin:18px 0}
[data-page="promotion"] .pfchips{display:flex;gap:7px;flex-wrap:wrap}

[data-page="promotion"] .pf-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-top:1px solid var(--border);padding-top:12px}
[data-page="promotion"] .pf-toggle{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--ink-2);cursor:pointer;user-select:none}
[data-page="promotion"] .pf-toggle input{width:16px;height:16px;accent-color:var(--green-700)}
[data-page="promotion"] .pcount{font-size:12.5px;color:var(--ink-3);margin-bottom:12px}
[data-page="promotion"] .pcount b{color:var(--green-900)}
[data-page="promotion"] .pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
[data-page="promotion"] .pcard{display:flex;flex-direction:column;gap:12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);padding:16px}
[data-page="promotion"] .pcard.hidden{display:none}
[data-page="promotion"] .pc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
[data-page="promotion"] .pc-bk{display:flex;align-items:center;gap:9px;min-width:0}
[data-page="promotion"] .pc-logo{width:38px;height:38px;border-radius:10px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:11px;flex:none}
[data-page="promotion"] .pc-bk b{font-family:var(--serif);font-size:15px;color:var(--green-900)}
[data-page="promotion"] .badges{display:flex;flex-direction:column;gap:5px;align-items:flex-end;flex:none}
[data-page="promotion"] .badge{font-size:10px;font-weight:800;padding:3px 9px;border-radius:99px;white-space:nowrap;letter-spacing:.02em}
[data-page="promotion"] .badge.type{background:var(--gold-soft);color:var(--gold-deep)}
[data-page="promotion"] .badge.new{background:var(--up-soft);color:var(--up)}
[data-page="promotion"] .pc-title{font-family:var(--serif);font-weight:800;font-size:17px;color:var(--green-900);line-height:1.32}
[data-page="promotion"] .pc-cond{display:grid;gap:7px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:11px 0}
[data-page="promotion"] .cond{display:flex;justify-content:space-between;gap:12px;font-size:12.5px}
[data-page="promotion"] .cond .k{color:var(--ink-3);flex:none}
[data-page="promotion"] .cond .v{color:var(--ink);font-weight:600;text-align:right}
[data-page="promotion"] .cond .v.ok{color:var(--up)}
[data-page="promotion"] .pc-meta{display:flex;gap:14px;flex-wrap:wrap;align-items:center;font-size:11.5px;color:var(--ink-3)}
[data-page="promotion"] .pc-meta .exp{color:var(--down);font-weight:600}
[data-page="promotion"] .pc-meta .checked{margin-left:auto}
[data-page="promotion"] .pc-cta{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:auto}
[data-page="promotion"] .pc-cta .btn-gold{grid-column:1/-1}
[data-page="promotion"] .pc-cta .btn{padding:0 12px;font-size:13px}
[data-page="promotion"] .pc-empty{grid-column:1/-1;text-align:center;color:var(--ink-3);font-size:14px;padding:40px 0}
@media(max-width:980px){[data-page="promotion"] .pgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){[data-page="promotion"] .pgrid{grid-template-columns:1fr}[data-page="promotion"] .pf-right{width:100%;margin-left:0}}
[data-page="promotion"] .pf-mob{display:none}
[data-page="promotion"] .pf-dd{position:relative;flex:1 1 0;min-width:0}





[data-page="promotion"] .pf-dd.dd-right .pf-panel{left:auto;right:0}

[data-page="promotion"] .pf-grp+.pf-grp{margin-top:16px}
[data-page="promotion"] .pf-grp-l{font-family:var(--serif);font-weight:700;font-size:14px;color:var(--green-900);margin-bottom:10px}



[data-page="promotion"] .pf-thai{display:flex;align-items:center;gap:9px;margin-top:16px;font-size:13.5px;font-weight:600;color:var(--ink-2);cursor:pointer;user-select:none}
[data-page="promotion"] .pf-thai input{width:17px;height:17px;accent-color:var(--green-700);flex:none}
[data-page="promotion"] .pf-list{display:flex;flex-direction:column}
[data-page="promotion"] .pf-list button{text-align:left;background:none;border:none;font-family:var(--thai);font-size:14.5px;color:var(--ink);padding:12px 8px;border-bottom:1px solid var(--cream-2);cursor:pointer;border-radius:7px}
[data-page="promotion"] .pf-list button:last-child{border-bottom:none}
[data-page="promotion"] .pf-list button:hover{background:var(--cream-2)}
[data-page="promotion"] .pf-list button.on{color:var(--green-700);font-weight:700}
@media(max-width:640px){[data-page="promotion"] .pfilters{display:none}[data-page="promotion"] .pf-mob{display:flex;gap:10px;margin:0 0 16px}}

/* ===== page: ranking-cheapest — scoped [data-page="ranking-cheapest"] ===== */
[data-page="ranking-cheapest"] .eyebrow{color:#e8c457}
[data-page="ranking-cheapest"] .wcb-ccard .thumb .cat{position:absolute;top:10px;left:10px}
[data-page="ranking-cheapest"] .hero-in>div{display:flex;flex-direction:column;align-items:flex-start;gap:32px}
[data-page="ranking-cheapest"] .hero-in .eyebrow{margin-bottom:0}
[data-page="ranking-cheapest"] .hero .sub{margin-top:0}
[data-page="ranking-cheapest"] .hero h1{line-height:1.4}
[data-page="ranking-cheapest"] .trust{display:flex;gap:22px;margin-top:20px;flex-wrap:wrap}
[data-page="ranking-cheapest"] .trust .t b{font-family:var(--mono);font-weight:800;font-size:24px;color:var(--gold-bright);display:block}
[data-page="ranking-cheapest"] .trust .t span{font-size:12px;color:rgba(255,255,255,.6)}
[data-page="ranking-cheapest"] .champ{background:rgba(255,255,255,.05);border:1px solid rgba(201,162,39,.4);border-radius:var(--r-lg);padding:20px}
[data-page="ranking-cheapest"] .champ .lab{font-size:12px;color:var(--gold-bright);font-weight:700;margin-bottom:11px}
[data-page="ranking-cheapest"] .champ .name{display:flex;align-items:center;gap:11px;margin-bottom:6px}
[data-page="ranking-cheapest"] .champ .clogo{width:42px;height:42px;border-radius:11px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:13px}
[data-page="ranking-cheapest"] .champ .name b{font-family:var(--serif);font-size:21px;color:#fff}
[data-page="ranking-cheapest"] .champ .for{font-size:12.5px;color:rgba(255,255,255,.6);margin-bottom:12px}
[data-page="ranking-cheapest"] .champ .big{display:flex;align-items:baseline;gap:7px}
[data-page="ranking-cheapest"] .champ .big .v{font-family:var(--mono);font-weight:800;font-size:34px;color:var(--gold-bright)}
[data-page="ranking-cheapest"] .champ .big .u{font-size:12px;color:rgba(255,255,255,.6)}
[data-page="ranking-cheapest"] .champ .meta{font-size:12px;color:rgba(255,255,255,.6);margin-top:8px}
[data-page="ranking-cheapest"] .controls{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:var(--hh);z-index:30}
[data-page="ranking-cheapest"] .controls-in{max-width:1180px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
[data-page="ranking-cheapest"] .insts{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none}
[data-page="ranking-cheapest"] .insts::-webkit-scrollbar{display:none}
[data-page="ranking-cheapest"] .inst{flex:0 0 auto}

[data-page="ranking-cheapest"] .sortbox{margin-left:auto;display:flex;align-items:center;gap:9px}
[data-page="ranking-cheapest"] .sortbox .lbl{font-size:12.5px;color:var(--ink-3);font-weight:600}
[data-page="ranking-cheapest"] .seg button{font-size:12.5px;padding:7px 12px;min-height:36px}
[data-page="ranking-cheapest"] main{padding:32px 0 8px}
[data-page="ranking-cheapest"] .board-head{margin:0 0 14px}
[data-page="ranking-cheapest"] .board-head h2{font-size:24px}
[data-page="ranking-cheapest"] .board-head .note{font-size:12px;color:var(--ink-3);max-width:40ch;text-align:right}
[data-page="ranking-cheapest"] .legend{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:14px;font-size:12px;color:var(--ink-2)}
[data-page="ranking-cheapest"] .legend .lg{display:inline-flex;align-items:center;gap:7px}
[data-page="ranking-cheapest"] .legend .sw{width:22px;height:8px;border-radius:99px;display:inline-block}
[data-page="ranking-cheapest"] .legend .dotr,[data-page="ranking-cheapest"] .legend .dotp{width:9px;height:9px;border-radius:50%}
[data-page="ranking-cheapest"] .legend .dotr{background:var(--recv)}
[data-page="ranking-cheapest"] .legend .dotp{background:var(--pay)}

[data-page="ranking-cheapest"] .wcb-thead,[data-page="ranking-cheapest"] .wcb-row{grid-template-columns:80px 42px 1.5fr 80px 98px 80px 170px}

[data-page="ranking-cheapest"] .wcb-row .rank{font-family:var(--mono);font-weight:800;font-size:18px;color:var(--ink-3);text-align:center}
[data-page="ranking-cheapest"] .wcb-row .rank .n{font-family:var(--serif);font-weight:800;font-size:16px;color:var(--ink);white-space:nowrap;flex-shrink:0}
[data-page="ranking-cheapest"] .wcb-row .rank .mv{display:inline-flex;align-items:center;gap:3px;padding:0 10px;min-height:16px;border-radius:var(--pill);font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0}
[data-page="ranking-cheapest"] .wcb-row .rank .mv.up{background:var(--up-soft);color:var(--up)}
[data-page="ranking-cheapest"] .wcb-row .rank .mv.dn{background:var(--down-soft);color:var(--down)}
[data-page="ranking-cheapest"] .wcb-row .rank .mv.fl{background:var(--cream-2);color:var(--ink-3)}
[data-page="ranking-cheapest"] .wcb-row.top1 .rank,[data-page="ranking-cheapest"] .wcb-row.top2 .rank,[data-page="ranking-cheapest"] .wcb-row.top3 .rank{color:var(--gold-deep)}
[data-page="ranking-cheapest"] .wcb-row .logo{width:42px;height:42px;border-radius:11px;background:var(--bk);color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:12px}
[data-page="ranking-cheapest"] .bname{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
[data-page="ranking-cheapest"] .bname b{font-family:var(--serif);font-size:16px;color:var(--green-900)}
[data-page="ranking-cheapest"] .bname .crown{color:var(--gold)}
[data-page="ranking-cheapest"] .bname .acct{font-size:11px;color:var(--ink-3);background:var(--cream-2);border:1px solid var(--border);padding:2px 8px;border-radius:var(--pill)}
[data-page="ranking-cheapest"] .ctag{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:var(--pill)}
[data-page="ranking-cheapest"] .ctag.comm{background:var(--gold-soft);color:var(--gold-deep)}
[data-page="ranking-cheapest"] .ctag.spread{background:var(--up-soft,#E6F1EA);color:var(--recv)}
[data-page="ranking-cheapest"] .bsub{font-size:11.5px;color:var(--ink-3);margin-top:3px}
[data-page="ranking-cheapest"] .costcell .v{display:flex;align-items:baseline;gap:5px}
[data-page="ranking-cheapest"] .costcell .v .num{font-weight:800;font-size:20px;color:var(--green-900)}
[data-page="ranking-cheapest"] .costcell .v .u{font-size:11px;color:var(--ink-3)}
[data-page="ranking-cheapest"] .barwrap{height:7px;border-radius:99px;background:var(--cream-2);overflow:hidden;margin:6px 0 4px}
[data-page="ranking-cheapest"] .bar{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--gold-deep),var(--gold),var(--gold-bright));width:0;transition:width .9s cubic-bezier(.2,.7,.2,1)}
[data-page="ranking-cheapest"] .cheapest-tag{font-size:11px;font-weight:700;color:var(--recv)}
[data-page="ranking-cheapest"] .swapcell{display:grid;gap:5px}
[data-page="ranking-cheapest"] .swaprow{display:flex;justify-content:space-between;font-size:12px}
[data-page="ranking-cheapest"] .swaprow .k{color:var(--ink-3)}
[data-page="ranking-cheapest"] .swaprow .val{font-family:var(--mono);font-weight:700}
[data-page="ranking-cheapest"] .swaprow .val.recv{color:var(--recv)}
[data-page="ranking-cheapest"] .swaprow .val.pay{color:var(--pay)}
[data-page="ranking-cheapest"] .swaprow .val.zero{color:var(--ink-3)}
[data-page="ranking-cheapest"] .costcol{display:flex;flex-direction:column;gap:2px;text-align:right;min-width:0}
[data-page="ranking-cheapest"] .costcol .cl{font-size:10px;color:var(--ink-3);font-weight:600}
[data-page="ranking-cheapest"] .costcol .cv{font-family:var(--mono);font-weight:800;font-size:15px;color:var(--green-900);font-variant-numeric:tabular-nums}
[data-page="ranking-cheapest"] .costcol .cv.recv{color:var(--recv)}
[data-page="ranking-cheapest"] .costcol .cv.pay{color:var(--pay)}
[data-page="ranking-cheapest"] .bacts{display:flex;gap:7px;justify-content:flex-end}
[data-page="ranking-cheapest"] .bacts .btn{flex:1}

[data-page="ranking-cheapest"] .champ-costs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:13px 0 10px}
[data-page="ranking-cheapest"] .champ-costs>div{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:8px 6px;text-align:center}
[data-page="ranking-cheapest"] .champ-costs span{display:block;font-size:10.5px;color:rgba(255,255,255,.6);margin-bottom:3px}
[data-page="ranking-cheapest"] .champ-costs b{font-family:var(--mono);font-size:15px;color:#fff;font-variant-numeric:tabular-nums}
[data-page="ranking-cheapest"] .champ-costs b.recv{color:#7FC9A6}
[data-page="ranking-cheapest"] .champ-costs b.pay{color:#F0907F}
[data-page="ranking-cheapest"] .reveal-more{display:flex;justify-content:center;margin-top:18px}
[data-page="ranking-cheapest"] .method{background:var(--cream-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:48px 0;margin-top:36px}
[data-page="ranking-cheapest"] .method h2{font-family:var(--serif);font-size:28px;color:var(--green-900)}
[data-page="ranking-cheapest"] .method .lead{color:var(--ink-2);font-size:15px;margin:8px 0 24px;max-width:62ch}
[data-page="ranking-cheapest"] .mgrid{margin:0}
[data-page="ranking-cheapest"] .mcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:22px;box-shadow:var(--shadow)}
[data-page="ranking-cheapest"] .mcard .mi{width:44px;height:44px;border-radius:12px;background:var(--gold-soft);color:var(--gold-deep);display:grid;place-items:center;font-size:22px;font-weight:800;margin-bottom:13px}
[data-page="ranking-cheapest"] .mcard h3{font-family:var(--serif);font-size:19px;color:var(--green-900);margin-bottom:8px}
[data-page="ranking-cheapest"] .mcard p{font-size:13.5px;color:var(--ink-2)}
[data-page="ranking-cheapest"] .mcard p b{color:var(--ink)}
[data-page="ranking-cheapest"] .method .fine{font-size:12px;color:var(--ink-3);margin-top:18px;line-height:1.6}
[data-page="ranking-cheapest"] .ilinks-sec{padding:32px 0}
[data-page="ranking-cheapest"] .cmt-band{background:var(--cream-2);border-top:1px solid var(--border);padding:48px 0}
@media(max-width:980px){[data-page="ranking-cheapest"] .hero-in{grid-template-columns:1fr}[data-page="ranking-cheapest"] .wcb-row{grid-template-columns:34px 40px 1fr;gap:9px;row-gap:11px}[data-page="ranking-cheapest"] .wcb-row .costcol{grid-column:span 1;flex-direction:row;justify-content:space-between;text-align:left;border-top:1px dashed var(--border);padding-top:8px}[data-page="ranking-cheapest"] .wcb-row .bmid{grid-column:2/-1}[data-page="ranking-cheapest"] .wcb-row .costcol,[data-page="ranking-cheapest"] .wcb-row .bacts{grid-column:1/-1}[data-page="ranking-cheapest"] .wcb-row .costcol .cl{font-size:11.5px}[data-page="ranking-cheapest"] .wcb-row .bacts{justify-content:stretch}[data-page="ranking-cheapest"] .wcb-row .bacts .btn{flex:1}[data-page="ranking-cheapest"] .mgrid{grid-template-columns:1fr}[data-page="ranking-cheapest"] .board-head .note{text-align:left}}
@media(max-width:820px){body[data-page="ranking-cheapest"]{padding-bottom:calc(64px + env(safe-area-inset-bottom))}[data-page="ranking-cheapest"] .controls{position:static}}
@media(max-width:640px){[data-page="ranking-cheapest"] .filterbar{gap:8px}[data-page="ranking-cheapest"] .sortbox{order:3;margin-left:0;flex:1 1 100%;width:auto;flex-wrap:wrap}[data-page="ranking-cheapest"] .sortbox .seg{display:flex;width:100%}[data-page="ranking-cheapest"] .sortbox .seg button{flex:1}[data-page="ranking-cheapest"] .yearctl{margin-left:0}}
@media(min-width:641px){[data-page="ranking-cheapest"] .insts{order:1}[data-page="ranking-cheapest"] .sortbox{order:2}[data-page="ranking-cheapest"] .yearctl{order:3;flex:1 0 100%;margin-left:0;justify-content:flex-end;padding-top:12px;border-top:1px solid var(--border)}}
[data-page="ranking-cheapest"] .filterbar{justify-content:flex-start}
[data-page="ranking-cheapest"] .sortbox{margin-left:auto}
[data-page="ranking-cheapest"] .yearctl{margin-left:auto}

[data-page="ranking-cheapest"] .wcb-thead .r{text-align:right}




[data-page="ranking-cheapest"] .wcb-row.top1{border-left-color:var(--gold);box-shadow:none;background:linear-gradient(90deg,#FFFDF6,transparent)}
[data-page="ranking-cheapest"] .wcb-row.top2{border-left-color:#B9C2C9}
[data-page="ranking-cheapest"] .wcb-row.top3{border-left-color:#CD9A6A}
[data-page="ranking-cheapest"] .wcb-row .rank{display:flex;flex-direction:row;align-items:center;gap:6px;line-height:1.05}
[data-page="ranking-cheapest"] .brk-logo-link{display:block;line-height:0;border-radius:11px;cursor:pointer}
[data-page="ranking-cheapest"] .brk-name{text-decoration:none;color:inherit;cursor:pointer}
[data-page="ranking-cheapest"] .brk-name b{color:var(--green-900)}
[data-page="ranking-cheapest"] .brk-name:hover b{color:var(--gold-deep);text-decoration:underline}
@media(max-width:980px){[data-page="ranking-cheapest"] .wcb-thead{display:none}[data-page="ranking-cheapest"] .wcb-tbody{border-radius:var(--r)}[data-page="ranking-cheapest"] .wcb-row .rank{flex-direction:row;gap:6px}[data-page="ranking-cheapest"] .yearctl{margin-left:0}}

/* ranking-cheapest — mobile card (matches Figma 663:3046 rank-1 / 663:3069 rank-2+) */
@media(max-width:980px){
  [data-page="ranking-cheapest"] .wcb-thead{display:none}
  [data-page="ranking-cheapest"] .wcb-tbody{background:none;border:none;border-radius:0;display:flex;flex-direction:column;gap:12px}
  [data-page="ranking-cheapest"] .wcb-row{display:grid;grid-template-columns:auto auto 1fr;align-items:start;column-gap:11px;row-gap:0;padding:12px 14px;border:1px solid #e6ede7;border-radius:12px;background:#fff;box-shadow:none;margin:0}
  [data-page="ranking-cheapest"] .wcb-row.top1{border-color:var(--gold);background:#f6edd2}
  /* rank stack: medal + move chip (vertical) */
  [data-page="ranking-cheapest"] .wcb-row .rank{flex-direction:column;align-items:center;gap:2px;align-self:start;padding:0}
  [data-page="ranking-cheapest"] .wcb-row .rank .n{width:26px;height:26px;display:grid;place-items:center;background:#8c968c;color:#fff!important;border-radius:9px;font-family:var(--thai);font-weight:700;font-size:13px}
  [data-page="ranking-cheapest"] .wcb-row.top1 .rank .n{background:var(--gold)}
  [data-page="ranking-cheapest"] .wcb-row .rank .mv{height:16px;min-height:0;padding:0 7px;font-size:8px;border-radius:999px}
  [data-page="ranking-cheapest"] .wcb-row .rank .mv.up{background:#e5fff1;color:#2a7d54}
  [data-page="ranking-cheapest"] .wcb-row .rank .mv.dn{background:#fbebe9;color:#b42318}
  /* logo */
  [data-page="ranking-cheapest"] .wcb-row .brk-logo-link{align-self:start}
  [data-page="ranking-cheapest"] .wcb-row .brk-logo-link .wcb-logo{--sz:40px!important;border-radius:11px}
  /* match Figma: solid brand-colour box + initials (favicons are transparent/invisible on light cards) */
  [data-page="ranking-cheapest"] .wcb-row .wcb-logo img{display:none}
  [data-page="ranking-cheapest"] .wcb-row .wcb-logo .init{display:grid!important;font-size:11.5px}
  /* text block */
  [data-page="ranking-cheapest"] .wcb-row .bmid{grid-column:auto;align-self:start;min-width:0}
  [data-page="ranking-cheapest"] .wcb-row .bname b{font-size:14px}
  [data-page="ranking-cheapest"] .wcb-row .acct{font-size:11px;padding:2px 8px}
  [data-page="ranking-cheapest"] .wcb-row .ctag.spread{background:#e6f1ea;color:var(--recv);font-size:11px;padding:2px 8px}
  [data-page="ranking-cheapest"] .wcb-row .bsub{font-size:11px;color:#8a988f;margin-top:4px}
  /* cost rows → key/value with dashed divider */
  [data-page="ranking-cheapest"] .wcb-row .costcol{grid-column:1/-1;flex-direction:row;justify-content:space-between;align-items:center;text-align:left;gap:10px;border-top:1px dashed #e6ede7;padding:9px 0;margin:0}
  [data-page="ranking-cheapest"] .wcb-row .bmid + .costcol{margin-top:8px}
  [data-page="ranking-cheapest"] .wcb-row .costcol .cl{font-size:12.5px;color:#56655c;font-weight:600}
  [data-page="ranking-cheapest"] .wcb-row .costcol .cv{font-family:var(--thai);font-weight:400;font-size:13px;color:#15241c}
  [data-page="ranking-cheapest"] .wcb-row .costcol .cv.recv{color:var(--recv)}
  [data-page="ranking-cheapest"] .wcb-row .costcol .cv.pay{color:var(--pay)}
  /* buttons: full width, stacked, 44px tall (do NOT shrink) */
  [data-page="ranking-cheapest"] .wcb-row .bacts{grid-column:1/-1;flex-direction:column;gap:6px;margin-top:10px}
  [data-page="ranking-cheapest"] .wcb-row .bacts .btn{width:100%;flex:none;min-height:44px;height:auto;font-size:14px;border-radius:10px}
  [data-page="ranking-cheapest"] .wcb-row .bacts .btn-outline{border-color:var(--gold);color:var(--gold)}
}

/* ===== page: ranking-deposit — scoped [data-page="ranking-deposit"] ===== */
[data-page="ranking-deposit"] .eyebrow{color:#e8c457}
[data-page="ranking-deposit"] .wcb-ccard .thumb .cat{position:absolute;top:10px;left:10px}
[data-page="ranking-deposit"] .tldr-sec{margin-top:-24px;position:relative;z-index:2}
[data-page="ranking-deposit"] .tldr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
[data-page="ranking-deposit"] .tlcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:13px}
[data-page="ranking-deposit"] .tlcard.gold{border-color:var(--gold)}
[data-page="ranking-deposit"] .tlcard .ic{width:40px;height:40px;border-radius:11px;background:var(--gold-soft);color:var(--gold-deep);display:grid;place-items:center;font-size:20px;flex:none}
[data-page="ranking-deposit"] .tlcard .lab{font-size:11px;color:var(--ink-3);font-weight:600}
[data-page="ranking-deposit"] .tlcard .v{font-family:var(--serif);font-weight:700;font-size:16px;color:var(--green-900)}
[data-page="ranking-deposit"] .tlcard .v small{font-family:var(--thai);font-size:11.5px;color:var(--ink-3);font-weight:400}

[data-page="ranking-deposit"] .feecell{display:grid;gap:4px}
[data-page="ranking-deposit"] .feecell .fr{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
[data-page="ranking-deposit"] .test-badge{font-size:11px;font-weight:700;color:var(--up);background:var(--up-soft);border:1px solid #c5e2d2;padding:3px 9px;border-radius:99px;display:inline-flex;align-items:center}
[data-page="ranking-deposit"] .chan-cell{display:flex;align-items:center;gap:0;flex-wrap:nowrap;min-width:0}
[data-page="ranking-deposit"] .info-cell{display:flex;align-items:center}
[data-page="ranking-deposit"] .dinfo{background:var(--cream-2);border:1px solid var(--border);border-radius:10px;padding:4px 12px}
[data-page="ranking-deposit"] .dinfo .row{display:flex;justify-content:space-between;gap:14px;border-top:1px dashed var(--border);padding:8px 0}
[data-page="ranking-deposit"] .dinfo .row:first-child{border-top:none}
[data-page="ranking-deposit"] .dinfo .k{font-size:12.5px;color:var(--ink-3)}
[data-page="ranking-deposit"] .dinfo .v{font-family:var(--mono);font-weight:700;font-size:13px;color:var(--ink);text-align:right}
[data-page="ranking-deposit"] .dinfo .v.free{color:var(--up)}
[data-page="ranking-deposit"] .chan-modal{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:20px}
[data-page="ranking-deposit"] .chan-modal[hidden]{display:none}
[data-page="ranking-deposit"] .cm-scrim{position:absolute;inset:0;background:rgba(7,21,14,.55)}
[data-page="ranking-deposit"] .cm-card{position:relative;background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);max-width:880px;width:100%;max-height:86vh;overflow:auto;padding:22px;border-top:3px solid var(--gold)}
[data-page="ranking-deposit"] .cm-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
[data-page="ranking-deposit"] .cm-head h3{font-size:21px;color:var(--green-900)}
[data-page="ranking-deposit"] .cm-close{width:36px;height:36px;border:none;background:var(--cream-2);border-radius:50%;cursor:pointer;display:grid;place-items:center;flex:none}
[data-page="ranking-deposit"] .cm-close svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:2}




[data-page="ranking-deposit"] .t-brk{display:flex;align-items:center;gap:10px}
[data-page="ranking-deposit"] .t-logo{width:36px;height:36px;border-radius:10px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:11px;flex:none}
[data-page="ranking-deposit"] .t-nm{font-family:var(--serif);font-weight:700;font-size:15px;color:var(--green-900)}
[data-page="ranking-deposit"] .chans{display:flex;gap:5px;flex-wrap:wrap}
[data-page="ranking-deposit"] .chan{font-size:10px;font-weight:700;padding:2px 7px;border-radius:var(--pill);background:var(--cream-2);border:1px solid var(--border);color:var(--ink-2)}
[data-page="ranking-deposit"] .chan.bank{background:var(--up-soft);color:var(--up);border-color:#c5e2d2}
[data-page="ranking-deposit"] .chan-cell .chans{width:100%;min-width:0;flex-wrap:nowrap;overflow:hidden}
[data-page="ranking-deposit"] .chan-cell .chan{flex:none;white-space:nowrap}
[data-page="ranking-deposit"] .cellv{font-family:var(--mono);font-weight:700;font-size:13px;color:var(--ink)}
[data-page="ranking-deposit"] .cellv.free{color:var(--up)}
[data-page="ranking-deposit"] .cellk{font-size:10px;color:var(--ink-3);font-weight:400;font-family:var(--thai)}
[data-page="ranking-deposit"] .wtime{font-weight:700;font-size:13px}
[data-page="ranking-deposit"] .wtime.fast{color:var(--up)}
[data-page="ranking-deposit"] .t-cta .btn{width:100%}
[data-page="ranking-deposit"] .noresult{padding:40px;text-align:center;color:var(--ink-3);background:var(--surface);border:1px dashed var(--border);border-radius:0 0 var(--r) var(--r)}
[data-page="ranking-deposit"] .rtoolbar .filters{margin:0;flex:1 1 auto;padding:0;background:none;border:none}
[data-page="ranking-deposit"] .wcb-thead,[data-page="ranking-deposit"] .wcb-row{grid-template-columns:66px 76px minmax(120px,1.4fr) 1fr 1fr 1fr 1fr;gap:14px}
/* deposit/withdraw rate table (new columns) */
[data-page="ranking-deposit"] .wcb-thead span{text-align:center;white-space:nowrap}
[data-page="ranking-deposit"] .wcb-row{align-items:center}
[data-page="ranking-deposit"] .dep-logo{display:flex;justify-content:center;align-items:center}
[data-page="ranking-deposit"] .dep-logo .wcb-logo img{display:none}
[data-page="ranking-deposit"] .dep-logo .wcb-logo .init{display:grid!important}
[data-page="ranking-deposit"] .dep-name{text-align:center}
[data-page="ranking-deposit"] .dep-name .brk-name{font-family:var(--serif);font-weight:700;font-size:15px;color:var(--green-700);text-decoration:none}
[data-page="ranking-deposit"] .dep-name .brk-name:hover{color:var(--gold-deep);text-decoration:underline}
[data-page="ranking-deposit"] .dep-baht,[data-page="ranking-deposit"] .wd-baht,[data-page="ranking-deposit"] .diff-cell,[data-page="ranking-deposit"] .rate-cell{text-align:center}
[data-page="ranking-deposit"] .dep-baht .dv,[data-page="ranking-deposit"] .wd-baht .dv,[data-page="ranking-deposit"] .diff-cell .dv,[data-page="ranking-deposit"] .rate-cell .dv{font-family:var(--mono);font-weight:700;font-size:14px;color:var(--ink);font-variant-numeric:tabular-nums}
[data-page="ranking-deposit"] .dep-baht .cellk,[data-page="ranking-deposit"] .wd-baht .cellk,[data-page="ranking-deposit"] .diff-cell .cellk,[data-page="ranking-deposit"] .rate-cell .cellk{display:none}
[data-page="ranking-deposit"] .wcb-thead span{white-space:nowrap}


[data-page="ranking-deposit"] .wcb-thead span:nth-child(2){padding-left:0}
[data-page="ranking-deposit"] .rk{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:6px}
[data-page="ranking-deposit"] .rk .wcb-rank{width:auto;height:auto;font-family:var(--serif);font-weight:800;font-size:16px;color:var(--ink);place-items:center;white-space:nowrap;flex-shrink:0}
[data-page="ranking-deposit"] .rk .mv{display:inline-flex;align-items:center;gap:3px;padding:0 10px;min-height:16px;border-radius:var(--pill);font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0}
[data-page="ranking-deposit"] .rk .mv.up{background:var(--up-soft);color:var(--up)}
[data-page="ranking-deposit"] .rk .mv.dn{background:var(--down-soft);color:var(--down)}
[data-page="ranking-deposit"] .rk .mv.fl{background:var(--cream-2);color:var(--ink-3)}

[data-page="ranking-deposit"] .t-nm{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
[data-page="ranking-deposit"] .dep-v{font-family:var(--mono);font-weight:700;font-size:14px;color:var(--ink)}
[data-page="ranking-deposit"] .dep-v.free{color:var(--up)}
[data-page="ranking-deposit"] .dep-min .cellk,[data-page="ranking-deposit"] .dep-fee .cellk,[data-page="ranking-deposit"] .dep-time .cellk{display:none}
[data-page="ranking-deposit"] .dep-mob{display:none}


[data-page="ranking-deposit"] .dep-ddbtn .fc{background:var(--gold);color:var(--green-900);font-size:11px;font-weight:800;border-radius:999px;padding:1px 7px}




[data-page="ranking-deposit"] .dep-panel .pgl{font-family:var(--serif);font-weight:700;font-size:13.5px;color:var(--green-900);margin-bottom:10px}



@media(max-width:640px){[data-page="ranking-deposit"] .rtoolbar .filters{display:none}[data-page="ranking-deposit"] .dep-mob{display:block;position:relative;flex:1 1 40%;min-width:0}[data-page="ranking-deposit"] .wcb-thead{display:none}[data-page="ranking-deposit"] .wcb-tbody{background:none;border:none;border-radius:0}[data-page="ranking-deposit"] .wcb-row{grid-template-columns:auto 1fr;grid-template-areas:"rank brk" "chan chan" "info info" "min min" "fee fee" "time time" "cta cta";gap:8px 12px;padding:14px;border:1px solid var(--border);border-radius:12px;background:#fff;box-shadow:var(--shadow);margin-bottom:10px}[data-page="ranking-deposit"] .rk{grid-area:rank;flex-direction:column;gap:2px;align-self:center}[data-page="ranking-deposit"] .t-nm{white-space:normal;line-height:1.2}[data-page="ranking-deposit"] .t-cta .btn{width:100%;white-space:nowrap}[data-page="ranking-deposit"] .chan-cell{grid-area:chan}[data-page="ranking-deposit"] .info-cell{grid-area:info}[data-page="ranking-deposit"] .chan-trigger{margin-left:auto}[data-page="ranking-deposit"] .dep-min{grid-area:min}[data-page="ranking-deposit"] .dep-fee{grid-area:fee}[data-page="ranking-deposit"] .dep-time{grid-area:time}[data-page="ranking-deposit"] .dep-min,[data-page="ranking-deposit"] .dep-fee,[data-page="ranking-deposit"] .dep-time{display:flex;align-items:baseline;gap:8px;font-size:13px}[data-page="ranking-deposit"] .dep-min{border-top:1px dashed var(--border);padding-top:8px}[data-page="ranking-deposit"] .dep-min .cellk,[data-page="ranking-deposit"] .dep-fee .cellk,[data-page="ranking-deposit"] .dep-time .cellk{display:inline;color:var(--ink-3);min-width:88px}}
[data-page="ranking-deposit"] .need-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
[data-page="ranking-deposit"] .need{background:linear-gradient(160deg,var(--green-800),var(--green-950));color:#fff;border-radius:var(--r);padding:20px;border:1px solid rgba(201,162,39,.3)}
[data-page="ranking-deposit"] .need .nt{font-family:var(--serif);font-weight:700;font-size:17px;color:var(--gold-bright);margin-bottom:8px}
[data-page="ranking-deposit"] .need p{font-size:13px;color:rgba(255,255,255,.78);margin-bottom:13px}
[data-page="ranking-deposit"] .need .pick{display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:10px 12px}
[data-page="ranking-deposit"] .need .pick .pl{width:30px;height:30px;border-radius:8px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:10px;flex:none}
[data-page="ranking-deposit"] .need .pick .pn{font-weight:700;font-size:14px}
[data-page="ranking-deposit"] .need .pick .pw{margin-left:auto;font-size:11.5px;color:var(--gold-bright)}
[data-page="ranking-deposit"] .method{background:var(--cream-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
[data-page="ranking-deposit"] .method p{color:var(--ink-2);font-size:14.5px;max-width:64ch}
[data-page="ranking-deposit"] .method p b{color:var(--ink)}
[data-page="ranking-deposit"] .method .fine{font-size:12px;color:var(--ink-3);margin-top:14px}
[data-page="ranking-deposit"] .cmt-band{background:var(--cream-2);border-top:1px solid var(--border);padding:48px 0}
@media(min-width:100000px){[data-page="ranking-deposit"] .wcb-thead{display:none}[data-page="ranking-deposit"] .wcb-row{grid-template-columns:1fr auto;gap:10px;row-gap:9px;padding:15px}[data-page="ranking-deposit"] .wcb-row .t-brk{grid-column:1/-1}[data-page="ranking-deposit"] .wcb-row .chan-cell{grid-column:1/-1}[data-page="ranking-deposit"] .wcb-row .info-cell{grid-column:1/-1}[data-page="ranking-deposit"] .wcb-row>div:not(.t-brk):not(.chan-cell):not(.info-cell):not(.t-cta){font-size:12.5px}[data-page="ranking-deposit"] .dep-min .cellk,[data-page="ranking-deposit"] .dep-fee .cellk,[data-page="ranking-deposit"] .dep-time .cellk{display:inline}[data-page="ranking-deposit"] .wcb-row>div:not(.t-brk):not(.chan-cell):not(.info-cell):not(.t-cta) .cellk::after{content:": "}[data-page="ranking-deposit"] .wcb-row .rk{grid-column:1/-1;flex-direction:row;justify-content:flex-start}[data-page="ranking-deposit"] .wcb-row .t-cta{grid-column:1/-1}}
@media(max-width:820px){body[data-page="ranking-deposit"]{padding-bottom:calc(64px + env(safe-area-inset-bottom))}}

/* ranking-deposit — card layout for mobile AND tablet (deposit/withdraw rate table) */
@media(max-width:1140px){
  [data-page="ranking-deposit"] .wcb-thead{display:none}
  [data-page="ranking-deposit"] .wcb-tbody{background:none;border:none;border-radius:0;display:flex;flex-direction:column;gap:12px}
  [data-page="ranking-deposit"] .wcb-row{display:grid;grid-template-columns:auto auto 1fr;grid-template-areas:"rk logo name" "b1 b1 b1" "b2 b2 b2" "b3 b3 b3" "b4 b4 b4";column-gap:11px;row-gap:0;align-items:center;padding:12px 14px;border:1px solid #e6ede7;border-radius:12px;background:#fff;box-shadow:none;margin:0}
  [data-page="ranking-deposit"] .wcb-row.rrk1{border-color:var(--gold);background:#f6edd2}
  /* rank stack: medal + move chip */
  [data-page="ranking-deposit"] .wcb-row .rk{grid-area:rk;flex-direction:column;align-items:center;gap:2px;align-self:center}
  [data-page="ranking-deposit"] .wcb-row .rk .wcb-rank{width:26px;height:26px;display:grid;place-items:center;background:#8c968c;color:#fff!important;border-radius:9px;font-family:var(--thai);font-weight:700;font-size:13px}
  [data-page="ranking-deposit"] .wcb-row.rrk1 .rk .wcb-rank{background:var(--gold)}
  [data-page="ranking-deposit"] .wcb-row .rk .mv{height:16px;min-height:0;padding:0 7px;font-size:8px;border-radius:999px}
  [data-page="ranking-deposit"] .wcb-row .rk .mv.up{background:#e5fff1;color:#2a7d54}
  [data-page="ranking-deposit"] .wcb-row .rk .mv.dn{background:#fbebe9;color:#b42318}
  /* logo — solid brand box + initials (favicons are transparent on light cards) */
  [data-page="ranking-deposit"] .wcb-row .dep-logo{grid-area:logo;justify-content:flex-start}
  [data-page="ranking-deposit"] .wcb-row .dep-logo .wcb-logo{--sz:40px!important;border-radius:11px}
  [data-page="ranking-deposit"] .wcb-row .dep-logo .wcb-logo img{display:none}
  [data-page="ranking-deposit"] .wcb-row .dep-logo .wcb-logo .init{display:grid!important;font-size:11.5px}
  /* name */
  [data-page="ranking-deposit"] .wcb-row .dep-name{grid-area:name;text-align:left;align-self:center}
  [data-page="ranking-deposit"] .wcb-row .dep-name .brk-name{font-family:var(--thai);font-weight:700;font-size:14px;color:#071a11}
  /* kv rows: ฝาก / ถอน / ผลต่าง / %เรท */
  [data-page="ranking-deposit"] .wcb-row .dep-baht{grid-area:b1;margin-top:8px}
  [data-page="ranking-deposit"] .wcb-row .wd-baht{grid-area:b2}
  [data-page="ranking-deposit"] .wcb-row .diff-cell{grid-area:b3}
  [data-page="ranking-deposit"] .wcb-row .rate-cell{grid-area:b4}
  [data-page="ranking-deposit"] .wcb-row .dep-baht,[data-page="ranking-deposit"] .wcb-row .wd-baht,[data-page="ranking-deposit"] .wcb-row .diff-cell,[data-page="ranking-deposit"] .wcb-row .rate-cell{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;border-top:1px dashed #e6ede7;padding:9px 0}
  [data-page="ranking-deposit"] .wcb-row .dep-baht .cellk,[data-page="ranking-deposit"] .wcb-row .wd-baht .cellk,[data-page="ranking-deposit"] .wcb-row .diff-cell .cellk,[data-page="ranking-deposit"] .wcb-row .rate-cell .cellk{display:inline;font-family:var(--thai);font-weight:600;font-size:12.5px;color:#56655c}
  [data-page="ranking-deposit"] .wcb-row .dep-baht .dv,[data-page="ranking-deposit"] .wcb-row .wd-baht .dv,[data-page="ranking-deposit"] .wcb-row .diff-cell .dv,[data-page="ranking-deposit"] .wcb-row .rate-cell .dv{font-family:var(--mono);font-weight:700;font-size:13px;color:#15241c}
}
/* tablet: same cards, tiled 2 per row so they aren't stretched full-width */
@media(min-width:981px) and (max-width:1140px){
  [data-page="ranking-deposit"] .wcb-tbody{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
}

/* ===== page: ranking-forex — scoped [data-page="ranking-forex"] ===== */
[data-page="ranking-forex"] .eyebrow{color:#e8c457}
[data-page="ranking-forex"] .wcb-ccard .thumb .cat{position:absolute;top:10px;left:10px}
[data-page="ranking-forex"] .brk-link .wcb-logo{--sz:36px!important}
[data-page="ranking-forex"] .hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
[data-page="ranking-forex"] .hero-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:-16px}
[data-page="ranking-forex"] .hero-chips .tchip{background:rgba(255,255,255,.08);color:#eaf2ec;font-size:12.5px;font-weight:600;padding:4px 12px;border-radius:999px}
[data-page="ranking-forex"] .wcb-thead,[data-page="ranking-forex"] .wcb-row{grid-template-columns:96px minmax(116px,1.1fr) minmax(150px,1.2fr) 68px 78px 84px 226px}
[data-page="ranking-forex"] .wcb-row{min-height:80px}
[data-page="ranking-forex"] .t-rank{display:flex;flex-direction:row;align-items:center;gap:8px}
[data-page="ranking-forex"] .t-rank .rkn{font-family:var(--serif);font-weight:800;font-size:16px;color:var(--ink);width:auto;height:auto;display:block;white-space:nowrap;flex-shrink:0}
[data-page="ranking-forex"] .t-rank .mv{display:inline-flex;align-items:center;gap:3px;padding:0 10px;min-height:16px;border-radius:var(--pill);font-size:12px;white-space:nowrap;flex-shrink:0}
[data-page="ranking-forex"] .t-rank .mv.up{background:var(--up-soft);color:var(--up)}
[data-page="ranking-forex"] .t-rank .mv.dn{background:var(--down-soft);color:var(--down)}
[data-page="ranking-forex"] .t-rank .mv.fl{background:var(--cream-2);color:var(--ink-3)}


[data-page="ranking-forex"] .wcb-thead span:nth-child(2){padding-left:52px}
[data-page="ranking-forex"] .wcb-thead button{background:none;border:none;color:var(--ink-3);font-family:var(--thai);font-weight:700;font-size:12.5px;cursor:pointer;display:inline-flex;align-items:center;gap:4px;padding:0}
[data-page="ranking-forex"] .wcb-thead button .ar{opacity:.5;font-size:10px}
[data-page="ranking-forex"] .wcb-thead button.act{color:var(--green-700)}
[data-page="ranking-forex"] .wcb-thead button.act .ar{opacity:1}


[data-page="ranking-forex"] .t-brk{display:flex;align-items:center;gap:12px;min-width:0}
[data-page="ranking-forex"] .t-nm{font-family:var(--serif);font-weight:700;font-size:16px;color:var(--green-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
[data-page="ranking-forex"] .t-yr{font-family:var(--mono);font-weight:700;font-size:14px;color:var(--ink-2)}
[data-page="ranking-forex"] .t-seg{font-weight:800;font-size:13px}
[data-page="ranking-forex"] .t-seg.y{color:var(--up)}
[data-page="ranking-forex"] .t-seg.n{color:var(--down)}
[data-page="ranking-forex"] .t-score .v{font-family:var(--mono);font-weight:800;font-size:18px;color:var(--ink);white-space:nowrap}
[data-page="ranking-forex"] .t-cta{display:flex;gap:8px;justify-content:flex-end}
[data-page="ranking-forex"] .t-cta .btn{white-space:nowrap}
[data-page="ranking-forex"] .t-cta .btn-gold{flex:none}
[data-page="ranking-forex"] .t-cta .btn-review{flex:1;min-width:0;overflow:hidden;justify-content:center;gap:4px}
[data-page="ranking-forex"] .t-cta .btn-review .rv-lb{flex:none}
[data-page="ranking-forex"] .t-cta .btn-review .rv-nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
[data-page="ranking-forex"] .crown{display:none}
[data-page="ranking-forex"] .t-lab{display:none}
[data-page="ranking-forex"] .t-score .mt{display:none}
[data-page="ranking-forex"] .tc,[data-page="ranking-forex"] .nm2{display:contents}
[data-page="ranking-forex"] .t-yr-m{display:none}
@media(max-width:980px){
  [data-page="ranking-cheapest"] .wcb-table,
  [data-page="ranking-deposit"] .wcb-table,
  [data-page="ranking-forex"] .wcb-table{background:none;border:none;box-shadow:none;overflow:visible}
  [data-page="ranking-cheapest"] .wcb-tbody,
  [data-page="ranking-deposit"] .wcb-tbody,
  [data-page="ranking-forex"] .wcb-tbody{display:flex;flex-direction:column;gap:12px;background:none;border:none;border-radius:0}
  [data-page="ranking-cheapest"] .wcb-row,
  [data-page="ranking-deposit"] .wcb-row,
  [data-page="ranking-forex"] .wcb-row{margin:0}
}
@media(max-width:980px){
  [data-page="ranking-forex"] .wcb-thead{display:none}
  [data-page="ranking-forex"] .wcb-tbody{background:none;border:none;border-radius:0}
  [data-page="ranking-forex"] .wcb-row{grid-template-columns:auto 1fr;grid-template-areas:"rank brk" "lic lic" "seg seg" "score score" "cta cta";gap:9px 11px;padding:6px 14px 12px;border:1px solid #e6ede7;border-radius:12px;background:#fff;box-shadow:none;margin:0}
  [data-page="ranking-forex"] .wcb-row.rrk1{border-color:var(--gold);background:#f6edd2}
  [data-page="ranking-forex"] .brk-link .wcb-logo{--sz:38px!important;border-radius:7px}
  [data-page="ranking-forex"] .t-lic span{background:#e2f1e8;border-color:#c6e2d2;color:#1f6b46;border-radius:7px;font-size:11px;padding:3px 9px}
  [data-page="ranking-forex"] .t-lic span::before{content:"\2696\FE0E";margin-right:1px}
  [data-page="ranking-forex"] .t-seg.y::before{content:"\2714  "}
  [data-page="ranking-forex"] .t-rank{grid-area:rank;flex-direction:row;align-items:center;padding:10px 0}
  [data-page="ranking-forex"] .t-rank .mv{display:none}
  [data-page="ranking-forex"] .wcb-row .wcb-rank{background:#8c968c!important;color:#fff!important;width:26px;height:26px;font-size:14px;border-radius:9px;display:grid;place-items:center;line-height:1}
  [data-page="ranking-forex"] .wcb-row.rrk1 .wcb-rank{background:var(--gold)!important}
  [data-page="ranking-forex"] .t-brk{grid-area:brk;padding:10px 0}
  [data-page="ranking-forex"] .t-brk .t-nm{white-space:normal;line-height:1.2}
  [data-page="ranking-forex"] .crown{display:inline;color:var(--gold);font-size:13px;margin-left:2px}
  [data-page="ranking-forex"] .tc{display:flex;flex-direction:column;gap:2px;min-width:0}
  [data-page="ranking-forex"] .nm2{display:flex;align-items:baseline;gap:4px}
  [data-page="ranking-forex"] .t-yr-m{display:block;font-size:11.5px;color:var(--ink-3);font-weight:400}
  [data-page="ranking-forex"] .t-lic-cell{grid-area:lic;display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-top:1px dashed #e6ede7;border-bottom:1px dashed #e6ede7}
  [data-page="ranking-forex"] .t-seg-cell{grid-area:seg;display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px dashed #e6ede7}
  [data-page="ranking-forex"] .t-score{grid-area:score;display:flex;align-items:center;justify-content:space-between;padding:9px 0;gap:10px}
  [data-page="ranking-forex"] .t-lab{display:block;font-size:12.5px;font-weight:600;color:var(--ink-2);flex:none}
  [data-page="ranking-forex"] .t-score .v{font-size:15px}
  [data-page="ranking-forex"] .t-score .mt{display:block;width:90px;height:7px;border-radius:99px;background:#e3ede6;overflow:hidden;flex:none}
  [data-page="ranking-forex"] .t-score .mf{display:block;height:100%;border-radius:99px;background:var(--gold)}
  [data-page="ranking-forex"] .t-cta{grid-area:cta;flex-direction:column;gap:6px}
  [data-page="ranking-forex"] .t-cta .btn{width:100%;flex:none}
  [data-page="ranking-forex"] .t-cta .btn-review .rv-nm{display:none}
  [data-page="ranking-forex"] .t-cta .btn-review .rv-lb{overflow:visible}
  [data-page="ranking-forex"] .t-cta .btn{min-height:44px;height:auto;font-size:14px}
  [data-page="ranking-forex"] .t-cta .btn-review{border-color:var(--gold);color:var(--gold)}
}
[data-page="ranking-forex"] .section{padding:32px 0 40px}
[data-page="ranking-forex"] .top3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
[data-page="ranking-forex"] .t3card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:20px;box-shadow:var(--shadow);position:relative}
[data-page="ranking-forex"] .t3card.first{border-color:var(--gold);box-shadow:none}
[data-page="ranking-forex"] .t3card .medal{position:absolute;top:-12px;left:18px;background:var(--green-900);color:#fff;font-family:var(--mono);font-weight:800;font-size:12px;padding:3px 11px;border-radius:var(--pill)}
[data-page="ranking-forex"] .t3card.first .medal{background:var(--gold);color:var(--green-900)}
[data-page="ranking-forex"] .t3card .t3h{display:flex;align-items:center;gap:11px;margin:6px 0 12px}
[data-page="ranking-forex"] .t3card .t3logo{width:44px;height:44px;border-radius:11px;color:#fff;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:13px;flex:none}
[data-page="ranking-forex"] .t3card .t3nm{font-family:var(--serif);font-weight:700;font-size:18px;color:var(--green-900)}
[data-page="ranking-forex"] .t3card .t3sc{font-family:var(--mono);font-weight:800;font-size:13px;color:var(--gold-deep)}
[data-page="ranking-forex"] .t3card .badge-lic{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:13px}
[data-page="ranking-forex"] .t3card .badge-lic span{font-size:11px;font-weight:700;color:var(--up);background:var(--up-soft);border:1px solid #c5e2d2;padding:2px 8px;border-radius:var(--pill)}
[data-page="ranking-forex"] .t3card ul{list-style:none;display:grid;gap:8px;margin-bottom:14px}
[data-page="ranking-forex"] .t3card li{display:flex;gap:8px;font-size:13.5px;color:var(--ink-2);align-items:flex-start}
[data-page="ranking-forex"] .t3card li svg{width:15px;height:15px;flex:none;margin-top:3px;color:var(--up);stroke:currentColor;fill:none;stroke-width:2.2}
[data-page="ranking-forex"] .t3card .t3acts{display:flex;gap:8px}
[data-page="ranking-forex"] .t3card .t3acts .btn{flex:1}
[data-page="ranking-forex"] .redflag{background:var(--warn-soft);border:1px solid #f3c9c4;border-radius:var(--r);padding:22px 24px}
[data-page="ranking-forex"] .redflag h3{font-family:var(--serif);font-size:20px;color:var(--warn);display:flex;align-items:center;gap:9px;margin-bottom:8px}
[data-page="ranking-forex"] .redflag .rsub{font-size:13.5px;color:var(--ink-2);margin-bottom:16px}
[data-page="ranking-forex"] .rf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
[data-page="ranking-forex"] .rf{background:var(--surface);border:1px solid #f3c9c4;border-radius:12px;padding:15px}
[data-page="ranking-forex"] .rf .ic{width:34px;height:34px;border-radius:9px;background:var(--warn-soft);color:var(--warn);display:grid;place-items:center;font-size:18px;margin-bottom:10px}
[data-page="ranking-forex"] .rf h4{font-family:var(--serif);font-size:15px;color:var(--warn);margin-bottom:5px}
[data-page="ranking-forex"] .rf p{font-size:12.5px;color:var(--ink-2)}
[data-page="ranking-forex"] .method{background:var(--cream-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
[data-page="ranking-forex"] .weights{display:grid;gap:10px;max-width:620px}
[data-page="ranking-forex"] .wrow{display:grid;grid-template-columns:200px 1fr 50px;gap:14px;align-items:center}
[data-page="ranking-forex"] .wrow .wl{font-size:13.5px;font-weight:600;color:var(--ink-2)}
[data-page="ranking-forex"] .wrow .wt{height:9px;border-radius:99px;background:var(--surface);overflow:hidden;border:1px solid var(--border)}
[data-page="ranking-forex"] .wrow .wt i{display:block;height:100%;background:linear-gradient(90deg,var(--green-700),var(--green-600))}
[data-page="ranking-forex"] .wrow .wv{font-family:var(--mono);font-weight:800;font-size:14px;color:var(--green-900);text-align:right}
[data-page="ranking-forex"] .cmt-band{background:var(--cream-2);border-top:1px solid var(--border);padding:48px 0}
@media(max-width:980px){[data-page="ranking-forex"] .top3,[data-page="ranking-forex"] .rf-grid{grid-template-columns:1fr}[data-page="ranking-forex"] .foot-grid{grid-template-columns:1fr 1fr}[data-page="ranking-forex"] .wcb-thead{display:none}[data-page="ranking-forex"] .wcb-row{grid-template-columns:36px 1fr auto;gap:10px;row-gap:10px}[data-page="ranking-forex"] .wcb-row .t-lic-cell{grid-column:1/-1;order:4}[data-page="ranking-forex"] .wcb-row .t-yr{display:none}[data-page="ranking-forex"] .wcb-row .t-seg-cell{grid-column:1/-1;order:5;font-size:12.5px;color:var(--ink-2)}[data-page="ranking-forex"] .wcb-row .t-score{order:3}[data-page="ranking-forex"] .wcb-row .t-cta{grid-column:1/-1;order:6;justify-content:stretch}[data-page="ranking-forex"] .wcb-row .t-cta .btn{flex:1}[data-page="ranking-forex"] .wcb-row .t-cta .btn-review{justify-content:center}[data-page="ranking-forex"] .wrow{grid-template-columns:130px 1fr 44px}}
@media(max-width:820px){[data-page="ranking-forex"] .nav{display:none}[data-page="ranking-forex"] .brand .bt .b{display:none}[data-page="ranking-forex"] .btabs{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:54;background:var(--green-900);border-top:1px solid rgba(201,162,39,.32);padding:6px 4px calc(6px + env(safe-area-inset-bottom));box-shadow:none}body[data-page="ranking-forex"]{padding-bottom:calc(64px + env(safe-area-inset-bottom))}}
@media(max-width:640px){[data-page="ranking-forex"] .world{display:none}[data-page="ranking-forex"] .foot-grid{grid-template-columns:1fr;gap:22px}}

/* ===== page: ranking — scoped [data-page="ranking"] ===== */
@keyframes pulse-ranking{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes scroll-ranking{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes spin-ranking{100%{transform:rotate(360deg)}}
@keyframes rise-ranking{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
[data-page="ranking"] .view{display:none}
[data-page="ranking"] .view.active{display:block}
[data-page="ranking"] .hero{position:relative;background:var(--hero-bg);color:#fff;overflow:hidden;border-bottom:3px solid var(--gold)}
[data-page="ranking"] .hero .glow{position:absolute;width:60vw;height:60vw;right:-18vw;top:-26vw;border-radius:50%;background:none;pointer-events:none}
[data-page="ranking"] .hero-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:54px 20px 56px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:32px}
[data-page="ranking"] .hero .eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:13px;letter-spacing:2px;color:var(--gold-bright);font-weight:600}
[data-page="ranking"] .hero h1{min-width:0;overflow-wrap:anywhere;font-family:var(--serif);font-weight:800;font-size:clamp(30px,5.6vw,52px);line-height:1.4}
[data-page="ranking"] .hero h1 .gold{color:var(--gold-bright)}
[data-page="ranking"] .hero p.sub{margin:0 auto;max-width:620px;color:rgba(255,255,255,.8);font-size:16px}
[data-page="ranking"] .hero .cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
[data-page="ranking"] .countdown{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
[data-page="ranking"] .cd-lab{width:100%;text-align:center;font-size:13px;color:var(--gold-bright);font-weight:600;margin-bottom:2px}
[data-page="ranking"] .cd-box{background:rgba(255,255,255,.06);border:1px solid rgba(201,162,39,.4);border-radius:12px;padding:10px 14px;min-width:74px}
[data-page="ranking"] .cd-box .v{font-family:var(--serif);font-weight:800;font-size:30px;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
[data-page="ranking"] .cd-box .k{font-size:11px;color:rgba(255,255,255,.6);margin-top:4px}
[data-page="ranking"] .score-head{text-align:center;padding:48px 0 10px}
[data-page="ranking"] .score-head .ic{font-size:22px}
[data-page="ranking"] .score-head h2{font-family:var(--serif);font-size:28px;color:var(--green-900)}
[data-page="ranking"] .score-head p{color:var(--ink-2);font-size:14px;margin:6px auto 0;max-width:60ch}
[data-page="ranking"] .boardfilter{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:space-between;padding:8px 0 4px}
[data-page="ranking"] .typechips{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none}
[data-page="ranking"] .typechips::-webkit-scrollbar{display:none}
[data-page="ranking"] .tchip{flex:0 0 auto}
[data-page="ranking"] .ticker{margin:14px 0 6px;background:var(--green-900);border-radius:12px;overflow:hidden;position:relative;border:1px solid rgba(201,162,39,.3)}
[data-page="ranking"] .ticker .lead{position:absolute;left:0;top:0;bottom:0;z-index:2;display:flex;align-items:center;gap:7px;background:var(--gold);color:var(--green-900);padding:0 14px;font-weight:800;font-size:12.5px;white-space:nowrap}
[data-page="ranking"] .ticker .lead .dot{width:8px;height:8px;border-radius:50%;background:var(--green-900);animation:pulse-ranking 1.4s infinite}
[data-page="ranking"] .ticker-track{display:flex;gap:30px;white-space:nowrap;padding:11px 0 11px 130px;animation:scroll-ranking 32s linear infinite;width:max-content}
[data-page="ranking"] .ticker:hover .ticker-track{animation-play-state:paused}
[data-page="ranking"] .tk{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.86)}
[data-page="ranking"] .tk .av{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:10px;flex:0 0 22px}
[data-page="ranking"] .tk b{color:#fff;font-weight:700}
[data-page="ranking"] .tk .vt{color:var(--gold-bright);font-weight:700}
[data-page="ranking"] .tk .sw{color:#7FC9A6;font-weight:700}
[data-page="ranking"] .board{display:flex;flex-direction:column;gap:8px;margin-top:10px}
[data-page="ranking"] .rrow{display:grid;grid-template-columns:40px 84px 1fr auto;gap:14px;align-items:center;padding:12px 16px}
[data-page="ranking"] .rank{font-family:var(--serif);font-weight:800;font-size:22px;color:var(--ink-3);text-align:center}
[data-page="ranking"] .logo-col{display:flex;flex-direction:column;align-items:center;gap:7px;width:84px}
[data-page="ranking"] .logo-link{display:block}
[data-page="ranking"] .logo{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;color:#fff;font-family:var(--serif);font-weight:800;font-size:14px;background:var(--bk,#2A6B4F)}
[data-page="ranking"] .logo-link:hover .logo{filter:brightness(1.07)}
[data-page="ranking"] .logo-wrap{position:relative;overflow:hidden;background:transparent}
[data-page="ranking"] .logo-wrap .logo-init{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-family:var(--serif);font-weight:800;font-size:14px;border-radius:inherit}
[data-page="ranking"] .logo-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:inherit;opacity:0}
[data-page="ranking"] .info-btn{display:inline-flex;align-items:center;gap:5px;border:1.5px solid var(--gold);background:var(--gold-soft);color:var(--gold-deep);border-radius:99px;cursor:pointer;padding:3px 11px;font-family:var(--thai);font-size:11.5px;font-weight:800;min-height:44px}
[data-page="ranking"] .info-btn:hover{background:var(--gold);color:var(--green-900)}
[data-page="ranking"] .info-btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.4}
[data-page="ranking"] #infoModal .modal-card{max-height:86vh;overflow:auto}
[data-page="ranking"] .ident{min-width:0}
[data-page="ranking"] .ident .nm{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
[data-page="ranking"] .ident .nm .full{font-family:var(--serif);font-weight:700;font-size:18px;color:var(--green-900)}
[data-page="ranking"] .ident .nm .init{font-size:11px;font-weight:700;color:var(--ink-2);background:var(--cream-2);border:1px solid var(--border);border-radius:var(--pill);padding:1px 7px}
[data-page="ranking"] .ident .nm .crown{color:var(--gold)}
[data-page="ranking"] .ident .types{display:flex;gap:5px;margin-top:5px;flex-wrap:wrap}
[data-page="ranking"] .tbadge{font-size:11px;font-weight:700;padding:2px 8px;border-radius:var(--pill);display:inline-flex;align-items:center;gap:4px}
[data-page="ranking"] .tbadge.gold{color:var(--gold-t);background:var(--gold-soft)}
[data-page="ranking"] .tbadge.forex{color:var(--forex-t);background:#E3EDE6}
[data-page="ranking"] .tbadge.stock{color:var(--stock-t);background:#E4ECF8}
[data-page="ranking"] .tbadge.crypto{color:var(--crypto-t);background:#FBEEDD}
[data-page="ranking"] .racts{display:flex;flex-direction:column;align-items:flex-end;gap:7px}
[data-page="ranking"] .rbtns{display:flex;align-items:center;gap:8px}
[data-page="ranking"] .vshare{display:flex;flex-direction:column;align-items:flex-end;gap:2px;line-height:1.2;white-space:nowrap}
[data-page="ranking"] .vshare .vpc{display:flex;align-items:baseline;gap:5px}
[data-page="ranking"] .vshare .vpc b{font-family:var(--serif);font-weight:800;font-size:19px;color:var(--gold-deep);font-variant-numeric:tabular-nums}
[data-page="ranking"] .vshare .vpc span{font-size:11px;color:var(--ink-3);font-weight:600}
[data-page="ranking"] .vshare .vcnt{font-size:12px;color:var(--ink-3)}
[data-page="ranking"] .vshare .vcnt b{color:var(--ink-2);font-weight:700;font-variant-numeric:tabular-nums}
[data-page="ranking"] .nstoggle{width:42px;height:42px;border:1px solid var(--border-2);background:#fff;border-radius:10px;cursor:pointer;display:grid;place-items:center;color:var(--ink-2)}
[data-page="ranking"] .nstoggle svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .2s}
[data-page="ranking"] .cta-mini{font-size:11px;color:var(--risk);background:#FDECEA;border-radius:7px;padding:5px 9px;margin:0 16px 12px;display:flex;gap:6px;align-items:flex-start}
[data-page="ranking"] .cta-mini svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;flex:0 0 12px;margin-top:1px}
[data-page="ranking"] .ns-body{display:none;border-top:1px solid var(--border);background:var(--cream-2);padding:14px 16px}
[data-page="ranking"] .board-foot{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:18px}
[data-page="ranking"] .rtoolbar{margin:12px 0}
[data-page="ranking"] .rtoolbar .typechips{flex:1 1 auto;min-width:0;flex-wrap:nowrap;overflow-x:auto}
/* ranking table → .wcb-table (chrome shared); page sets columns + cells */
[data-page="ranking"] .wcb-thead,[data-page="ranking"] .wcb-row{grid-template-columns:90px minmax(150px,1.4fr) 100px minmax(190px,1.3fr) 120px 178px;gap:14px}
[data-page="ranking"] .wcb-table{border:1px solid var(--border);border-radius:12px;background:var(--surface);box-shadow:none;overflow:hidden}
[data-page="ranking"] .wcb-thead{margin:0;border:0;border-bottom:1px solid var(--border);border-radius:0;background:var(--cream-2)}
[data-page="ranking"] .wcb-tbody{display:block}
[data-page="ranking"] .wcb-tbody .wcb-row{min-height:72px;padding:11px 16px;border:0;border-bottom:1px solid var(--border);border-radius:0;background:var(--surface)}
[data-page="ranking"] .wcb-tbody .wcb-row:last-child{border-bottom:0}
[data-page="ranking"] .wcb-tbody .wcb-row:hover{background:var(--cream-2)}
[data-page="ranking"] .wcb-tbody .wcb-row.top1{background:var(--gold-soft);box-shadow:inset 3px 0 0 var(--gold)}
[data-page="ranking"] .wcb-thead span:nth-child(2){padding-left:52px}
[data-page="ranking"] .wcb-thead span:nth-child(3){text-align:center}
[data-page="ranking"] .info-cell{text-align:center}
[data-page="ranking"] .rk{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:6px;position:relative}
[data-page="ranking"] .rk .crown{position:absolute;top:-16px;font-size:14px;line-height:1}
[data-page="ranking"] .rk .wcb-rank{width:auto;height:auto;font-family:var(--serif);font-weight:800;font-size:16px;color:var(--ink);white-space:nowrap;flex-shrink:0;background:none;border-radius:0}
[data-page="ranking"] .rk .mv{display:inline-flex;align-items:center;gap:3px;padding:0 10px;min-height:16px;border-radius:var(--pill);font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0}
[data-page="ranking"] .rk .mv.up{background:var(--up-soft);color:var(--up)}
[data-page="ranking"] .rk .mv.dn{background:var(--down-soft);color:var(--down)}
[data-page="ranking"] .rk .mv.fl{background:var(--cream-2);color:var(--ink-3)}
[data-page="ranking"] .bk-cell{display:flex;align-items:center;gap:12px;min-width:0}
[data-page="ranking"] .bk-cell .bname{font-family:var(--serif);font-weight:700;font-size:16px;color:var(--green-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
[data-page="ranking"] .bk-cell .crown{color:var(--gold);font-size:32px;margin-left:2px}
[data-page="ranking"] a.bname{text-decoration:none;cursor:pointer}
[data-page="ranking"] a.bname:hover{color:var(--gold-deep);text-decoration:underline}
[data-page="ranking"] .wcb-table .logo,[data-page="ranking"] .wcb-table .logo-link{width:40px;height:40px;flex:0 0 40px;font-size:12px;border-radius:11px}
[data-page="ranking"] .lic-cell{display:flex;align-items:center;gap:8px}
[data-page="ranking"] .lic-lab{display:none}
[data-page="ranking"] .lic-chips{display:flex;gap:6px;flex-wrap:wrap}
[data-page="ranking"] .votes-cell{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;white-space:nowrap}
[data-page="ranking"] .votes-cell .vrow{display:flex;flex-direction:row-reverse;align-items:baseline;gap:4px}
[data-page="ranking"] .votes-cell .vrow:first-child b{font-family:var(--mono);font-weight:800;font-size:19px;color:var(--ink);font-variant-numeric:tabular-nums}
[data-page="ranking"] .votes-cell .vlab{font-size:11.5px;color:var(--ink-3)}
[data-page="ranking"] .votes-cell .vrow:last-child{margin-top:3px}
[data-page="ranking"] .votes-cell .vrow:last-child b{font-family:var(--mono);font-weight:800;font-size:11.5px;color:var(--gold-deep)}
[data-page="ranking"] .act-cell{display:flex;justify-content:flex-end}
[data-page="ranking"] .vt-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
@media(max-width:980px){
  [data-page="ranking"] .wcb-thead{display:none}
  [data-page="ranking"] .wcb-table{background:none;border:none;box-shadow:none;overflow:visible}
  [data-page="ranking"] .wcb-tbody{display:flex;flex-direction:column;gap:12px}
  [data-page="ranking"] .wcb-tbody .wcb-row{grid-template-columns:auto 1fr;grid-template-areas:"rank broker" "lic lic" "votes votes" "act act" "info info";gap:9px 11px;padding:6px 14px 12px;border:1px solid #e6ede7;border-radius:12px;background:#fff;box-shadow:none}
  [data-page="ranking"] .wcb-tbody .wcb-row.top1{border-color:var(--gold);background:var(--gold-soft)}
  [data-page="ranking"] .wcb-tbody .rk{grid-area:rank;flex-direction:row;justify-content:flex-start;align-items:center;padding:10px 0;position:static}
  [data-page="ranking"] .wcb-tbody .rk .mv{display:none}
  [data-page="ranking"] .wcb-tbody .wcb-rank{width:26px;height:26px;font-family:var(--mono);font-size:14px;line-height:1;padding-top:1px;box-sizing:border-box;border-radius:9px;background:#8c968c!important;color:#fff!important}
  [data-page="ranking"] .wcb-tbody .wcb-row.top1 .wcb-rank{background:var(--gold)!important}
  [data-page="ranking"] .wcb-tbody .bk-cell{grid-area:broker;min-width:0;padding:10px 0}
  [data-page="ranking"] .wcb-tbody .bk-cell .bname{white-space:normal;line-height:1.2}
  [data-page="ranking"] .wcb-tbody .lic-cell{grid-area:lic;justify-content:space-between;padding:9px 0;border-top:1px dashed #e6ede7;border-bottom:1px dashed #e6ede7}
  [data-page="ranking"] .wcb-tbody .lic-lab{display:block;font-size:12.5px;font-weight:600;color:var(--ink-2);flex:none}
  [data-page="ranking"] .wcb-tbody .votes-cell{grid-area:votes;align-items:stretch;gap:6px;padding:2px 0}
  [data-page="ranking"] .wcb-tbody .votes-cell .vrow{flex-direction:row;justify-content:space-between}
  [data-page="ranking"] .wcb-tbody .votes-cell .vrow:first-child b{font-size:16px}
  [data-page="ranking"] .wcb-tbody .votes-cell .vrow:last-child{margin-top:0}
  [data-page="ranking"] .wcb-tbody .act-cell{grid-area:act;justify-content:stretch}
  [data-page="ranking"] .wcb-tbody .act-cell .btn{width:100%}
  [data-page="ranking"] .wcb-tbody .info-cell{grid-area:info;display:flex;align-items:center}
  [data-page="ranking"] .wcb-tbody .info-cell .btn{width:100%}
}
[data-page="ranking"] .rank-intro{background:var(--green-900);color:#fff;padding:20px 0}
[data-page="ranking"] .disclosure{display:flex;gap:10px;align-items:flex-start;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:12px 14px;font-size:12.5px;color:rgba(255,255,255,.82);line-height:1.55}
[data-page="ranking"] .disclosure svg{width:16px;height:16px;stroke:var(--gold);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:0 0 16px;margin-top:2px}
[data-page="ranking"] .disclosure b{color:#fff}
[data-page="ranking"] .social-band{background:#F8F8F8;padding:48px 0}
[data-page="ranking"] .comments-band{background:linear-gradient(160deg,var(--rose-1),var(--rose-2));padding:48px 0}
[data-page="ranking"] .band-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
[data-page="ranking"] .band-head h2{font-family:var(--serif);font-weight:800;font-size:24px;color:var(--green-900);display:flex;align-items:center;gap:10px}
[data-page="ranking"] .band-head h2 svg{width:24px;height:24px;stroke:var(--green-900);fill:none;stroke-width:1.8}
[data-page="ranking"] .band-head .note{font-size:12.5px;color:var(--ink-2);text-align:right;max-width:40ch;line-height:1.5}
[data-page="ranking"] .snews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
[data-page="ranking"] .snews-card{background:#fff;border-radius:12px;box-shadow:var(--shadow);overflow:hidden;border-top:4px solid var(--ac,#888);display:flex;flex-direction:column}
[data-page="ranking"] .snews-card .thumb{position:relative;height:114px;overflow:hidden;display:flex;align-items:flex-end;padding:10px;background-size:cover;background-position:center}
[data-page="ranking"] .snews-card .thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.34));pointer-events:none}
[data-page="ranking"] .snews-card .thumb .wm{position:absolute;right:-8px;top:-22px;font-family:var(--serif);font-weight:800;font-size:112px;line-height:1;color:rgba(255,255,255,.12);letter-spacing:-5px;pointer-events:none;user-select:none}
[data-page="ranking"] .snews-card .thumb .ico{position:absolute;left:13px;top:12px;font-size:30px;filter:none}
[data-page="ranking"] .snews-card .thumb .cat{position:absolute;top:10px;left:10px;z-index:1;background:rgba(255,255,255,.94);color:var(--ink);font-size:11px;font-weight:800;padding:3px 10px;border-radius:var(--pill);display:inline-flex;align-items:center;gap:6px}
[data-page="ranking"] .snews-card .thumb .cat .d{width:10px;height:10px;border-radius:3px;flex:none}
[data-page="ranking"] .wcb-ccard .thumb .cat{position:absolute;top:10px;left:10px}
[data-page="ranking"] .snews-card .top{display:flex;align-items:center;gap:8px;padding:12px 14px 6px}
[data-page="ranking"] .snews-card .blogo{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:11px;flex:0 0 28px}
[data-page="ranking"] .snews-card .bn{font-weight:800;font-size:13.5px}
[data-page="ranking"] .snews-card .srctag{margin-left:auto;display:inline-flex;align-items:center;gap:5px;background:var(--cream-2);border-radius:var(--pill);padding:3px 9px;font-size:11px;font-weight:700;color:var(--ink-2)}
[data-page="ranking"] .snews-card .srctag .d{width:12px;height:12px;border-radius:3px}
[data-page="ranking"] .snews-card .body{padding:2px 14px 12px;flex:1}
[data-page="ranking"] .snews-card .hl{font-weight:700;font-size:13.5px;line-height:1.35}
[data-page="ranking"] .snews-card .sub{font-size:12px;color:var(--ink-2);margin-top:6px;line-height:1.5}
[data-page="ranking"] .snews-card .foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-top:1px solid var(--border)}
[data-page="ranking"] .snews-card .tm{font-size:11px;color:var(--ink-3)}
[data-page="ranking"] .cfilters{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}
[data-page="ranking"] .cgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
[data-page="ranking"] .sentinel{height:1px}
[data-page="ranking"] .cloader{display:none;align-items:center;justify-content:center;gap:10px;padding:24px;color:var(--ink-2);font-size:12.5px;font-weight:600}
[data-page="ranking"] .cloader.on{display:flex}
[data-page="ranking"] .spinner{width:18px;height:18px;border:2.5px solid var(--border);border-top-color:var(--green-700);border-radius:50%;animation:spin-ranking .8s linear infinite}
[data-page="ranking"] .cend{display:none;text-align:center;padding:24px;color:var(--ink-2);font-size:12.5px;font-weight:700}
[data-page="ranking"] .cend.on{display:block}
[data-page="ranking"] .page-hd{background:var(--green-900);color:#fff;padding:48px 0}
[data-page="ranking"] .page-hd h1{font-family:var(--serif);font-size:30px}
[data-page="ranking"] .page-hd p{color:rgba(255,255,255,.82);margin-top:8px;max-width:64ch}
[data-page="ranking"] .prose{max-width:760px;margin:0 auto;padding:36px 20px}
[data-page="ranking"] .prose h3{font-family:var(--serif);font-size:22px;color:var(--green-900);margin:24px 0 8px}
[data-page="ranking"] .prose p{color:var(--ink-2);margin-bottom:12px}
[data-page="ranking"] .verdict{background:#fff;border:1px solid var(--border);border-left:5px solid var(--gold);border-radius:12px;padding:24px;box-shadow:var(--shadow)}
[data-page="ranking"] .verdict .big{font-family:var(--serif);font-weight:900;font-size:42px;color:var(--gold-deep);line-height:1}
[data-page="ranking"] .modal{position:fixed;inset:0;z-index:60;display:none;align-items:flex-end;justify-content:center;background:rgba(11,32,21,.55)}
[data-page="ranking"] .modal.open{display:flex}
[data-page="ranking"] .modal-card{background:#fff;width:100%;max-width:420px;border-radius:18px 18px 0 0;box-shadow:var(--shadow-lg);padding:24px 16px calc(24px + env(safe-area-inset-bottom));animation:rise-ranking .26s}
[data-page="ranking"] .modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
[data-page="ranking"] .modal-head h3{font-family:var(--serif);font-size:22px;color:var(--green-900)}
[data-page="ranking"] .modal-head p{font-size:12px;color:var(--ink-2);margin-top:3px}
[data-page="ranking"] .modal-close{background:var(--cream-2);border:none;cursor:pointer;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex:0 0 36px}
[data-page="ranking"] .modal-close svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:2}
[data-page="ranking"] .slogins{display:flex;flex-direction:column;gap:8px;margin-top:16px}
[data-page="ranking"] .divider{display:flex;align-items:center;gap:12px;margin:16px 0;color:var(--ink-2);font-size:11px;font-weight:700}
[data-page="ranking"] .divider::before,[data-page="ranking"] .divider::after{content:"";flex:1;border-top:1px solid var(--border)}
[data-page="ranking"] .field{margin-bottom:12px}
[data-page="ranking"] .field label{display:block;font-size:12px;font-weight:700;color:var(--ink-2);margin-bottom:5px}
[data-page="ranking"] .field input{width:100%;min-height:var(--tap);border:1.5px solid var(--border);border-radius:10px;padding:0 12px;font-family:var(--thai);font-size:14px;color:var(--ink);background:#fff}
[data-page="ranking"] .field input:focus{outline:none;border-color:var(--gold-deep)}
[data-page="ranking"] .modal-fine{font-size:11px;color:var(--ink-2);margin-top:12px;line-height:1.5}
@media(max-width:980px){[data-page="ranking"] .snews-grid{grid-template-columns:1fr 1fr}[data-page="ranking"] .mgrid{grid-template-columns:1fr}[data-page="ranking"] .rcard.open .ns-body{grid-template-columns:1fr}}
@media(max-width:640px){[data-page="ranking"] .rrow{grid-template-columns:38px 84px 1fr;gap:11px}[data-page="ranking"] .racts{grid-column:1/-1;align-items:stretch;border-top:1px dashed var(--border-2);padding-top:11px;margin-top:3px}[data-page="ranking"] .racts .rbtns{flex-wrap:wrap}[data-page="ranking"] .racts .vshare{align-self:flex-start;align-items:flex-start}[data-page="ranking"] .racts .vote-btn,[data-page="ranking"] .racts .btn{flex:1;min-width:96px}[data-page="ranking"] .snews-grid{grid-template-columns:1fr}[data-page="ranking"] .cgrid{grid-template-columns:1fr}[data-page="ranking"] .band-head .note{text-align:left}[data-page="ranking"] .cd-box{min-width:64px;padding:9px 11px}[data-page="ranking"] .cd-box .v{font-size:25px}}
[data-page="ranking"] .btabs,[data-page="ranking"] .msheet,[data-page="ranking"] .sheet-scrim,[data-page="ranking"] .filter-bar{display:none}
[data-page="ranking"] .filter-bar{align-items:center;gap:10px;padding:8px 0 2px}
[data-page="ranking"] .filter-trigger{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border-2);background:#fff;border-radius:11px;padding:0 14px;min-height:44px;font-family:var(--thai);font-weight:700;font-size:13.5px;color:var(--ink);cursor:pointer}
[data-page="ranking"] .filter-trigger svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2}
[data-page="ranking"] .filter-trigger .fcount{background:var(--green-700);color:#fff;border-radius:var(--pill);font-size:11.5px;padding:2px 9px;font-weight:800}
[data-page="ranking"] .sheet-grab{display:block;width:40px;height:4px;border-radius:2px;background:var(--border-2);margin:0 auto 12px}
[data-page="ranking"] .sheet-h{font-family:var(--serif);font-weight:800;font-size:18px;color:var(--green-900)}
[data-page="ranking"] .sheet-close{width:34px;height:34px;border:none;background:var(--cream-2);border-radius:50%;cursor:pointer;display:grid;place-items:center;flex:0 0 34px}
[data-page="ranking"] .sheet-close svg{width:17px;height:17px;stroke:var(--ink);fill:none;stroke-width:2}
[data-page="ranking"] .boardfilter .sheet-head{display:none}
[data-page="ranking"] .msheet .mnav a,[data-page="ranking"] .msheet .mnav button{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--border);color:var(--ink);font-family:var(--thai);font-size:15px;font-weight:600;padding:15px 4px;cursor:pointer;min-height:var(--tap)}
[data-page="ranking"] .msheet .mnav a:last-child,[data-page="ranking"] .msheet .mnav button:last-child{border-bottom:none}
[data-page="ranking"] .msheet .mnav svg{width:19px;height:19px;stroke:var(--ink-2);fill:none;stroke-width:2;flex:0 0 19px}
@media(max-width:820px){[data-page="ranking"] .brand .seal{width:34px;height:34px;flex:0 0 34px}[data-page="ranking"] .brand .seal svg{width:19px;height:19px}body[data-page="ranking"]{padding-bottom:calc(64px + env(safe-area-inset-bottom))}[data-page="ranking"] .sheet-scrim{display:block;position:fixed;inset:0;background:rgba(11,32,21,.55);z-index:58;opacity:0;visibility:hidden;transition:opacity .25s}[data-page="ranking"] .sheet-scrim.open{opacity:1;visibility:visible}[data-page="ranking"] .msheet{display:block;position:fixed;left:0;right:0;bottom:0;z-index:59;background:#fff;border-radius:18px 18px 0 0;box-shadow:var(--shadow-lg);transform:translateY(100%);transition:transform .26s;padding:16px 16px calc(20px + env(safe-area-inset-bottom));max-height:84vh;overflow:auto}[data-page="ranking"] .msheet.open{transform:none}[data-page="ranking"] .msheet .sheet-h{margin-bottom:8px}}
@media(max-width:640px){[data-page="ranking"] #view-rank .hero-in{padding:24px 18px 24px}[data-page="ranking"] #view-rank .hero h1{font-size:clamp(19px,5.2vw,26px);line-height:1.16}[data-page="ranking"] #view-rank .hero .eyebrow{margin-bottom:8px;font-size:11px}[data-page="ranking"] #view-rank .hero p.sub{font-size:13.5px;margin-top:9px}[data-page="ranking"] .countdown{margin-top:15px;gap:7px}[data-page="ranking"] .cd-box{min-width:0;flex:1;padding:7px 4px}[data-page="ranking"] .cd-box .v{font-size:21px}[data-page="ranking"] .cd-box .k{font-size:10px;margin-top:2px}[data-page="ranking"] .cd-lab{font-size:12px;margin-bottom:0}[data-page="ranking"] .statbar{margin-top:-16px}[data-page="ranking"] .stat{padding:13px 8px}[data-page="ranking"] .stat .v{font-size:21px}[data-page="ranking"] .stat .k{font-size:11px}[data-page="ranking"] #view-rank > .wrap{display:flex;flex-direction:column;padding-top:28px}[data-page="ranking"] #view-rank .score-head{padding:20px 0 6px}[data-page="ranking"] #view-rank .score-head h2{font-size:22px}[data-page="ranking"] #view-rank .ticker{order:1;margin:14px 0 4px}[data-page="ranking"] #view-rank .board-foot{order:2}[data-page="ranking"] .filter-bar{display:flex}[data-page="ranking"] .boardfilter{position:fixed;left:0;right:0;bottom:0;z-index:59;background:#fff;border-radius:18px 18px 0 0;box-shadow:var(--shadow-lg);transform:translateY(100%);transition:transform .26s;padding:16px 16px calc(20px + env(safe-area-inset-bottom));display:block;max-height:80vh;overflow:auto}[data-page="ranking"] .boardfilter.open{transform:none}[data-page="ranking"] .boardfilter .sheet-head{display:block;margin-bottom:6px}[data-page="ranking"] .boardfilter .sheet-head-row{display:flex;align-items:center;justify-content:space-between}[data-page="ranking"] .boardfilter .seg{display:flex;width:100%;margin-bottom:14px}[data-page="ranking"] .boardfilter .seg button{flex:1}[data-page="ranking"] .boardfilter .typechips{flex-wrap:wrap;overflow:visible}[data-page="ranking"] .rrow{padding:12px 11px}[data-page="ranking"] .info-btn{padding:4px 12px;min-height:44px}[data-page="ranking"] .racts{gap:7px}[data-page="ranking"] .racts .vote-btn{flex:2 1 0;min-width:130px;font-size:14px}[data-page="ranking"] .racts .btn-outline{flex:1 1 0;min-width:0;font-size:12.5px}[data-page="ranking"] .cta-mini{background:transparent;color:var(--ink-3);font-size:10px;padding:4px 2px 0;margin:0 11px 11px;border-top:1px dashed var(--border)}[data-page="ranking"] #view-home .prose h3{font-size:21px!important}[data-page="ranking"] .page-hd h1{font-size:24px}}

/* ===== pages: asset-hub (category hub) + asset-commodity (commodity silo) =====
   Same two-tier pattern as news-forex: hero (reuses unscoped .ch-hero) + a
   card grid. asset-hub lists asset CATEGORIES (โภคภัณฑ์, หุ้น, ดัชนี, …) —
   icon badges instead of photos, since several are "coming soon" stubs with
   no natural photo. asset-commodity lists the commodities within that one
   category (ทองคำ, น้ำมัน, ถั่ว) and links out to wcb-asset-detail.html#key
   for the actual chart/analysis engine — uses the .silo-card photo pattern
   (same component as wcb-news-forex.html) since every commodity here is real. */
[data-page="asset-hub"] .cat-section{max-width:1180px;margin:0 auto;padding:32px 20px 56px}
[data-page="asset-hub"] .cat-shead{margin-bottom:18px}
[data-page="asset-hub"] .cat-shead h2{font-family:var(--serif);font-weight:800;font-size:20px;color:var(--green-900);margin-bottom:4px}
[data-page="asset-hub"] .cat-shead p{font-size:13.5px;color:var(--ink-2)}
[data-page="asset-hub"] .cat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media(max-width:980px){[data-page="asset-hub"] .cat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){[data-page="asset-hub"] .cat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){[data-page="asset-hub"] .cat-grid{grid-template-columns:1fr}}

[data-page="asset-commodity"] .cat-section{max-width:1180px;margin:0 auto;padding:32px 20px 56px}
[data-page="asset-commodity"] .cat-shead{margin-bottom:18px}
[data-page="asset-commodity"] .cat-shead h2{font-family:var(--serif);font-weight:800;font-size:20px;color:var(--green-900);margin-bottom:4px}
[data-page="asset-commodity"] .cat-shead p{font-size:13.5px;color:var(--ink-2)}
[data-page="asset-commodity"] .cat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
[data-page="asset-commodity"] .silo-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;text-decoration:none;color:inherit;cursor:pointer;transition:transform .16s,box-shadow .16s,border-color .16s}
[data-page="asset-commodity"] .silo-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
[data-page="asset-commodity"] .silo-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--cream-2)}
[data-page="asset-commodity"] .silo-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
[data-page="asset-commodity"] .silo-card:hover .silo-thumb img{transform:scale(1.06)}
[data-page="asset-commodity"] .silo-tag{position:absolute;top:10px;left:10px;z-index:1;font-family:var(--mono);font-size:10px;font-weight:800;color:var(--green-950);background:var(--gold-bright);padding:3px 9px;border-radius:var(--pill);letter-spacing:.03em}
[data-page="asset-commodity"] .silo-body{flex:1;display:flex;flex-direction:column;padding:16px 18px 18px}
[data-page="asset-commodity"] .silo-title{font-family:var(--serif);font-weight:800;font-size:17px;color:var(--green-900);line-height:1.3;margin-bottom:8px}
[data-page="asset-commodity"] .silo-excerpt{font-size:12.5px;color:var(--ink-2);line-height:1.6;margin-bottom:12px}
[data-page="asset-commodity"] .silo-more{margin-top:auto;display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--gold-deep)}
[data-page="asset-commodity"] .silo-more svg{width:13px;height:13px;flex:none;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .16s}
[data-page="asset-commodity"] .silo-card:hover .silo-more svg{transform:translateX(3px)}
@media(max-width:720px){[data-page="asset-commodity"] .cat-grid{grid-template-columns:1fr}}

/* ===== page: news-forex — scoped [data-page="news-forex"] =====
   Silo hub: hero (reuses unscoped .ch-hero) + a card grid linking out to each
   currency pair's own landing page. No in-page filtering — every pair is its
   own URL/silo (see [data-page="news-forex-silo"] below). */
[data-page="news-forex"] .silo-section{max-width:1180px;margin:0 auto;padding:32px 20px 56px}
[data-page="news-forex"] .silo-shead{margin-bottom:18px}
[data-page="news-forex"] .silo-shead h2{font-family:var(--serif);font-weight:800;font-size:20px;color:var(--green-900);margin-bottom:4px}
[data-page="news-forex"] .silo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
[data-page="news-forex"] .silo-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;text-decoration:none;color:inherit;cursor:pointer;transition:transform .16s,box-shadow .16s,border-color .16s}
[data-page="news-forex"] .silo-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
[data-page="news-forex"] .silo-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--cream-2)}
[data-page="news-forex"] .silo-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
[data-page="news-forex"] .silo-card:hover .silo-thumb img{transform:scale(1.06)}
[data-page="news-forex"] .silo-tag{position:absolute;top:10px;left:10px;z-index:1;font-family:var(--mono);font-size:10px;font-weight:800;color:var(--green-950);background:var(--gold-bright);padding:3px 9px;border-radius:var(--pill);letter-spacing:.03em}
[data-page="news-forex"] .silo-body{flex:1;display:flex;flex-direction:column;padding:14px 16px 16px}
[data-page="news-forex"] .silo-title{font-family:var(--serif);font-weight:800;font-size:15.5px;color:var(--green-900);line-height:1.28;margin-bottom:6px}
[data-page="news-forex"] .silo-excerpt{font-size:12px;color:var(--ink-2);line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:10px}
[data-page="news-forex"] .silo-more{margin-top:auto;display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--gold-deep)}
[data-page="news-forex"] .silo-more svg{width:13px;height:13px;flex:none;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .16s}
[data-page="news-forex"] .silo-card:hover .silo-more svg{transform:translateX(3px)}
@media(max-width:980px){[data-page="news-forex"] .silo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){[data-page="news-forex"] .silo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){[data-page="news-forex"] .silo-grid{grid-template-columns:1fr}}

/* ===== page: news-forex-silo — scoped [data-page="news-forex-silo"] =====
   One landing page per currency pair (list 75% + sticky "popular" sidebar 25%
   + numbered pager). Hero reuses unscoped .ch-hero/.ch-crumb/.eyebrow/.ch-fresh,
   sidebar box reuses unscoped .ch-side/.ch-side-h. Card grid keeps the
   "Option C — Magazine" treatment: full-bleed 3:4 image tiles with a gradient
   scrim and overlaid text, gold pill category tag. Same template for all 16
   silos — only the data fed into it differs. */
[data-page="news-forex-silo"] .ncat-desc-wrap{max-width:1180px;margin:0 auto;padding:32px 20px 0}
[data-page="news-forex-silo"] .ncat-desc{margin:0;font-size:14.5px;color:var(--ink-2);line-height:1.75;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);padding:18px 22px}
[data-page="news-forex-silo"] .ncat-layout{max-width:1180px;margin:0 auto;padding:22px 20px 40px}
[data-page="news-forex-silo"] .ncat-list{min-width:0}
[data-page="news-forex-silo"] .ncat-pager-wrap{margin-top:8px}
[data-page="news-forex-silo"] .ncat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
[data-page="news-forex-silo"] .ncat-card{position:relative;display:block;aspect-ratio:3/4;border-radius:var(--r-lg);overflow:hidden;text-decoration:none;color:#fff;cursor:pointer;background:var(--cream-2)}
[data-page="news-forex-silo"] .ncat-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
[data-page="news-forex-silo"] .ncat-card:hover img{transform:scale(1.06)}
[data-page="news-forex-silo"] .ncat-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(4,16,10,.55) 68%,rgba(4,16,10,.92) 100%)}
[data-page="news-forex-silo"] .ncat-cat{position:absolute;top:12px;left:12px;z-index:1;font-size:10.5px;font-weight:800;color:var(--green-950);background:var(--gold-bright);padding:4px 10px;border-radius:var(--pill);text-transform:uppercase;letter-spacing:.03em}
[data-page="news-forex-silo"] .ncat-body{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:16px}
[data-page="news-forex-silo"] .ncat-title{font-family:var(--serif);font-weight:800;font-size:18px;line-height:1.28;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
[data-page="news-forex-silo"] .ncat-excerpt{font-size:11.5px;color:rgba(255,255,255,.72);line-height:1.5;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:7px}
[data-page="news-forex-silo"] .ncat-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
[data-page="news-forex-silo"] .ncat-author{font-size:10.5px;color:rgba(255,255,255,.78);font-weight:700}
[data-page="news-forex-silo"] .ncat-dot{font-size:10.5px;color:rgba(255,255,255,.4)}
[data-page="news-forex-silo"] .ncat-date{font-size:10.5px;color:rgba(255,255,255,.6);font-weight:600}
[data-page="news-forex-silo"] .wcb-pager .ps{display:none}
@media(max-width:1100px){
  [data-page="news-forex-silo"] .ncat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  [data-page="news-forex-silo"] .ncat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:480px){
  [data-page="news-forex-silo"] .ncat-grid{grid-template-columns:1fr;gap:14px}
}

/* ===== wcb-analysis-eurusd-hub.html — EUR/USD analysis archive (chronological timeline, not a news grid) ===== */
[data-page="analysis-eurusd-hub"] .tl-daylabel,[data-page="analysis-hub"] .tl-daylabel{font-family:var(--serif);font-weight:700;font-size:15px;color:var(--green-900);background:var(--cream);padding:10px 16px;border-radius:10px;margin:26px 0 4px}
[data-page="analysis-eurusd-hub"] .tl-daylabel:first-child,[data-page="analysis-hub"] .tl-daylabel:first-child{margin-top:0}
[data-page="analysis-hub"] .tl-list{border-top:1px solid var(--border)}
[data-page="analysis-eurusd-hub"] .tl-row,[data-page="analysis-hub"] .tl-row{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--border);text-decoration:none;color:inherit;transition:background .12s}
[data-page="analysis-eurusd-hub"] .tl-row:hover,[data-page="analysis-hub"] .tl-row:hover{background:var(--cream-2)}
[data-page="analysis-eurusd-hub"] .tl-time,[data-page="analysis-hub"] .tl-time{flex:none;width:48px;padding-top:2px;font-family:var(--mono);font-weight:700;font-size:12.5px;color:var(--ink-3)}
[data-page="analysis-eurusd-hub"] .tl-body,[data-page="analysis-hub"] .tl-body{min-width:0;flex:1}
[data-page="analysis-eurusd-hub"] .tl-title,[data-page="analysis-hub"] .tl-title{font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.4;color:var(--green-900);margin-bottom:6px}
[data-page="analysis-eurusd-hub"] .tl-row:hover .tl-title,[data-page="analysis-hub"] .tl-row:hover .tl-title{color:var(--gold-deep)}
[data-page="analysis-eurusd-hub"] .tl-sum,[data-page="analysis-hub"] .tl-sum{font-size:13.5px;color:var(--ink-2);line-height:1.6;margin-bottom:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
[data-page="analysis-eurusd-hub"] .tl-meta,[data-page="analysis-hub"] .tl-meta{display:flex;align-items:center;flex-wrap:wrap;gap:10px 12px}
[data-page="analysis-eurusd-hub"] .tl-analyst,[data-page="analysis-hub"] .tl-analyst{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--ink-2)}
[data-page="analysis-eurusd-hub"] .tl-avatar,[data-page="analysis-hub"] .tl-avatar{width:26px;height:26px;border-radius:50%;object-fit:cover;flex:none}
[data-page="analysis-eurusd-hub"] .tl-trend,[data-page="analysis-hub"] .tl-trend{font-size:11.5px;font-weight:800;padding:3px 10px;border-radius:var(--pill);white-space:nowrap}
[data-page="analysis-eurusd-hub"] .tl-trend.up,[data-page="analysis-hub"] .tl-trend.up{background:var(--up-soft);color:var(--up)}
[data-page="analysis-eurusd-hub"] .tl-trend.dn,[data-page="analysis-hub"] .tl-trend.dn{background:var(--down-soft);color:var(--pay)}
[data-page="analysis-eurusd-hub"] .tl-trend.fl,[data-page="analysis-hub"] .tl-trend.fl{background:var(--cream-2);color:var(--ink-2)}
[data-page="analysis-eurusd-hub"] .tl-tf,[data-page="analysis-hub"] .tl-tf{font-size:11px;font-weight:700;color:var(--ink-3);font-family:var(--mono);letter-spacing:.02em}
[data-page="analysis-eurusd-hub"] .tl-dot,[data-page="analysis-hub"] .tl-dot{color:var(--border-2)}
[data-page="analysis-eurusd-hub"] .tl-pager-wrap,[data-page="analysis-hub"] .tl-pager-wrap{margin-top:20px}
@media(max-width:640px){
  [data-page="analysis-eurusd-hub"] .tl-row,[data-page="analysis-hub"] .tl-row{gap:10px}
  [data-page="analysis-eurusd-hub"] .tl-time,[data-page="analysis-hub"] .tl-time{width:40px;font-size:11.5px}
  [data-page="analysis-eurusd-hub"] .tl-title,[data-page="analysis-hub"] .tl-title{font-size:15.5px}
}

/* ===== wcb-analysis-hub.html — Analysis Hub (all-category research center, not a news layout) ===== */
[data-page="analysis-hub"] .ahub-cats{padding:32px 20px 32px;max-width:1180px;margin:0 auto}
[data-page="analysis-hub"] .cathub-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
[data-page="analysis-hub"] .silo-count,[data-page="asset-hub"] .silo-count{position:absolute;top:10px;right:10px;z-index:1;font-family:var(--mono);font-size:10px;font-weight:800;color:#fff;background:rgba(7,26,17,.6);padding:3px 9px;border-radius:var(--pill);letter-spacing:.02em}
[data-page="analysis-hub"] .silo-card.soon,[data-page="asset-hub"] .silo-card.soon{cursor:default}
[data-page="analysis-hub"] .silo-card.soon:hover,[data-page="asset-hub"] .silo-card.soon:hover{transform:none;box-shadow:var(--shadow);border-color:var(--border)}
[data-page="analysis-hub"] .silo-card.soon .silo-thumb,[data-page="asset-hub"] .silo-card.soon .silo-thumb{filter:grayscale(.35) brightness(.85)}
[data-page="analysis-hub"] .silo-card.soon .silo-tag,[data-page="asset-hub"] .silo-card.soon .silo-tag{background:var(--border-2);color:#fff}
[data-page="analysis-hub"] .silo-card.soon .silo-more,[data-page="asset-hub"] .silo-card.soon .silo-more{color:var(--ink-3)}
[data-page="analysis-hub"] .silo-card.soon .silo-more svg,[data-page="asset-hub"] .silo-card.soon .silo-more svg{display:none}
[data-page="analysis-hub"] .tl-cat{font-size:10.5px;font-weight:800;color:var(--gold-deep);background:var(--gold-soft);padding:3px 9px;border-radius:var(--pill);white-space:nowrap}
@media(max-width:980px){
  [data-page="analysis-hub"] .cathub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  [data-page="analysis-hub"] .cathub-grid{grid-template-columns:1fr}
}

/* ===== wcb-calendar.html — economic calendar (investing.com-style, ported to our theme) ===== */
[data-page="calendar"] .cal-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin:28px 0 16px}
[data-page="calendar"] .cal-toolbar .wcb-filterbar{width:100%}
[data-page="calendar"] .cal-toolbar .wcb-filterbar .wcb-chip{flex:1;justify-content:center;border-radius:9px}
[data-page="calendar"] .cal-toolbar .wcb-filterbar .wcb-chip.on{background:var(--green-700);border-color:var(--green-700)}
[data-page="calendar"] .cal-meta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;font-size:12.5px;color:var(--ink-2);font-family:var(--mono);margin-bottom:20px;padding-bottom:18px;border-bottom:1px solid var(--border)}
[data-page="calendar"] .cal-meta b{color:var(--green-900);font-weight:700}
[data-page="calendar"] .cal-meta svg{width:14px;height:14px;stroke:var(--gold-deep);fill:none;stroke-width:1.8;vertical-align:-2px;margin-right:5px}
[data-page="calendar"] .cal-meta .sep{opacity:.35}

[data-page="calendar"] .cal-daylabel{font-family:var(--serif);font-weight:700;font-size:15px;color:var(--green-900);background:var(--cream);padding:10px 16px;border-radius:10px;margin-bottom:10px}

[data-page="calendar"] .cal-table{width:100%;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;background:var(--surface);box-shadow:var(--shadow);margin-bottom:36px}
[data-page="calendar"] .cal-head,[data-page="calendar"] .cal-row{display:grid;grid-template-columns:62px 66px 1fr 84px 74px 74px 74px;grid-template-areas:"time cur event impact actual forecast previous";gap:8px 12px;padding:12px 16px;align-items:center}
[data-page="calendar"] .cal-head{background:var(--green-900);color:#fff;font-size:11px;font-weight:700;letter-spacing:.03em;text-transform:uppercase}
[data-page="calendar"] .cal-head span:not(:first-child){text-align:right}
[data-page="calendar"] .cal-head span:nth-child(3){text-align:left}
[data-page="calendar"] .cal-row{border-bottom:1px solid var(--cream-2);font-size:13.5px}
[data-page="calendar"] .cal-row:last-child{border-bottom:none}
[data-page="calendar"] .cal-row:hover{background:var(--cream-2)}
[data-page="calendar"] .cal-time{grid-area:time;font-family:var(--mono);color:var(--ink-2);font-size:12.5px}
[data-page="calendar"] .cal-cur{grid-area:cur}
[data-page="calendar"] .cal-cur-badge{display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);font-style:normal;font-weight:700;font-size:10.5px;color:#fff;border-radius:var(--pill);padding:4px 0;width:42px;letter-spacing:.02em}
[data-page="calendar"] .cal-event{grid-area:event;font-weight:600;color:var(--ink);text-decoration:none;line-height:1.4}
[data-page="calendar"] .cal-event:hover{color:var(--gold-deep)}
[data-page="calendar"] .cal-impact{grid-area:impact;display:flex;gap:2px;justify-content:flex-end}
[data-page="calendar"] .cal-impact svg{width:13px;height:13px;stroke-width:1.6}
[data-page="calendar"] .cal-impact svg.on{fill:var(--gold);stroke:var(--gold)}
[data-page="calendar"] .cal-impact svg:not(.on){fill:none;stroke:var(--border-2)}
[data-page="calendar"] .cal-nums{display:contents}
[data-page="calendar"] .cal-num{font-family:var(--mono);text-align:right;font-size:13px;color:var(--ink-2)}
[data-page="calendar"] .cal-actual{grid-area:actual;font-weight:700;color:var(--ink)}
[data-page="calendar"] .cal-forecast{grid-area:forecast}
[data-page="calendar"] .cal-previous{grid-area:previous}

@media(max-width:760px){
  [data-page="calendar"] .cal-head{display:none}
  [data-page="calendar"] .cal-table{border:none;background:none;box-shadow:none;display:flex;flex-direction:column;gap:10px}
  [data-page="calendar"] .cal-row{grid-template-columns:auto auto 1fr auto;grid-template-areas:"time cur . impact" "event event event event" "nums nums nums nums";gap:4px 10px;border:1px solid var(--border);border-radius:12px;background:var(--surface);padding:13px 14px}
  [data-page="calendar"] .cal-row:hover{background:var(--surface)}
  [data-page="calendar"] .cal-event{padding-top:2px}
  [data-page="calendar"] .cal-nums{display:flex;flex-wrap:wrap;gap:8px 18px;grid-area:nums;padding-top:8px;margin-top:4px;border-top:1px dashed var(--border)}
  [data-page="calendar"] .cal-num{text-align:left}
  [data-page="calendar"] .cal-num::before{font-weight:600;color:var(--ink-3);font-size:11px;margin-right:5px}
  [data-page="calendar"] .cal-actual::before{content:"ผลจริง"}
  [data-page="calendar"] .cal-forecast::before{content:"คาดการณ์"}
  [data-page="calendar"] .cal-previous::before{content:"ครั้งก่อน"}
}

/* calendar: 2-column layout (unified table card + sticky right sidebar) */
[data-page="calendar"] .cal-layout{display:grid;grid-template-columns:1fr 320px;gap:28px;align-items:start}
[data-page="calendar"] .cal-main{min-width:0}
[data-page="calendar"] .cal-main .cal-table{margin-bottom:0}
[data-page="calendar"] .cal-main .cal-toolbar{margin:0;padding:12px 14px;border-bottom:1px solid var(--border)}
[data-page="calendar"] .cal-main .cal-toolbar .wcb-filterbar{background:none;border:none;padding:0;margin:0;width:100%}
[data-page="calendar"] .cal-main .cal-daylabel{margin:0;border-radius:0;background:var(--cream-2);border-bottom:1px solid var(--border)}
/* sticky sidebar (reuses the analysis an2-side look) */
[data-page="calendar"] .cal-aside{display:flex;flex-direction:column;gap:18px;position:sticky;top:20px}
[data-page="calendar"] .cal-side{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
[data-page="calendar"] .cal-side-h{display:flex;align-items:center;gap:8px;padding:13px 16px;font-family:var(--serif);font-weight:800;font-size:14.5px;color:var(--green-900);border-bottom:1px solid var(--border);background:var(--cream-2)}
[data-page="calendar"] .cal-prow{display:flex;align-items:center;gap:11px;padding:10px 16px;text-decoration:none;color:inherit;border-bottom:1px solid var(--border);transition:background .12s}
[data-page="calendar"] .cal-prow:last-child{border-bottom:none}
[data-page="calendar"] .cal-prow:hover{background:var(--cream-2)}
[data-page="calendar"] .cal-prow .th{width:44px;height:44px;flex:none;border-radius:9px;display:grid;place-items:center;color:#fff;font-family:var(--serif);font-weight:800;font-size:12px;background-size:cover;background-position:center}
[data-page="calendar"] .cal-prow .tx{min-width:0;flex:1}
[data-page="calendar"] .cal-prow .tt{font-size:12.5px;font-weight:700;color:var(--green-900);line-height:1.38;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:3px}
[data-page="calendar"] .cal-prow .dt{font-size:11px;color:var(--ink-3);font-family:var(--mono)}
/* broker vote rows (top sidebar section) */
[data-page="calendar"] .cal-brow .rk{width:20px;flex:none;text-align:center;font-family:var(--mono);font-weight:800;font-size:14px;color:var(--gold-deep)}
[data-page="calendar"] .cal-brow .th{width:34px;height:34px;font-size:11px}
[data-page="calendar"] .cal-brow .nm{flex:1;min-width:0;font-family:var(--serif);font-weight:700;font-size:13.5px;color:var(--green-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
[data-page="calendar"] .cal-brow .sc{font-family:var(--mono);font-weight:800;font-size:12.5px;color:var(--gold-deep);flex:none}
/* news section: 12 photo cards (same component as wcb-news-forex) */
[data-page="calendar"] .cal-news{max-width:1180px;margin:0 auto;padding:4px 20px 44px}
[data-page="calendar"] .ncat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
[data-page="calendar"] .news-mini{display:flex;flex-direction:column;border:0.5px solid #86600A;border-radius:10px;overflow:hidden;background:var(--cream-2);text-decoration:none;color:inherit;transition:transform .16s,box-shadow .16s,border-color .16s}
[data-page="calendar"] .news-mini:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
[data-page="calendar"] .news-mini-thumb{display:block;position:relative;aspect-ratio:16/9;background-size:cover;background-position:center}
[data-page="calendar"] .news-mini-cat{position:absolute;top:8px;left:8px;display:inline-flex;align-items:center;min-height:24px;box-sizing:border-box;font-size:10px;line-height:1;font-weight:800;color:var(--green-950);background:var(--gold-bright);padding:0 10px;border-radius:999px;letter-spacing:.02em}
[data-page="calendar"] .news-mini-body{display:flex;flex-direction:column;gap:4px;padding:10px 12px 12px}
[data-page="calendar"] .news-mini-title{font-family:var(--serif);font-weight:700;font-size:13px;color:var(--green-900);line-height:1.34;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
[data-page="calendar"] .news-mini:hover .news-mini-title{color:var(--gold-deep)}
[data-page="calendar"] .news-mini-author{font-size:10.5px;color:var(--ink-2);font-weight:600}
[data-page="calendar"] .news-mini-meta{font-size:10px;color:var(--ink-3);font-family:var(--mono)}
[data-page="calendar"] .cal-news-more{display:flex;justify-content:center;margin-top:26px}
[data-page="calendar"] .cal-news-more .btn{min-width:230px}
@media(max-width:980px){
  [data-page="calendar"] .cal-layout{grid-template-columns:1fr}
  [data-page="calendar"] .cal-aside{position:static;flex-direction:row;flex-wrap:wrap}
  [data-page="calendar"] .cal-side{flex:1;min-width:260px}
  [data-page="calendar"] .ncat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  [data-page="calendar"] .ncat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:480px){
  [data-page="calendar"] .cal-aside{flex-direction:column}
  [data-page="calendar"] .ncat-grid{grid-template-columns:1fr;gap:14px}
}

[data-page="asset-detail"] .wcb-ccard .thumb .cat{position:absolute;top:10px;left:10px}

/* ===== page: asset-detail — "สินทรัพย์อื่นๆ ที่คุณสนใจ" (replaces the old
   bull/bear/neutral analysis grid + tab-switcher bar) — same silo-card
   photo component as wcb-news-forex.html / wcb-asset-commodity.html ===== */
[data-page="asset-detail"] .cat-section{max-width:1180px;margin:0 auto;padding:40px 20px 56px}
[data-page="asset-detail"] .cat-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
[data-page="asset-detail"] .silo-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;text-decoration:none;color:inherit;cursor:pointer;transition:transform .16s,box-shadow .16s,border-color .16s}
[data-page="asset-detail"] .silo-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
[data-page="asset-detail"] .silo-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--cream-2)}
[data-page="asset-detail"] .silo-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
[data-page="asset-detail"] .silo-card:hover .silo-thumb img{transform:scale(1.06)}
[data-page="asset-detail"] .silo-tag{position:absolute;top:10px;left:10px;z-index:1;font-family:var(--mono);font-size:10px;font-weight:800;color:var(--green-950);background:var(--gold-bright);padding:3px 9px;border-radius:var(--pill);letter-spacing:.03em}
[data-page="asset-detail"] .silo-body{flex:1;display:flex;flex-direction:column;padding:16px 18px 18px}
[data-page="asset-detail"] .silo-title{font-family:var(--serif);font-weight:800;font-size:17px;color:var(--green-900);line-height:1.3;margin-bottom:8px}
[data-page="asset-detail"] .silo-excerpt{font-size:12.5px;color:var(--ink-2);line-height:1.6;margin-bottom:12px}
[data-page="asset-detail"] .silo-more{margin-top:auto;display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--gold-deep)}
[data-page="asset-detail"] .silo-more svg{width:13px;height:13px;flex:none;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .16s}
[data-page="asset-detail"] .silo-card:hover .silo-more svg{transform:translateX(3px)}
@media(max-width:860px){[data-page="asset-detail"] .cat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){[data-page="asset-detail"] .cat-grid{grid-template-columns:1fr}}