/* Reference-led Coral Reef: the highlighted left rail is intelligence, not an order book. */
.cr-grid{grid-template-columns:minmax(210px,.72fr) minmax(0,1.28fr);gap:16px}
.cr-intel,.cr-ticket{padding:16px;border-radius:14px}
.cr-intel{background:linear-gradient(180deg,#062236,var(--panel));gap:16px}
.cr-intel .cr-sethead{flex-wrap:wrap;overflow-wrap:anywhere}
.cr-intel .cr-sethead b{font-size:12px}
.cr-intel .cr-steps{justify-content:center}
.cr-intel .cr-h{font-size:12px;color:var(--tide)}
.cr-intel .cr-h .note{font-size:12px}
.cr-intel .cr-reads .mic-cs{grid-template-columns:repeat(2,minmax(0,1fr))}
.cr-intel .cr-reads .mic-c small{font-size:12px;white-space:normal;text-align:center}
.cr-intel .mr{margin:0}
.cr-intel .mr-cs{grid-template-columns:repeat(2,minmax(0,1fr))}
.cr-intel .mr>summary{font-size:12px}
.cr-intel .lean-tf small{font-size:12px}
.cr-intel .cr-logo{filter:drop-shadow(0 0 6px var(--glow))}
.cr-calc{padding-bottom:12px;border-bottom:1px solid var(--line);min-width:0;overflow-wrap:anywhere}
.cr-ticket,.cr-ticket .ax{min-width:0;max-width:100%;overflow-wrap:anywhere}
.cr-ticket .ax>*,.cr-ticket .ax-lab{min-width:0;max-width:100%}
.cr-ticket .ax-lab{display:flex;flex-wrap:wrap;gap:6px}
.cr-ticket .itog{max-width:100%;display:flex}
.cr-ticket .itog button{min-width:0;padding:8px 10px}
.cr-ticket .ax-riskbox{flex-wrap:wrap;max-width:100%}
.cr-calc .rr-kv{grid-template-columns:repeat(2,minmax(0,1fr))}
.cr-calc .note{font-size:12px}
.cr-orb{width:150px;aspect-ratio:1;margin:12px auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:3px solid var(--tide);border-radius:50%;background:radial-gradient(circle at 35% 25%,#2277a0,#073551 60%,var(--panel));box-shadow:0 0 0 7px #80e2d412,0 0 25px #2fb9b14d,inset 0 0 30px #2fb9b122;animation:cr-breathe 2.8s ease-in-out infinite}
.cr-orb>span:last-child{font:500 12px var(--f-mono);color:var(--ink);text-align:center}
.cr-orb-badge{font:600 30px var(--f-mono);line-height:1;border:1px solid #80e2d466;background:#04182acc;color:var(--tide);border-radius:999px;padding:8px 16px}
.cr-orb-badge small{font-size:20px;color:var(--silver)}
@keyframes cr-breathe{0%,100%{box-shadow:0 0 0 5px #80e2d40d,0 0 18px #2fb9b13b,inset 0 0 24px #2fb9b11a}50%{box-shadow:0 0 0 10px #80e2d419,0 0 34px #2fb9b17a,inset 0 0 32px #2fb9b12b}}
.rr-reef{border-color:var(--tide);box-shadow:0 0 14px #2fb9b166;animation:cr-breathe 2.8s ease-in-out infinite}
.rr-reef:hover,.rr-reef:focus-visible{box-shadow:0 0 22px #2fb9b199;outline:2px solid var(--tide);outline-offset:3px}
.ax-portfolio{border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:12px 14px;margin-top:12px;display:grid;gap:8px}
.ax-portfolio .ax-top h3{font:600 14px var(--f-body);margin:0}
.ax-portfolio .ax-both{margin:0;border:0;padding:0}
.ax-portfolio .ax-dev{font-size:12px;margin:0}
.ax-portfolio .ax-both h4{font-size:12px;margin:4px 0}
.cr-ticket .ax-ctl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cr-ticket .ax-ctl .ax-lab:last-child{grid-column:1/-1}
@media(max-width:760px){.cr-grid{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:8px}.cr-intel,.cr-ticket{padding:10px}.cr-ticket{order:initial}.cr-ticket .ax-ctl{grid-template-columns:1fr}.cr-ticket .dgrid{grid-template-columns:1fr}.cr-orb{width:112px}.cr-orb-badge{font-size:24px;padding:7px 11px}.cr-intel .cr-steps{gap:2px}.cr-intel .cr-steps span{width:18px;height:20px}.cr-calc .rr-kv{grid-template-columns:1fr}.cr-intel .mr-cs{grid-template-columns:1fr}.cr-intel .cacts-m{right:auto;left:0}}
@media(max-width:350px){.cr-grid{grid-template-columns:1fr}.cr-intel .mr-cs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.cr-orb,.rr-reef{animation:none}}
/* right column: ticket + live R:R card under it (user 2026-10-20) */
.cr-right{display:flex;flex-direction:column;gap:12px;min-width:0;order:initial}
.cr-rr{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;display:grid;gap:10px;min-width:0;overflow-wrap:anywhere}
.cr-rr h3{margin:0;font:600 12px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cr-rr .rr-out{margin-top:0}
.cr-rr .rr-kv{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){.cr-rr{padding:10px;gap:8px}.cr-rr .rr-out{padding:10px}.cr-rr .rr-num{font-size:30px}.cr-rr .rr-gr{font-size:10px;letter-spacing:.04em;padding:3px 8px}.cr-rr .rr-kv{gap:6px 10px;margin-top:8px}.cr-rr .rr-kv dt{font-size:9px;letter-spacing:.06em}.cr-rr .rr-kv dd{font-size:12px}.cr-rr .rr-kv small{display:block;font-size:10px}.cr-rr .rr-foot{font-size:10px;margin-top:8px}}
/* Flush columns (user 2026-10-24: "make these sections flush, bring up the info on the left side"): the left column's
   reads sit tighter so they end higher, and the Risk : Reward panel stretches so both columns finish on one line. */
.cr-grid{align-items:stretch}
.cr-right{height:100%}
.cr-right>.cr-rr{flex:1 1 auto;align-content:start}
.cr-intel{gap:10px}
.cr-intel .ra{gap:6px;padding-top:8px}
.cr-intel .ra-d>summary{gap:2px;padding:2px}
.cr-intel .ra-lean{gap:4px}
.cr-intel .ra-lrow{gap:2px 6px}
@media(max-width:760px){
  .cr-intel{gap:8px}
  .cr-intel .ra-ring{width:84px;height:84px}
  .cr-intel .ra-chop,.cr-intel .ra-ltf{padding:4px 6px}
  .cr-intel .ra-lean .ra-h .note{display:block}
}
/* the reads start at the top and sit together (they used to be spread down the column) */
.cr-grid>.cr-intel>.ra{flex:0 0 auto;justify-content:flex-start;gap:10px;padding-top:10px}
.cr-grid>.cr-intel .ra-lean{gap:8px;padding-bottom:0}
.cr-grid>.cr-intel .ra-lrow{gap:4px}
.cr-grid>.cr-intel .ra-lrow .lean{padding:6px}
.cr-grid>.cr-intel .ra-ltf{gap:4px}
.cr-grid>.cr-intel .ra-h .note{margin-top:2px}
.cr-ticket[hidden]{display:none!important}
.cr-hold[hidden]{display:none!important}
/* the full-screen chart is the page (owner 2026-10-29): while Coral Reef is open the page is a black screen under the
   chart, and the chart is never shown small — so there's no small-then-big jump, even on the very first load */
#page-reef:not([hidden]){position:fixed;inset:0;z-index:990;background:#000;overflow:hidden}
#page-reef:not([hidden])::before{content:"Loading the chart…";position:absolute;left:0;right:0;top:46%;text-align:center;font:600 12px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:#3b4f8f}
#page-reef:not([hidden]) .cc-chartwrap:not(.full){visibility:hidden}
