.position-row{
cursor:pointer;
transition:background .15s,box-shadow .15s}
.position-row:hover{
background:#f3f7f4}
.position-row:focus{
outline:2px solid #7fa497;
outline-offset:-2px;
background:#f3f7f4}
.row-chevron{
display:inline-block;
margin-left:7px;
color:#8ca096;
font-size:17px;
vertical-align:-1px}
.position-dialog{
width:min(940px,calc(100vw - 30px));
max-height:calc(100vh - 30px)}
.position-detail{
padding:27px}
.position-subtitle{
margin:5px 0 0;
color:var(--muted);
font-size:12px}
.position-hero{
display:grid;
grid-template-columns:1fr 1fr;
gap:1px;
background:var(--line);
border:1px solid var(--line);
border-radius:15px;
overflow:hidden;
margin-bottom:16px}
.position-hero>div{
background:#f8faf8;
padding:20px 22px}
.position-hero span,.position-hero strong,.position-hero small{
display:block}
.position-hero span,.position-metrics span{
color:var(--muted);
font-size:11px}
.position-value-label{
display:flex!important;
align-items:center;
gap:6px}
.position-value-label .position-info,
.position-return-label .position-info{
flex:0 0 auto;
width:15px;
height:15px;
font-size:9px;
line-height:12px}
.position-return-label{
display:flex!important;
align-items:center;
gap:6px}
.position-hero strong{
font:700 25px Manrope;
margin:6px 0 4px}
.position-hero small{
font-size:11px;
color:var(--muted)}
.position-metrics{
display:grid;
grid-template-columns:repeat(4,1fr);
border:1px solid var(--line);
border-radius:15px;
overflow:hidden}
.position-metrics>div{
padding:15px 17px;
border-right:1px solid var(--line);
border-bottom:1px solid var(--line);
min-height:72px}
.position-metrics>div:nth-child(4n){
border-right:0}
.position-metrics>div:nth-last-child(-n+4){
border-bottom:0}
.position-metrics strong{
display:block;
margin-top:7px;
font:700 13px Manrope}
.position-history-head{
display:flex;
align-items:end;
justify-content:space-between;
margin:25px 0 10px}
.position-history-head h3{
font:700 15px Manrope;
margin:0}
.position-history-head p{
color:var(--muted);
font-size:11px;
margin:4px 0 0}
.position-history{
border:1px solid var(--line);
border-radius:12px;
max-height:290px}
.position-history th{
position:sticky;
top:0;
background:#fff;
z-index:1}
.position-history .quote-eur{
display:block}
.position-transaction-note{
display:block;
max-width:260px;
margin-top:4px;
color:var(--muted);
font-weight:400;
font-style:italic;
white-space:pre-wrap;
overflow-wrap:anywhere}
.position-detail>.dialog-actions{
margin-bottom:-5px}

.return-neutral{
color:#78847f;
font-weight:600}
.quote-line{
display:flex;
justify-content:flex-end;
align-items:center;
gap:7px;
white-space:nowrap}
.quote-change{
display:inline-flex;
padding:3px 6px;
border-radius:7px;
font-size:10px;
font-weight:700;
background:#eef1ef}
.quote-change.return-positive{
background:#e5f2eb}
.quote-change.return-negative{
background:#f7e7e7}
.profile-button{
width:100%;
border:0;
background:transparent;
color:#fff;
padding:7px 5px;
border-radius:10px;
display:grid;
grid-template-columns:35px 1fr auto;
gap:10px;
align-items:center;
text-align:left;
cursor:pointer}
.profile-button:hover,.profile-button:focus{
background:rgba(255,255,255,.08);
outline:0}
.profile-button strong,.profile-button small{
display:block}
.profile-button small{
color:#95a8a1;
font-size:11px;
margin-top:2px;
overflow:hidden;
text-overflow:ellipsis}
.profile-chevron{
color:#95a8a1;
font-size:20px}
.settings-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:18px;
align-items:start}
.settings-card{
display:grid;
gap:15px}
.settings-card-head{
display:flex;
gap:12px;
align-items:center;
margin-bottom:4px}
.settings-card-head h2{
font-size:16px}
.settings-card-head p{
margin:4px 0 0;
color:var(--muted);
font-size:11px}
.settings-icon{
width:38px;
height:38px;
display:grid;
place-items:center;
border-radius:11px;
background:#e7f0eb;
color:var(--green);
font-size:18px}
.settings-card label{
font-size:11px;
font-weight:600;
color:#52615b}
.settings-card label>small{
font-weight:400;
color:var(--muted);
margin-left:4px}
.settings-card label input{
margin-top:6px}
.settings-card .btn{
justify-self:start}
.settings-preferences{
grid-column:1/-1}
.preference-row,.preference-toggle{
display:grid;
grid-template-columns:1fr 220px;
gap:20px;
align-items:center;
padding:14px 0;
border-bottom:1px solid var(--line)}
.preference-row strong,.preference-row small,.preference-toggle strong,.preference-toggle small{
display:block}
.preference-row small,.preference-toggle small{
font-weight:400;
color:var(--muted);
margin-top:4px}
.preference-toggle{
position:relative;
cursor:pointer}
.preference-toggle input{
position:absolute;
opacity:0;
pointer-events:none}
.preference-toggle i{
justify-self:end;
width:44px;
height:24px;
border-radius:99px;
background:#cdd5d1;
position:relative;
transition:.2s}
.preference-toggle i::after{
content:'';
position:absolute;
width:18px;
height:18px;
left:3px;
top:3px;
border-radius:50%;
background:#fff;
box-shadow:0 1px 4px rgba(0,0,0,.2);
transition:.2s}
.preference-toggle input:checked+i{
background:var(--green)}
.preference-toggle input:checked+i::after{
transform:translateX(20px)}
.privacy-mode .hero-value,.privacy-mode #net-gains,.privacy-mode #dividends,.privacy-mode #portfolio-cards strong,.privacy-mode #portfolio-body td:nth-child(n+4):nth-child(-n+7),.privacy-mode .position-hero strong,.privacy-mode .position-metrics strong,.privacy-mode #position-transactions td:nth-child(n+4){
filter:blur(6px);
transition:filter .15s;
user-select:none}
.privacy-mode .hero-value:hover,.privacy-mode #net-gains:hover,.privacy-mode #dividends:hover,.privacy-mode #portfolio-cards strong:hover,.privacy-mode #portfolio-body td:nth-child(n+4):nth-child(-n+7):hover,.privacy-mode .position-hero strong:hover,.privacy-mode .position-metrics strong:hover,.privacy-mode #position-transactions td:nth-child(n+4):hover{
filter:none;
user-select:auto}

.last-update.freshness-delayed strong{
color:var(--amber)}
.as-of.freshness-delayed{
background:#faf0df;
color:#8a6427}
.last-update.freshness-stale strong{
color:#a6533d}
.as-of.freshness-stale{
background:#f7e9e4;
color:#8f4938}
.last-update.freshness-closed strong{
color:#52758c}
.as-of.freshness-closed{
background:#eaf1f5;
color:#456b82}
.last-update.freshness-missing strong{
color:var(--muted)}
.background-status{
justify-self:end;
display:inline-flex;
align-items:center;
gap:7px;
width:max-content;
padding:7px 10px;
border-radius:99px;
background:#e7f3ed;
color:var(--green);
font-size:11px;
font-weight:700}
.background-status i{
width:7px;
height:7px;
border-radius:50%;
background:#38a875;
box-shadow:0 0 0 3px rgba(56,168,117,.14)}

@media(max-width:760px){
.position-detail{
padding:20px}
.position-hero{
grid-template-columns:1fr}
.position-metrics{
grid-template-columns:1fr 1fr}
.position-metrics>div:nth-child(2n){
border-right:0}
.position-metrics>div:nth-last-child(-n+4){
border-bottom:1px solid var(--line)}
.position-metrics>div:nth-last-child(-n+2){
border-bottom:0}
.position-history{
max-height:360px}
.position-history table{
min-width:680px}
}

@media(max-width:760px){
.settings-grid{
grid-template-columns:1fr}
.settings-preferences{
grid-column:auto}
.preference-row,.preference-toggle{
grid-template-columns:1fr}
.preference-toggle i{
justify-self:start}
.profile-button{
padding:7px 3px}
}

.portfolio-table-tools{
display:flex;
align-items:end;
gap:9px;
margin-bottom:12px;
position:relative}
.closed-positions-section{
margin-top:34px}
.closed-positions-head{
margin-bottom:12px}
.closed-positions-table{
min-width:720px}
.closed-position-row .asset-icon{
filter:saturate(.65)}
.closed-position-row .asset-cell small{
color:var(--muted)}
.portfolio-table-tools>label{
font-size:10px;
font-weight:700;
color:var(--muted);
text-transform:uppercase;
letter-spacing:.05em}
.portfolio-table-tools>label select{
min-width:210px;
margin-top:5px;
text-transform:none;
letter-spacing:0}
.column-picker-wrap{
position:relative}
.column-picker{
position:absolute;
z-index:12;
top:calc(100% + 7px);
left:0;
width:310px;
background:#fff;
border:1px solid var(--line);
border-radius:13px;
box-shadow:0 18px 45px rgba(20,45,37,.18);
padding:15px}
.column-picker-head{
padding-bottom:11px;
border-bottom:1px solid var(--line)}
.column-picker-head strong,.column-picker-head small{
display:block}
.column-picker-head small{
color:var(--muted);
font-size:10px;
margin-top:3px}
.column-picker #column-options{
display:grid;
grid-template-columns:1fr 1fr;
gap:4px 10px;
margin-top:10px;
max-height:290px;
overflow:auto}
.column-picker label{
display:flex;
align-items:center;
gap:7px;
padding:6px;
border-radius:7px;
font-size:11px;
cursor:pointer}
.column-picker label:hover{
background:#f4f7f5}
.column-picker input{
width:auto;
margin:0}
.column-picker input:disabled{
accent-color:var(--green)}
.danger-text{
color:var(--red);
background:transparent;
border:0}
.column-title{
display:inline-flex;
align-items:center;
justify-content:flex-end;
gap:5px;
white-space:nowrap}
.th:not(.numeric) .column-title{
justify-content:flex-start}
.column-info{
width:16px;
height:16px;
border-radius:50%;
border:1px solid #aab5b0;
background:#fff;
color:#708078;
font:700 10px Georgia;
line-height:13px;
padding:0;
cursor:help;
text-transform:none}
.column-info:hover,.column-info:focus{
background:var(--forest);
border-color:var(--forest);
color:#fff;
outline:0}
.unavailable{
color:#9aa49f;
font-style:italic;
font-size:11px}
.small-dialog{
width:min(450px,calc(100vw - 30px))}
.small-dialog label{
font-size:11px;
font-weight:600;
color:#52615b}
.small-dialog label input{
margin-top:6px}
.small-dialog label small{
display:block;
margin-top:5px;
color:var(--muted);
font-weight:400}
.portfolio-table{
min-width:max-content}
.portfolio-table th,.portfolio-table td{
min-width:110px}
.portfolio-table th:first-child,.portfolio-table td:first-child{
position:sticky;
left:0;
z-index:2;
background:#fff;
min-width:235px}
.portfolio-table th:first-child{
z-index:3}
.portfolio-table .position-row:hover td:first-child{
background:#f3f7f4}
.privacy-mode #portfolio-body .numeric,
.privacy-mode #closed-positions-body .numeric{
filter:blur(6px);
transition:filter .15s;
user-select:none}
.privacy-mode #portfolio-body .numeric:hover,
.privacy-mode #closed-positions-body .numeric:hover{
filter:none;
user-select:auto}

.privacy-mode #daily-change,
.privacy-mode #period-result strong,
.privacy-mode #performance-chart,
.privacy-mode #performance-tooltip,
.privacy-mode #recent-transactions .numeric,
.privacy-mode #transactions-body .numeric:not(.actions-cell),
.privacy-mode #admin-user-transactions .numeric,
.privacy-mode #admin-users-body td:nth-child(4),
.privacy-mode #admin-transactions-count{
filter:blur(6px);
transition:filter .15s;
user-select:none}
.privacy-mode #daily-change:hover,
.privacy-mode #period-result strong:hover,
.privacy-mode #performance-chart:hover,
.privacy-mode #performance-tooltip:hover,
.privacy-mode #recent-transactions .numeric:hover,
.privacy-mode #transactions-body .numeric:not(.actions-cell):hover,
.privacy-mode #admin-user-transactions .numeric:hover,
.privacy-mode #admin-users-body td:nth-child(4):hover,
.privacy-mode #admin-transactions-count:hover{
filter:none;
user-select:auto}

.performance-methods{
margin:18px 0;
padding:20px;
border:1px solid var(--line);
border-radius:16px;
background:#fff}
.performance-methods-head{
display:flex;
justify-content:space-between;
gap:28px;
align-items:flex-start}
.performance-methods-head h2{
margin:2px 0 0;
font:700 18px Manrope}
.performance-methods-intro{
max-width:580px;
margin:7px 0 0;
color:var(--muted);
font-size:13px;
line-height:1.5}
.performance-methods details{
width:min(390px,100%);
flex:0 0 auto;
color:var(--muted);
font-size:12px}
.performance-methods summary{
color:var(--green);
font-weight:700;
cursor:pointer}
.performance-methods details p{
margin:8px 0 0;
line-height:1.55}
.performance-method-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:10px;
margin-top:16px}
.performance-method-card{
min-width:0;
padding:15px;
border-radius:12px;
border:1px solid transparent;
background:#f6f8f6}
.performance-method-card-primary{
border-color:#b7d8c8;
background:#f1f8f4}
.performance-method-card-personal{
background:#f7f6f1}
.performance-method-kicker{
display:block;
margin-bottom:7px;
color:var(--muted);
font-size:10px;
font-weight:700;
letter-spacing:.08em}
.performance-method-name{
min-height:36px;
font-weight:700;
line-height:1.35}
.performance-method-name abbr{
display:inline-block;
margin-left:4px;
padding:2px 5px;
border:0;
border-radius:5px;
background:#e6ece8;
color:var(--muted);
font-size:9px;
font-weight:700;
letter-spacing:.03em;
text-decoration:none;
vertical-align:2px}
.performance-method-grid strong{
display:block;
margin:10px 0 4px;
font:700 22px Manrope}
.performance-method-grid small{
display:block;
color:var(--muted);
font-size:11px;
line-height:1.4}
.performance-benchmark-summary{
margin:12px 0 0;
padding:10px 12px;
border-radius:9px;
background:#f6f8f6;
font-size:12px;
font-weight:700}
.performance-benchmark-summary.positive{
background:#edf7f1}
.performance-benchmark-summary.negative{
background:#fbf0f0}
.privacy-mode .performance-method-grid strong{
filter:blur(6px)}
.privacy-mode .performance-method-grid strong:hover{
filter:none}
@media(max-width:900px){
.performance-methods-head{
display:block}
.performance-methods details{
margin-top:12px}}
@media(max-width:760px){
.performance-method-grid{
grid-template-columns:1fr}}

@media(max-width:760px){
.portfolio-table-tools{
align-items:stretch;
flex-wrap:wrap}
.portfolio-table-tools>label{
width:100%}
.portfolio-table-tools>label select{
width:100%}
.column-picker{
position:fixed;
left:15px;
right:15px;
top:auto;
bottom:15px;
width:auto;
max-height:70vh}
.column-picker #column-options{
grid-template-columns:1fr}
.portfolio-table-tools .btn{
flex:1}
.portfolio-table th:first-child,.portfolio-table td:first-child{
min-width:190px}
}

#column-tooltip{
position:fixed;
z-index:1000;
width:min(310px,calc(100vw - 24px));
padding:10px 12px;
border-radius:9px;
background:#142f27;
color:#fff;
font-size:11px;
line-height:1.45;
box-shadow:0 10px 30px rgba(12,29,24,.28);
pointer-events:none}
#column-tooltip::before{
content:'';
position:absolute;
top:-5px;
left:calc(50% - 5px);
width:10px;
height:10px;
background:#142f27;
transform:rotate(45deg)}

.chart-tooltip{
position:absolute;
z-index:3;
transform:translate(-50%,-100%);
background:#fff;
color:var(--ink);
border:1px solid #dce5e0;
border-radius:9px;
padding:8px 10px;
box-shadow:0 8px 24px rgba(7,27,21,.2);
pointer-events:none;
white-space:nowrap}
.chart-tooltip strong,.chart-tooltip span{
display:block}
.chart-tooltip strong{
font:700 12px Manrope}
.chart-tooltip span{
color:var(--muted);
font-size:10px;
margin-top:2px}

.sidebar-close{
display:none}
.quote-previous{
display:block;
color:var(--muted);
font-size:9px;
margin-top:4px}
.quote-updated{
display:block;
color:var(--muted);
font-size:9px;
margin-top:6px;
white-space:nowrap}
.asset-cell small.asset-refresh{
margin-top:5px;
color:var(--green);
line-height:1.35}
.asset-cell small.asset-refresh.has-reason{
color:#8a6427}

.panel-actions{
display:flex;
align-items:center;
gap:14px}
.allocation-modes{
display:flex;
padding:3px;
border-radius:9px;
background:#eef2ef}
.allocation-modes button{
border:0;
border-radius:7px;
padding:6px 9px;
background:transparent;
color:var(--muted);
font:600 10px "DM Sans";
cursor:pointer}
.allocation-modes button.active{
background:#fff;
color:var(--forest);
box-shadow:0 1px 5px rgba(20,45,37,.12)}

.position-bars{
display:grid;
gap:10px;
min-height:210px;
align-content:start}
.position-bar-row{
display:grid;
grid-template-columns:minmax(90px,130px) minmax(90px,1fr) auto;
gap:10px;
align-items:center}
.position-bar-label,.position-bar-value{
min-width:0}
.position-bar-label strong,.position-bar-label small,.position-bar-value strong,.position-bar-value small{
display:block}
.position-bar-label strong{
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
font-size:11px}
.position-bar-label small,.position-bar-value small{
color:var(--muted);
font-size:9px;
margin-top:2px}
.position-bar-track{
height:9px;
border-radius:99px;
background:#edf2ef;
overflow:hidden}
.position-bar-track i{
display:block;
height:100%;
border-radius:inherit;
background:linear-gradient(90deg,#315c4d,#77997e)}
.position-bar-value{
text-align:right}
.position-bar-value strong{
font-size:10px}
.position-bar-value small{
white-space:nowrap}

@media(max-width:760px){
.sidebar-close{
display:grid;
place-items:center;
position:absolute;
right:14px;
top:18px;
width:36px;
height:36px;
padding:0;
border:1px solid rgba(255,255,255,.16);
border-radius:50%;
background:rgba(255,255,255,.07);
color:#fff;
font:300 27px/1 "DM Sans";
cursor:pointer}
.sidebar-close:hover,.sidebar-close:focus{
background:rgba(255,255,255,.15);
outline:0}
.hero-card{
height:auto;
min-height:0}
.hero-card #performance-chart,.hero-card .chart-tooltip{
display:none}
.hero-card .periods{
position:static;
width:max-content;
margin:18px 0 0}
.hero-card .period-result{
position:static;
text-align:left;
margin-top:12px}
.hero-card .period-result span{
display:block}
}

@media(max-width:760px){
.dashboard-grid .panel-head{
gap:12px;
flex-wrap:wrap}
.dashboard-grid .panel-actions{
width:100%;
justify-content:space-between}
.allocation-modes button{
padding:7px 11px}
}

@media(max-width:480px){
.position-bar-row{
grid-template-columns:82px minmax(60px,1fr) auto;
gap:7px}
.position-bar-value small{
font-size:8px}
}

.period-result{
position:absolute;
right:27px;
top:67px;
text-align:right}
.period-result span,.period-result strong{
display:block}
.period-result span{
color:#9eb3ab;
font-size:9px;
text-transform:uppercase;
letter-spacing:.06em}
.period-result strong{
font:700 16px Manrope;
margin-top:3px}
.period-result .neutral{
color:#c3d0cb}

@media(max-width:760px){
.period-result{
right:18px;
top:72px}
.period-result span{
display:none}
.period-result strong{
font-size:14px}
}