/* BTC / 15-minute strategies, hour by hour (pnl-comparison.js). */
.pnl-comparison{--pnl-15m:#d95926;--pnl-astra:#199e70;--pnl-opus:#3987e5;--pnl-son:#b879e8;padding:32px;margin:12px 0 48px;border:1px solid #ffffff16;border-radius:20px;background:radial-gradient(ellipse at 0 0,#ff65340c,transparent 55%),#0d1010;box-shadow:0 20px 60px #00000025}
.pnl-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}
.pnl-kicker{display:block;font:10px monospace;letter-spacing:1.7px;color:#929b96;margin-bottom:10px}
.pnl-heading h2{font-size:clamp(26px,3vw,38px);letter-spacing:-1.4px;font-weight:500;margin:0}
.pnl-period{font:10px monospace;letter-spacing:1px;border:1px solid #ffffff18;border-radius:100px;padding:10px 14px;white-space:nowrap;color:#e2e7df}
.pnl-period span{color:#89948d}
.pnl-description{color:#949e98;font-size:13px;line-height:1.7;margin:12px 0 24px;max-width:760px}
.pnl-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}
.pnl-legend{display:flex;flex-wrap:wrap;gap:10px 24px;font-size:12px;font-weight:600;color:#dbe2dc}
.pnl-legend span{display:flex;align-items:center;gap:8px}
.pnl-key{display:inline-block;flex:none;width:16px;height:2px;border-radius:1px;background:var(--key)}
.pnl-original .pnl-key{--key:var(--pnl-15m)}.pnl-astra .pnl-key{--key:var(--pnl-astra)}.pnl-opus .pnl-key{--key:var(--pnl-opus)}.pnl-son .pnl-key{--key:var(--pnl-son)}
.pnl-hint,.pnl-chart-footer{font-size:11px;color:#8c9690;line-height:1.7}
.pnl-detail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:22px}
.pnl-selected-hour{grid-column:1/-1;align-self:center;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px}
.pnl-selected-hour .pnl-kicker{margin-bottom:0}
.pnl-selected-hour strong{font-size:13px;line-height:1.7;font-weight:500;color:#dbe2dc}
.pnl-value-card{display:grid;gap:6px;align-content:start;padding:14px 16px;border:1px solid #ffffff10;border-radius:10px;background:#ffffff02}
.pnl-card-label{display:flex;align-items:center;gap:8px;font:11px monospace;color:#c5cdc7}
.pnl-card-value{font:24px monospace;letter-spacing:-1px;color:#eef2ec}
.pnl-card-note{color:#8c9690;font-size:10px;line-height:1.6}
#pnl-comparison-chart{min-height:280px;transition:opacity .2s}
#pnl-comparison-chart.is-refreshing{opacity:.6}
#pnl-comparison-chart svg{display:block;width:100%;height:auto;overflow:visible}
#pnl-comparison-chart text{fill:#88978e;font:11px monospace}
#pnl-comparison-chart .pnl-caption{font-size:9px;letter-spacing:1.3px}
#pnl-comparison-chart .pnl-tick-base{fill:#c5cdc7}
#pnl-comparison-chart .pnl-end-label{fill:#dbe2dc}
#pnl-comparison-chart .pnl-grid{stroke:#ffffff0d;stroke-width:1}
#pnl-comparison-chart .pnl-base{stroke:#a3b1a855;stroke-width:1}
#pnl-comparison-chart .pnl-axis{stroke:#ffffff1f;stroke-width:1}
.pnl-line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.pnl-dot,.pnl-dot-focus{stroke-width:2}
.pnl-dot-start{fill:#0d1010;stroke:#c5cdc7;stroke-width:1.5}
.pnl-dot-focus,.pnl-cross{pointer-events:none}
.pnl-cross{stroke:#ffffff45;stroke-width:1}
.pnl-end-key{stroke-width:2;stroke-linecap:round}
.pnl-hit{fill:transparent;cursor:crosshair;outline:none}
.pnl-hit:focus-visible{stroke:#ffffff70;stroke-width:1}
.pnl-chart-footer{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 0 20px}
.pnl-hourly-details{border-top:1px solid #ffffff10;color:#929e96;font-size:12px}
.pnl-hourly-details summary{display:flex;justify-content:space-between;cursor:pointer;padding:18px 0 0;list-style:none}
.pnl-hourly-details summary::-webkit-details-marker{display:none}
.pnl-hourly-details caption{text-align:left;padding:12px;white-space:normal;line-height:1.7}
.pnl-hourly-details td,.pnl-hourly-details th{font-variant-numeric:tabular-nums;white-space:nowrap}
@media(max-width:800px){.pnl-detail{grid-template-columns:1fr 1fr}.pnl-selected-hour .pnl-kicker{margin-bottom:4px}.pnl-hint{display:none}.pnl-card-value{font-size:20px}}
@media(max-width:560px){.pnl-comparison{padding:20px 14px;border-radius:14px}.pnl-heading{align-items:flex-start;flex-direction:column;gap:12px}.pnl-period{font-size:9px;padding:7px 10px;white-space:normal}.pnl-detail{grid-template-columns:1fr;gap:8px}.pnl-value-card{grid-template-columns:auto 1fr;align-items:baseline;column-gap:14px;padding:12px}.pnl-card-value{text-align:right;font-size:19px}.pnl-card-note{grid-column:1/-1}.pnl-chart-footer{font-size:10px}}
@media(prefers-reduced-motion:reduce){#pnl-comparison-chart{transition:none}}

/* day / hour switch, hourly window navigator, drill-down */
.pnl-controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-bottom:18px}
.pnl-seg{display:inline-flex;border:1px solid #ffffff1c;border-radius:100px;padding:3px;background:#ffffff05}
.pnl-seg button,.pnl-nav button,.pnl-drill{font:11px monospace;letter-spacing:.8px;color:#c5cdc7;background:transparent;border:0;cursor:pointer}
.pnl-seg button{padding:8px 16px;border-radius:100px;min-height:32px}
.pnl-seg button[aria-pressed=true]{background:#eef2ec;color:#0d1010;font-weight:700}
.pnl-seg button:not([aria-pressed=true]):hover{background:#ffffff10}
.pnl-nav{display:inline-flex;align-items:center;gap:6px}
.pnl-nav[hidden]{display:none}
.pnl-nav button{width:32px;height:32px;border:1px solid #ffffff1c;border-radius:50%;font-size:14px;letter-spacing:0}
.pnl-nav button:hover:not(:disabled){background:#ffffff10}
.pnl-nav button:disabled{opacity:.3;cursor:default}
.pnl-nav-label{min-width:150px;text-align:center;font:11px monospace;color:#dbe2dc}
.pnl-drill{padding:6px 12px;border:1px solid #ff65346a;border-radius:100px;color:#ff9a78}
.pnl-drill:hover{background:#ff65341a}
.pnl-seg button:focus-visible,.pnl-nav button:focus-visible,.pnl-drill:focus-visible{outline:2px solid #ffffff90;outline-offset:2px}
#pnl-comparison-chart .pnl-band{fill:#ffffff0a;pointer-events:none}
#pnl-comparison-chart .pnl-vgrid{stroke:#ffffff08;stroke-width:1}
#pnl-comparison-chart .pnl-vgrid-day{stroke:#ffffff1c;stroke-dasharray:2 4}
#pnl-comparison-chart .pnl-bar{pointer-events:none}
@media(max-width:560px){.pnl-nav-label{min-width:0;flex:1}.pnl-controls{gap:10px}}

/* ---- interactive race chart: legend chips, spotlight, tooltip, motion, replay ---- */
.pnl-comparison{position:relative}
#pnl-comparison-chart{position:relative}
.pnl-legend > span{cursor:pointer;padding:7px 12px;border:1px solid #ffffff14;border-radius:100px;background:#ffffff04;transition:opacity .2s,border-color .2s,background .2s,transform .2s;user-select:none}
.pnl-legend > span:hover,.pnl-legend > span.is-spot{border-color:#ffffff40;background:#ffffff0c}
.pnl-legend > span:focus-visible{outline:2px solid #ffffff90;outline-offset:2px}
.pnl-legend > span.is-off{opacity:.38}
.pnl-legend > span.is-off .pnl-key{height:0;border-top:2px dotted var(--key);background:none}
.pnl-chip-val{font:600 11px monospace;font-style:normal;color:#eef2ec;letter-spacing:-.2px;min-width:0;font-variant-numeric:tabular-nums}
.pnl-chip-val:empty{display:none}
.pnl-toolbar{flex-wrap:wrap}

.pnl-seg-metric{margin-left:0}
.pnl-actions{display:inline-flex;gap:8px;margin-left:auto}
.pnl-pill{font:11px monospace;letter-spacing:.8px;color:#c5cdc7;background:transparent;border:1px solid #ffffff1c;border-radius:100px;padding:8px 14px;min-height:32px;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.pnl-pill:hover{background:#ffffff10;border-color:#ffffff40}
.pnl-pill[hidden]{display:none}
.pnl-pill:focus-visible{outline:2px solid #ffffff90;outline-offset:2px}
.pnl-play[aria-pressed=true]{background:#ff6534;border-color:#ff6534;color:#0d1010;font-weight:700}
.pnl-zoomout{border-color:#ff65346a;color:#ff9a78}

/* value cards: rank badge, leader glow, spotlight */
.pnl-value-card{position:relative;overflow:hidden;transition:border-color .25s,background .25s,opacity .25s,transform .25s}
.pnl-value-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--key);opacity:.85}
.pnl-value-card.is-lead{border-color:color-mix(in srgb,var(--key) 55%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--key) 13%,transparent),#ffffff02 60%);box-shadow:0 0 28px -10px var(--key)}
.pnl-value-card.is-spot{border-color:color-mix(in srgb,var(--key) 70%,#fff 10%);transform:translateY(-2px)}
.pnl-value-card.is-off{opacity:.42}
.pnl-rank{margin-left:auto;font:700 10px monospace;letter-spacing:.6px;color:#0d1010;background:var(--key);border-radius:100px;padding:2px 8px}
.pnl-card-label{width:100%}
.pnl-card-value{font-variant-numeric:tabular-nums}

/* svg layer */
#pnl-comparison-chart .pnl-s{transition:opacity .25s,stroke-width .25s}
#pnl-comparison-chart .has-spot .pnl-s:not(.is-spot){opacity:.14}
#pnl-comparison-chart .has-spot .pnl-end:not(.is-spot){opacity:.25}
#pnl-comparison-chart .has-spot .pnl-line.is-spot{stroke-width:3.2}
.pnl-line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.pnl-halo{fill:none;stroke-width:7;stroke-linejoin:round;stroke-linecap:round;opacity:.3;filter:url(#pnl-glow);pointer-events:none}
.pnl-area{opacity:0;pointer-events:none}
.pnl-area.is-lead{opacity:.55}
.has-spot .pnl-area.is-lead{opacity:0}
.has-spot .pnl-area.is-spot{opacity:1}
.pnl-pulse{pointer-events:none;transform-box:fill-box;transform-origin:center;animation:pnl-pulse 2.4s ease-out infinite}
@keyframes pnl-pulse{0%{transform:scale(1);opacity:.55}100%{transform:scale(3.4);opacity:0}}
.pnl-brush{fill:#ff65341f;stroke:#ff6534;stroke-width:1;stroke-dasharray:4 3;pointer-events:none}
.pnl-band{transition:opacity .15s}
#pnl-comparison-chart .pnl-hit{cursor:crosshair;touch-action:pan-y}
.is-playing .pnl-end,.is-playing .pnl-pulse{opacity:0}
.is-playing .pnl-cross{stroke:#ff653490}

/* entry animation: lines draw themselves, bars grow, dots fade in */
.pnl-anim .pnl-draw{stroke-dasharray:1;stroke-dashoffset:1;animation:pnl-draw .9s cubic-bezier(.25,.6,.2,1) forwards}
@keyframes pnl-draw{to{stroke-dashoffset:0}}
.pnl-anim .pnl-bar{transform-box:fill-box;transform-origin:center bottom;animation:pnl-grow .55s cubic-bezier(.2,.8,.2,1) backwards}
.pnl-anim .pnl-bar-neg{transform-origin:center top}
@keyframes pnl-grow{from{transform:scaleY(0)}}
.pnl-anim .pnl-fade{animation:pnl-fade .5s .8s backwards}
@keyframes pnl-fade{from{opacity:0}}

/* floating tooltip */
.pnl-tip{position:absolute;z-index:3;min-width:190px;max-width:280px;padding:10px 12px;border:1px solid #ffffff26;border-radius:12px;background:#0d1010ee;backdrop-filter:blur(8px);box-shadow:0 14px 40px #000000a0;pointer-events:none;font:11px monospace;color:#dbe2dc;display:grid;gap:5px}
.pnl-tip[hidden]{display:none}
.pnl-tip-head{font-size:10px;letter-spacing:.8px;color:#929b96;margin-bottom:2px}
.pnl-tip-row{display:flex;align-items:center;gap:8px;white-space:nowrap}
.pnl-tip-rank{color:#7b857f;width:20px}
.pnl-tip-name{flex:1}
.pnl-tip-row strong{font-weight:600;color:#eef2ec;font-variant-numeric:tabular-nums}
.pnl-tip-pos{color:#5fd29b}.pnl-tip-neg{color:#ff7a66}

@media(max-width:800px){.pnl-actions{margin-left:0}.pnl-chip-val{display:none}}
@media(max-width:560px){.pnl-tip{min-width:160px;font-size:10px}.pnl-legend > span{padding:6px 10px}.pnl-seg button{padding:8px 12px}.pnl-controls{gap:8px}}
@media(prefers-reduced-motion:reduce){.pnl-pulse,.pnl-anim *{animation:none!important}.pnl-value-card,.pnl-legend > span{transition:none}}

#pnl-comparison-chart .pnl-version-line{stroke-width:1;stroke-dasharray:4 4;opacity:.75;pointer-events:none}
#pnl-comparison-chart .pnl-version-label{font-size:9px;letter-spacing:.6px;paint-order:stroke;stroke:#0d1010;stroke-width:3px;pointer-events:none}