.calc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:0.85rem;margin-top:0.5rem;}
.calc-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1rem 1.1rem;transition:box-shadow 0.15s;}
.calc-card:hover{box-shadow:0 2px 10px rgba(0,0,0,0.06);}
.calc-card.drag-over{border-color:var(--accent);border-style:dashed;}
.calc-card-head{display:flex;align-items:center;gap:0.4rem;margin-bottom:0.75rem;flex-wrap:wrap;}
.calc-name{flex:1;font-size:0.85rem;font-weight:600;outline:none;border-bottom:1px solid transparent;cursor:text;min-width:120px;}
.calc-name:focus{border-bottom-color:var(--accent);}
.calc-type-sel{font-family:Inter,sans-serif;font-size:0.56rem;border:1px solid var(--border);border-radius:20px;padding:0.09rem 0.35rem;background:var(--surface2);color:var(--text3);cursor:pointer;outline:none;appearance:none;-webkit-appearance:none;}
.calc-type-sel:focus{border-color:var(--accent);}
.calc-fields{display:grid;grid-template-columns:1fr 1fr;gap:0.5rem 0.75rem;margin-bottom:0.85rem;}
.calc-field{}
.calc-fl{font-family:Inter,sans-serif;font-size:0.56rem;color:var(--text3);letter-spacing:0.05em;display:block;margin-bottom:0.2rem;}
.calc-fi{font-family:Inter,sans-serif;font-size:0.82rem;width:100%;padding:0.32rem 0.5rem;border:1px solid var(--border);border-radius:6px;background:var(--surface2);color:var(--text);outline:none;}
.calc-fi:focus{border-color:var(--accent);}
.calc-result{background:linear-gradient(135deg,rgba(0,163,114,0.06),rgba(59,107,232,0.06));border:1px solid rgba(0,163,114,0.18);border-radius:8px;padding:0.65rem 0.85rem;}
.calc-result-lbl{font-family:Inter,sans-serif;font-size:0.56rem;color:var(--text3);letter-spacing:0.08em;text-transform:uppercase;margin-bottom:0.2rem;}
.calc-result-val{font-size:1.3rem;font-weight:800;letter-spacing:-0.02em;background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.calc-result-extra{font-family:Inter,sans-serif;font-size:0.6rem;color:var(--text3);margin-top:0.2rem;}
.calc-empty{text-align:center;padding:3rem 1rem;color:var(--text3);font-family:Inter,sans-serif;font-size:0.78rem;}
.etf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:0.6rem;margin-top:0.75rem;}
.etf-card{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:0.7rem 0.85rem;cursor:pointer;transition:border-color 0.15s,box-shadow 0.15s;}
.etf-card:hover{border-color:rgba(0,163,114,0.4);box-shadow:0 2px 8px rgba(0,0,0,0.08);}
.etf-ticker{font-family:Inter,sans-serif;font-size:0.63rem;color:var(--accent2);letter-spacing:0.1em;margin-bottom:0.2rem;}
.etf-name{font-size:0.73rem;font-weight:600;margin-bottom:0.4rem;line-height:1.3;}
.etf-row{display:flex;justify-content:space-between;align-items:flex-end;}
.etf-alloc{font-family:Inter,sans-serif;font-size:0.93rem;font-weight:500;color:var(--accent);}
.etf-ter{font-family:Inter,sans-serif;font-size:0.59rem;color:var(--text3);}
.etf-val{font-family:Inter,sans-serif;font-size:0.67rem;color:var(--text3);margin-top:0.35rem;}
.etf-edit-row{padding:7px 0;border-bottom:0.5px solid var(--border);}
.etf-edit-row:last-child{border-bottom:none;}
.etf-row-l1{display:flex;gap:5px;align-items:center;margin-bottom:4px;}
.etf-row-l2{display:grid;grid-template-columns:52px 52px 64px 1fr;gap:5px;align-items:center;}
.etf-ei-flex{flex:1;min-width:0;width:auto!important;}
.etf-ei-ticker-col{width:48px!important;flex-shrink:0;}
.etf-ter-wrap{position:relative;}
.etf-ter-pct{position:absolute;right:3px;top:50%;transform:translateY(-50%);font-family:Inter,sans-serif;font-size:0.58rem;color:var(--text3);pointer-events:none;}
.etf-ei-ter{padding-right:14px!important;}
.etf-bp-wrap{position:relative;}
.etf-bp-cur{position:absolute;left:4px;top:50%;transform:translateY(-50%);font-family:Inter,sans-serif;font-size:0.58rem;color:var(--text3);pointer-events:none;}
.etf-ei-bp{padding-left:13px!important;}
/* Hide TER cell for types where TER is not applicable */
.etf-edit-row[data-inv-type="stock"] .etf-ter-wrap,
.etf-edit-row[data-inv-type="other"] .etf-ter-wrap{visibility:hidden;pointer-events:none;}
/* Investment type visual indicators */
.etf-type-stock{padding-left:6px;border-left:2px solid rgba(59,107,232,0.55);}
.etf-type-fund{padding-left:6px;border-left:2px solid rgba(124,58,237,0.45);}
.etf-type-other{padding-left:6px;border-left:2px solid rgba(136,136,170,0.5);}
.etf-ei{font-family:Inter,sans-serif;font-size:0.72rem;width:100%;padding:5px 7px;border:1px solid var(--border);border-radius:5px;background:var(--surface2);color:var(--text);outline:none;}
.etf-ei:focus{border-color:var(--accent);}
.etf-alloc-wrap{position:relative;}
.etf-pct{position:absolute;right:3px;top:50%;transform:translateY(-50%);font-family:Inter,sans-serif;font-size:0.58rem;color:var(--text3);pointer-events:none;}
.etf-ei-alloc{padding-right:14px!important;}
/* Remove number input spinners in ETF modal */
.etf-ei[type=number]::-webkit-outer-spin-button,
.etf-ei[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.etf-ei[type=number]{-moz-appearance:textfield;}
.etf-ticker-btn{background:none;border:none;cursor:pointer;font-family:Inter,sans-serif;font-size:0.63rem;color:var(--accent2);letter-spacing:0.1em;margin-bottom:0.2rem;padding:0;text-align:left;display:block;}
.etf-ticker-btn:hover{text-decoration:underline;opacity:0.8;}
/* ETF Fund Visualisation Bar */
.etf-bar{display:flex;border-radius:8px;overflow:hidden;width:100%;}
.etf-bar-card{background:var(--surface2);border-radius:10px;padding:4px;gap:4px;min-height:100px;align-items:stretch;}
.etf-seg{flex:0 0 auto;border-radius:7px;padding:0.65rem 0.75rem;cursor:pointer;transition:filter 0.15s;min-width:44px;overflow:hidden;position:relative;}
.etf-seg:hover{filter:brightness(1.08);}
.etf-seg-inner{display:flex;flex-direction:column;height:100%;}
.etf-seg-ticker{font-family:Inter,sans-serif;font-size:0.58rem;font-weight:700;letter-spacing:0.08em;margin-bottom:0.25rem;}
.etf-seg-pct{font-size:1.1rem;font-weight:800;line-height:1;margin-bottom:0.2rem;color:var(--text);}
.etf-seg-name{font-size:0.67rem;font-weight:600;line-height:1.25;color:var(--text2);}
.etf-seg-meta{font-family:Inter,sans-serif;font-size:0.55rem;margin-top:0.3rem;color:var(--text2);}
.etf-seg .etf-seg-name{display:none;}
.etf-seg .etf-seg-meta{display:none;}
.etf-seg.etf-xs .etf-seg-ticker{display:none;}
.etf-seg.etf-xs{padding:0.5rem 0.45rem;}
.etf-seg.etf-md .etf-seg-name,.etf-seg.etf-lg .etf-seg-name{display:block;}
.etf-seg.etf-md .etf-seg-meta,.etf-seg.etf-lg .etf-seg-meta{display:block;}
.etf-bar-strip{height:12px;border-radius:6px;gap:3px;overflow:hidden;align-items:stretch;min-height:unset;}
.etf-strip-seg{flex:0 0 auto;height:100%;}
.etf-strip-seg:first-child{border-radius:4px 0 0 4px;}
.etf-strip-seg:last-child{border-radius:0 4px 4px 0;}
.etf-fund-list{display:grid;grid-template-columns:1fr 1fr;gap:0 1.25rem;margin-top:0.75rem;}
.etf-fl-item{display:flex;align-items:flex-start;gap:0.5rem;padding:0.5rem 0;border-bottom:0.5px solid var(--border);cursor:pointer;transition:opacity 0.15s;}
.etf-fl-item:hover{opacity:0.75;}
.etf-fl-item:last-child{border-bottom:none;}
.etf-fl-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;margin-top:0.28rem;}
.etf-fl-body{flex:1;min-width:0;}
.etf-fl-name{font-size:0.78rem;font-weight:600;display:flex;align-items:baseline;gap:0.3rem;flex-wrap:wrap;}
.etf-fl-ticker{font-family:Inter,sans-serif;font-size:0.55rem;letter-spacing:0.06em;color:var(--text3);}
.etf-fl-sub{font-family:Inter,sans-serif;font-size:0.58rem;color:var(--text3);margin-top:0.08rem;}
.etf-fl-pct{font-size:0.88rem;font-weight:700;color:var(--text);flex-shrink:0;margin-left:auto;align-self:center;padding-left:0.5rem;}
