/* risk-plan.css — A Girl & Her Futures™
 * Stop loss / take profit and position sizing screens (shared/risk-plan.js).
 * Levels differ by line style, icon and label, not by colour alone. */

.lc-q-in .rp,.lc-q-in .rp-plan,.lc-q-in .rp-btns,.lc-q-in .rp-compare,.lc-q-in .rp-place,.lc-q-in .rp-read,.lc-q-in .rp-q,.lc-q-in .rp-calc,.lc-q-in .rp-panel,.lc-q-in .rp-split,.lc-q-in .rp-reveals,.lc-q-in .rp-ans,.lc-q-in .rp-calcbox,.lc-q-in .rp-mistake,.lc-q-in .rp-qty{font-size:1rem;line-height:1.4;font-family:var(--font-body)}
.rp-chart{position:relative;height:300px;outline:none;touch-action:none;cursor:row-resize;user-select:none;-webkit-user-select:none}
.rp-chart svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.rp-chart:focus-visible{outline:2.5px solid var(--pink);outline-offset:-3px}
.rp-side b{font-size:.84rem;font-weight:800;border-radius:8px;padding:3px 9px}
.rp-long{background:var(--bg-e3f6f3,#E3F6F3);color:var(--fg-1f7a70,#1F7A70)}.rp-short{background:var(--dbg-fde8ed,#FDE8ED);color:var(--dfg-b83a57,#B83A57)}
.rp-lv line{stroke-width:2.5}
.rp-lv.en line{stroke:var(--fg-2c1810,#2C1810)}.rp-lv.en rect{fill:var(--fg-2c1810,#2C1810)}
.rp-lv.sl line{stroke:var(--fg-d9536f,#D9536F);stroke-dasharray:8 5}.rp-lv.sl rect{fill:var(--fg-d9536f,#D9536F)}
.rp-lv.tp line{stroke:var(--fg-2e9a8e,#2E9A8E);stroke-dasharray:2 4;stroke-linecap:round;stroke-width:3}.rp-lv.tp rect{fill:var(--fg-2e9a8e,#2E9A8E)}
.rp-lv .rp-px{font-size:11px;font-weight:800;fill:var(--fg-ffffff,#FFFFFF)}
.rp-lv .rp-name{font-size:11px;font-weight:800;fill:var(--fg-2c1810,#2C1810);letter-spacing:.04em;paint-order:stroke;stroke:var(--fg-ffffff,#FFFFFF);stroke-width:4px;stroke-linejoin:round}
.rp-ghost line{stroke-width:2;stroke-dasharray:4 4;opacity:.8}
.rp-ghost.sl line{stroke:var(--fg-d9536f,#D9536F)}.rp-ghost.tp line{stroke:var(--fg-2e9a8e,#2E9A8E)}
.rp-ghost rect{fill:var(--fg-8a7069,#8A7069)}.rp-ghost text{font-size:11px;font-weight:800;fill:var(--fg-ffffff,#FFFFFF)}
.rp-zone rect{stroke-width:1.5}
.rp-zone.risk rect{fill:rgba(217,83,111,.12);stroke:var(--fg-d9536f,#D9536F);stroke-dasharray:5 4}
.rp-zone.reward rect{fill:rgba(46,154,142,.12);stroke:var(--fg-2e9a8e,#2E9A8E)}
.rp-zone text{font-size:12px;font-weight:800;fill:var(--fg-2c1810,#2C1810);letter-spacing:.02em}
.rp-plan{display:flex;gap:8px;flex-wrap:wrap}
.rp-plan span{background:var(--bg-fffaf8,#FFFAF8);border:1.5px solid var(--ln-efe3dd,#EFE3DD);border-radius:999px;padding:6px 12px;font-size:.9rem;color:var(--fg-5a4740,#5A4740)}
.rp-plan span b{color:var(--fg-2c1810,#2C1810)}
.rp-plan span.set.sl{border-color:var(--ln-d9536f,#D9536F);background:var(--bg-fff6f2,#FFF6F2)}.rp-plan span.set.tp{border-color:var(--ln-2e9a8e,#2E9A8E);background:var(--bg-e3f6f3,#E3F6F3)}
.rp-btns{display:flex;gap:10px;flex-wrap:wrap}
.rp-add{flex:1 1 180px;border:2px solid var(--ln-e3d3cb,#E3D3CB);background:var(--bg-ffffff,#FFFFFF);border-radius:14px;padding:12px 14px;font:800 .98rem var(--font-body);color:var(--fg-2c1810,#2C1810);cursor:pointer}
.rp-add.sl:hover{border-color:var(--ln-d9536f,#D9536F)}.rp-add.tp:hover{border-color:var(--ln-2e9a8e,#2E9A8E)}
.rp-add:disabled{opacity:.5;cursor:default}
.rp-add:focus-visible,.rp-setbtn:focus-visible,.rp-place input:focus-visible,.rp-in input:focus-visible{outline:2.5px solid var(--pink);outline-offset:2px}
.rp-seg{max-width:520px}
.rp-seg button:disabled{opacity:.45;cursor:default}
.rp-compare{display:flex;flex-direction:column;gap:8px;border:1.5px solid var(--ln-e3d3cb,#E3D3CB);border-radius:16px;padding:14px 16px;background:var(--bg-ffffff,#FFFFFF);animation:lcIn .3s forwards}
.rp-compare[hidden],.rp-q[hidden],.rp-place[hidden],.rp-read[hidden]{display:none}
.rp-cbar{display:grid;grid-template-columns:70px 1fr;align-items:center;gap:10px;font-weight:700;color:var(--fg-5a4740,#5A4740)}
.rp-cbar i{display:block;height:26px;width:calc(var(--u) * 33%);border-radius:8px;position:relative;animation:rpGrow .6s ease-out}
.rp-cbar i.r{background:repeating-linear-gradient(45deg,var(--bg-d9536f,#D9536F) 0 6px,var(--bg-e0607a,#E0607A) 6px 12px)}
.rp-cbar i.w{background:var(--bg-2e9a8e,#2E9A8E)}
.rp-cbar b{position:absolute;left:calc(100% + 8px);top:3px;white-space:nowrap;color:var(--fg-2c1810,#2C1810);font-size:.9rem}
@keyframes rpGrow{from{width:0}}
.lc-q-in .rp-ratio{margin:0;font-size:1.05rem;font-weight:700;color:var(--fg-2c1810,#2C1810)}
.rp-ratio b{font-size:1.2rem;color:var(--fg-b83d61,#B83D61)}
.rp-place{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.rp-place label{display:flex;flex-direction:column;gap:4px;font-size:.8rem;font-weight:700;color:var(--fg-5a4740,#5A4740)}
.rp-place input,.rp-in input{border:2px solid var(--ln-e3d3cb,#E3D3CB);border-radius:10px;padding:9px 10px;font:800 1rem var(--font-body);color:var(--fg-2c1810,#2C1810);background:var(--bg-ffffff,#FFFFFF);width:150px}
.rp-setbtn{border:0;background:var(--bg-2c1810,#2C1810);color:var(--fg-ffffff,#FFFFFF);border-radius:999px;padding:11px 18px;font:800 .92rem var(--font-body);cursor:pointer}
.rp-howto{flex-basis:100%;font-size:.82rem}
.rp-read,.rp-panel{display:flex;gap:8px;flex-wrap:wrap}
.rp-read span,.rp-panel span{background:var(--bg-fffaf8,#FFFAF8);border:1.5px solid var(--ln-efe3dd,#EFE3DD);border-radius:12px;padding:8px 12px;font-size:.88rem;color:var(--fg-5a4740,#5A4740);display:flex;flex-direction:column}
.rp-read b,.rp-panel b{font-size:1.05rem;color:var(--fg-2c1810,#2C1810)}
.rp-q{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.rp-field{display:flex;flex-direction:column;gap:6px;font-weight:700;color:var(--fg-2c1810,#2C1810)}
.rp-in{display:inline-flex;align-items:center;gap:6px}
.rp-in em{font-style:normal;font-weight:700;color:var(--fg-8a7069,#8A7069)}
.rp-in input{width:120px}
.rp-ratio-pick{max-width:360px}
.rp-check{flex:none}
.rp-mistake{display:flex;flex-direction:column;gap:10px}

/* Position sizing */
.rp-calc{border:1.5px solid var(--ln-e3d3cb,#E3D3CB);border-radius:16px;padding:14px 16px;background:var(--bg-ffffff,#FFFFFF);display:flex;flex-direction:column;gap:8px}
.lc-q-in .rp-big{margin:0;display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.rp-n{font-weight:800;color:var(--fg-5a4740,#5A4740)}
.rp-usd{font-size:1.5rem;font-weight:900;color:var(--fg-2c1810,#2C1810)}
.lc-q-in .rp-f{margin:0;font-size:.98rem;color:var(--fg-5a4740,#5A4740)}
.rp-f b{color:var(--fg-2c1810,#2C1810)}
.rp-meter{height:14px;border-radius:7px;background:var(--bg-f1e6e1,#F1E6E1);overflow:hidden}
.rp-meter i{display:block;height:100%;width:0;background:repeating-linear-gradient(45deg,var(--bg-d9536f,#D9536F) 0 6px,var(--bg-e0607a,#E0607A) 6px 12px);transition:width .45s ease}
.rp-budget{display:flex;flex-direction:column;gap:6px}
.rp-track{position:relative;height:22px;border-radius:8px;background:var(--bg-f1e6e1,#F1E6E1);margin-top:20px}
.rp-track i{display:block;height:100%;border-radius:8px;background:var(--bg-2e9a8e,#2E9A8E);transition:width .45s ease}
.rp-budget.over .rp-track i{background:repeating-linear-gradient(45deg,var(--bg-d9536f,#D9536F) 0 6px,var(--bg-e0607a,#E0607A) 6px 12px)}
.rp-track em{position:absolute;top:-20px;bottom:-4px;width:0;border-left:3px solid var(--ln-2c1810,#2C1810);font-style:normal}
.rp-track em span{position:absolute;top:0;left:5px;font-size:.74rem;font-weight:800;color:var(--fg-2c1810,#2C1810);white-space:nowrap}
.lc-q-in .rp-verdict{margin:0;font-weight:800}
.rp-budget.ok .rp-verdict{color:var(--fg-1f7a70,#1F7A70)}.rp-budget.over .rp-verdict{color:var(--fg-b83a57,#B83A57)}
.rp-split{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rp-side-card{border:2px solid var(--ln-e3d3cb,#E3D3CB);border-radius:16px;padding:14px;background:var(--bg-ffffff,#FFFFFF);display:flex;flex-direction:column;gap:6px;position:relative}
.rp-side-card.plan{border-color:var(--ln-2e9a8e,#2E9A8E)}.rp-side-card.emo{border-color:var(--ln-d9536f,#D9536F);border-style:dashed}
.rp-side-card small{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-8a7069,#8A7069)}
.rp-side-card b{font-size:1.3rem;font-weight:900;color:var(--fg-2c1810,#2C1810)}
.lc-q-in .rp-side-card p{margin:0;font-size:.9rem;color:var(--fg-5a4740,#5A4740)}
.rp-stack{display:flex;flex-wrap:wrap;gap:4px}
.rp-stack i{width:22px;height:22px;border-radius:6px;background:var(--bg-2e9a8e,#2E9A8E)}
.emo .rp-stack i{background:repeating-linear-gradient(45deg,var(--bg-d9536f,#D9536F) 0 5px,var(--bg-e0607a,#E0607A) 5px 10px)}
.rp-x{align-self:flex-start;background:var(--bg-2c1810,#2C1810);color:var(--fg-ffffff,#FFFFFF);border-radius:999px;padding:4px 10px;font-size:.82rem;font-weight:800}
.rp-reveals{display:flex;gap:10px;flex-wrap:wrap}
.rp-ans{display:flex;flex-direction:column;gap:10px}
.rp-ans .s2-reveal{animation:lcIn .3s forwards}
.rp-calcbox{border:1.5px solid var(--ln-e3d3cb,#E3D3CB);border-radius:18px;overflow:hidden;background:var(--bg-ffffff,#FFFFFF)}
.rp-top{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg-fffaf8,#FFFAF8);border-bottom:1px solid var(--ln-efe3dd,#EFE3DD)}
.rp-top .cw-sim{margin-left:auto}
.rp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--bg-efe3dd,#EFE3DD)}
.rp-grid span{background:var(--bg-ffffff,#FFFFFF);padding:8px 12px;font-size:.8rem;color:var(--fg-8a7069,#8A7069);display:flex;flex-direction:column}
.rp-grid b{font-size:1rem;color:var(--fg-2c1810,#2C1810)}
.rp-work{padding:14px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.rp-work .rp-qty,.rp-work .rp-bb,.rp-work>div{align-self:stretch}

@media (max-width:640px){
  .rp-chart{height:250px}
  .rp-split{grid-template-columns:1fr}
  .rp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rp-qty button{font-size:.8rem;padding:6px 4px}
}
@media (prefers-reduced-motion:reduce){.rp-compare,.rp-cbar i,.rp-ans .s2-reveal{animation:none;opacity:1}.rp-meter i,.rp-track i{transition:none}}

/* Plain: just the chart, no trading-platform bar (the Section 1 look) */
.rp-plain .cw-top{display:none}
.rp-plain{box-shadow:none}