.portfolio-tool {
  --bg: var(--world-bg);
  --paper: color-mix(in srgb, var(--world-bg) 88%, var(--world-ink) 4%);
  --ink: var(--world-ink);
  --muted: var(--world-muted);
  --faint: var(--world-faint);
  --line: color-mix(in srgb, var(--world-ink) 14%, transparent);
  --line-strong: color-mix(in srgb, var(--world-ink) 28%, transparent);
  --soft: color-mix(in srgb, var(--world-bg-soft) 82%, var(--world-ink) 4%);
  --accent: var(--world-ink);
  --good: #3f7657;
  --warn: #92631e;
  --bad: var(--color-danger);
  --blue: var(--world-accent);
  --radius: var(--radius-panel);
  --shadow: 0 1.25rem 3.5rem rgb(24 29 35 / 8%);
  --mono: var(--font-mono);
  --sans: var(--font-body);
  --serif: var(--font-display);
  min-height: 100svh;
  color: var(--ink);
  background: var(--bg);
  font-family: var(--sans);
  font-size: 0.9375rem;
  line-height: 1.55;
}

:root[data-theme="night"] .portfolio-tool {
  --paper: color-mix(in srgb, var(--world-bg-soft) 90%, white 2%);
  --soft: color-mix(in srgb, var(--world-bg-soft) 84%, white 4%);
  --good: #83bd99;
  --warn: #d3a65f;
  --bad: #d88d86;
  --shadow: none;
}


.portfolio-tool, .portfolio-tool *{box-sizing:border-box}
    .portfolio-tool{scroll-behavior:smooth}
    .portfolio-tool{
      margin:0;
      background:var(--bg);
      color:var(--ink);
      font-family:var(--sans);
      font-size:15px;
      line-height:1.55;
      -webkit-font-smoothing:antialiased;
    }
    .portfolio-tool button,.portfolio-tool input,.portfolio-tool select{font:inherit;color:inherit}
    .portfolio-tool button{cursor:pointer}
    .portfolio-tool a{color:inherit;text-decoration:none}
    .portfolio-tool .portfolio-tool__shell{max-width:1220px;margin:0 auto;padding:0 28px 80px}
    .portfolio-tool .topbar{
      min-height:68px;display:flex;align-items:center;justify-content:space-between;
      border-bottom:1px solid var(--line);gap:20px;
    }
    .portfolio-tool .brand{font-family:var(--serif);font-size:20px;letter-spacing:.01em}
    .portfolio-tool .nav{display:flex;gap:17px;align-items:center;color:var(--muted);font-size:13px}
    .portfolio-tool .nav a:hover,.portfolio-tool .text-button:hover{color:var(--ink)}
    .portfolio-tool .text-button{border:0;background:transparent;padding:3px;color:var(--muted);font-size:13px}
    .portfolio-tool .hero{padding:68px 0 38px;border-bottom:1px solid var(--line)}
    .portfolio-tool .eyebrow,.portfolio-tool .meta,.portfolio-tool .kicker{
      font-family:var(--mono);text-transform:uppercase;letter-spacing:.09em;font-size:11px;color:var(--muted)
    }
    .portfolio-tool h1{
      margin:11px 0 14px;font-family:var(--serif);font-size:clamp(42px,7vw,78px);
      font-weight:500;line-height:.98;letter-spacing:-.035em;
    }
    .portfolio-tool .lede{max-width:730px;font-size:18px;color:var(--muted);margin:0}
    .portfolio-tool .hero-meta{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:28px;color:var(--muted);font-family:var(--mono);font-size:11px}
    .portfolio-tool .portfolio-tool__main{padding-top:26px}
    .portfolio-tool .section{padding:34px 0;border-bottom:1px solid var(--line)}
    .portfolio-tool .section-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:20px}
    .portfolio-tool .section-head h2{font-family:var(--serif);font-size:28px;font-weight:500;margin:5px 0 0}
    .portfolio-tool .section-head p{margin:0;color:var(--muted);max-width:520px;text-align:right;font-size:13px}
    .portfolio-tool .summary-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
    .portfolio-tool .metric{
      background:var(--paper);border:1px solid var(--line);border-radius:15px;padding:17px 16px;min-height:116px
    }
    .portfolio-tool .metric .label{color:var(--muted);font-size:12px}
    .portfolio-tool .metric .value{font-family:var(--serif);font-size:28px;line-height:1.1;margin:12px 0 5px;font-variant-numeric:tabular-nums}
    .portfolio-tool .metric .sub{font-size:11px;color:var(--muted)}
    .portfolio-tool .metric.compact .value{font-size:23px}
    .portfolio-tool .control-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
    .portfolio-tool .button{
      appearance:none;border:1px solid var(--line-strong);background:var(--paper);border-radius:999px;
      padding:9px 14px;font-size:13px;line-height:1;transition: color var(--motion-fast) ease, border-color var(--motion-fast) ease, background-color var(--motion-fast) ease, transform var(--motion-fast) ease;
    }
    @media (hover: hover) and (pointer: fine){.portfolio-tool .button:hover{border-color:var(--ink);transform:translateY(-1px)}}
    .portfolio-tool .button.primary{background:var(--ink);color:var(--bg);border-color:var(--ink)}
    .portfolio-tool .button.ghost{background:transparent}
    .portfolio-tool .button.small{padding:7px 10px;font-size:11px}
    .portfolio-tool .button.danger{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 45%,var(--line))}
    .portfolio-tool .status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--faint);margin-right:6px}
    .portfolio-tool .status-dot.good{background:var(--good)}
    .portfolio-tool .status-dot.warn{background:var(--warn)}
    .portfolio-tool .status-dot.bad{background:var(--bad)}
    .portfolio-tool .table-wrap{
      width:100%;overflow:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper)
    }
    .portfolio-tool table{width:100%;border-collapse:collapse;min-width:1050px}
    .portfolio-tool th,.portfolio-tool td{border-bottom:1px solid var(--line);padding:10px 9px;text-align:right;vertical-align:middle}
    .portfolio-tool th{
      font-family:var(--mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:500;
      background:color-mix(in srgb,var(--paper) 88%,var(--soft));
      position:sticky;top:0;z-index:2;
    }
    .portfolio-tool th:first-child,.portfolio-tool td:first-child{text-align:left;padding-left:14px}
    .portfolio-tool tr:last-child td{border-bottom:0}
    .portfolio-tool tbody tr:hover{background:color-mix(in srgb,var(--soft) 55%,transparent)}
    .portfolio-tool .cell-input,.portfolio-tool .cell-select{
      width:100%;min-width:64px;border:0;border-bottom:1px solid transparent;background:transparent;padding:4px 2px;
      text-align:right;border-radius:0;outline:none;font-variant-numeric:tabular-nums
    }
    .portfolio-tool .cell-input:focus,.portfolio-tool .cell-select:focus{border-bottom-color:var(--ink)}
    .portfolio-tool .cell-select{text-align:left;min-width:92px}
    .portfolio-tool .symbol-input{text-align:left;font-family:var(--mono);font-weight:600;text-transform:uppercase}
    .portfolio-tool .name-input{text-align:left;min-width:110px}
    .portfolio-tool .readonly{color:var(--muted);font-variant-numeric:tabular-nums}
    .portfolio-tool .weight-over{color:var(--warn)}
    .portfolio-tool .weight-under{color:var(--blue)}
    .portfolio-tool .weight-ok{color:var(--good)}
    .portfolio-tool .tiny{font-family:var(--mono);font-size:10px;color:var(--muted)}
    .portfolio-tool .pill{
      display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:999px;
      padding:4px 8px;font-size:10px;color:var(--muted);white-space:nowrap
    }
    .portfolio-tool .chart-card,.portfolio-tool .panel{
      border:1px solid var(--line);background:var(--paper);border-radius:var(--radius);padding:20px;
    }
    .portfolio-tool .allocation-layout{display:grid;grid-template-columns:1.4fr .6fr;gap:14px}
    .portfolio-tool .allocation-bars{display:flex;flex-direction:column;gap:12px}
    .portfolio-tool .bar-row{display:grid;grid-template-columns:90px 1fr 70px;gap:12px;align-items:center}
    .portfolio-tool .bar-name{font-family:var(--mono);font-size:11px;overflow:hidden;text-overflow:ellipsis}
    .portfolio-tool .bar-track{height:10px;border-radius:999px;background:var(--soft);position:relative;overflow:hidden}
    .portfolio-tool .bar-current,.portfolio-tool .bar-target{position:absolute;left:0;top:0;height:100%;border-radius:999px}
    .portfolio-tool .bar-current{background:var(--ink);opacity:.75}
    .portfolio-tool .bar-target{height:2px;top:4px;background:var(--bad);opacity:.8}
    .portfolio-tool .bar-val{font-family:var(--mono);font-size:10px;color:var(--muted);text-align:right}
    .portfolio-tool .legend{display:flex;gap:14px;font-size:11px;color:var(--muted);margin-top:16px}
    .portfolio-tool .legend i{width:18px;height:4px;display:inline-block;margin-right:5px;vertical-align:middle;background:var(--ink)}
    .portfolio-tool .legend i.target{height:2px;background:var(--bad)}
    .portfolio-tool .form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
    .portfolio-tool .field{display:flex;flex-direction:column;gap:6px}
    .portfolio-tool .field label{font-size:11px;color:var(--muted)}
    .portfolio-tool .input,.portfolio-tool .select{
      border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:11px 12px;outline:none;width:100%
    }
    .portfolio-tool .input:focus,.portfolio-tool .select:focus{border-color:var(--line-strong)}
    .portfolio-tool .segmented{
      display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;border:1px solid var(--line);border-radius:999px;
      overflow:hidden;background:var(--paper)
    }
    .portfolio-tool .segmented button{border:0;border-right:1px solid var(--line);background:transparent;padding:9px 14px;font-size:12px;white-space:nowrap}
    .portfolio-tool .segmented button:last-child{border-right:0}
    .portfolio-tool .segmented button.active{background:var(--ink);color:var(--bg)}
    .portfolio-tool .trade-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .portfolio-tool .trade-list{display:flex;flex-direction:column;gap:0;margin-top:8px}
    .portfolio-tool .trade-item{
      display:grid;grid-template-columns:1fr auto auto;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);align-items:baseline
    }
    .portfolio-tool .trade-item:last-child{border-bottom:0}
    .portfolio-tool .trade-symbol{font-family:var(--mono);font-weight:600}
    .portfolio-tool .trade-action{font-family:var(--mono);font-size:10px;text-transform:uppercase}
    .portfolio-tool .trade-action.buy{color:var(--good)}
    .portfolio-tool .trade-action.sell{color:var(--bad)}
    .portfolio-tool .trade-amount{font-variant-numeric:tabular-nums}
    .portfolio-tool .empty{padding:28px 4px;color:var(--muted);font-family:var(--serif);font-size:20px}
    .portfolio-tool .note{border-left:2px solid var(--line-strong);padding:2px 0 2px 14px;color:var(--muted);font-size:12px;margin-top:14px}
    .portfolio-tool .risk-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}
    .portfolio-tool .stress-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:14px}
    .portfolio-tool .stress-list{display:flex;flex-direction:column;gap:10px}
    .portfolio-tool .stress-line{display:grid;grid-template-columns:1fr 110px 74px;gap:10px;align-items:center}
    .portfolio-tool .stress-line input{text-align:right}
    .portfolio-tool .impact-big{font-family:var(--serif);font-size:44px;line-height:1;margin:14px 0}
    .portfolio-tool .impact-big.negative{color:var(--bad)}
    .portfolio-tool .impact-big.positive{color:var(--good)}
    .portfolio-tool .dilution-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .portfolio-tool .result-box{
      border:1px solid var(--line);border-radius:14px;padding:18px;background:color-mix(in srgb,var(--soft) 45%,var(--paper))
    }
    .portfolio-tool .result-box .big{font-family:var(--serif);font-size:34px;margin:6px 0}
    .portfolio-tool .api-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
    .portfolio-tool .provider{
      border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--paper)
    }
    .portfolio-tool .provider-top{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:8px}
    .portfolio-tool .provider h4{margin:0;font-family:var(--serif);font-size:17px;font-weight:500}
    .portfolio-tool .provider p{margin:0;color:var(--muted);font-size:11px}
    .portfolio-tool .privacy{
      display:grid;grid-template-columns:1fr auto;gap:20px;align-items:start;
      padding:26px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper)
    }
    .portfolio-tool .privacy h3{font-family:var(--serif);font-size:25px;font-weight:500;margin:4px 0 9px}
    .portfolio-tool .privacy p{color:var(--muted);margin:0;max-width:700px}
    .portfolio-tool .footer{padding:34px 0;color:var(--muted);display:flex;justify-content:space-between;gap:20px;font-size:12px}
    .portfolio-tool .modal{
      position:fixed;inset:0;background:rgba(0,0,0,.26);display:none;align-items:center;justify-content:center;padding:20px;z-index:100
    }
    .portfolio-tool .modal.open{display:flex}
    .portfolio-tool .modal-card{
      width:min(760px,100%);max-height:90vh;overflow:auto;background:var(--bg);border:1px solid var(--line-strong);
      border-radius:22px;padding:24px;box-shadow:var(--shadow)
    }
    .portfolio-tool .modal-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:18px}
    .portfolio-tool .modal-head h3{margin:0;font-family:var(--serif);font-size:28px;font-weight:500}
    .portfolio-tool .toast{
      position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(20px);
      opacity:0;pointer-events:none;background:var(--ink);color:var(--bg);border-radius:999px;padding:9px 14px;
      font-size:12px;transition:.2s ease;z-index:200
    }
    .portfolio-tool .toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
    .portfolio-tool .checkbox{display:inline-flex;gap:7px;align-items:center;font-size:12px;color:var(--muted)}
    .portfolio-tool .checkbox input{accent-color:var(--ink)}
    .portfolio-tool .row-actions{white-space:nowrap}
    .portfolio-tool .source-badge{font-family:var(--mono);font-size:9px;color:var(--muted)}
    .portfolio-tool .target-sum{font-family:var(--mono);font-size:11px}
    .portfolio-tool .target-sum.bad{color:var(--bad)}
    .portfolio-tool .subtle-rule{height:1px;background:var(--line);margin:18px 0}
    .portfolio-tool .advanced{display:none}
    .portfolio-tool .advanced.open{display:block}
    .portfolio-tool .mono{font-family:var(--mono)}
    .portfolio-tool .right{text-align:right}
    .portfolio-tool .warning{color:var(--warn)}
    .portfolio-tool .danger{color:var(--bad)}
    .portfolio-tool .good{color:var(--good)}

    .portfolio-tool .frontier-chart{display:flex;flex-direction:column;gap:10px;margin-top:12px}
    .portfolio-tool .frontier-row{display:grid;grid-template-columns:72px 1fr 72px;gap:12px;align-items:center}
    .portfolio-tool .frontier-label,.portfolio-tool .frontier-value{font-family:var(--mono);font-size:10px;color:var(--muted)}
    .portfolio-tool .frontier-value{text-align:right}
    .portfolio-tool .frontier-track{height:9px;border-radius:999px;background:var(--soft);overflow:hidden;position:relative}
    .portfolio-tool .frontier-fill{height:100%;border-radius:999px;background:var(--ink);opacity:.78}
    .portfolio-tool .frontier-row.knee .frontier-label,.portfolio-tool .frontier-row.knee .frontier-value{color:var(--good)}
    .portfolio-tool .frontier-row.knee .frontier-fill{opacity:1}
    .portfolio-tool .routing-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:14px}
    .portfolio-tool .route-list{display:flex;flex-direction:column;gap:0;margin-top:10px}
    .portfolio-tool .route-item{display:grid;grid-template-columns:1fr auto auto;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);align-items:baseline}
    .portfolio-tool .route-item:last-child{border-bottom:0}
    .portfolio-tool .status-chip{display:inline-flex;align-items:center;border-radius:999px;padding:3px 8px;font-size:10px;font-family:var(--mono);border:1px solid var(--line);white-space:nowrap}
    .portfolio-tool .status-chip.quiet{color:var(--good)}
    .portfolio-tool .status-chip.drifting{color:var(--warn)}
    .portfolio-tool .status-chip.rebalance{color:var(--bad)}
    .portfolio-tool .budget-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0}
    .portfolio-tool .budget-row{display:grid;grid-template-columns:1fr 72px 72px 80px;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
    .portfolio-tool .budget-row:last-child{border-bottom:0}
    .portfolio-tool .budget-row input{text-align:right}
    .portfolio-tool .snapshot-actions{display:flex;gap:8px;flex-wrap:wrap}
    @media(max-width:980px){
      .portfolio-tool .summary-grid{grid-template-columns:repeat(3,1fr)}
      .portfolio-tool .form-grid{grid-template-columns:repeat(2,1fr)}
      .portfolio-tool .allocation-layout,.portfolio-tool .stress-layout,.portfolio-tool .dilution-grid,.portfolio-tool .routing-grid,.portfolio-tool .budget-grid{grid-template-columns:1fr}
      .portfolio-tool .risk-grid{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:680px){
      .portfolio-tool .portfolio-tool__shell{padding:0 16px 60px}
      .portfolio-tool .topbar{min-height:58px}
      .portfolio-tool .nav a.hide-mobile{display:none}
      .portfolio-tool .hero{padding:46px 0 30px}
      .portfolio-tool .lede{font-size:16px}
      .portfolio-tool .summary-grid{grid-template-columns:repeat(2,1fr)}
      .portfolio-tool .summary-grid .metric:first-child{grid-column:1/-1}
      .portfolio-tool .section{padding:28px 0}
      .portfolio-tool .section-head{align-items:flex-start;flex-direction:column;gap:8px}
      .portfolio-tool .section-head p{text-align:left}
      .portfolio-tool .form-grid{grid-template-columns:1fr 1fr}
      .portfolio-tool .trade-grid{grid-template-columns:1fr}
      .portfolio-tool .risk-grid{grid-template-columns:1fr 1fr}
      .portfolio-tool .api-grid{grid-template-columns:1fr}
      .portfolio-tool .segmented{width:100%;overflow:auto}
      .portfolio-tool .segmented button{padding:10px 12px}
      .portfolio-tool .privacy{grid-template-columns:1fr}
      .portfolio-tool .footer{flex-direction:column}
      .portfolio-tool .bar-row{grid-template-columns:72px 1fr 58px}
    }
  

.portfolio-tool .portfolio-tool__shell { max-width: var(--measure); padding-inline: var(--page-gutter); }
.portfolio-tool .hero { padding-top: clamp(3.75rem, 9vw, 7.5rem); }
.portfolio-tool .hero h1 { max-width: 12ch; font-size: clamp(3.2rem, 8vw, 6.8rem); }
.portfolio-tool .hero-tools { display: flex; align-items: center; gap: 0.75rem; margin-top: 1.5rem; }
.portfolio-tool .hero-tools > span { color: var(--muted); font-size: 0.75rem; }
.portfolio-tool .empty-start { margin: 0.8rem 0 0; color: var(--muted); font-size: 0.78rem; }
.portfolio-tool :is(button, input, select):focus-visible { outline: 2px solid var(--world-accent); outline-offset: 3px; }
.portfolio-tool .table-wrap { scrollbar-color: var(--line-strong) transparent; }
.portfolio-tool .modal { padding-top: max(1.25rem, env(safe-area-inset-top)); padding-bottom: max(1.25rem, env(safe-area-inset-bottom)); }
.portfolio-tool .modal-card { background: var(--world-bg); }
.portfolio-tool .site-footer { font-family: var(--font-body); }

@media (max-width: 680px) {
  .portfolio-tool .portfolio-tool__shell { padding-inline: var(--page-gutter); }
  .portfolio-tool .hero { padding-top: 3.2rem; }
  .portfolio-tool .hero h1 { font-size: clamp(3rem, 15vw, 4.8rem); }
  .portfolio-tool .summary-grid { grid-template-columns: 1fr 1fr; }
  .portfolio-tool .metric { min-height: 7rem; }
  .portfolio-tool .section-head .control-row { width: 100%; }
  .portfolio-tool .section-head .button { flex: 1 1 9rem; min-height: 2.75rem; }
}

@media (prefers-reduced-motion: reduce) {
  .portfolio-tool *, .portfolio-tool *::before, .portfolio-tool *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; }
}

.portfolio-tool select option,
.portfolio-tool select optgroup {
  color: var(--ink);
  background: var(--paper);
}