
  * { box-sizing:border-box; }
  body { background:var(--bg); color:var(--text); font:14px/1.5 -apple-system,
         "Segoe UI",Roboto,Helvetica,sans-serif; margin:0; padding:18px; }
  @media (min-width:1100px){ body{ padding:26px max(40px,calc((100vw - 1100px)/2)); } }
  a { text-decoration:none; }
  h1 { font-size:20px; margin:0; }
  h2 { font-size:13px; margin:0 0 9px; color:var(--muted); text-transform:uppercase;
       letter-spacing:.06em; }
  .muted { color:var(--muted); }
  .panel { background:var(--panel); border:1px solid var(--line); border-radius:10px;
           padding:14px 16px; margin-bottom:14px; }
  .topline { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
  /* ---- search (cloned from the analyzer) ---- */
  .searchwrap { position:relative; flex:1; min-width:240px; max-width:460px; }
  #wl_q { width:100%; padding:10px 14px; border-radius:10px; border:1px solid var(--line);
       background:var(--panel2); color:var(--text); font-size:15px; outline:none; }
  #wl_q:focus { border-color:var(--link); }
  #wl_sugg { position:absolute; top:104%; left:0; right:0; background:var(--panel);
          border:1px solid var(--line); border-radius:10px; z-index:50; max-height:330px;
          overflow:auto; display:none; box-shadow:var(--popover-shadow); }
  #wl_sugg div { padding:8px 13px; cursor:pointer; display:flex; gap:10px; align-items:center; }
  #wl_sugg div:hover, #wl_sugg div.sel { background:var(--panel2); }
  #wl_sugg b { min-width:58px; flex:none; }
  #wl_sugg small { color:var(--muted); flex:1 1 auto; min-width:0;
                   white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .wl-sst { font-size:11px; white-space:nowrap; flex:0 1 auto; min-width:0; max-width:42%;
            overflow:hidden; text-overflow:ellipsis; text-align:right; }
  /* ---- sync / account bar ---- */
  .wl-syncbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
  .wl-pill { font-size:11.5px; font-weight:700; padding:3px 9px; border-radius:8px;
             border:1px solid transparent; }
  .wl-pill-synced { background:color-mix(in srgb,var(--up) 15%,var(--panel)); color:var(--up); }
  .wl-pill-syncing { background:color-mix(in srgb,var(--info) 15%,var(--panel)); color:var(--info); }
  .wl-pill-local, .wl-pill-offline { background:var(--panel2); color:var(--muted); }
  .wl-in { padding:7px 11px; border-radius:8px; border:1px solid var(--line);
           background:var(--panel2); color:var(--text); font-size:13px; outline:none; }
  .wl-btn { background:var(--panel2); border:1px solid var(--line); color:var(--link);
            padding:7px 13px; border-radius:8px; font-size:13px; cursor:pointer; }
  .wl-btn:hover { border-color:var(--link); }
  .wl-btn:disabled { opacity:.5; cursor:default; }
  #wl_authbox, #wl_codestep, #wl_account { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
  /* ---- controls ---- */
  .wl-controls { display:flex; gap:16px; align-items:center; flex-wrap:wrap; margin:2px 2px 14px; }
  .wl-controls label { display:flex; gap:7px; align-items:center; font-size:13px; color:var(--muted); }
  .wl-controls select { background:var(--panel2); color:var(--text); border:1px solid var(--line);
            border-radius:8px; padding:5px 9px; font-size:13px; }
  .wl-soonpill { color:var(--info); font-weight:700; font-size:13px; }
  /* ---- cards ---- */
  .wl-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:12px; }
  .wl-card { background:var(--panel); border:1px solid var(--line); border-radius:12px;
             padding:12px 14px; border-left:3px solid transparent; }
  .wl-card.wl-buysoon { border-left-color:var(--info);
             background:color-mix(in srgb,var(--info) 5%,var(--panel)); }
  .wl-card.wl-gone { opacity:.72; }
  .wl-top { display:flex; align-items:center; gap:8px; }
  .wl-name { color:var(--text); font-size:15px; flex:1; }
  .wl-name b { font-weight:800; } .wl-cn { font-weight:400; font-size:12.5px; }
  .wl-rm { background:transparent; border:0; color:var(--muted); cursor:pointer;
           font-size:14px; line-height:1; padding:3px 7px; border-radius:7px; }
  .wl-rm:hover { color:#fff; background:var(--down); }
  .wl-sig { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:7px; }
  .state { display:inline-block; padding:2px 10px; border-radius:11px; font-weight:700;
           font-size:12px; border:1px solid transparent; }
  .wl-action { font-size:12px; font-weight:600; }
  .wl-sector { font-size:11.5px; margin-left:auto; }
  .wl-enrich:not(:empty) { margin-top:9px; padding-top:9px; border-top:1px solid var(--line); }
  .wl-summary { font-size:12.5px; margin:0 0 6px; line-height:1.5; }
  .wl-entry { display:inline-flex; gap:7px; align-items:center; padding:4px 10px; border-radius:8px;
              font-size:12px; border:1px solid transparent; margin:2px 0 6px; }
  .wl-etag { font-weight:800; letter-spacing:.03em; }
  .wl-px { font-size:12px; margin:2px 0 4px; }
  .wl-mtf { margin-top:4px; }
  /* the shared 3-up MTF strip is sized for the wide sector/analyzer pages; the
     watchlist card (~310px) is too narrow for it, so stack the timeframe cards
     (same single-column layout the strip already uses on mobile) — otherwise the
     min-content of three gauges overflows and bleeds past the card edge */
  .wl-card .mtf-grid { grid-template-columns:1fr; }
  /* ---- empty / chips / banner / toast ---- */
  #wl_empty { display:none; }
  .wl-chip { background:var(--panel2); border:1px solid var(--line); border-radius:8px;
             padding:6px 11px; margin:5px 6px 0 0; cursor:pointer; color:var(--text); font-size:13px; }
  .wl-chip:hover { border-color:var(--link); }
  .wl-banner { display:none; margin-bottom:14px; padding:10px 14px; border-radius:9px;
               font-size:13px; background:color-mix(in srgb,var(--warn) 14%,var(--panel));
               border:1px solid color-mix(in srgb,var(--warn) 35%,transparent); color:var(--text); }
  #wl_export { width:100%; min-height:54px; resize:vertical; }
  .wl-toast { position:fixed; left:50%; bottom:26px; transform:translateX(-50%) translateY(20px);
              background:var(--panel); color:var(--text); border:1px solid var(--line);
              border-radius:10px; padding:10px 16px; font-size:13px; font-weight:600;
              box-shadow:var(--popover-shadow); opacity:0; pointer-events:none; transition:.25s; z-index:90; }
  .wl-toast.show { opacity:1; transform:translateX(-50%) translateY(0); }
  .wl-toast.bad { border-color:var(--down); color:var(--down); }
  /* ---- portfolio factor exposure (factor_exposure.js) ---- */
  #fx_panel h2 { margin-bottom:6px; text-transform:none; letter-spacing:0; color:var(--text); font-size:15px; }
  .fx-head { font-size:14px; margin:0 0 4px; line-height:1.55; }
  .fx-sub { font-size:12px; margin:0 0 12px; }
  .fx-grid { display:flex; flex-direction:column; gap:7px; }
  .fx-row { display:grid; grid-template-columns:132px 46px 1fr 42px; align-items:center; gap:10px; font-size:12.5px; }
  .fx-lab { color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .fx-beta { text-align:right; font-variant-numeric:tabular-nums; color:var(--muted); }
  .fx-track { height:9px; background:var(--panel2); border-radius:6px; overflow:hidden; }
  .fx-track span { display:block; height:100%; border-radius:6px; transition:width .3s ease; }
  .fx-share { text-align:right; font-weight:700; font-variant-numeric:tabular-nums; }
  .fx-tag { font-size:10px; color:var(--muted); border:1px solid var(--line); border-radius:5px; padding:0 4px; margin-left:5px; }
  .fx-shocks { margin-top:13px; border-top:1px solid var(--line); padding-top:10px; }
  .fx-shock-h { font-size:11px; letter-spacing:.05em; margin-bottom:6px; }
  .fx-srow { display:flex; justify-content:space-between; font-size:12.5px; padding:3px 0; }
  .fx-lo { margin-top:11px; }
  .fx-lo summary { cursor:pointer; font-size:12px; color:var(--muted); }
  .fx-lo .fx-grid { margin-top:9px; }
  .fx-cov { font-size:11px; margin:9px 0 0; line-height:1.5; }
  .fx-wedit { margin-top:11px; border-top:1px solid var(--line); padding-top:9px; }
  .fx-wedit summary { cursor:pointer; font-size:12px; color:var(--link); font-weight:600; }
  .fx-wgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:6px 12px; margin:10px 0; }
  .fx-wrow { display:flex; align-items:center; gap:6px; font-size:12.5px; }
  .fx-wt { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .fx-w { width:62px; padding:4px 7px; border-radius:7px; border:1px solid var(--line);
          background:var(--panel2); color:var(--text); font:inherit; font-size:12.5px; outline:none;
          text-align:right; font-variant-numeric:tabular-nums; }
  .fx-w:focus { border-color:color-mix(in srgb,var(--link) 70%,var(--line));
          box-shadow:0 0 0 3px color-mix(in srgb,var(--link) 18%,transparent); }
  .fx-wfoot { display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:11px; }
  .fx-wreset { background:var(--panel2); border:1px solid var(--line); color:var(--link);
          padding:5px 11px; border-radius:8px; font:inherit; font-size:12px; cursor:pointer; }
  .fx-wreset:hover { border-color:color-mix(in srgb,var(--link) 55%,var(--line)); }
  @media (max-width:480px){ .fx-row{ grid-template-columns:92px 40px 1fr 36px; gap:7px; } }

  /* ---- mx5 dialog system (minimal subset) ---- */
  html.mx5-dlg-lock{ overflow:hidden; }
  html.mx5-dlg-lock body{ overflow:hidden; position:fixed; width:100%; }
  .mx5-dlg{
    display:none;position:fixed;inset:0;z-index:200;
    align-items:center;justify-content:center;
  }
  .mx5-dlg.open{ display:flex; }
  .mx5-dlg-backdrop{
    position:absolute;inset:0;
    background:rgba(3,6,10,.58);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
  }
  .mx5-dlg-panel{
    position:relative;z-index:1;
    max-width:980px;width:calc(100% - 48px);
    max-height:82vh;
    background:rgba(13,17,24,.88);
    border:1px solid rgba(255,255,255,.10);
    border-radius:18px;
    backdrop-filter:blur(28px) saturate(1.4);
    -webkit-backdrop-filter:blur(28px) saturate(1.4);
    box-shadow:0 40px 120px rgba(0,0,0,.72),
               0 2px 0 rgba(255,255,255,.06) inset,
               0 0 0 1px rgba(255,255,255,.04);
    overflow-y:auto;
    display:flex;flex-direction:column;
  }
  [data-theme="light"] .mx5-dlg-panel{
    background:#ffffff;
    border-color:rgba(255,255,255,.6);
    box-shadow:0 32px 96px rgba(0,0,0,.18),
               0 1px 0 rgba(255,255,255,.9) inset,
               0 0 0 1px rgba(0,0,0,.04);
  }
  @supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
    .mx5-dlg-panel{background:rgba(13,18,26,.98);}
    [data-theme="light"] .mx5-dlg-panel{background:rgba(255,255,255,.98);}
  }
  .mx5-dlg-panel-narrow{ max-width:640px; }
  .mx5-dlg-header{
    display:flex;align-items:center;justify-content:space-between;
    padding:20px 26px 16px;
    position:sticky;top:0;z-index:2;
    background:rgba(13,17,24,.92);
    backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);
    border-bottom:1px solid rgba(255,255,255,.07);
  }
  [data-theme="light"] .mx5-dlg-header{
    background:#ffffff;border-bottom-color:rgba(0,0,0,.07);
  }
  @supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
    .mx5-dlg-header{background:rgba(13,18,26,.98);}
    [data-theme="light"] .mx5-dlg-header{background:rgba(255,255,255,.98);}
  }
  .mx5-dlg-title{
    font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
    color:var(--muted);
  }
  .mx5-dlg-close{
    display:flex;align-items:center;justify-content:center;
    width:32px;height:32px;border-radius:50%;
    background:rgba(255,255,255,.07);border:none;cursor:pointer;
    color:var(--muted);font-size:18px;line-height:1;
    font-family:inherit;flex-shrink:0;transition:background .15s;
  }
  .mx5-dlg-close:hover{background:rgba(255,255,255,.14);}
  .mx5-dlg-close:focus-visible{outline:2px solid var(--link);outline-offset:2px;}
  .mx5-dlg-body{ padding:24px 26px 28px;flex:1;overflow-y:auto; }
  @media(max-width:700px){
    .mx5-dlg{ align-items:flex-end; }
    .mx5-dlg-panel{width:calc(100% - 24px);max-width:none;max-height:85vh;
      border-radius:18px 18px 0 0;margin:0 12px;}
    .mx5-dlg-close{width:44px;height:44px;font-size:22px;}
    .mx5-dlg-body{padding:20px 18px 28px;overflow-x:hidden;}
    .mx5-dlg-header{padding:16px 18px 12px;}
  }
  @media(max-width:360px){
    .mx5-dlg-panel{margin:0 6px;width:calc(100% - 12px);}
  }

  /* ---- portfolio section ---- */
  #pf_section .pf-sh { display:flex; align-items:center; gap:8px; margin-bottom:12px; }
  #pf_section .pf-sh h2 { font-size:15px; margin:0; color:var(--text); text-transform:none;
    letter-spacing:0; }
  #pf_section .pf-help { background:transparent; border:none; cursor:pointer;
    color:var(--muted); font-size:13px; padding:0 3px; }
  #pf_signedout { padding:10px 0; }
  #pf_signedout p { margin:0 0 9px; color:var(--muted); font-size:13px; }
  #pf_empty { padding:10px 0; display:none; }
  #pf_empty p { margin:0 0 9px; color:var(--muted); font-size:13px; }
  #pf_err_inline { display:none; color:var(--down,#ef4444); font-size:13px; padding:8px 0; }
  #pf_add { margin-top:10px; }
  /* table */
  .ts { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .ts table { border-collapse:collapse; width:100%; min-width:560px; }
  .ts th { font-size:11.5px; font-weight:700; color:var(--muted); text-align:right;
    padding:5px 10px; border-bottom:1px solid var(--line); white-space:nowrap; }
  .ts th:first-child, .ts th:nth-child(2) { text-align:left; }
  .ts td { padding:7px 10px; border-bottom:1px solid var(--line); font-size:13px;
    vertical-align:middle; }
  .ts td:first-child { font-weight:700; }
  .ts td.tabnum { text-align:right; font-variant-numeric:tabular-nums; }
  .ts tr:last-child td { border-bottom:none; }
  #pf_closed { margin-top:12px; }
  #pf_closed summary { cursor:pointer; font-size:13px; font-weight:600;
    color:var(--muted); padding:4px 0; }
  #pf_foot { display:block; margin-top:9px; font-size:11.5px; color:var(--muted); }
  /* modal form rows */
  .pfm-row { margin-bottom:13px; }
  .pfm-row label { display:block; font-size:12px; font-weight:600; color:var(--muted);
    margin-bottom:4px; }
  .pfm-row input, .pfm-row select { width:100%; }
  #pfm_hint { font-size:11.5px; color:var(--muted); margin-top:3px; display:none; }
  #pfm_sugg { position:absolute; top:104%; left:0; right:0; background:var(--panel);
    border:1px solid var(--line); border-radius:10px; z-index:50; max-height:220px;
    overflow:auto; display:none; box-shadow:var(--popover-shadow,0 8px 32px rgba(0,0,0,.4)); }
  #pfm_sugg div { padding:8px 13px; cursor:pointer; display:flex; gap:10px; align-items:center; }
  #pfm_sugg div:hover, #pfm_sugg div.sel { background:var(--panel2); }
  #pfm_sugg b { min-width:58px; flex:none; }
  #pfm_sugg small { color:var(--muted); flex:1; min-width:0;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .pfm-ticker-wrap { position:relative; }
  #pfm_err { display:none; color:var(--down,#ef4444); font-size:12.5px; margin-top:8px; }
  @media(max-width:640px){ .mx5-dlg-panel-narrow{ width:calc(100% - 12px); } }

  /* ===================================================================== */
  /* Watchlist Risk Intelligence (WRI W3) — scoped .wri* (ported from the   */
  /* pinned W2 mockup mockups/wri/watchlist_risk_mockup.html; theme.css     */
  /* untouched). All tints via color-mix over theme tokens -> light/dark    */
  /* for free. Risk-state ramp is NEVER --up/--down (zh-flip trap).         */
  /* ===================================================================== */
  .wri, .wri-rail {
    --wri-ok:#3fb98d; --wri-tilt:#d9a13c; --wri-conc:#e2703a; --wri-one:#e05252;
    --f-mkt:#8fa4b8; --f-growth:#9a7bff; --f-size:#4fc3d9; --f-rates:#5f8dff;
    --f-usd:#7fae72; --f-oil:#d9903c; --f-china:#e0645c; --f-btc:#f0a13c;
    --f-gold:#d4b23c; --f-idio:#66788c;
    --wri-mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  }
  .wri .num, .wri-rail .num { font-family:var(--wri-mono); font-variant-numeric:tabular-nums; }
  .wri .eyebrow { display:flex; align-items:center; gap:8px; font-family:var(--wri-mono);
    font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
  .wri .eyebrow .asof { margin-left:auto; letter-spacing:.04em; }

  /* aurora backdrop (mx5 idiom: fixed, blurred, whisper-alpha) */
  .wri-aurora { position:fixed; inset:0; pointer-events:none; z-index:0; overflow:hidden; }
  .wri-aurora::before { content:""; position:absolute; width:900px; height:700px;
    top:-220px; left:-160px; border-radius:50%; filter:blur(90px);
    background:radial-gradient(ellipse, rgba(154,123,255,.10) 0%, transparent 70%); }
  .wri-aurora::after { content:""; position:absolute; width:760px; height:620px;
    bottom:-140px; right:-120px; border-radius:50%; filter:blur(90px);
    background:radial-gradient(ellipse, rgba(34,217,122,.07) 0%, transparent 70%); }
  [data-theme="light"] .wri-aurora::before { background:radial-gradient(ellipse, rgba(154,123,255,.07) 0%, transparent 70%); }
  [data-theme="light"] .wri-aurora::after  { background:radial-gradient(ellipse, rgba(34,217,122,.05) 0%, transparent 70%); }

  /* L3 regime rail */
  .wri-rail { display:none; align-items:center; gap:10px; flex-wrap:wrap;
    padding:8px 14px; margin-bottom:14px; border-radius:10px; font-size:12.5px;
    background:color-mix(in srgb, var(--panel) 82%, transparent);
    border:1px solid color-mix(in srgb, var(--wri-rail-tint,var(--wri-tilt)) 26%, var(--line)); }
  .wri-rail .dot { width:7px; height:7px; border-radius:50%; background:var(--wri-rail-tint,var(--wri-tilt));
    box-shadow:0 0 10px 1px color-mix(in srgb, var(--wri-rail-tint,var(--wri-tilt)) 65%, transparent); flex:none; }
  .wri-rail-ok { --wri-rail-tint:var(--wri-ok); } .wri-rail-tilt { --wri-rail-tint:var(--wri-tilt); }
  .wri-rail-conc { --wri-rail-tint:var(--wri-conc); } .wri-rail-one { --wri-rail-tint:var(--wri-one); }
  .wri-rail b { font-weight:700; }
  .wri-rail .sep { color:color-mix(in srgb, var(--muted) 55%, transparent); }
  .wri-rail a { color:var(--link); text-decoration:none; margin-left:auto; font-size:12px; }

  /* L2 hero */
  .wri-hero { padding:18px 20px 16px; position:relative; z-index:1; }
  .wri-hero .wri-empty { font-size:13.5px; line-height:1.55; max-width:640px; }
  .wri-verdict { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:10px; }
  .wri-hero[data-state="conc"] { --vh1:var(--wri-conc); --vh2:color-mix(in srgb, var(--wri-conc) 45%, var(--info)); }
  .wri-hero[data-state="one"]  { --vh1:var(--wri-one);  --vh2:color-mix(in srgb, var(--wri-one) 45%, var(--info)); }
  .wri-hero[data-state="tilt"] { --vh1:var(--wri-tilt); --vh2:color-mix(in srgb, var(--wri-tilt) 45%, var(--info)); }
  .wri-hero[data-state="ok"]   { --vh1:var(--wri-ok);   --vh2:color-mix(in srgb, var(--wri-ok) 45%, var(--info)); }
  .wri-verdict h2 { margin:0; font-size:clamp(19px,2.2vw,24px); font-weight:800;
    line-height:1.22; letter-spacing:-.02em;
    background:linear-gradient(120deg, var(--vh1) 0%, var(--vh2) 90%);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:var(--vh1); }
  .wri-state { flex:none; font-family:var(--wri-mono); font-size:10px; font-weight:700;
    letter-spacing:.12em; text-transform:uppercase; padding:4px 10px; border-radius:8px;
    color:var(--vh1); border:1px solid color-mix(in srgb, var(--vh1) 42%, transparent);
    background:color-mix(in srgb, var(--vh1) 8%, transparent);
    display:inline-flex; align-items:center; gap:6px; }
  .wri-state::before { content:""; width:6px; height:6px; border-radius:50%;
    background:var(--vh1); box-shadow:0 0 7px color-mix(in srgb, var(--vh1) 70%, transparent); }
  .wri-so { margin:8px 0 0; font-size:13.5px; line-height:1.55; max-width:780px; color:var(--text); }
  .wri-so b { font-weight:700; }

  .wri-lens { display:flex; align-items:center; gap:10px; margin:15px 0 2px; }
  .wri-lens .seg { display:inline-flex; border:1px solid color-mix(in srgb, var(--line) 80%, transparent);
    border-radius:9px; padding:2px; background:color-mix(in srgb, var(--panel2) 70%, transparent); }
  .wri-lens button { border:0; background:transparent; color:var(--muted); cursor:pointer;
    font-family:var(--wri-mono); font-size:11px; font-weight:700; letter-spacing:.06em;
    padding:4px 12px; border-radius:7px; }
  .wri-lens button[aria-pressed="true"] { background:var(--panel); color:var(--text);
    box-shadow:0 1px 8px rgba(0,0,0,.3), inset 0 0 0 1px color-mix(in srgb, var(--line) 70%, transparent); }
  .wri-lens button:focus-visible { outline:2px solid var(--link); outline-offset:2px; }
  .wri-lens .hint { font-size:11.5px; color:var(--muted); }

  /* patch bay */
  .wri-braid { position:relative; margin:4px 0 0; }
  .wri-braid svg { display:block; width:100%; height:auto; }
  .wri-braid .guide { stroke:var(--line); stroke-width:1; stroke-dasharray:1 6; opacity:.55; }
  .wri-braid .cord { fill:none; stroke-width:1.25; stroke-linecap:round; opacity:.85; }
  .wri-braid .cord.hedge { stroke-dasharray:5 4; }
  .wri-braid .rail { stroke:color-mix(in srgb, var(--line) 85%, var(--muted)); stroke-width:1; }
  .wri-braid .segbase { stroke-width:2.5; stroke-linecap:butt; }
  .wri-braid .segtick { stroke-width:1; }
  .wri-braid .seg-dom { filter:drop-shadow(0 0 5px color-mix(in srgb, var(--f-growth) 55%, transparent)); }
  .wri-braid text { font-family:var(--wri-mono); }
  .wri-braid .tick { font-size:10.5px; fill:var(--muted); letter-spacing:.04em; }
  .wri-braid .tick.neg { fill:var(--wri-ok); }
  .wri-strandlab { font-size:10px; letter-spacing:.1em; fill:var(--muted); text-transform:uppercase; }
  .wri-strandlab.dom { fill:var(--text); }
  @media (prefers-reduced-motion:no-preference){
    .wri-braid.animate .cord { stroke-dasharray:300; stroke-dashoffset:300; animation:wri-draw .65s ease-out forwards; }
    .wri-braid.animate .cord.hedge { stroke-dasharray:5 4; stroke-dashoffset:0; animation:none; }
    @keyframes wri-draw { to { stroke-dashoffset:0; } }
  }
  .wri-buckets { display:none; flex-direction:column; gap:8px; margin:10px 0 2px; }
  .wri-bucket { display:flex; align-items:center; gap:9px; font-size:12.5px; padding:7px 10px;
    border:1px solid color-mix(in srgb, var(--line) 70%, transparent); border-radius:9px; }
  .wri-bucket .swatch { width:9px; height:9px; border-radius:3px; flex:none; }
  .wri-bucket .tks { font-family:var(--wri-mono); font-size:11px; color:var(--muted); }

  /* sub-cards */
  .wri-sub { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:10px; margin-top:16px; }
  .wri-card2 { background:color-mix(in srgb, var(--panel2) 70%, transparent);
    border:1px solid color-mix(in srgb, var(--line) 72%, transparent);
    border-radius:10px; padding:12px 14px; }
  .wri-card2 h3 { margin:0 0 9px; font-family:var(--wri-mono); font-size:10px;
    letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:700;
    display:flex; gap:6px; align-items:center; }
  .wri-card2 h3 .q { margin-left:auto; cursor:help; color:var(--muted); font-size:10px;
    border:1px solid color-mix(in srgb, var(--line) 85%, transparent); border-radius:50%;
    width:15px; height:15px; line-height:13px; text-align:center; flex:none; font-family:var(--font-ui,inherit); }
  .wri-card2 h3 .q:focus-visible { outline:2px solid var(--link); outline-offset:2px; }
  .wri-frow { display:grid; grid-template-columns:96px 1fr 42px; gap:9px; align-items:center;
    font-size:12.5px; padding:3px 0; }
  .wri-frow .lab { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .wri-track { height:7px; border-radius:4px; background:rgba(255,255,255,.07); overflow:hidden; }
  [data-theme="light"] .wri-track { background:rgba(10,25,40,.08); }
  .wri-track i { display:block; height:100%; border-radius:4px;
    background:linear-gradient(90deg, color-mix(in srgb, var(--hue,#8fa4b8) 40%, transparent), var(--hue,#8fa4b8)); }
  .wri-frow .pct { text-align:right; font-weight:600; font-family:var(--wri-mono); font-size:12px; }
  .wri-enb { font-size:11.5px; color:var(--muted); margin-top:8px; padding-top:8px;
    border-top:1px solid color-mix(in srgb, var(--line) 70%, transparent); }
  .wri-twins { display:flex; flex-direction:column; gap:8px; }
  .wri-twin { display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:12.5px; }
  .wri-twin .tk { font-family:var(--wri-mono); font-weight:600; font-size:11.5px;
    padding:2px 8px; border-radius:6px; color:var(--text);
    border:1px solid color-mix(in srgb, var(--f-growth) 45%, transparent);
    background:color-mix(in srgb, var(--f-growth) 8%, transparent); }
  .wri-twin .lnk { color:var(--muted); font-size:11px; }
  .wri-twin.stress .tk { border-color:color-mix(in srgb, var(--wri-one) 40%, transparent);
    background:color-mix(in srgb, var(--wri-one) 7%, transparent); }
  .wri-twin .why { flex-basis:100%; font-size:11.5px; color:var(--muted); line-height:1.45; }
  .wri-crow { display:grid; grid-template-columns:52px 1fr 46px; gap:9px; align-items:center;
    font-size:12.5px; padding:3px 0; }
  .wri-crow .tk { font-family:var(--wri-mono); font-weight:600; font-size:12px; }
  .wri-crow .pct { text-align:right; font-weight:600; font-family:var(--wri-mono); font-size:12px; }
  .wri-crow.neg .pct { color:var(--wri-ok); }
  .wri-note { font-size:11.5px; color:var(--muted); margin-top:8px; padding-top:8px;
    border-top:1px solid color-mix(in srgb, var(--line) 70%, transparent); }
  .wri-fxdrawer { margin-top:10px; }
  .wri-fxdrawer > summary { cursor:pointer; font-size:11.5px; color:var(--link); font-weight:600;
    font-family:var(--font-ui,inherit); }
  .wri-fxdrawer #fx_panel { display:block !important; background:transparent; border:0; padding:10px 0 0; margin:0; }
  .wri-foot { margin-top:13px; font-size:11.5px; color:var(--muted); }
  .wri-foot .q { cursor:help; text-decoration:underline dotted; }
  .wri-foot .q:focus-visible { outline:2px solid var(--link); outline-offset:2px; }

  /* pre-trade check (W4) — full-width hairline row inside the hero, after the
     sub-cards, before the footnote. Uses the .wri idiom only: mono eyebrow,
     hairline borders, tabular mono numerals. Deltas are NEVER tinted (neutral
     ink — a diversification delta is a measurement, not a verdict, WRI-R3). */
  .wri-w4 { margin-top:16px; padding-top:14px;
    border-top:1px solid color-mix(in srgb, var(--line) 72%, transparent); }
  .wri-w4-head { display:flex; align-items:center; gap:8px; font-family:var(--wri-mono);
    font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
    font-weight:700; margin-bottom:10px; }
  .wri-w4-head .q { cursor:help; color:var(--muted); font-size:10px;
    border:1px solid color-mix(in srgb, var(--line) 85%, transparent); border-radius:50%;
    width:15px; height:15px; line-height:13px; text-align:center; flex:none;
    font-family:var(--font-ui,inherit); }
  .wri-w4-head .q:focus-visible { outline:2px solid var(--link); outline-offset:2px; }
  .wri-w4-in { display:flex; gap:9px; align-items:flex-start; flex-wrap:wrap; }
  .wri-w4-tk { position:relative; flex:1 1 190px; min-width:160px; max-width:280px; }
  .wri-w4-tk input { width:100%; padding:8px 12px; border-radius:9px; border:1px solid var(--line);
    background:var(--panel2); color:var(--text); font-size:14px; outline:none; }
  .wri-w4-tk input:focus { border-color:var(--link); }
  .wri-w4-amt { flex:0 0 auto; display:flex; flex-direction:column; gap:3px; }
  .wri-w4-amtrow { position:relative; display:inline-flex; align-items:center; }
  .wri-w4-amtrow .cur { position:absolute; left:11px; color:var(--muted); font-size:13px;
    font-family:var(--wri-mono); pointer-events:none; }
  .wri-w4-amt input { width:128px; padding:8px 12px 8px 22px; border-radius:9px;
    border:1px solid var(--line); background:var(--panel2); color:var(--text);
    font-size:14px; outline:none; font-family:var(--wri-mono); font-variant-numeric:tabular-nums; }
  .wri-w4-amt input:focus { border-color:var(--link); }
  .wri-w4-amt .sub { font-size:10.5px; color:var(--muted); line-height:1.4; max-width:230px; }
  .wri-w4-clear { align-self:center; background:transparent; border:0; color:var(--link);
    cursor:pointer; font-size:11.5px; font-weight:600; padding:4px 6px;
    font-family:var(--font-ui,inherit); }
  .wri-w4-clear:focus-visible { outline:2px solid var(--link); outline-offset:2px; }
  /* suggestion dropdown — mirrors #wl_sugg but scoped to the what-if input */
  .wri-w4-sugg { position:absolute; top:104%; left:0; right:0; background:var(--panel);
    border:1px solid var(--line); border-radius:10px; z-index:50; max-height:280px;
    overflow:auto; display:none; box-shadow:var(--popover-shadow); }
  .wri-w4-sugg div { padding:7px 12px; cursor:pointer; display:flex; gap:10px; align-items:center;
    font-size:13px; }
  .wri-w4-sugg div:hover, .wri-w4-sugg div.sel { background:var(--panel2); }
  .wri-w4-sugg b { min-width:52px; flex:none; font-family:var(--wri-mono); }
  .wri-w4-sugg small { color:var(--muted); flex:1 1 auto; min-width:0;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  /* result block — neutral ink; deltas plain, numerals mono, arrows plain */
  .wri-w4-res { margin-top:12px; }
  .wri-w4-res .ln { font-size:13px; line-height:1.55; color:var(--text); margin:0 0 4px;
    display:flex; align-items:baseline; gap:7px; }
  .wri-w4-res .ln .dot { width:4px; height:4px; border-radius:50%; flex:none;
    background:color-mix(in srgb, var(--muted) 60%, transparent); margin-top:7px; }
  .wri-w4-res .num { font-family:var(--wri-mono); font-variant-numeric:tabular-nums; font-weight:700; }
  .wri-w4-res .arw { color:var(--muted); font-family:var(--wri-mono); padding:0 1px; }
  .wri-w4-res .tk { font-family:var(--wri-mono); font-weight:700; }
  .wri-w4-res .null { color:var(--muted); font-style:normal; }
  .wri-w4-res .wri-lanes { margin-top:9px; }
  .wri-w4-res .wri-lanes .wri-more { display:none; }   /* the candidate shows all its chips inline */

  /* L1 card additions (layered over the existing .wl-card, not replacing it) */
  .wri-lanes { display:flex; gap:6px; flex-wrap:wrap; margin-top:9px; align-items:center; }
  .wri-chip { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:600;
    padding:2.5px 9px; border-radius:7px; color:var(--text);
    border:1px solid color-mix(in srgb, var(--line) 85%, var(--muted)); background:transparent; }
  .wri-chip::before { content:""; width:5px; height:5px; border-radius:50%; background:var(--wri-tilt); flex:none; }
  .wri-chip.hot { border-color:color-mix(in srgb,var(--wri-one) 45%,transparent);
    background:color-mix(in srgb,var(--wri-one) 7%,transparent); }
  .wri-chip.hot::before { background:var(--wri-one); box-shadow:0 0 6px color-mix(in srgb,var(--wri-one) 60%,transparent); }
  .wri-chip.info { color:var(--muted); } .wri-chip.info::before { background:var(--muted); opacity:.6; }
  .wri-role { font-family:var(--wri-mono); font-size:10px; font-weight:700; letter-spacing:.1em;
    text-transform:uppercase; padding:3px 9px; border-radius:7px; margin-left:auto;
    color:var(--wri-conc); border:1px solid color-mix(in srgb,var(--wri-conc) 42%,transparent);
    background:color-mix(in srgb,var(--wri-conc) 8%,transparent); flex:none; }
  .wri-role-review { color:var(--wri-tilt); border-color:color-mix(in srgb,var(--wri-tilt) 42%,transparent);
    background:color-mix(in srgb,var(--wri-tilt) 8%,transparent); }
  .wri-role-exit { color:var(--wri-one); border-color:color-mix(in srgb,var(--wri-one) 42%,transparent);
    background:color-mix(in srgb,var(--wri-one) 8%,transparent); }
  .wri-more { font-size:11px; color:var(--link); cursor:pointer; border:0; background:none;
    padding:2px 4px; font-weight:600; font-family:var(--font-ui,inherit); }
  .wri-drawer { display:none; margin-top:10px; padding-top:10px;
    border-top:1px solid color-mix(in srgb, var(--line) 70%, transparent); }
  .wri-drawer.open { display:block; }
  .wri-lrow { display:flex; gap:8px; align-items:baseline; font-size:12.5px; padding:3.5px 0; }
  .wri-lrow .ln { flex:none; width:112px; color:var(--muted); font-size:11.5px; }
  .wri-lrow .st { flex:none; font-family:var(--wri-mono); font-weight:700; font-size:10px; letter-spacing:.08em; }
  .wri-lrow .st.ok { color:var(--wri-ok); } .wri-lrow .st.watch { color:var(--wri-tilt); }
  .wri-lrow .st.elev { color:var(--wri-one); } .wri-lrow .st.na { color:var(--muted); }
  .wri-lrow .st.info { color:var(--muted); }   /* TXI chain lane — INFO tier, deliberately cool */
  .wri-lrow .rs { color:var(--text); }
  /* TXI chain lane — the drawer ? tip (shared data-tip-* tooltip; no title=) */
  .wri-q { display:inline-flex; align-items:center; justify-content:center; width:14px; height:14px;
    margin-left:5px; border-radius:50%; border:1px solid var(--line); color:var(--muted);
    font-size:9.5px; font-weight:700; cursor:help; vertical-align:middle; }
  /* TXI chain lane — the ONE appended hero-rail sentence + its link */
  .wri-rail-chain { color:var(--muted); }
  .wri-rail-chain a { color:var(--wri-rail-tint, var(--muted)); font-weight:600; margin-left:4px; white-space:nowrap; }
  .wri-drawer .asof { font-size:11px; color:var(--muted); margin-top:7px; }

  /* portfolio table: risk columns (mini-bar mirrors the FX idiom) */
  .wri-rsbar { display:inline-block; vertical-align:middle; width:44px; height:7px; border-radius:4px;
    background:rgba(255,255,255,.07); overflow:hidden; margin-left:8px; }
  [data-theme="light"] .wri-rsbar { background:rgba(10,25,40,.08); }
  .wri-rsbar i { display:block; height:100%;
    background:linear-gradient(90deg, color-mix(in srgb, var(--f-growth) 40%, transparent), var(--f-growth)); }
  .wri-rsbar i.neg { background:linear-gradient(90deg, color-mix(in srgb, var(--wri-ok) 40%, transparent), var(--wri-ok)); }

  @media (max-width:560px){
    .wri-verdict h2 { font-size:19px; }
    .wri-braid { display:none; }
    .wri-buckets { display:flex; }
  }
