/* Kai$erFinance public performance block. Inherits the theme's font; colours can be overridden via the --kf-* variables. */
.kf {
  --kf-ink: #18202a;
  --kf-muted: #5d6a78;
  --kf-olive: #5d6a78;
  --kf-line: #dde3ea;
  --kf-panel: #ffffff;
  --kf-gold: #18202a; /* the portfolio line and accents: ink, no gold */
  --kf-gold-soft: #f1f3ef;
  --kf-index: #3d5a80;
  --kf-up: #1d7a4f;
  --kf-down: #b3392f;
  color: var(--kf-ink);
  background: var(--kf-panel);
  border: 1px solid var(--kf-line);
  border-radius: 12px;
  padding: clamp(16px, 3vw, 28px);
  display: grid;
  gap: 18px;
  max-width: 980px;
  margin-inline: auto;
}
@media (prefers-color-scheme: dark) {
  .kf.kf-auto-dark {
    --kf-ink: #ebe7da; --kf-muted: #aaa592; --kf-olive: #a9a07a; --kf-line: #3a3832; --kf-panel: #292823;
    --kf-gold: #ebe7da; --kf-gold-soft: #302e28; --kf-index: #9fb0c2; --kf-up: #8fb596; --kf-down: #d38c78;
  }
}
.kf * { box-sizing: border-box; }
.kf-num { font-variant-numeric: tabular-nums; }
.kf-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1px; background: var(--kf-line); border: 1px solid var(--kf-line); border-radius: 10px; overflow: hidden; }
.kf-stat { background: var(--kf-panel); padding: 14px 16px; display: grid; gap: 4px; }
.kf-label { font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--kf-muted); }
.kf-big { font-size: clamp(22px, 4vw, 30px); font-weight: 600; line-height: 1.1; }
.kf-up { color: var(--kf-up); }
.kf-down { color: var(--kf-down); }
.kf-verdict { background: var(--kf-gold-soft); border-radius: 8px; padding: 10px 14px; font-weight: 500; }
.kf-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; }
.kf-legend { display: flex; flex-wrap: wrap; gap: 16px; font-size: 14px; color: var(--kf-muted); }
.kf-legend i { display: inline-block; width: 14px; height: 3px; border-radius: 2px; vertical-align: middle; margin-right: 6px; }
.kf-ranges { display: flex; gap: 4px; }
.kf-ranges button { font: inherit; font-size: 13px; padding: 4px 10px; border-radius: 99px; border: 1px solid var(--kf-line); background: none; color: var(--kf-muted); cursor: pointer; }
.kf-ranges button[aria-pressed="true"] { background: var(--kf-ink); border-color: var(--kf-ink); color: var(--kf-panel); }
.kf-ranges button:focus-visible { outline: 2px solid var(--kf-gold); outline-offset: 2px; }
.kf-chart svg { width: 100%; height: auto; display: block; }
.kf-chart text { fill: var(--kf-muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.kf-alloc { display: grid; gap: 8px; }
.kf-alloc-row { display: grid; grid-template-columns: minmax(80px, 160px) 1fr 52px; gap: 10px; align-items: center; font-size: 14px; }
.kf-alloc-track { height: 8px; border-radius: 4px; background: var(--kf-line); overflow: hidden; }
.kf-alloc-fill { height: 100%; background: var(--kf-gold); }
.kf-foot { font-size: 12px; color: var(--kf-muted); margin: 0; }
.kf-empty { color: var(--kf-muted); text-align: center; padding: 24px 0; margin: 0; }
.kf-admin-link { text-align: center; font-size: 14px; }
.kf-top { display: flex; justify-content: flex-end; margin-bottom: -6px; }
.kf-lang { display: inline-flex; border: 1px solid var(--kf-line); border-radius: 99px; overflow: hidden; }
.kf-lang button { font: inherit; font-size: 12px; font-weight: 600; letter-spacing: .06em; padding: 4px 12px; border: 0; background: none; color: var(--kf-muted); cursor: pointer; }
.kf-lang button[aria-pressed="true"] { background: var(--kf-ink); color: var(--kf-panel); }
.kf-lang button:focus-visible { outline: 2px solid var(--kf-gold); outline-offset: -2px; }
.kf-periods { overflow-x: auto; }
.kf-periods table { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.kf-periods caption { text-align: left; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--kf-muted); padding-bottom: 8px; }
.kf-periods th, .kf-periods td { padding: 8px 10px; border-bottom: 1px solid var(--kf-line); white-space: nowrap; text-align: right; }
.kf-periods thead th { font-size: 12px; font-weight: 600; color: var(--kf-muted); }
.kf-periods tbody th { text-align: left; font-weight: 500; }
.kf-periods tbody tr:last-child th, .kf-periods tbody tr:last-child td { border-bottom: 0; }
.kf-periods i { display: inline-block; width: 12px; height: 3px; border-radius: 2px; vertical-align: middle; margin-right: 8px; }
html[data-theme="dark"] .kf {
  --kf-ink: #ebe7da; --kf-muted: #aaa592; --kf-olive: #a9a07a; --kf-line: #3a3832; --kf-panel: #292823;
    --kf-gold: #ebe7da; --kf-gold-soft: #302e28; --kf-index: #9fb0c2; --kf-up: #8fb596; --kf-down: #d38c78;
}
.kf > * { transition: opacity .2s ease, transform .2s ease; }
html.kf-text-out .kf > *:not(.kf-top) { opacity: 0; transform: translateY(3px); }
@media (prefers-reduced-motion: reduce) { .kf > * { transition: none; } }
/* Benchmark picker in the legend. */
.kf-legend { align-items: center; }
.kf-bench-pick { display: inline-flex; align-items: center; }
.kf-bench-pick select {
  font: inherit; font-size: 14px; color: var(--kf-ink);
  background: transparent; border: 1px solid var(--kf-line); border-radius: 99px;
  padding: 3px 10px; cursor: pointer; max-width: 100%;
}
.kf-bench-pick select:focus-visible { outline: 2px solid var(--kf-gold); outline-offset: 2px; }
.kf-bench-pick select option { color: #161b22; background: #fff; }
/* Real amounts and holdings. */
.kf-amounts .kf-big { font-size: clamp(20px, 3.4vw, 26px); }
.kf-holdings tbody th small { color: var(--kf-muted); font-weight: 400; margin-left: 4px; }
.kf-controls { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
/* Benchmark chips: visitors switch comparisons on and off. */
.kf { --kf-b-spy: #3d5a80; --kf-b-qqq: #2a8c80; --kf-b-urth: #7b5ea7; --kf-b-ewl: #c0392b; --kf-b-xau: #6b7280; --kf-b-btc: #d9622b; }
html[data-theme="dark"] .kf { --kf-b-spy: #9fb0c2; --kf-b-qqq: #8db3a8; --kf-b-urth: #b0a4c4; --kf-b-ewl: #cf968a; --kf-b-xau: #b4ac9e; --kf-b-btc: #d1a274; }
.kf-bar { flex-wrap: wrap; align-items: center; justify-content: flex-start; }
.kf-legend-own { display: inline-flex; align-items: center; font-weight: 600; color: var(--kf-ink); }
.kf-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.kf-chips-label { font-size: 13px; color: var(--kf-muted); margin: 0 2px 0 4px; }
.kf-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font: inherit; font-size: 13px; padding: 4px 10px; border-radius: 99px;
  border: 1px solid var(--kf-line); background: none; color: var(--kf-muted); cursor: pointer;
}
.kf-chip i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; opacity: .35; }
.kf-chip[aria-pressed="true"] { color: var(--kf-ink); border-color: var(--kf-muted); }
.kf-chip[aria-pressed="true"] i { opacity: 1; }
.kf-chip:hover { border-color: var(--kf-muted); }
.kf-chip:focus-visible { outline: 2px solid var(--kf-gold); outline-offset: 2px; }
.kf-range-row { display: flex; justify-content: flex-end; margin-top: -6px; }
.kf-periods tbody th i { border-radius: 2px; }
/* Chart tooltip. */
.kf-chart { position: relative; }
.kf-chart svg { touch-action: pan-y; cursor: crosshair; }
.kf-chart svg:focus-visible { outline: 2px solid var(--kf-gold); outline-offset: 4px; border-radius: 4px; }
.kf-tip {
  position: absolute; top: 6px; z-index: 2; min-width: 168px; pointer-events: none;
  background: var(--kf-panel); color: var(--kf-ink); border: 1px solid var(--kf-line); border-radius: 8px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .12); padding: 8px 10px; font-size: 13px; display: grid; gap: 4px;
}
.kf-tip-date { font-size: 12px; color: var(--kf-muted); margin-bottom: 2px; }
.kf-tip-row { display: grid; grid-template-columns: 8px 1fr auto; align-items: center; gap: 8px; }
.kf-tip-row i { width: 8px; height: 8px; border-radius: 50%; }
.kf-tip-row b { font-weight: 600; font-variant-numeric: tabular-nums; }
.kf-tip[hidden] { display: none; }
.kf-chart svg:focus:not(:focus-visible) { outline: none; }
.kf-tv { color: inherit; text-decoration: none; display: inline-flex; align-items: baseline; gap: 4px; }
.kf-tv svg { width: 10px; height: 10px; flex: none; align-self: center; color: var(--kf-muted); opacity: .6; }
.kf-tv:hover { color: var(--kf-gold); }
.kf-tv:hover svg { color: var(--kf-gold); opacity: 1; }
.kf-tv:focus-visible { outline: 2px solid var(--kf-gold); outline-offset: 2px; border-radius: 3px; }
.kf-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (prefers-reduced-motion: no-preference) { .kf-tv, .kf-tv svg { transition: color .15s ease, opacity .15s ease; } }
/* Keep the space for the block while the script loads, so the footer doesn't jump. */
.kf[data-kf]:not(.kf-ready) { min-height: 720px; }
/* Tables on phones: tighter, so returns and holdings fit the screen. */
.kf-periods-narrow thead th { white-space: normal; vertical-align: bottom; line-height: 1.25; }
.kf-periods-narrow thead th i { display: block; margin: 0 0 6px auto; }
@media (max-width: 560px) {
  .kf-periods th, .kf-periods td { padding: 8px 6px; font-size: 13px; }
  .kf-periods th:first-child, .kf-periods td:first-child { padding-left: 0; }
  .kf-periods th:last-child, .kf-periods td:last-child { padding-right: 0; }
  .kf-holdings tbody th small { display: block; margin: 2px 0 0; }
}
.kf-periods-many th, .kf-periods-many td { font-size: 12px; padding-left: 4px; padding-right: 4px; }
/* "Prices may be delayed" note. */
.kf-stale { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; color: var(--kf-muted); }
.kf-stale svg { width: 15px; height: 15px; flex: none; color: var(--kf-gold); }
/* Chart motion: soft and short. Range and benchmark changes cross-fade; the first view draws in once. */
.kf-chart .kf-ghost { position: absolute; top: 0; left: 0; width: 100%; pointer-events: none; animation: kf-fade-out .26s ease forwards; }
.kf-chart .kf-fade-in { animation: kf-fade-in .26s ease both; }
.kf-chart .kf-draw .kf-ln { stroke-dasharray: 1; stroke-dashoffset: 1; animation: kf-draw .75s cubic-bezier(.33, .7, .3, 1) forwards; }
.kf-chart .kf-draw .kf-area, .kf-chart .kf-draw .kf-end { opacity: 0; animation: kf-show .45s ease .5s forwards; }
@keyframes kf-fade-in { from { opacity: 0; } }
@keyframes kf-fade-out { to { opacity: 0; } }
@keyframes kf-draw { to { stroke-dashoffset: 0; } }
@keyframes kf-show { to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .kf-chart .kf-ghost { display: none; }
  .kf-chart svg, .kf-chart svg * { animation: none !important; }
  .kf-chart .kf-draw .kf-ln { stroke-dashoffset: 0; }
  .kf-chart .kf-draw .kf-area, .kf-chart .kf-draw .kf-end { opacity: 1; }
}
/* Tooltip motion: a quick fade-and-lift in, a gentle glide between days, a soft fade out. */
.kf-tip { transform: translate(var(--kf-tip-x, 0px), 4px); opacity: 0; transition: opacity .14s ease, transform .14s ease; }
.kf-tip.kf-tip-on { opacity: 1; transform: translate(var(--kf-tip-x, 0px), 0); }
.kf-tip-guide { stroke-opacity: 0; transition: stroke-opacity .14s ease, transform .09s ease-out; }
.kf-tip-active .kf-tip-guide { stroke-opacity: .7; }
.kf-tip-dot { opacity: 0; transition: opacity .14s ease, transform .09s ease-out; }
.kf-tip-dot.kf-on { opacity: 1; }
.kf-tip-jump, .kf-tip-jump .kf-tip-guide, .kf-tip-jump .kf-tip-dot { transition: opacity .14s ease, stroke-opacity .14s ease !important; }
@media (prefers-reduced-motion: reduce) {
  .kf-tip, .kf-tip-guide, .kf-tip-dot { transition: none !important; }
  .kf-tip { transform: translate(var(--kf-tip-x, 0px), 0); }
}
.kf-chart .kf-draw .kf-grid { opacity: 1; }
/* Display menu when the block is used via the shortcode (inside a theme). */
.kf-top .kf-menu { position: relative; }
.kf-top .kf-menu-btn { display: inline-flex; align-items: center; gap: 8px; font: inherit; font-size: 13px; font-weight: 600; color: var(--kf-ink); background: none; border: 1px solid var(--kf-line); border-radius: 99px; padding: 6px 12px 6px 10px; cursor: pointer; }
.kf-top .kf-menu-btn svg { width: 16px; height: 16px; color: var(--kf-muted); }
.kf-top .kf-menu-panel { position: absolute; right: 0; top: calc(100% + 8px); z-index: 20; min-width: 220px; display: grid; gap: 10px; padding: 12px; background: var(--kf-panel); border: 1px solid var(--kf-line); border-radius: 12px; box-shadow: 0 12px 32px rgba(0,0,0,.12); opacity: 0; transform: translateY(-4px); transition: opacity .16s ease, transform .16s ease; }
.kf-top .kf-menu-panel.kf-open { opacity: 1; transform: none; }
.kf-top .kf-menu-panel[hidden] { display: none; }
.kf-top .kf-menu-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.kf-top .kf-menu-label { font-size: 13px; color: var(--kf-muted); }
/* Dark mode details: quiet verdict line, softer shadows, calmer fills. */
html[data-theme="dark"] .kf-verdict { background: var(--kf-gold-soft); border: 1px solid var(--kf-line); box-shadow: inset 2px 0 0 var(--kf-gold); }
html[data-theme="dark"] .kf-tip { box-shadow: 0 8px 24px rgba(0, 0, 0, .35); background: #2f2d28; }
html[data-theme="dark"] .kf-chart .kf-area { fill-opacity: .07; }
html[data-theme="dark"] .kf-alloc-fill { opacity: .85; }
/* ---------- 3.0 design: beige, editorial ---------- */
.kf { border-radius: 6px; }
.kf-stats { border-radius: 4px; }
.kf-label, .kf-periods caption, .kf-chips-label { color: var(--kf-olive); }
.kf-verdict { background: var(--kf-gold-soft); border: 1px solid var(--kf-line); box-shadow: inset 2px 0 0 var(--kf-gold); border-radius: 4px; }
.kf-tip { border-radius: 6px; background: #ffffff; box-shadow: 0 6px 20px rgba(0, 0, 0, .12); }
/* Time ranges as plain words with an underline, like size pickers in a shop. */
.kf-ranges { gap: 2px; }
.kf-ranges button { border: 0; border-radius: 0; background: none; padding: 4px 9px; color: var(--kf-muted); text-decoration: none; }
.kf-ranges button:hover { color: var(--kf-ink); }
.kf-ranges button[aria-pressed="true"] { background: none; color: var(--kf-ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
.kf-chip { border-radius: 4px; }
.kf-alloc-track { border-radius: 2px; background: var(--kf-gold-soft); }
.kf-alloc-fill { background: var(--kf-gold); }
html[data-theme="dark"] .kf-tip { background: #2f2d28; }
/* 3.0.1: no gold. The portfolio line is ink; accents are olive. */
.kf-verdict { box-shadow: inset 2px 0 0 var(--kf-olive); }
.kf-stale svg { color: var(--kf-olive); }
.kf-alloc-fill { background: var(--kf-olive); }
.kf-chart .kf-area { fill-opacity: .05; }
.kf-tv:hover, .kf-tv:hover svg { color: var(--kf-olive); }
.kf-ranges button:focus-visible, .kf-chip:focus-visible, .kf-lang button:focus-visible, .kf-chart svg:focus-visible, .kf-tv:focus-visible, .kf-bench-pick select:focus-visible { outline-color: var(--kf-olive); }
/* Positions list: tap a row for details. */
.kf-pos { display: grid; gap: 0; }
.kf-pos > .kf-label { margin-bottom: 8px; }
.kf-pos-head, .kf-pos-top { display: grid; grid-template-columns: minmax(0, 1fr) 88px 110px 64px 20px; align-items: center; gap: 10px; }
.kf-pos-noval .kf-pos-head, .kf-pos-noval .kf-pos-top { grid-template-columns: minmax(0, 1fr) 88px 64px 20px; }
.kf-pos-head { font-size: 12px; font-weight: 600; color: var(--kf-muted); padding: 0 6px 6px; text-align: right; border-bottom: 1px solid var(--kf-line); }
.kf-pos-row { border-bottom: 1px solid var(--kf-line); }
.kf-pos-top { width: 100%; font: inherit; font-size: 14px; color: inherit; text-align: right; background: none; border: 0; padding: 11px 6px; cursor: default; }
button.kf-pos-top { cursor: pointer; border-radius: 4px; }
button.kf-pos-top:hover { background: color-mix(in srgb, var(--kf-ink) 4%, transparent); }
button.kf-pos-top:focus-visible { outline: 2px solid var(--kf-olive); outline-offset: -2px; }
.kf-pos-name { text-align: left; font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-pos-name small { color: var(--kf-muted); font-weight: 400; margin-left: 4px; }
.kf-pos-ret { font-weight: 600; }
.kf-pos-chev { display: grid; place-items: center; color: var(--kf-muted); }
.kf-pos-chev svg { width: 12px; height: 12px; transition: transform .2s ease; }
.kf-pos-row.kf-open .kf-pos-chev svg { transform: rotate(180deg); }
.kf-pos-more { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows .24s ease, opacity .2s ease; }
.kf-pos-row.kf-open .kf-pos-more { grid-template-rows: 1fr; opacity: 1; }
.kf-pos-inner { overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; padding: 0 6px; }
.kf-pos-row.kf-open .kf-pos-inner { padding-bottom: 12px; }
.kf-pos-inner dl { display: flex; flex-wrap: wrap; gap: 6px 28px; margin: 0; }
.kf-pos-inner dl div { display: grid; gap: 2px; }
.kf-pos-inner dt { font-size: 11px; letter-spacing: .05em; text-transform: uppercase; color: var(--kf-olive); }
.kf-pos-inner dd { margin: 0; font-size: 14px; }
.kf-pos-inner .kf-tv { font-size: 13px; color: var(--kf-muted); align-items: center; }
.kf-pos-cash .kf-pos-name { color: var(--kf-muted); }
@media (max-width: 560px) {
  .kf-pos-head, .kf-pos-top { grid-template-columns: minmax(0, 1fr) 72px 84px 50px 14px; gap: 6px; }
  .kf-pos-noval .kf-pos-head, .kf-pos-noval .kf-pos-top { grid-template-columns: minmax(0, 1fr) 72px 50px 14px; }
  .kf-pos-top { font-size: 13px; padding: 10px 2px; }
  .kf-pos-head { padding: 0 2px 6px; }
  .kf-pos-name small { display: block; margin: 2px 0 0; }
}
@media (prefers-reduced-motion: reduce) { .kf-pos-more, .kf-pos-chev svg { transition: none; } }