/* =====================================================================
   DOMINO — Portfolio (Asset Management mission control)
   Loads after domino.css. Reuses .seg, .tag, .btn.
   ===================================================================== */

.pf { height: 100%; display: flex; flex-direction: column; background: var(--canvas); min-height: 0; }
.pf__toolbar { flex: 0 0 auto; display: flex; align-items: center; gap: 14px; padding: 12px var(--gutter); border-bottom: 1px solid var(--hairline); background: var(--surface); }
.pf__toolbar .seg { background: var(--neutral-100); }
.pf__spacer { flex: 1; }
.pf__scroll { flex: 1; overflow-y: auto; padding: 18px var(--gutter) 28px; scrollbar-width: thin; scrollbar-color: var(--slate-200) transparent; }
.pf__scroll::-webkit-scrollbar { width: 10px; }
.pf__scroll::-webkit-scrollbar-thumb { background: var(--slate-200); border-radius: 5px; border: 3px solid var(--canvas); }

/* KPI band — tight */
.pf-kpis { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1px; background: var(--hairline-soft); border: 1px solid var(--hairline); border-radius: var(--r-card); overflow: hidden; margin-bottom: 16px; }
.pf-kpi { background: var(--surface); padding: 13px 16px; }
.pf-kpi__l { font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--slate-400); font-weight: 600; }
.pf-kpi__v { font-size: 24px; font-weight: var(--w-stat); color: var(--ink-900); letter-spacing: -0.02em; margin-top: 6px; font-feature-settings: "tnum" 1; }
.pf-kpi__s { font-size: 11.5px; color: var(--slate-400); margin-top: 4px; }

.pf-delta { display: inline-flex; align-items: center; gap: 2px; font-weight: 600; }
.pf-delta.is-up { color: var(--success); }
.pf-delta.is-down { color: var(--danger); }
.pf-delta svg { width: 11px; height: 11px; }

/* layout grid */
.pf-grid { display: grid; grid-template-columns: 1.7fr 1fr; gap: 16px; margin-bottom: 16px; align-items: start; }
.pf-panel { background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--r-card); box-shadow: var(--shadow-xs); overflow: hidden; }
.pf-panel__h { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; border-bottom: 1px solid var(--hairline); }
.pf-panel__h > span:first-child { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--ink-900); letter-spacing: -0.01em; }
.pf-panel__h svg { color: var(--slate-500); }
.pf-panel__hint { font-size: 11.5px; color: var(--slate-400); }

/* map */
.pf-map { position: relative; height: 360px; background: var(--neutral-100); }
.pf-map iframe { width: 100%; height: 100%; border: 0; display: block; filter: saturate(0.92); }
.pf-map__pins { position: absolute; inset: 0; pointer-events: none; }
.pf-pin { position: absolute; transform: translate(-50%, -50%); border-radius: 50%; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,0.35); pointer-events: auto; cursor: pointer; transition: transform var(--duration-fast) var(--ease-out); }
.pf-pin:hover { transform: translate(-50%, -50%) scale(1.25); z-index: 3; }
.pf-pin--success { background: var(--success); }
.pf-pin--info { background: var(--info); }
.pf-pin--warn { background: var(--warning); }
.pf-tip { position: absolute; transform: translate(-50%, calc(-100% - 14px)); background: var(--ink-900); color: var(--ivory); border-radius: var(--r-control); padding: 8px 11px; box-shadow: var(--shadow-lg); white-space: nowrap; pointer-events: none; z-index: 5; }
.app.theme-dark .pf-tip { background: #1e2c39; border: 1px solid var(--hairline); }
.pf-tip__n { font-size: 12.5px; font-weight: 600; }
.pf-tip__m { font-size: 11px; opacity: 0.7; margin-top: 2px; }
.pf-legend { display: flex; align-items: center; gap: 16px; padding: 11px 16px; border-top: 1px solid var(--hairline); flex-wrap: wrap; }
.pf-leg { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--slate-600); }
.pf-leg--note { margin-left: auto; color: var(--slate-400); }
.pf-dot { width: 9px; height: 9px; border-radius: 50%; }

/* side panels */
.pf-side { display: flex; flex-direction: column; gap: 16px; }
.pf-vs { padding: 14px 16px; display: flex; flex-direction: column; gap: 14px; }
.pf-perf__top { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 6px; }
.pf-perf__l { font-size: 12px; color: var(--slate-500); font-weight: 500; }
.pf-perf__v { font-size: 12.5px; font-weight: 600; color: var(--ink-900); font-feature-settings: "tnum" 1; }
.pf-perf__uw { font-size: 11px; color: var(--slate-400); font-weight: 400; }
.pf-perf__track { position: relative; height: 8px; background: var(--neutral-100); border-radius: 4px; overflow: hidden; }
.pf-perf__fill { height: 100%; border-radius: 4px; }
.pf-perf__fill.is-up { background: var(--success); }
.pf-perf__fill.is-down { background: var(--warning); }
.pf-perf__uwmark { position: absolute; top: -2px; bottom: -2px; width: 2px; background: var(--ink-800); z-index: 2; }

.pf-tr { padding: 6px 16px 14px; }
.pf-tr__row { display: flex; align-items: center; justify-content: space-between; padding: 9px 0; border-top: 1px solid var(--hairline-soft); font-size: 13px; color: var(--slate-600); }
.pf-tr__row:first-child { border-top: 0; }
.pf-tr__row b { color: var(--ink-900); font-weight: 600; }

/* asset table */
.pf-table-panel { overflow: visible; }
.pf-table-wrap { overflow-x: auto; }
.pf-table { width: 100%; border-collapse: collapse; }
.pf-table th { text-align: left; font-size: 10px; letter-spacing: 0.07em; text-transform: uppercase; color: var(--slate-400); font-weight: 600; padding: 11px 14px; border-bottom: 1px solid var(--hairline); white-space: nowrap; cursor: pointer; }
.pf-table th.num, .pf-table td.num { text-align: right; font-feature-settings: "tnum" 1; }
.pf-table td { padding: 12px 14px; border-bottom: 1px solid var(--hairline-soft); font-size: 13px; color: var(--ink-800); white-space: nowrap; }
.pf-table tbody tr:hover { background: var(--neutral-50); }
.pf-table td:first-child, .pf-table th:first-child { padding-left: 16px; }
.pf-table td:last-child, .pf-table th:last-child { padding-right: 16px; }
.pf-tname { font-weight: 600; color: var(--ink-900); letter-spacing: -0.01em; }
.pf-tsub { font-size: 11px; color: var(--slate-400); margin-top: 2px; }
.pf-val { font-weight: 600; color: var(--ink-900); }
.pf-noivs { display: inline-flex; align-items: center; gap: 8px; justify-content: flex-end; }
.pf-noivs__bar { width: 54px; height: 6px; border-radius: 3px; background: var(--neutral-100); overflow: hidden; position: relative; }
.pf-noivs__bar i { position: absolute; top: 0; bottom: 0; left: 0; border-radius: 3px; }
.pf-noivs__bar i.is-up { background: var(--success); }
.pf-noivs__bar i.is-down { background: var(--warning); }
.pf-irr { font-weight: 600; }
.pf-irr.is-strong { color: var(--success); }
.pf-irr.is-mid { color: var(--ink-800); }
.pf-irr.is-soft { color: var(--warning); }

@media (max-width: 1080px) {
  .pf-kpis { grid-template-columns: repeat(3, 1fr); }
  .pf-grid { grid-template-columns: 1fr; }
}