/* ForexR Signals (/signals and /signals/{id}-...). Loaded only on those pages; chart.css supplies the fc-* chart card.
   Tokens come from app.css (--surface --line --hair --ink --muted --faint --up --dn --brand ...). Green and red mean
   direction or result and nothing else. Numbers use --fm (IBM Plex Mono), the same face as the chart. */
.sg-body{--sg-gap:clamp(16px,2.2vw,24px);--sg-pad:clamp(16px,2vw,22px)}
.sg-sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.up{color:var(--up)}.dn{color:var(--dn)}
.sg-muted{color:var(--muted);font-size:.9rem;line-height:1.6;margin:10px 0 0}
.sg-small{font-size:.8rem}
.sg-body a:focus-visible,.sg-body button:focus-visible,.sg-body select:focus-visible,.sg-body input:focus-visible,.sg-body summary:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}

/* ---------- lead ---------- */
.sg-lead{margin-bottom:26px}
.sg-h1{margin:6px 0 0;color:var(--ink);font:800 1.9rem/1.12 var(--fh);letter-spacing:-.03em}
.sg-h1-hub{font-size:clamp(2rem,4.4vw,2.9rem);margin-top:10px}
.sg-lede{max-width:64ch;margin:14px 0 0;color:var(--muted);font-size:1.02rem;line-height:1.65}
.sg-practice{margin:16px 0 0;color:var(--muted);font-size:.88rem;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}

/* ---------- chips and badges ---------- */
.sg-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:999px;background:var(--hair);color:var(--muted);font:600 .72rem/1.4 var(--ff);white-space:nowrap;letter-spacing:.01em}
.sg-chip b{font:600 .75rem/1 var(--fm);color:var(--ink)}
.sg-pre{background:var(--brand-soft);color:var(--brand-strong)}
.sg-oco{background:transparent;box-shadow:inset 0 0 0 1px var(--line)}
.sg-src-ai{box-shadow:inset 0 0 0 1px var(--line);background:transparent}
.sg-side{display:inline-flex;align-items:center;padding:3px 10px;border-radius:7px;font:700 .72rem/1.4 var(--ff);letter-spacing:.06em;text-transform:uppercase}
.sg-buy{background:var(--up-bg);color:var(--up)}
.sg-sell{background:var(--dn-bg);color:var(--dn)}
.sg-state{display:inline-flex;align-items:center;gap:7px;font:650 .74rem/1.3 var(--ff);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.sg-state i{width:8px;height:8px;border-radius:50%;background:var(--faint);flex:none}
.sg-st-live{color:var(--ink)}
.sg-st-live i{background:var(--up);box-shadow:0 0 0 0 var(--up-bg);animation:sg-pulse 2s ease-out infinite}
.sg-st-pending i{background:var(--brand)}
.sg-st-closed i{background:var(--ink)}
@keyframes sg-pulse{0%{box-shadow:0 0 0 0 var(--up-bg)}70%{box-shadow:0 0 0 7px transparent}100%{box-shadow:0 0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){.sg-st-live i{animation:none}}

/* ---------- stats strip ---------- */
.sg-stats{display:grid;grid-template-columns:repeat(6,1fr);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.sg-stat{display:flex;flex-direction:column;gap:4px;padding:18px 20px;min-width:0;border-left:1px solid var(--hair)}
.sg-stat:first-child{border-left:0}
.sg-stat-k{font:600 .7rem/1.3 var(--ff);letter-spacing:.07em;text-transform:uppercase;color:var(--faint)}
.sg-stat b{font:600 1.65rem/1.15 var(--fm);color:var(--ink);letter-spacing:-.02em}
.sg-stat b.up{color:var(--up)}.sg-stat b.dn{color:var(--dn)}
.sg-stat small{color:var(--muted);font-size:.76rem;line-height:1.4}
.sg-since{margin:12px 2px 0;color:var(--muted);font-size:.86rem}
@media (max-width:1000px){.sg-stats{grid-template-columns:repeat(3,1fr)}.sg-stat:nth-child(4){border-left:0}.sg-stat:nth-child(n+4){border-top:1px solid var(--hair)}}
@media (max-width:560px){.sg-stats{grid-template-columns:repeat(2,1fr)}.sg-stat{padding:14px 16px}.sg-stat:nth-child(odd){border-left:0}.sg-stat:nth-child(n+3){border-top:1px solid var(--hair)}.sg-stat:nth-child(3){border-left:0}.sg-stat:nth-child(4){border-left:1px solid var(--hair)}.sg-stat b{font-size:1.4rem}}

/* ---------- tabs and filters ---------- */
.sg-board{margin-top:44px}
.sg-tabs{display:flex;gap:4px;padding:4px;width:fit-content;max-width:100%;overflow-x:auto;background:var(--hair);border-radius:12px;scrollbar-width:none}
.sg-tabs::-webkit-scrollbar{display:none}
.sg-tab{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:9px;color:var(--muted);font:600 .92rem/1 var(--ff);white-space:nowrap;text-decoration:none}
.sg-tab:hover{color:var(--ink)}
.sg-tab[aria-selected=true]{background:var(--surface);color:var(--ink);box-shadow:0 1px 2px #1013181a}
.sg-n{font:600 .74rem/1 var(--fm);color:var(--faint);background:var(--hair);border-radius:999px;padding:3px 7px}
.sg-tab[aria-selected=true] .sg-n{background:var(--brand-soft);color:var(--ink)}
.sg-filters{display:flex;flex-wrap:wrap;gap:12px 14px;margin:20px 0 22px}
.sg-filters label{display:grid;gap:5px;font:600 .7rem/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.sg-filters select,.sg-fields select,.sg-fields input{height:40px;min-width:150px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font:500 .9rem/1 var(--ff);text-transform:none;letter-spacing:0}
.sg-filters [hidden]{display:none}

/* ---------- cards ---------- */
.sg-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:var(--sg-gap)}
.sg-card{position:relative;display:flex;flex-direction:column;gap:14px;padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);transition:border-color .18s ease}
/* The lift, shadow and press come from motion.css section 8 (pointer devices, no reduced motion), like every other card. */
.sg-card:hover{border-color:var(--faint)}
.sg-card-a{position:absolute;inset:0;z-index:1;border-radius:inherit}
.sg-card-h{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.sg-sym{display:flex;align-items:center;gap:11px;min-width:0}
.sg-sym-t{display:grid;gap:2px;min-width:0}
.sg-sym-t strong{font:700 1.05rem/1.2 var(--fh);color:var(--ink);letter-spacing:-.01em}
.sg-sub{font-size:.76rem;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sg-head-r{flex:none;padding-top:3px}
.sg-order-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:-4px}
.sg-order{font:600 .86rem/1 var(--ff);color:var(--ink)}
.sg-res{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:baseline;padding:12px 14px;border-radius:12px;background:var(--hair)}
.sg-res strong{font:600 1.55rem/1.1 var(--fm);letter-spacing:-.02em;color:var(--ink)}
.sg-res.up strong{color:var(--up)}.sg-res.dn strong{color:var(--dn)}
.sg-res span{font:500 .8rem/1.2 var(--fm);color:var(--muted)}
.sg-res em{grid-column:1/-1;font-style:normal;font-size:.8rem;color:var(--muted)}
.sg-res .sg-none{font:700 1.05rem/1.2 var(--fh);color:var(--muted)}
.is-win .sg-res{background:var(--up-bg)}.is-loss .sg-res{background:var(--dn-bg)}
.sg-lv{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin:0}
.sg-lv>div:nth-child(-n+2){grid-column:span 3}
.sg-lv>div:nth-child(n+3){grid-column:span 2}
.sg-lv>div{display:grid;gap:4px;min-width:0;padding:8px 8px 9px;border-radius:9px;background:var(--hair)}
.sg-lv dt{display:flex;align-items:center;gap:3px;font:600 .62rem/1 var(--ff);letter-spacing:.05em;text-transform:uppercase;color:var(--faint);white-space:nowrap}
.sg-lv dd{margin:0;font:500 .82rem/1.2 var(--fm);color:var(--ink);overflow:hidden;text-overflow:ellipsis;letter-spacing:-.02em}
.sg-lv-tp.is-hit{background:var(--up-bg)}.sg-lv-tp.is-hit dt{color:var(--up)}
.sg-lv-sl dd{color:var(--dn)}
.sg-prog{position:relative;height:8px;border-radius:99px;background:var(--hair)}
.sg-prog-sl,.sg-prog-tp{position:absolute;top:0;bottom:0}
.sg-prog-sl{left:0;border-radius:99px 0 0 99px;background:var(--dn-bg)}
.sg-prog-tp{border-radius:0 99px 99px 0;background:var(--up-bg)}
.sg-tk{position:absolute;top:-3px;width:2px;height:14px;margin-left:-1px;border-radius:2px;background:var(--faint);opacity:.7}
.sg-tk.is-hit{background:var(--up);opacity:1}
.sg-dot{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--surface);border:3px solid var(--ink);box-sizing:border-box}
.sg-prog-l{display:flex;justify-content:space-between;gap:8px;margin-top:-6px;font:600 .66rem/1 var(--ff);letter-spacing:.05em;text-transform:uppercase;color:var(--faint)}
.sg-now{font:500 .74rem/1 var(--fm);letter-spacing:0;text-transform:none;color:var(--muted)}
.sg-card-f{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:auto;padding-top:2px}
.sg-age{margin-left:auto;font-size:.76rem;color:var(--faint)}
.sg-empty{grid-column:1/-1;display:grid;justify-items:center;gap:6px;padding:56px 20px;text-align:center;color:var(--muted);background:var(--surface);border:1px dashed var(--line);border-radius:var(--r)}
.sg-empty svg{color:var(--faint);margin-bottom:6px}
.sg-empty h3{margin:0;font:700 1.1rem/1.3 var(--fh);color:var(--ink)}
.sg-empty p{margin:0;max-width:46ch;font-size:.92rem;line-height:1.6}
.sg-empty-s{padding:28px 16px}

/* ---------- loading the board (signals.js) ----------
   #sgList is a .mo-busy box (motion.css: dimmed + progress bar while aria-busy="true"). After a moment the stale cards give
   way to placeholder cards cloned from <template id="sgSk">; those keep full strength, the bar stays. Placeholders are the
   real card boxes with invisible text, so they take the real height. The .sk primitives are inline on this page. */
.sg-list.is-sk[aria-busy=true]{opacity:1}
.sg-list>.sg-empty{align-content:center} /* a failed load keeps the list's height (inline min-height): centre the message in it */
.sg-card-sk{pointer-events:none;box-shadow:none}
.sg-card-sk .sk{color:transparent;background:var(--sk-base)}
.sg-card-sk .sk *{visibility:hidden}
.sg-sk-ico{flex:none;width:30px;height:30px}
.sg-empty-sk .sg-sk-em{width:40px;height:40px;margin-bottom:6px}

/* ---------- track record ---------- */
.sg-record,.sg-how{margin-top:64px}
.sg-panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:var(--sg-pad)}
.sg-h3{margin:0 0 12px;font:700 1rem/1.3 var(--fh);color:var(--ink);letter-spacing:-.01em}
.sg-rec-top{margin-bottom:var(--sg-gap)}
.sg-rec-grid{align-items:start;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sg-gap)}
@media (max-width:860px){.sg-rec-grid{grid-template-columns:minmax(0,1fr)}}
.sg-tbl-w{overflow-x:auto}
.sg-tbl{width:100%;border-collapse:collapse;font-size:.88rem}
.sg-tbl th,.sg-tbl td{padding:10px 8px;text-align:left;border-top:1px solid var(--hair);font-weight:500}
.sg-tbl thead th{border-top:0;padding-top:0;font:600 .68rem/1.2 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.sg-tbl tbody th{font-weight:600;color:var(--ink)}
.sg-tbl .n{text-align:right;font-family:var(--fm);font-size:.84rem;white-space:nowrap}
.sg-need{color:var(--faint);font:500 .8rem/1.2 var(--ff)!important}
.sg-curve{display:block;width:100%;height:auto;max-height:260px}
.sg-curve .sg-zero{stroke:var(--line);stroke-dasharray:3 4}
.sg-curve .sg-line,.sg-curve.sg-up .sg-line,.sg-curve.sg-dn .sg-line{fill:none!important;stroke:var(--ink);stroke-width:2;stroke-linejoin:round}
.sg-curve .sg-area{fill:var(--hair);opacity:.7}
.sg-curve.sg-up .sg-area{fill:var(--up-bg);opacity:1}.sg-curve.sg-dn .sg-area{fill:var(--dn-bg);opacity:1}
.sg-curve.sg-up .sg-line,.sg-curve.sg-up .sg-end{stroke:var(--up);fill:var(--up)}
.sg-curve.sg-dn .sg-line,.sg-curve.sg-dn .sg-end{stroke:var(--dn);fill:var(--dn)}
.sg-curve .sg-end{stroke:none}
.sg-ax{font:500 11px var(--fm);fill:var(--faint)}
/* Draw-in, once: signals.js sets --len (the line's length) and .sg-draw on a curve that starts below the fold, then
   .sg-draw-in when it is scrolled to. Without JS or with reduced motion the curve is simply there. */
@media (prefers-reduced-motion:no-preference){
  .sg-curve.sg-draw .sg-line{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 1.3s var(--ease-io,ease-in-out) .2s}
  .sg-curve.sg-draw-in .sg-line{stroke-dashoffset:0}
  .sg-curve.sg-draw .sg-area{transition:opacity .8s ease .7s}
  .sg-curve.sg-draw .sg-end{transition:opacity .3s ease 1.4s,scale .45s var(--ease-out,ease-out) 1.4s;transform-box:fill-box;transform-origin:center}
  .sg-curve.sg-draw:not(.sg-draw-in) :is(.sg-area,.sg-end){opacity:0}
  .sg-curve.sg-draw:not(.sg-draw-in) .sg-end{scale:.2}
}

/* ---------- how it works + disclaimer ---------- */
.sg-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sg-gap);list-style:none;margin:0 0 18px;padding:0}
@media (max-width:860px){.sg-steps{grid-template-columns:minmax(0,1fr)}}
.sg-steps li{padding:var(--sg-pad);background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.sg-step-n{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--brand-soft);color:var(--ink);font:700 .85rem/1 var(--fm)}
.sg-steps h3{margin:12px 0 6px;font:700 1rem/1.3 var(--fh)}
.sg-steps p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.6}
.sg-disc{display:flex;gap:12px;align-items:flex-start;margin:40px 0 0;padding:16px 18px;border-radius:var(--r);background:var(--hair);color:var(--muted)}
.sg-disc svg{flex:none;margin-top:1px;color:var(--faint)}
.sg-disc p{margin:0;font-size:.86rem;line-height:1.65}
.sg-disc strong{color:var(--ink)}
.sg-disc a{color:var(--brand-strong);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* ---------- detail: banner ---------- */
.sg-banner{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 28px;padding:clamp(18px,2.6vw,28px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);margin-bottom:var(--sg-gap)}
.sg-bn-main{display:grid;gap:12px;min-width:0}
.sg-bn-tags{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0}
.sg-banner .sg-h1{display:flex;align-items:center;gap:12px;margin:0}
.sg-banner .sg-h1 em{font-style:normal;font-weight:600;color:var(--muted)}
.sg-bn-meta{display:flex;flex-wrap:wrap;gap:4px 0;margin:0;color:var(--muted);font-size:.88rem}
.sg-bn-meta span+span::before{content:"";display:inline-block;width:3px;height:3px;border-radius:50%;background:var(--faint);margin:0 10px;vertical-align:middle}
.sg-bn-r{display:flex;align-items:flex-end;gap:28px;flex-wrap:wrap}
.sg-big{display:grid;gap:3px}
.sg-big strong{font:600 clamp(1.9rem,4vw,2.6rem)/1 var(--fm);letter-spacing:-.03em;color:var(--ink)}
.sg-big.up strong{color:var(--up)}.sg-big.dn strong{color:var(--dn)}
.sg-big .sg-none{font:700 1.3rem/1.2 var(--fh);color:var(--ink);letter-spacing:-.01em}
.sg-big span{font-size:.82rem;color:var(--muted)}
.sg-px{display:grid;gap:3px;text-align:right}
.sg-px span{font:600 .68rem/1 var(--ff);letter-spacing:.07em;text-transform:uppercase;color:var(--faint)}
.sg-px b{font:600 1.45rem/1 var(--fm);letter-spacing:-.02em}
.sg-px b.tick-up{color:var(--up)}.sg-px b.tick-dn{color:var(--dn)}

/* ---------- detail: layout ---------- */
.sg-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sg-gap)}
.sg-col{display:contents}
.sg-col>.o1{order:1}.sg-col>.o2{order:2}.sg-col>.o3{order:3}.sg-col>.o4{order:4}.sg-col>.o5{order:5}.sg-col>.o6{order:6}.sg-col>.o7{order:7}.sg-col>.o8{order:8}.sg-col>.o9{order:9}.sg-col>.o10{order:10}.sg-col>.o11{order:11}
@media (min-width:1040px){
  .sg-grid{grid-template-columns:minmax(0,1fr) 360px;align-items:start}
  .sg-col{display:grid;gap:var(--sg-gap);min-width:0}
  .sg-col-b{position:sticky;top:84px}
}
.sg-chart{border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;background:var(--surface)}
.sg-chart .card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px}
.sg-chart .card-h h2{margin:0;font:700 1rem/1.3 var(--fh)}
.sg-chart-note{font-size:.78rem;color:var(--faint);text-align:right}
.sg-noscript{padding:12px 16px;color:var(--muted)}
.sg-sec{padding:var(--sg-pad);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.sg-sec p{line-height:1.7}
.sg-h2{margin:0 0 12px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font:700 1.08rem/1.3 var(--fh);color:var(--ink);letter-spacing:-.015em}
.sg-lvl{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;margin:0}
.sg-lvl>div{display:grid;gap:4px;padding:11px 13px;border-radius:10px;background:var(--hair)}
.sg-lvl dt{font:600 .68rem/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.sg-lvl dd{margin:0;font:600 1.02rem/1.25 var(--fm);color:var(--ink)}
.sg-lvl dd small{display:block;margin-top:2px;font:400 .74rem/1.4 var(--ff);color:var(--muted)}
.sg-lvl .dn dd{color:var(--dn)}
.sg-lvl .up.is-hit{background:var(--up-bg)}.sg-lvl .up.is-hit dd{color:var(--up)}
.sg-reason{margin:0;font-size:1.02rem;color:var(--ink)}
.sg-basis{display:grid;gap:8px;margin:14px 0 0}
.sg-basis-i{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.86rem}
.sg-more{margin-top:14px;border-top:1px solid var(--hair);padding-top:12px}
.sg-more summary{cursor:pointer;font:600 .9rem/1.4 var(--ff);color:var(--ink)}
.sg-more p{margin:10px 0 0;color:var(--muted);font-size:.9rem}
.sg-tl{list-style:none;margin:0;padding:0 0 0 18px;border-left:2px solid var(--hair);display:grid;gap:14px}
.sg-tl li{position:relative;display:grid;gap:2px}
.sg-tl li::before{content:"";position:absolute;left:-24px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--surface);border:2px solid var(--faint)}
.sg-tl-filled::before,.sg-tl-closed::before{border-color:var(--ink)!important;background:var(--ink)!important}
.sg-tl-tp1::before,.sg-tl-tp2::before,.sg-tl-tp3::before{border-color:var(--up)!important;background:var(--up)!important}
.sg-tl-reason,.sg-tl-confidence{opacity:.7}
.sg-tl time{font:500 .74rem/1.3 var(--fm);color:var(--faint)}
.sg-tl-t{font-size:.92rem;color:var(--ink)}
.sg-tl-t b{font-family:var(--fm);font-weight:600;margin-left:4px}
.sg-tl-t small{color:var(--muted);margin-left:6px}
.sg-bracket p{margin:0 0 8px}
.sg-review{border-color:var(--dn);border-color:color-mix(in srgb,var(--dn) 35%,var(--line))}
.sg-review .sg-rv-sum{margin:0 0 18px;font-size:1.04rem;color:var(--ink)}
.sg-rv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:640px){.sg-rv-grid{grid-template-columns:minmax(0,1fr)}}
.sg-review h3{margin:0 0 6px;font:650 .74rem/1.2 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.sg-review p{margin:0;color:var(--muted);font-size:.92rem}
.sg-rv-check{margin:16px 0;padding:14px 16px;border-radius:12px;background:var(--hair)}
.sg-rv-check strong{display:block;margin-bottom:4px;color:var(--ink)}
.sg-rv-check.broke{background:var(--dn-bg)}.sg-rv-check.held{background:var(--up-bg)}
.sg-rv-ev{margin:0 0 4px;padding-left:18px;color:var(--muted);font-size:.9rem;line-height:1.65}
.sg-lesson{margin:14px 0 0!important;padding-top:14px;border-top:1px solid var(--hair);color:var(--ink)!important}
.sg-hash{display:grid;gap:10px;margin:14px 0 0}
.sg-hash dt{font:600 .68rem/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin-bottom:5px}
.sg-hash dd{margin:0;font:500 .78rem/1.5 var(--fm);color:var(--ink);word-break:break-all;padding:9px 11px;border-radius:9px;background:var(--hair)}
.sg-payload{margin:10px 0 0;padding:12px;border-radius:10px;background:var(--hair);font:400 .74rem/1.6 var(--fm);color:var(--ink);white-space:pre-wrap;word-break:break-all;max-height:240px;overflow:auto}
.sg-verify{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:16px 0 0}
#sgVerifyOut{font-size:.9rem;font-weight:600}
#sgVerifyOut.ok{color:var(--up)}#sgVerifyOut.bad{color:var(--dn)}
.sg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 16px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font:600 .88rem/1 var(--ff);cursor:pointer;transition:background .15s,border-color .15s}
.sg-btn:hover{border-color:var(--faint);background:var(--hair)}
.sg-btn-pri{background:var(--brand);border-color:var(--brand);color:var(--brand-on)}
.sg-btn-pri:hover{background:var(--brand2);border-color:var(--brand2)}

/* ---------- detail: side panels ---------- */
.sg-panel .sg-h2{margin-bottom:6px}
.sg-cp{list-style:none;margin:14px 0;padding:0;display:grid}
.sg-cp-row{display:grid;grid-template-columns:76px 1fr auto;align-items:center;gap:8px;padding:8px 0;border-top:1px solid var(--hair)}
.sg-cp-row:first-child{border-top:0}
.sg-cp-k{font:600 .7rem/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.sg-cp-v{font:600 .98rem/1.2 var(--fm);color:var(--ink);overflow-wrap:anywhere}
.sg-copy{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 11px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--muted);font:600 .76rem/1 var(--ff);cursor:pointer}
.sg-copy:hover{color:var(--ink);border-color:var(--faint)}
.sg-copy-i{width:13px;height:13px;border:1.5px solid currentColor;border-radius:3px;position:relative;flex:none}
.sg-copy-i::after{content:"";position:absolute;left:3px;top:-5px;width:11px;height:11px;border:1.5px solid currentColor;border-radius:3px;border-left:0;border-bottom:0;opacity:.0}
.sg-copy.is-done{color:var(--up);border-color:var(--up)}
.sg-copy.is-done .sg-copy-i{border:0;border-radius:0}
.sg-copy.is-done .sg-copy-i::before{content:"";position:absolute;left:2px;top:1px;width:8px;height:4px;border:2px solid currentColor;border-top:0;border-right:0;transform:rotate(-45deg)}
.sg-copyall{width:100%}
.sg-live{min-height:1.2em;margin:10px 0 0;font-size:.82rem;font-weight:600;color:var(--up)}
.sg-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}
.sg-fields label{display:grid;gap:5px;font:600 .68rem/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.sg-fields select,.sg-fields input{min-width:0;width:100%;font-family:var(--fm);text-transform:none;letter-spacing:0}
.sg-calc-out{display:grid;gap:3px;margin:0;padding:14px;border-radius:12px;background:var(--hair)}
.sg-calc-lots{font-size:.9rem;color:var(--muted)}
.sg-calc-lots b{font:600 1.7rem/1.1 var(--fm);color:var(--ink);letter-spacing:-.02em;margin-right:4px}
#sgCalcSub{font-size:.8rem;color:var(--muted);line-height:1.5}
.sg-conf-row{display:flex;align-items:center;gap:16px;margin:12px 0}
.sg-conf-row p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.55}
.sg-ring{--p:50;--sg-arc:var(--p);flex:none;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:conic-gradient(var(--ink) calc(var(--sg-arc)*1%),var(--hair) 0)}
/* The arc sweeps in once when the ring is scrolled to (signals.js: .sg-ring-wait while below the fold, then .sg-ring-in).
   --sg-arc is registered so the gradient stop can transition; browsers without @property just show the final arc. */
@property --sg-arc{syntax:'<number>';inherits:false;initial-value:0}
@media (prefers-reduced-motion:no-preference){
  .sg-ring.sg-ring-wait{--sg-arc:0}
  .sg-ring.sg-ring-in{transition:--sg-arc 1s var(--ease-out,ease-out)}
}
.sg-ring b{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;background:var(--surface);font:600 1.15rem/1 var(--fm)}
.sg-cal{margin:0 0 4px;padding:12px 14px;border-radius:10px;background:var(--hair);font-size:.88rem;line-height:1.55;color:var(--ink)}
.sg-links{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:2px}
.sg-links a{display:block;padding:9px 0;color:var(--brand-strong);font-weight:600;font-size:.92rem}
.sg-links a:hover{text-decoration:underline;text-underline-offset:3px}

/* ---------- chart card placeholders ----------
   signals.php prints .fc-skb pieces in the toolbar, drawing rail, footer and playback bar, sized like chart.js's buttons
   (fine and coarse pointers), so the card reads as loading and keeps its height; chart.js empties each bar as it builds
   it. If the chart never comes (engine or data failed: .fc-wrap.is-empty), they disappear rather than shimmer on. */
.sg-chart .fc-skb{flex:none;width:var(--w,30px);height:30px;border-radius:7px}
.sg-chart .fc-rail>.fc-skb{width:34px;height:34px}
.sg-chart .fc-skb-tz{width:92px;height:26px}
.sg-chart .fc-skb-main{width:36px;height:36px;border-radius:50%}
.sg-chart .fc-skb-track{display:flex;align-items:center}
.sg-chart .fc-skb-track>.sk{width:100%;height:6px;border-radius:99px}
.sg-chart .fc-rp-time .sk-t{vertical-align:middle}
@media (pointer:coarse){
  .sg-chart .fc-bar>.fc-skb{height:36px}
  .sg-chart .fc-skb-tz{height:34px}
  .sg-chart .fc-replay>.fc-skb{height:40px}
  .sg-chart .fc-replay>.fc-skb-main{width:44px;height:44px}
}
.sg-chart:has(.fc-wrap.is-empty) :is(.fc-skb,.fc-skb-track,.fc-rp-time>.sk,.fc-rp-lab.sk){visibility:hidden}

/* ---------- playback bar (chart.js fills .fc-replay) ---------- */
.fc-replay{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding:10px 14px;border-top:1px solid var(--hair);background:var(--surface)}
.fc-replay[hidden]{display:none}
.fc-rp-lab{font:600 .7rem/1 var(--ff);letter-spacing:.07em;text-transform:uppercase;color:var(--faint);margin-right:4px}
.fc-rp-main{background:var(--brand)!important;color:var(--brand-on)!important;border-radius:50%!important;width:36px;height:36px;padding:0}
.fc-rp-main:hover{background:var(--brand2)!important}
.fc-rp-main svg{width:16px;height:16px}
.fc-rp-scrub{flex:1 1 180px;min-width:120px;height:28px;accent-color:var(--ink);cursor:pointer}
.fc-rp-time{min-width:112px;font:500 .78rem/1 var(--fm);color:var(--muted);text-align:right}
.fc-rp-speed .fc-tb{font:600 .78rem/1 var(--fm)}
.fc-rp-full{height:32px;font-size:.78rem}
@media (max-width:720px){
  .fc-replay{padding:10px 12px}
  .fc-rp-lab{display:none}
  .fc-rp-scrub{order:9;flex:1 1 100%}
  .fc-rp-time{order:8;margin-left:auto}
}
@media (pointer:coarse){.fc-replay .fc-tb{height:40px;min-width:40px}.fc-rp-main{width:44px!important;height:44px!important}}

@media (max-width:640px){
  .sg-banner{align-items:stretch}
  .sg-bn-r{justify-content:space-between;width:100%;padding-top:14px;border-top:1px solid var(--hair)}
  .sg-cp-row{grid-template-columns:70px 1fr auto}
  .sg-chart .card-h{flex-direction:column;align-items:flex-start;gap:4px}
  .sg-chart-note{text-align:left}
}
.sg-prelaunch-note{max-width:62ch;margin:12px 0 0;padding:10px 14px;border-radius:10px;background:var(--hair);font:400 .86rem/1.5 var(--ff);color:var(--muted)}
.sg-prelaunch-note b{color:var(--ink);font-weight:600}

/* ---------- strategies + AI desk log ---------- */
.sg-strats,.sg-deskl{margin-top:64px}
.sg-strats-lede{max-width:70ch;margin:-4px 0 20px;line-height:1.65}
.sg-strat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:var(--sg-gap);align-items:stretch}
.sg-strat{display:flex;flex-direction:column;gap:14px;min-width:0;padding:var(--sg-pad);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.sg-strat header{display:grid;gap:6px;justify-items:start}
.sg-strat h3{margin:0;font:700 1.15rem/1.25 var(--fh);letter-spacing:-.015em;color:var(--ink)}
.sg-strat-meta{margin:0;font-size:.82rem;color:var(--faint)}
.sg-chip-ai{background:var(--brand-soft);color:var(--ink)}
.sg-strat-about{margin:0;font-size:.9rem;line-height:1.65;color:var(--muted)}
.sg-strat-bt{display:grid;gap:10px;padding:14px;border-radius:calc(var(--r) - 4px);background:var(--hair)}
.sg-strat-bt h4{margin:0;font:700 .72rem/1.3 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.sg-strat-bt h4 small{display:block;margin-top:2px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--faint);font-size:.78rem}
.sg-strat-bt p{margin:0}
.sg-tbl-bt{font-size:.84rem}
.sg-tbl-bt th,.sg-tbl-bt td{padding:8px 3px}
.sg-tbl-bt .n{font-size:.78rem}
.sg-tbl-bt tbody th{font-size:.8rem}
.sg-tbl-bt tbody th{white-space:nowrap}
.sg-strat-nums{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:.86rem;color:var(--muted)}
.sg-strat-nums b{font-family:var(--fm);color:var(--ink)}
.sg-strat-cav{font-size:.84rem;line-height:1.6;color:var(--muted)}
.sg-strat-cav strong{color:var(--ink)}
.sg-strat-live{margin-top:auto;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 16px;padding-top:14px;border-top:1px solid var(--hair)}
.sg-strat-live p{margin:4px 0 0;font-size:.92rem}
.sg-strat-live b{font-family:var(--fm)}
.sg-link{font-weight:600;font-size:.88rem;color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line)}
.sg-link:hover{text-decoration-color:currentColor}

.sg-desk{list-style:none;margin:0;padding:0}
.sg-desk-i{display:grid;grid-template-columns:130px 130px minmax(0,1fr) 110px;gap:6px 16px;align-items:start;padding:12px 0;border-top:1px solid var(--hair)}
.sg-desk-i:first-child{border-top:0;padding-top:0}
.sg-desk-t{display:grid;gap:1px;font-size:.82rem;color:var(--ink);font-family:var(--fm)}
.sg-desk-t span{color:var(--faint);font-family:var(--ff);font-size:.76rem}
.sg-desk-s{display:flex;align-items:center;gap:8px;font-size:.9rem}
.sg-desk-b strong{font-size:.9rem;color:var(--ink)}
.sg-desk-b strong a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.sg-desk-b p{margin:3px 0 0;font-size:.84rem;line-height:1.55;color:var(--muted)}
.sg-desk-m{text-align:right;font-size:.74rem;color:var(--faint)}
.is-pub .sg-desk-b strong{color:var(--up)}
.is-rej .sg-desk-b strong{color:var(--dn)}
.is-err .sg-desk-b strong,.is-skip .sg-desk-b strong{color:var(--muted);font-weight:600}
@media (max-width:760px){
  .sg-desk-i{grid-template-columns:minmax(0,1fr) auto}
  .sg-desk-t{grid-column:1;grid-row:1;display:flex;gap:8px;align-items:baseline}
  .sg-desk-s{grid-column:2;grid-row:1}
  .sg-desk-b{grid-column:1/-1}
  .sg-desk-m{grid-column:1/-1;text-align:left}
}

/* ---------- small screens: tables scroll inside their card, curve keeps a real height ---------- */
.sg-curve-m{display:none}
.sg-panel{min-width:0}
.sg-tbl-w{max-width:100%;-webkit-overflow-scrolling:touch}
@media (max-width:560px){
  .sg-curve-d{display:none}
  .sg-curve-m{display:block;max-height:none}
  .sg-tbl{font-size:.82rem}
  .sg-tbl th,.sg-tbl td{padding:9px 4px}
  .sg-tbl thead th{font-size:.6rem;letter-spacing:.03em;vertical-align:bottom}
  .sg-tbl .n{font-size:.78rem}
  .sg-tbl .sg-need{white-space:normal;font-size:.72rem!important;line-height:1.3}
  .sg-tbl-w .sg-tbl-bt{min-width:0}
  .sg-tbl tbody th:first-child,.sg-tbl thead th:first-child{position:sticky;left:0;background:var(--surface)}
  .sg-strat-bt .sg-tbl tbody th:first-child,.sg-strat-bt .sg-tbl thead th:first-child{background:var(--hair)}
}

/* ---------- "Open in your platform" panel (inc/signals-apps.php), in a .sg-panel card under the copy panel ----------
   From the panel's own sheet (scratchpad sg-apps.css), with the heading set like the other panel headings (.sg-h2) and
   the hover like .sg-btn. The lift and press come from motion.css section 8h; the items reveal via motion.js. */
.sg-apps{display:grid;gap:12px}
.sg-apps-h{margin:0;font:700 1.08rem/1.3 var(--fh);color:var(--ink);letter-spacing:-.015em}
.sg-apps-l{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.sg-app{display:grid;gap:4px}
.sg-app-a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 16px;border:1px solid var(--line);border-radius:10px;background:var(--raised);color:var(--ink);font:600 .9rem/1.2 var(--ff);text-align:center;text-decoration:none;cursor:pointer;transition:border-color .15s,background .15s}
.sg-app-a:hover{border-color:var(--faint);background:var(--hair)}
.sg-app-a:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.sg-app-a.is-done{border-color:var(--up);color:var(--up)}
.sg-app-n{margin:0;font-size:.76rem;line-height:1.45;color:var(--faint)}

/* ---------- type of trading (2026-11-06): chips in the filter form, a badge on cards and strategy cards ---------- */
.sg-types{flex-basis:100%;min-width:0;margin:0;padding:0;border:0}
.sg-types legend{padding:0;margin-bottom:8px;font:600 .7rem/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.sg-types-row{display:flex;flex-wrap:wrap;gap:8px}
.sg-filters .sg-type{position:relative;display:inline-flex;gap:0;font:600 .88rem/1 var(--ff);letter-spacing:0;text-transform:none;color:var(--muted);cursor:pointer}
.sg-type input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.sg-type span{display:inline-flex;align-items:center;min-height:38px;padding:0 15px;border:1px solid var(--line);border-radius:999px;background:var(--surface);transition:border-color .15s,background .15s,color .15s}
.sg-type:hover span{border-color:var(--faint);color:var(--ink)}
.sg-type input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.sg-type input:focus-visible+span{outline:2px solid var(--brand);outline-offset:2px}
.sg-type-about{margin:8px 0 0;font-size:.82rem;line-height:1.45;color:var(--muted);min-height:1.45em}
.sg-style{background:transparent;border:1px solid var(--line);color:var(--ink)}
.sg-order-row .sg-style{margin-left:auto}
.sg-strat-chips{display:flex;flex-wrap:wrap;gap:6px}
.sg-strat-type{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:28px 0 14px;font:700 1.08rem/1.3 var(--fh);color:var(--ink)}
.sg-strat-type:first-of-type{margin-top:4px}
.sg-strat-type small{font:400 .85rem/1.45 var(--ff);color:var(--muted)}
.sg-desk-k{margin-left:2px;font-size:.74rem;color:var(--faint)}
.sg-style-l{color:inherit;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.sg-style-l:hover{text-decoration-color:currentColor}

/* ---------- risk tag (2026-11-06): Cautious / High Risk chips, the risk panel on a signal page ----------
   Orange and blue, so they never read as the green/red of direction and results. */
.sg-body{--sg-hi:#a8420a;--sg-hi-bg:#f9731619;--sg-hi-dot:#ea580c;--sg-lo:#2b5a86;--sg-lo-bg:#3b82f615;--sg-lo-dot:#3b82f6}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .sg-body{--sg-hi:#fdba74;--sg-hi-bg:#fb923c24;--sg-hi-dot:#fb923c;--sg-lo:#9cc8fb;--sg-lo-bg:#60a5fa1f;--sg-lo-dot:#60a5fa}}
:root[data-theme=dark] .sg-body{--sg-hi:#fdba74;--sg-hi-bg:#fb923c24;--sg-hi-dot:#fb923c;--sg-lo:#9cc8fb;--sg-lo-bg:#60a5fa1f;--sg-lo-dot:#60a5fa}
.sg-risk{gap:6px}
.sg-risk i{width:7px;height:7px;border-radius:50%;flex:none;background:currentColor}
.sg-risk-high{background:var(--sg-hi-bg);color:var(--sg-hi)}
.sg-risk-high i{background:var(--sg-hi-dot)}
.sg-risk-cautious{background:var(--sg-lo-bg);color:var(--sg-lo)}
.sg-risk-cautious i{background:var(--sg-lo-dot)}
.sg-risk-each{background:transparent;box-shadow:inset 0 0 0 1px var(--line)}
.sg-order-row .sg-risk{margin-left:auto}
.sg-order-row .sg-risk+.sg-style{margin-left:0}
.sg-bn-tags .sg-risk{font-size:.74rem}
.sg-riskp .sg-h2{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}
.sg-rk{display:grid;gap:12px;list-style:none;margin:14px 0 0;padding:0}
.sg-rk li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:start}
.sg-rk strong{display:block;font:650 .86rem/1.35 var(--ff);color:var(--ink)}
.sg-rk p{margin:2px 0 0;font-size:.85rem;line-height:1.5;color:var(--muted)}
.sg-rk-i{display:grid;place-items:center;width:22px;height:22px;margin-top:1px;border-radius:50%;background:var(--hair);color:var(--muted);font:700 .74rem/1 var(--ff)}
.sg-rk-i::before{content:"\2713"}
.sg-rk .is-flag .sg-rk-i{background:var(--sg-hi-bg);color:var(--sg-hi)}
.sg-rk .is-flag .sg-rk-i::before{content:"!"}

/* ---------- live updates (2026-11-06): the hub and signal pages update themselves; this marks what just changed ---------- */
.sg-auto{display:inline-flex;align-items:center;gap:7px;margin:12px 0 0 4px;font:600 .74rem/1.3 var(--ff);letter-spacing:.02em;color:var(--muted)}
.sg-auto i{width:7px;height:7px;border-radius:50%;flex:none;background:var(--up);animation:sg-pulse 2s ease-out infinite}
.sg-auto.is-off i{background:var(--faint);animation:none}
.sg-card.sg-new{animation:sg-new 4s ease-out}
@keyframes sg-new{0%,35%{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft),var(--shadow)}}
.sg-upd{animation:sg-upd 2.6s ease-out}
@keyframes sg-upd{0%,30%{box-shadow:0 0 0 3px var(--brand-soft),var(--shadow)}}
.sg-stat.sg-chg b{animation:sg-chg 1.8s ease-out;border-radius:6px}
@keyframes sg-chg{0%,30%{background:var(--brand-soft)}100%{background:transparent}}
@media (prefers-reduced-motion:reduce){.sg-auto i,.sg-card.sg-new,.sg-upd,.sg-stat.sg-chg b{animation:none}}