:root { color-scheme:light; font-family:Inter,system-ui,sans-serif; --text:#17202a; --muted:#697582; --page:#f4f6f8; --surface:#fff; --header:#101820; --header-text:#fff; --border:#ccd3da; --soft-border:#e6eaee; --secondary:#e9edf0; --code:#edf0f2; --shadow:rgba(0,0,0,.06); color:var(--text); background:var(--page); }
:root[data-theme="dark"] { color-scheme:dark; --text:#e8edf2; --muted:#aab5c0; --page:#11161c; --surface:#1a222b; --header:#080c10; --header-text:#f5f7fa; --border:#46515d; --soft-border:#303b46; --secondary:#303b46; --code:#29333d; --shadow:rgba(0,0,0,.28); }
* { box-sizing: border-box; }
body { margin:0; background:var(--page); color:var(--text); transition:background .2s,color .2s; }
header { background:var(--header); color:var(--header-text); padding:16px 4vw; display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; }
.brand { display:flex; align-items:center; gap:10px; }
.brand-logo { width:44px; height:44px; flex:0 0 44px; padding:3px; overflow:hidden; border:1px solid rgba(255,255,255,.16); border-radius:11px; background:#fff; }
.brand-logo img { display:block; width:100%; height:100%; border-radius:7px; object-fit:cover; }
.brand-copy { display:grid; gap:2px; }
.brand strong { font-size:20px; font-weight:800; }
.brand small { color:var(--header-text); font-size:11px; font-weight:500; opacity:.68; }
nav { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
nav>a { padding:8px 10px; border-radius:7px; }
nav a { color:var(--header-text); text-decoration:none; opacity:.88; }
nav>a:hover, nav>a.active { background:rgba(255,255,255,.12); opacity:1; }
.menu-toggle { display:none; width:42px; height:38px; padding:9px; flex-direction:column; justify-content:space-between; background:transparent; }
.menu-toggle span { display:block; height:2px; width:100%; background:var(--header-text); border-radius:2px; }
.theme-toggle { display:flex; align-items:center; gap:6px; padding:0; background:transparent; color:var(--header-text); font-weight:inherit; opacity:.88; }
.profile-menu { position:relative; }
.profile-menu summary { display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:8px; cursor:pointer; list-style:none; font-weight:700; }
.profile-menu summary::-webkit-details-marker { display:none; }
.profile-menu summary:hover, .profile-menu[open] summary { background:rgba(255,255,255,.12); }
.profile-menu svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }
.notification-badge { display:inline-flex; min-width:19px; height:19px; align-items:center; justify-content:center; padding:0 5px; border-radius:999px; color:#fff; background:#dc3545; box-shadow:0 0 0 2px var(--header); font-size:11px; font-weight:800; line-height:1; }
.profile-chevron { color:var(--muted); }
.profile-dropdown { position:absolute; z-index:20; top:calc(100% + 8px); right:0; width:210px; padding:7px; border:1px solid var(--soft-border); border-radius:11px; background:var(--surface); box-shadow:0 12px 30px rgba(0,0,0,.2); }
.profile-dropdown a, .profile-dropdown button { display:flex; width:100%; padding:10px 11px; border-radius:7px; color:var(--text); background:transparent; text-align:left; text-decoration:none; font:inherit; font-weight:700; opacity:1; }
.profile-dropdown a:hover, .profile-dropdown button:hover, .profile-dropdown a.active { background:var(--secondary); }
.profile-dropdown .theme-toggle { gap:8px; }
main { width:min(1200px, 92vw); margin:32px auto; }
.app-footer { width:min(1200px,92vw); margin:8px auto 28px; padding-top:16px; border-top:1px solid var(--soft-border); color:var(--muted); text-align:center; line-height:1.5; }
.app-footer small { font-size:11px; }
h1 { margin-top:0; }
.heading-context { color:var(--muted); font-weight:650; }
.section-tabs { display:flex; width:100%; gap:4px; margin:-6px 0 22px; padding:5px; overflow-x:auto; border:1px solid var(--soft-border); border-radius:10px; background:var(--surface); }
.section-tabs a { flex:1; min-width:130px; padding:10px 16px; border-radius:7px; color:var(--muted); text-align:center; text-decoration:none; font-weight:700; opacity:1; }
.section-tabs a:hover { background:var(--secondary); color:var(--text); }
.section-tabs a.active { background:var(--header); color:var(--header-text); }
.sub-tabs { display:flex; width:fit-content; gap:6px; margin:-10px 0 22px; padding-bottom:7px; border-bottom:1px solid var(--soft-border); }
#chart-view { scroll-margin-top:16px; }
.sub-tabs a { padding:8px 12px; border-radius:7px; color:var(--muted); text-decoration:none; font-size:14px; font-weight:700; opacity:1; }
.sub-tabs a:hover { color:var(--text); background:var(--secondary); }
.sub-tabs a.active { color:var(--text); background:var(--secondary); }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px; margin-bottom:22px; }
.cards article, .panel, .login-card { background:var(--surface); border-radius:14px; padding:20px; box-shadow:0 4px 18px var(--shadow); }
.cards span { display:block; color:var(--muted); font-size:14px; margin-bottom:8px; }
.cards strong { font-size:24px; }
.panel { margin-bottom:22px; overflow:hidden; }
.panel-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.prices-intro { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.prices-intro h2, .prices-intro p { margin-top:0; }
.prices-intro p { margin-bottom:0; color:var(--muted); }
.app-dialog { width:min(520px,calc(100% - 32px)); padding:0; color:var(--text); background:var(--surface); border:1px solid var(--border); border-radius:16px; box-shadow:0 24px 70px rgba(0,0,0,.45); }
.app-dialog::backdrop { background:rgba(0,0,0,.68); backdrop-filter:blur(4px); }
.app-dialog-content { padding:24px; }
.app-dialog-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:18px; }
.app-dialog-heading h2 { margin:0 0 4px; }
.app-dialog-close { min-width:38px; width:38px; height:38px; padding:0; font-size:22px; }
.dialog-danger-action { margin-top:12px; }
.danger-zone { display:flex; align-items:center; justify-content:space-between; gap:24px; border:1px solid color-mix(in srgb,#dc3545 45%,var(--soft-border)); }
.danger-zone h3, .danger-zone p { margin-top:0; }
.danger-zone p { margin-bottom:0; }
.form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; align-items:end; }
.form-grid > *, .transaction-value-group > * { min-width:0; }
.transaction-form { grid-template-columns:minmax(300px,2fr) repeat(2,minmax(160px,1fr)); max-width:1000px; font-size:14px; }
.transaction-form input, .transaction-form select { padding:9px 10px; font-size:14px; font-weight:400; }
.transaction-value-group { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-column:span 2; gap:10px; }
.conditional-fields { grid-column:1/-1; margin:2px 0 0; padding:18px; border:1px solid var(--soft-border); border-radius:10px; background:var(--page); }
.conditional-fields legend { padding:0 7px; font-weight:800; }
.conditional-fields[hidden] { display:none; }
.bond-cost-preview { display:grid; align-self:stretch; align-content:center; gap:5px; padding:12px 14px; border:1px solid var(--soft-border); border-radius:9px; background:var(--page); }
.bond-cost-preview span { color:var(--muted); font-size:13px; font-weight:700; }
.bond-cost-preview strong { font-size:20px; }
.bond-form { gap:16px; }
.bond-form-section { grid-column:1/-1; margin:0; padding:16px; border:1px solid var(--soft-border); border-radius:11px; background:var(--page); }
.bond-form-section legend { padding:0 7px; font-size:14px; font-weight:800; }
.bond-section-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.bond-identity-grid { grid-template-columns:1fr 1.5fr 1.25fr 1fr 1fr .65fr; }
.bond-purchase-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.bond-details-grid { grid-template-columns:1fr .7fr 1fr 1.5fr; }
.bond-form>button, .bond-form>.button { justify-self:start; min-width:180px; }
.settings-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:22px; align-items:start; }
.settings-form { display:grid; gap:16px; }
.page-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:22px; }
.page-heading h1 { margin-bottom:5px; }
.page-heading p { margin:0; }
.pillars-total { padding:11px 15px; border-radius:9px; background:var(--surface); box-shadow:0 4px 18px var(--shadow); white-space:nowrap; }
.pillar-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:22px; }
.pillar-card { --pillar-color:#2563eb; padding:20px; border-top:4px solid var(--pillar-color); border-radius:14px; background:var(--surface); box-shadow:0 4px 18px var(--shadow); }
.pillar-card.pillar-2 { --pillar-color:#0891b2; }
.pillar-card.pillar-3 { --pillar-color:#7c3aed; }
.pillar-card.pillar-4 { --pillar-color:#db2777; }
.pillar-card-heading { display:flex; align-items:center; gap:11px; }
.pillar-card h2 { margin:0; font-size:18px; }
.pillar-number { display:grid; flex:0 0 34px; width:34px; height:34px; place-items:center; border-radius:50%; background:var(--pillar-color); color:#fff; font-weight:900; }
.pillar-card>p { min-height:54px; color:var(--muted); font-size:13px; }
.pillar-values { display:flex; justify-content:space-between; align-items:end; gap:8px; margin:18px 0 10px; }
.pillar-values strong { font-size:22px; }
.pillar-values span { color:var(--muted); font-size:12px; text-align:right; }
.progress-track { height:10px; overflow:hidden; border-radius:999px; background:var(--secondary); }
.progress-track span { display:block; width:var(--progress); height:100%; border-radius:inherit; background:var(--pillar-color); transition:width .35s ease; }
.pillar-goal { display:flex; justify-content:space-between; gap:8px; margin-top:9px; font-size:13px; }
.pillar-details { display:grid; gap:10px; }
.pillar-detail { border:1px solid var(--soft-border); border-radius:10px; overflow:hidden; }
.pillar-detail>summary { display:flex; justify-content:space-between; padding:14px 16px; cursor:pointer; background:var(--page); }
.pillar-detail>summary b { display:inline-grid; width:25px; height:25px; margin-right:7px; place-items:center; border-radius:50%; background:var(--header); color:var(--header-text); }
.pillar-summary-actions { display:flex; align-items:center; gap:12px; }
.pillar-inline-add { padding:7px 10px; }
.pillar-item-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.pillar-item-heading form { margin:0; }
.compact-button { padding:7px 10px; font-size:12px; }
.pillar-select-form select { min-width:190px; padding:8px 10px; }
.pillar-add-button { width:100%; margin-top:16px; }
.pillar-add-button span { font-size:18px; line-height:0; }
.pillar-dialog { width:min(620px,92vw); max-height:82vh; padding:0; border:1px solid var(--soft-border); border-radius:14px; background:var(--surface); color:var(--text); box-shadow:0 24px 70px rgba(0,0,0,.35); }
.pillar-dialog::backdrop { background:rgba(5,10,16,.62); backdrop-filter:blur(2px); }
.pillar-dialog form { padding:22px; }
.dialog-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; margin-bottom:18px; }
.dialog-heading h2 { margin:0 0 4px; }
.dialog-close { width:38px; height:38px; padding:0; font-size:24px; }
.assignment-list { display:grid; gap:8px; max-height:48vh; overflow-y:auto; }
.assignment-item { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px; padding:12px; border:1px solid var(--soft-border); border-radius:9px; cursor:pointer; }
.assignment-item:hover { background:var(--page); }
.assignment-item input { width:18px; height:18px; }
.assignment-item span { display:grid; gap:3px; }
.assignment-item>b { white-space:nowrap; }
.dialog-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:20px; }
.pillar-badge { display:inline-block; padding:5px 8px; border-radius:999px; background:var(--secondary); font-size:12px; font-weight:800; }
button:disabled { cursor:not-allowed; opacity:.5; }
.dashboard-pillars-panel>.panel-heading { margin-bottom:18px; }
.dashboard-pillars-panel .pillar-grid { margin-bottom:0; }
.dashboard-pillar-grid .pillar-card>p { display:none; }
@media(max-width:1000px){.pillar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1100px){.transaction-form{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}.transaction-title-field{grid-column:1/-1}.transaction-value-group{grid-column:1/-1}}
@media(max-width:1100px){.bond-identity-grid,.bond-section-grid,.bond-details-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.transaction-form{grid-template-columns:1fr}.transaction-title-field{grid-column:auto}}
@media(max-width:700px){.prices-intro{align-items:stretch;flex-direction:column}.prices-intro>button{width:100%}.panel-heading{align-items:stretch;flex-direction:column}.panel-heading form button{width:100%}}
@media(max-width:700px){.danger-zone{align-items:stretch;flex-direction:column}.danger-zone form button{width:100%}}
@media(max-width:700px){.bond-identity-grid,.bond-section-grid,.bond-details-grid{grid-template-columns:1fr}.bond-form-section{padding:13px}.bond-form>button,.bond-form>.button{width:100%}}
@media(max-width:520px){.transaction-value-group{grid-template-columns:1fr;grid-column:auto}}
label { display:flex; flex-direction:column; gap:6px; font-weight:650; }
input, select { padding:11px 12px; border:1px solid var(--border); border-radius:8px; font:inherit; font-size:14px; font-weight:400; background:var(--surface); color:var(--text); }
label > input:not([type="checkbox"]):not([type="radio"]), label > select, label > textarea { width:100%; max-width:100%; min-width:0; }
input[readonly] { color:var(--muted); background:var(--secondary); cursor:not-allowed; }
button, .button { background:#101820; color:#fff; border:0; border-radius:8px; padding:11px 16px; font-weight:700; cursor:pointer; text-decoration:none; text-align:center; }
.secondary { background:var(--secondary); color:var(--text); }
table { width:100%; border-collapse:collapse; }
th, td { padding:12px; border-bottom:1px solid var(--soft-border); text-align:left; }
th { color:var(--muted); font-size:13px; text-transform:uppercase; }
.table-wrap { overflow-x:auto; container-type:inline-size; }
.positive { color:#087a45; }
.negative { color:#b42318; }
.flash { padding:12px 16px; border:1px solid #a9dec0; border-radius:8px; margin-bottom:16px; background:#e8f5ee; color:#145c36; font-weight:650; }
.flash.error { border-color:#efb4b4; background:#fdecec; color:#8f1d1d; }
:root[data-theme="dark"] .flash { border-color:#2d7653; background:#173c2b; color:#b8f3d1; }
:root[data-theme="dark"] .flash.error { border-color:#844040; background:#451f24; color:#ffc5c5; }
.login-card { width:min(420px,100%); margin:10vh auto; }
.login-tagline { margin:-8px 0 20px; color:var(--muted); font-size:14px; }
.muted, small { color:var(--muted); }
code { background:var(--code); padding:2px 5px; border-radius:4px; }
.inline-form { display:flex; align-items:center; gap:8px; }
.amount-input { width:120px; }
.danger { background:#b42318; }
.row-actions { display:flex; align-items:center; gap:8px; }
.row-actions form { margin:0; }
.table-action-stack { display:grid; gap:7px; min-width:92px; }
.table-action-stack form { display:grid; margin:0; }
.table-action-stack .button,.table-action-stack button { width:100%; padding:9px 12px; }
.allocation-content { display:grid; grid-template-columns:minmax(220px,320px) 1fr; align-items:center; gap:36px; padding:12px 0; }
.pie-chart { width:min(280px,100%); aspect-ratio:1; justify-self:center; border-radius:50%; background:var(--pie); box-shadow:inset 0 0 0 1px var(--soft-border); }
.allocation-legend { display:grid; gap:4px; }
.legend-row { display:grid; grid-template-columns:14px minmax(120px,1fr) 65px 110px; align-items:center; gap:10px; padding:9px 4px; border-bottom:1px solid var(--soft-border); }
.legend-color { width:12px; height:12px; border-radius:50%; background:var(--legend-color); }
.legend-row small { text-align:right; }
.tag-filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.tag-filters[hidden] { display:none; }
.tag-filter-label { display:flex; flex-direction:row; align-items:center; gap:7px; padding:7px 10px; border:1px solid var(--soft-border); border-radius:999px; font-size:14px; cursor:pointer; }
.tag-filter-label input { margin:0; }
.chart-modes { display:flex; gap:5px; padding:4px; border-radius:9px; background:var(--secondary); }
.chart-mode { padding:7px 11px; background:transparent; color:var(--text); font-size:13px; }
.chart-mode.active { background:var(--surface); color:var(--text); box-shadow:0 1px 4px var(--shadow); }
.line-chart-wrap { position:relative; width:100%; min-height:280px; margin-top:14px; }
.line-chart-wrap canvas { display:block; width:100%; }
.line-chart-empty { position:absolute; inset:45% 20px auto; padding:10px; border-radius:8px; background:var(--surface); color:var(--muted); text-align:center; }
.symbol-search-form { margin:20px 0; padding:16px; border-radius:10px; background:var(--page); }
.search-results { margin:18px 0 24px; border:1px solid var(--soft-border); border-radius:10px; }
.search-results { scroll-margin-top:20px; }
.search-results h3 { margin:0; padding:16px 16px 4px; }
.pagination { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; margin-top:18px; }
.pagination .button:first-child { justify-self:start; }
.pagination .button:last-child { justify-self:end; }
.pagination>span { color:var(--muted); text-align:center; font-size:14px; }
.tag-badge { display:inline-block; padding:4px 8px; border-radius:999px; background:var(--secondary); font-size:12px; font-weight:700; white-space:nowrap; }
.tag-list { display:flex; flex-wrap:wrap; gap:5px; }
.sort-button { display:flex; align-items:center; gap:5px; padding:0; background:transparent; color:inherit; font-size:inherit; text-transform:inherit; white-space:nowrap; }
.sort-button span { min-width:12px; font-size:14px; }
.title-with-link { display:flex; align-items:center; gap:8px; }
.external-title-link { display:inline-flex; align-items:center; padding:3px 6px; border:1px solid var(--border); border-radius:5px; color:var(--muted); background:var(--surface); font-size:10px; font-weight:800; line-height:1; text-decoration:none; white-space:nowrap; }
.external-title-link:hover { color:var(--text); border-color:var(--muted); background:var(--secondary); }
.missing-price { color:#b26a00; font-size:12px; font-weight:700; white-space:nowrap; }
#positions-table { font-size:13px; }
#positions-table td:first-child strong { font-size:13px; line-height:1.25; }
#positions-table td:first-child small { font-size:11px; line-height:1.2; }
#positions-table .tag-badge { padding:3px 7px; font-size:11px; }
@media(min-width:901px){
  main{width:min(1280px,90vw)}
  .sortable-table{width:100%;table-layout:fixed;font-size:14px}
  .sortable-table th,.sortable-table td{padding:10px 3px}
  .sortable-table th{font-size:12px}
  .sortable-table .sort-button{align-items:flex-start;white-space:normal;line-height:1.2;text-align:left}
  .sortable-table td{overflow-wrap:normal;word-break:normal}
  #liquidity-positions-table{width:100%;table-layout:fixed}
  #liquidity-positions-table th:nth-child(1){width:16%}
  #liquidity-positions-table th:nth-child(2){width:12%}
  #liquidity-positions-table th:nth-child(3){width:15%}
  #liquidity-positions-table th:nth-child(4){width:12%}
  #liquidity-positions-table th:nth-child(5){width:8%}
  #liquidity-positions-table th:nth-child(6){width:6%}
  #liquidity-positions-table th:nth-child(7){width:7%}
  #liquidity-positions-table th:nth-child(8){width:8%}
  #liquidity-positions-table th:nth-child(9){width:7%}
  #liquidity-positions-table th:nth-child(10){width:9%}
  #liquidity-positions-table th:nth-child(9),#liquidity-positions-table td:nth-child(9){padding-left:8px;padding-right:8px}
  #liquidity-positions-table th:nth-child(10),#liquidity-positions-table td:nth-child(10){padding-left:8px}
  #liquidity-positions-table .inline-form{display:grid;gap:5px;min-width:0}
  #liquidity-positions-table .amount-input{width:100%;min-width:0;padding:9px 7px}
  #liquidity-positions-table .inline-form button{width:100%;padding:9px 5px;font-size:13px}
  #liquidity-positions-table .table-action-stack{min-width:0}
  #liquidity-positions-table .table-action-stack .button,
  #liquidity-positions-table .table-action-stack button{padding:8px 4px;font-size:13px}
  #bonds-table{width:100%;table-layout:fixed}
  #bonds-table th:nth-child(1){width:20%}
  #bonds-table th:nth-child(2){width:8%}
  #bonds-table th:nth-child(3){width:8%}
  #bonds-table th:nth-child(4){width:8%}
  #bonds-table th:nth-child(5){width:8%}
  #bonds-table th:nth-child(6){width:7%}
  #bonds-table th:nth-child(7){width:9%}
  #bonds-table th:nth-child(8){width:11%}
  #bonds-table th:nth-child(9){width:8%}
  #bonds-table th:nth-child(10){width:5%}
  #bonds-table th:nth-child(11){width:8%}
  #bonds-table td:first-child{overflow-wrap:break-word}
  #bonds-table .row-actions{display:grid;gap:7px;min-width:0}
  #bonds-table .row-actions form{display:grid}
  #bonds-table .row-actions .button,#bonds-table .row-actions button{width:100%;padding:8px 4px;font-size:12px}
  #positions-table td:nth-child(n+6),
  #bonds-table td:nth-child(n+2):nth-child(-n+8),
  #liquidity-positions-table td:nth-child(n+3):nth-child(-n+9){white-space:nowrap}
  .transactions-table-panel{padding:14px 10px}
  #transactions-table{width:100%;table-layout:fixed;font-size:13px}
  #transactions-table th,#transactions-table td{padding:11px 5px;vertical-align:middle;overflow-wrap:anywhere}
  #transactions-table th{font-size:11px;line-height:1.15}
  #transactions-table th:nth-child(1){width:8%}
  #transactions-table th:nth-child(2){width:6%}
  #transactions-table th:nth-child(3){width:15%}
  #transactions-table th:nth-child(4){width:7%}
  #transactions-table th:nth-child(5){width:9%}
  #transactions-table th:nth-child(6){width:7%}
  #transactions-table th:nth-child(7){width:8%}
  #transactions-table th:nth-child(8){width:9%}
  #transactions-table th:nth-child(9){width:7%}
  #transactions-table th:nth-child(10){width:10%}
  #transactions-table th:nth-child(11){width:14%}
  #transactions-table td:nth-child(1),#transactions-table td:nth-child(2),
  #transactions-table td:nth-child(4),#transactions-table td:nth-child(6),
  #transactions-table td:nth-child(7){white-space:nowrap}
  #transactions-table .row-actions{gap:5px;min-width:0}
  #transactions-table .row-actions .button,#transactions-table .row-actions button{padding:9px 7px;font-size:12px}
}
@media(max-width:900px){
  header{align-items:center}
  .menu-toggle{display:flex}
  nav{display:none; width:100%; flex-direction:column; align-items:stretch; gap:4px; padding-top:8px; font-size:15px}
  nav.is-open{display:flex}
  .section-tabs{display:flex; flex-direction:row; flex-wrap:nowrap; width:100%; padding:5px; font-size:14px}
  .section-tabs a{width:auto; padding:10px 14px; text-align:center}
  .sub-tabs{display:flex; flex-direction:row; width:100%; padding-bottom:7px; font-size:14px}
  .sub-tabs a{width:auto; padding:8px 10px; text-align:center}
  nav>a, nav>.theme-toggle{width:100%; padding:11px 8px; text-align:left}
  .profile-menu{width:100%}
  .profile-menu summary{padding:11px 8px}
  .profile-dropdown{position:static; width:100%; margin-top:4px; box-shadow:none}
  .theme-toggle{justify-content:flex-start}
  .allocation-content{grid-template-columns:1fr; gap:22px}
  .legend-row{grid-template-columns:14px minmax(90px,1fr) 55px 90px}
  th,td{white-space:nowrap}
  .mobile-card-table thead{display:none}
  .mobile-card-table,.mobile-card-table tbody{display:block;width:100%}
  .mobile-card-table tbody tr{display:block;margin-bottom:14px;padding:7px 14px;border:1px solid var(--soft-border);border-radius:11px;background:var(--surface);box-shadow:0 2px 9px var(--shadow)}
  .mobile-card-table tbody tr:last-child{margin-bottom:0}
  .mobile-card-table tbody td{display:grid;grid-template-columns:minmax(92px,34%) minmax(0,1fr);align-items:start;gap:12px;width:100%;padding:10px 0;border-bottom:1px solid var(--soft-border);white-space:normal;overflow-wrap:anywhere}
  .mobile-card-table tbody td:last-child{border-bottom:0}
  .mobile-card-table tbody td::before{content:var(--cell-label);color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
  #positions-table td:nth-child(1){--cell-label:"Titolo"}#positions-table td:nth-child(2){--cell-label:"ISIN"}#positions-table td:nth-child(3){--cell-label:"Broker"}#positions-table td:nth-child(4){--cell-label:"TAG"}#positions-table td:nth-child(5){--cell-label:"Quantità"}#positions-table td:nth-child(6){--cell-label:"Prezzo"}#positions-table td:nth-child(7){--cell-label:"Investito"}#positions-table td:nth-child(8){--cell-label:"Valore"}#positions-table td:nth-child(9){--cell-label:"Risultato"}
  #liquidity-positions-table td:nth-child(1){--cell-label:"Conto"}#liquidity-positions-table td:nth-child(2){--cell-label:"Tipo"}#liquidity-positions-table td:nth-child(3){--cell-label:"Capitale"}#liquidity-positions-table td:nth-child(4){--cell-label:"Condizioni"}#liquidity-positions-table td:nth-child(5){--cell-label:"Maturati"}#liquidity-positions-table td:nth-child(6){--cell-label:"Imposte"}#liquidity-positions-table td:nth-child(7){--cell-label:"Interessi netti"}#liquidity-positions-table td:nth-child(8){--cell-label:"Saldo disponibile"}#liquidity-positions-table td:nth-child(9){--cell-label:"Scadenza"}#liquidity-positions-table td:nth-child(10){--cell-label:"Azioni"}
  #bonds-table td:nth-child(1){--cell-label:"Obbligazione"}#bonds-table td:nth-child(2){--cell-label:"Nominale"}#bonds-table td:nth-child(3){--cell-label:"Prezzo"}#bonds-table td:nth-child(4){--cell-label:"Investito"}#bonds-table td:nth-child(5){--cell-label:"Valore"}#bonds-table td:nth-child(6){--cell-label:"Risultato"}#bonds-table td:nth-child(7){--cell-label:"Cedola"}#bonds-table td:nth-child(8){--cell-label:"Rendimento"}#bonds-table td:nth-child(9){--cell-label:"Scadenza"}#bonds-table td:nth-child(10){--cell-label:"TAG"}#bonds-table td:nth-child(11){--cell-label:"Azioni"}
  #transactions-table td:nth-child(1){--cell-label:"Data"}#transactions-table td:nth-child(2){--cell-label:"Modalità"}#transactions-table td:nth-child(3){--cell-label:"Titolo"}#transactions-table td:nth-child(4){--cell-label:"Tipo"}#transactions-table td:nth-child(5){--cell-label:"Quantità"}#transactions-table td:nth-child(6){--cell-label:"Prezzo"}#transactions-table td:nth-child(7){--cell-label:"Commissioni"}#transactions-table td:nth-child(8){--cell-label:"Broker"}#transactions-table td:nth-child(9){--cell-label:"TAG"}#transactions-table td:nth-child(10){--cell-label:"Liquidità"}#transactions-table td:nth-child(11){--cell-label:"Azioni"}
  .mobile-card-table .inline-form{flex-wrap:wrap;justify-content:flex-start}
  .mobile-card-table .amount-input{width:min(130px,100%)}
  .mobile-card-table .row-actions{flex-wrap:wrap}
  .mobile-card-table .title-with-link{min-width:0;flex-wrap:wrap}
  .mobile-card-table .title-with-link strong{min-width:0;overflow-wrap:anywhere}
  .page-heading{flex-direction:column}
  .pagination{grid-template-columns:1fr 1fr}
  .pagination>span:nth-child(2){grid-column:1/-1;grid-row:1}
  .pillar-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
  main{width:calc(100% - 20px);margin:20px auto}
  .heading-context{display:block;margin-top:5px;font-size:.68em;line-height:1.2}
  .panel,.cards article,.login-card{padding:16px;border-radius:12px}
  .form-grid{grid-template-columns:minmax(0,1fr);gap:13px}
  .form-grid button,.form-grid>.button{width:100%;max-width:100%}
  input,select,textarea{max-width:100%}
}
@container (max-width:800px){
  .mobile-card-table thead{display:none}
  .mobile-card-table,.mobile-card-table tbody{display:block;width:100%}
  .mobile-card-table tbody tr{display:block;margin-bottom:14px;padding:7px 14px;border:1px solid var(--soft-border);border-radius:11px;background:var(--surface);box-shadow:0 2px 9px var(--shadow)}
  .mobile-card-table tbody tr:last-child{margin-bottom:0}
  .mobile-card-table tbody td{display:grid;grid-template-columns:minmax(92px,34%) minmax(0,1fr);align-items:start;gap:12px;width:100%;padding:10px 0;border-bottom:1px solid var(--soft-border);white-space:normal;overflow-wrap:anywhere}
  .mobile-card-table tbody td:last-child{border-bottom:0}
  .mobile-card-table tbody td::before{content:var(--cell-label);color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
  #positions-table td:nth-child(1){--cell-label:"Titolo"}#positions-table td:nth-child(2){--cell-label:"ISIN"}#positions-table td:nth-child(3){--cell-label:"Broker"}#positions-table td:nth-child(4){--cell-label:"TAG"}#positions-table td:nth-child(5){--cell-label:"Quantità"}#positions-table td:nth-child(6){--cell-label:"Prezzo"}#positions-table td:nth-child(7){--cell-label:"Investito"}#positions-table td:nth-child(8){--cell-label:"Valore"}#positions-table td:nth-child(9){--cell-label:"Risultato"}
  #liquidity-positions-table td:nth-child(1){--cell-label:"Conto"}#liquidity-positions-table td:nth-child(2){--cell-label:"Tipo"}#liquidity-positions-table td:nth-child(3){--cell-label:"Capitale"}#liquidity-positions-table td:nth-child(4){--cell-label:"Condizioni"}#liquidity-positions-table td:nth-child(5){--cell-label:"Maturati"}#liquidity-positions-table td:nth-child(6){--cell-label:"Imposte"}#liquidity-positions-table td:nth-child(7){--cell-label:"Interessi netti"}#liquidity-positions-table td:nth-child(8){--cell-label:"Saldo disponibile"}#liquidity-positions-table td:nth-child(9){--cell-label:"Scadenza"}#liquidity-positions-table td:nth-child(10){--cell-label:"Azioni"}
  #bonds-table td:nth-child(1){--cell-label:"Obbligazione"}#bonds-table td:nth-child(2){--cell-label:"Nominale"}#bonds-table td:nth-child(3){--cell-label:"Prezzo"}#bonds-table td:nth-child(4){--cell-label:"Investito"}#bonds-table td:nth-child(5){--cell-label:"Valore"}#bonds-table td:nth-child(6){--cell-label:"Risultato"}#bonds-table td:nth-child(7){--cell-label:"Cedola"}#bonds-table td:nth-child(8){--cell-label:"Rendimento"}#bonds-table td:nth-child(9){--cell-label:"Scadenza"}#bonds-table td:nth-child(10){--cell-label:"TAG"}#bonds-table td:nth-child(11){--cell-label:"Azioni"}
  .mobile-card-table .inline-form{flex-wrap:wrap;justify-content:flex-start}
  .mobile-card-table .amount-input{width:min(130px,100%)}
  .mobile-card-table .row-actions{flex-wrap:wrap}
  .mobile-card-table .title-with-link{min-width:0;flex-wrap:wrap}
  .mobile-card-table .title-with-link strong{min-width:0;overflow-wrap:anywhere}
}