.nf-queue-badge{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:9000;background:var(--surface);color:var(--text);border:1px solid var(--line-16);border-radius:999px;padding:8px 14px;font:500 12px var(--sans,system-ui);box-shadow:0 6px 24px rgba(0,0,0,.25)} .nf-queue-badge[hidden]{display:none} .nf-price-age{font:500 11px var(--mono,ui-monospace);letter-spacing:.3px;color:var(--dim);margin-top:4px} .nf-price-age[hidden]{display:none} @media(max-width:767px){.nf-queue-badge{bottom:84px}} /* v3.57.0 · un solo carattere senza grazie, quello del sistema: niente download */ body{font-variant-numeric:tabular-nums} button,input,select,textarea{font-family:inherit} *{box-sizing:border-box;margin:0;padding:0} /* === v3.5.0 · palette a due temi === Scuro di default. Il chiaro si attiva con la classe .theme-light su . Ogni colore dell'app passa da qui: non aggiungere colori scritti a mano. */ :root{ --page:#000000; --bg:#000000; --surface:#111214; --text:#f3f4f6; --muted:#a7adb5; --dim:#7c828b; --warm:#9dbad8; --warm-dk:#6f93b8; --accent:#8c9aab; --positive:#34d17a; --danger:#ff5f5f; --gray:#7c828b; --amber:#e3a94f; --on-accent:#05080b; --line-04:rgba(255,255,255,.04); --line-06:rgba(255,255,255,.06); --line-08:rgba(255,255,255,.08); --line-10:rgba(255,255,255,.10); --line-12:rgba(255,255,255,.12); --line-16:rgba(255,255,255,.16); --line-24:rgba(255,255,255,.24); --warm-08:rgba(157,186,216,.08); --warm-12:rgba(157,186,216,.13); --warm-15:rgba(157,186,216,.17); --warm-20:rgba(157,186,216,.22); --warm-25:rgba(157,186,216,.28); --warm-35:rgba(157,186,216,.38); --warm-50:rgba(157,186,216,.52); --accent-06:rgba(140,154,171,.08); --accent-12:rgba(140,154,171,.15); --accent-20:rgba(140,154,171,.24); --pos-12:rgba(52,209,122,.14); --pos-25:rgba(52,209,122,.28); --neg-12:rgba(255,95,95,.14); --neg-25:rgba(255,95,95,.28); --ink-06:rgba(0,0,0,.30); --ink-08:rgba(0,0,0,.40); --ink-14:rgba(0,0,0,.50); --ink-20:rgba(0,0,0,.58); --ink-28:rgba(0,0,0,.66); --ink-40:rgba(0,0,0,.75); --glass:rgba(0,0,0,.82); --toast-bg:rgba(22,23,26,.97); --toast-text:#f3f4f6; --toast-dim:rgba(243,244,246,.65); --toast-line:rgba(255,255,255,.16); --cat-1:#9dbad8; --cat-2:#5f86ad; --cat-3:#d4dfea; --cat-4:#3f5f80; --cat-5:#8c9aab; --cat-6:#7fa3c7; --cat-7:#5d646d; --cat-8:#b8cadc; --cat-9:#2f475f; --cat-10:#a9b2bc; --cat-11:#4c6b8a; --cat-12:#e6ebf0; /* alias storici: i nomi usati nel CSS dell'app puntano alla palette qui sopra */ --bg2:var(--surface);--border:var(--line-12);--border2:var(--line-24); --accent-light:var(--accent);--af:var(--accent-06); --warm-light:var(--warm);--wf:var(--warm-08); --text-inv:var(--text);--muted-inv:var(--muted); --danger-bg:var(--neg-12);--positive-bg:var(--pos-12); --blue:var(--accent);--gold:var(--warm); --ss:0 1px 3px var(--ink-06);--sm:0 4px 20px var(--ink-08); --R:14px;--r:10px; /* v3.6.0 · tipografia: un solo font, come nel mockup */ --sans:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,system-ui,sans-serif; --cond:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,system-ui,sans-serif; --mono:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,ui-monospace,monospace; } :root.theme-light{ --page:#e6e7e9; --bg:#f2f2f3; --surface:#fafafa; --text:#1d1f20; --muted:#50565c; --dim:#6b7178; --warm:#3e6488; --warm-dk:#2d4a66; --accent:#5980a6; --positive:#137a45; --danger:#c0322b; --gray:#80868d; --amber:#8a5a00; --on-accent:#ffffff; --line-04:rgba(29,31,32,.04); --line-06:rgba(29,31,32,.06); --line-08:rgba(29,31,32,.08); --line-10:rgba(29,31,32,.10); --line-12:rgba(29,31,32,.13); --line-16:rgba(29,31,32,.17); --line-24:rgba(29,31,32,.25); --warm-08:rgba(62,100,136,.07); --warm-12:rgba(62,100,136,.11); --warm-15:rgba(62,100,136,.15); --warm-20:rgba(62,100,136,.19); --warm-25:rgba(62,100,136,.25); --warm-35:rgba(62,100,136,.35); --warm-50:rgba(62,100,136,.50); --accent-06:rgba(89,128,166,.07); --accent-12:rgba(89,128,166,.13); --accent-20:rgba(89,128,166,.21); --pos-12:rgba(19,122,69,.11); --pos-25:rgba(19,122,69,.24); --neg-12:rgba(192,50,43,.11); --neg-25:rgba(192,50,43,.24); --ink-06:rgba(29,31,32,.06); --ink-08:rgba(29,31,32,.08); --ink-14:rgba(29,31,32,.14); --ink-20:rgba(29,31,32,.20); --ink-28:rgba(29,31,32,.28); --ink-40:rgba(29,31,32,.40); --glass:rgba(242,242,243,.9); --toast-bg:rgba(29,31,32,.96); --toast-text:#f7f7f8; --toast-dim:rgba(247,247,248,.72); --toast-line:rgba(255,255,255,.2); --cat-1:#3e6488; --cat-2:#5980a6; --cat-3:#2d4a66; --cat-4:#9bb4cc; --cat-5:#80868d; --cat-6:#1d2f40; --cat-7:#b8c6d4; --cat-8:#6b7f93; --cat-9:#c9d6e2; --cat-10:#46607a; --cat-11:#d6d9dc; --cat-12:#7d9cbb; } body{background:var(--bg);font-family:var(--sans);font-size:15px;line-height:1.55;min-height:100vh;font-variant-numeric:tabular-nums;color:var(--text)} /* v3.6.0 · scala tipografica del mockup */ .k{font:600 11px var(--cond);letter-spacing:.16em;text-transform:uppercase;color:var(--warm)} .lbl{font:400 10px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dim)} .meta{font:400 11px var(--sans);color:var(--muted)} .sub{font:400 11px var(--sans);color:var(--dim)} .v-m{font:600 30px/1 var(--cond)} .v-s{font:600 24px/1 var(--cond)} .page-kicker{font:400 11px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--warm)} .page-title{font:600 30px/1 var(--cond);margin:6px 0 20px} /* v3.6.0 · mattoni del mockup, pronti per le sezioni che rifaremo una a una. Non sono ancora applicati alle card esistenti: quelle cambiano nella loro fase. */ .panel{border:none;border-radius:0;box-shadow:none;background:transparent;padding:16px 20px} .panel--gold{background:var(--warm-08)} .head-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:12px} .stack{display:flex;flex-direction:column;gap:20px;min-width:0} .seg{display:flex;gap:4px} .seg>span{padding:6px 12px;font:600 12px var(--sans);color:var(--dim);border-radius:20px;cursor:pointer} .seg>span.on{background:var(--line-08);color:var(--text)} .chip{border:1px solid var(--line-12);padding:4px 10px;font:400 11px var(--sans);color:var(--muted);border-radius:20px} .chip.on{background:var(--warm);border-color:var(--warm);color:var(--on-accent)} .btn{display:inline-block;text-align:center;padding:11px 14px;font:600 13px var(--cond);letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--line-12);color:var(--muted);background:transparent;cursor:pointer} body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:1000;opacity:.25;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E")} nav{display:flex;align-items:center;justify-content:space-between;padding:0 28px;height:58px;background:var(--glass);backdrop-filter:blur(14px);border-bottom:1px solid var(--line-12);position:sticky;top:0;z-index:100} .logo{font-family:var(--cond);font-size:24px;font-weight:700;color:var(--text-inv);letter-spacing:-.3px}.logo span{color:var(--warm-light);font-style:italic} .mb{width:28px;height:28px;border:1px solid var(--line-24);border-radius:50%;background:var(--line-06);color:var(--text-inv);font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-weight:600;transition:all .15s} .mb:hover{border-color:var(--warm-light);background:var(--warm-15);transform:scale(1.08);color:var(--warm-light)} .ml{font-family:var(--mono);font-size:13px;font-weight:500;color:var(--text-inv);min-width:110px;text-align:center} .bp{padding:6px 16px;background:transparent;color:var(--warm-light);border:1px solid var(--warm-light);border-radius:20px;font-size:11px;cursor:pointer;font-family:var(--sans);font-weight:600;transition:all .2s} .bp:hover{background:var(--warm-light);color:var(--bg);transform:translateY(-1px);box-shadow:0 4px 12px var(--warm-25)} .ud{width:7px;height:7px;border-radius:50%;background:var(--warm-light);display:inline-block;margin-left:6px;vertical-align:middle;animation:pd 1.5s infinite} @keyframes pd{0%,100%{opacity:1}50%{opacity:.4}} .content{padding:24px;max-width:1280px;margin:0 auto} .sec{display:none}.sec.active{display:block;animation:fi .3s ease} @keyframes fi{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}} /* KPI */ .kg{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:1.2rem} .kpi{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--R);padding:16px 18px;box-shadow:var(--ss);transition:all .2s;position:relative;overflow:hidden} .kpi:hover{box-shadow:var(--sm);transform:translateY(-1px)} .kl{font-size:9px;color:var(--dim);letter-spacing:1px;text-transform:uppercase;margin-bottom:6px;font-family:var(--mono)} .kv{font-family:var(--cond);font-size:26px;font-weight:700;color:var(--text)} .ks{font-size:10px;color:var(--muted);margin-top:5px;font-family:var(--mono)} .pb{height:4px;background:var(--border);border-radius:2px;margin-top:8px;overflow:hidden} .pf{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--accent),var(--accent-light));transition:width .6s} .pfw{background:linear-gradient(90deg,var(--warm),var(--warm-light))} .kpi-edit{font-family:var(--mono);font-size:14px;background:var(--surface);border:1px solid var(--border2);border-radius:6px;padding:2px 6px;width:90px;text-align:right;color:var(--text);outline:none} .kl-edit{font-family:var(--mono);font-size:10.5px;background:var(--surface);border:1px solid var(--border2);border-radius:4px;padding:0 4px;width:34px;text-align:center;color:var(--text);outline:none;font-weight:600} .kpi-edit:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-12)} .card{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--R);padding:18px 20px;margin-bottom:12px;box-shadow:var(--ss);transition:box-shadow .2s} .card:hover{box-shadow:var(--sm)} .ct{font-family:var(--cond);font-size:16px;font-weight:700;color:var(--text);margin-bottom:12px;padding-bottom:9px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px} .dw{display:flex;align-items:center;gap:16px;flex-wrap:wrap} .db{width:110px;height:110px;flex-shrink:0} .leg{display:flex;flex-direction:column;gap:5px;flex:1;min-width:100px} .li{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--text);font-family:var(--mono)} .ld{width:7px;height:7px;border-radius:50%;flex-shrink:0} .lb{height:140px;position:relative} table{width:100%;font-size:12px;border-collapse:collapse;font-family:var(--mono)} th{font-size:9px;color:var(--dim);text-align:left;padding:3px 6px 8px;font-weight:400;letter-spacing:.5px;text-transform:uppercase} td{padding:7px 6px;border-top:1px solid var(--border);color:var(--text);vertical-align:middle} input[type=number],input[type=text]:not(.tb-search){width:100%;font-size:12px;padding:5px 7px;border:1px solid var(--border);border-radius:var(--r);background:var(--surface);color:var(--text);font-family:var(--mono);outline:none;transition:all .2s} input[type=number]:focus,input[type=text]:focus:not(.tb-search){border-color:var(--accent);background:var(--surface);box-shadow:0 0 0 3px var(--accent-12)} input[type=number]{text-align:right} .badge{display:inline-block;font-size:10px;padding:3px 10px;border-radius:10px;font-family:var(--mono);font-weight:600;letter-spacing:.2px} .bg{background:var(--positive);color:var(--bg)}.br{background:var(--danger);color:var(--bg)}.bgr{background:var(--page);color:var(--muted)}.bb{background:var(--blue);color:var(--bg)} .ab{display:inline-flex;align-items:center;gap:4px;padding:5px 13px;border:1px dashed var(--accent);border-radius:var(--r);background:none;color:var(--accent);font-size:11px;cursor:pointer;margin-top:10px;font-family:var(--sans);font-weight:500;transition:all .2s} .ab:hover{background:var(--af);border-style:solid} .xb{border:none;background:none;color:var(--dim);cursor:pointer;font-size:14px;padding:2px 4px;line-height:1;flex-shrink:0;border-radius:4px;transition:all .15s} .xb:hover{color:var(--danger);background:var(--neg-12)} .dr{display:grid;align-items:center;gap:5px;padding:5px 0;border-top:1px solid var(--border);transition:background .15s} .dr:hover{background:var(--af)} .sr{grid-template-columns:1fr 52px 52px 74px 74px 48px 22px 20px} .er{grid-template-columns:1fr 80px 80px 48px 22px 20px} .cr{grid-template-columns:1fr 80px 80px 48px 20px} .or{grid-template-columns:1fr 68px 68px 20px} .brow{grid-template-columns:1fr 88px 20px} .dh{display:grid;gap:5px;padding:0 0 6px;font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.5px;font-family:var(--mono)} .st{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding-top:10px;border-top:1px solid var(--border);font-size:12px;font-family:var(--mono);color:var(--text)} .hr{display:grid;grid-template-columns:80px 1fr 88px 72px 64px;gap:5px;padding:7px 0;border-top:1px solid var(--border);font-size:12px;align-items:center;font-family:var(--mono);transition:background .15s;color:var(--text)}.hr:hover{background:var(--af)} .ca{grid-template-columns:1fr 90px 22px} .hh{display:grid;grid-template-columns:80px 1fr 88px 72px 64px;gap:5px;padding:0 0 6px;font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.5px} .bs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:1.2rem} .cg{color:var(--positive)}.gr{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--border);font-size:12px;font-family:var(--mono);transition:background .15s}.gr:hover{background:var(--af)} .gf{font-size:16px;width:22px;text-align:center;flex-shrink:0}.gn{flex:1;color:var(--text)}.gp{font-weight:600;color:var(--accent);min-width:42px;text-align:right} .nb{background:var(--af);border:1px solid var(--pos-12);border-radius:var(--r);padding:12px 16px;font-size:11px;color:var(--muted);font-family:var(--mono);line-height:1.7;margin-top:6px} /* Delta badge */ /* World map */ #import-file{display:none} /* === Sottocategorie satellite === */ #update-banner{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--toast-bg);backdrop-filter:blur(14px);color:var(--bg);padding:12px 16px;border-radius:10px;box-shadow:0 12px 32px var(--toast-line);display:none;align-items:center;gap:12px;z-index:300;font-family:var(--sans);font-size:13px;max-width:90vw} #update-banner.show{display:flex} #update-banner .ub-txt{display:flex;flex-direction:column;gap:1px;line-height:1.3} #update-banner .ub-t{font-weight:600} #update-banner .ub-s{font-size:11px;color:var(--toast-dim)} #update-banner button{background:var(--warm-light);color:var(--bg);border:none;padding:7px 14px;border-radius:6px;font-family:var(--sans);font-size:12px;font-weight:600;cursor:pointer;flex-shrink:0} #update-banner button:active{background:var(--warm)} #update-banner .ub-close{background:none;color:var(--toast-dim);padding:4px 8px;font-size:18px;line-height:1} @media(max-width:600px){#update-banner{bottom:80px;left:10px;right:10px;transform:none;max-width:none}} .main{flex:1;min-width:0} .content{padding:24px;max-width:1280px;margin:0 auto} @media(max-width:900px){ body{overflow-x:hidden;overflow-y:hidden} .main{flex:1;min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;padding-bottom:0} .content{padding:14px} .kg{grid-template-columns:repeat(2,1fr)} .bs{grid-template-columns:1fr} .sr{grid-template-columns:1fr 44px 44px 60px 60px 40px 20px 18px} .er{grid-template-columns:1fr 64px 64px 40px 20px 18px} .cr{grid-template-columns:1fr 64px 64px 40px 18px} .card{padding:14px 14px} .ct{font-size:14px} } @media(max-width:500px){ .content{padding:10px} .card{padding:12px 10px;margin-bottom:10px;border-radius:10px} .ct{font-size:13px;margin-bottom:8px} .kg{gap:8px} .kpi{padding:12px} .kv{font-size:18px} .kl{font-size:9.5px} .ks{font-size:9px} .sr{grid-template-columns:1fr 38px 38px 52px 52px 36px 18px 16px;gap:4px} .er{grid-template-columns:1fr 56px 56px 36px 18px 16px;gap:4px} .cr{grid-template-columns:1fr 56px 56px 36px 16px;gap:4px} .dr input,.dr select{padding:5px 5px;font-size:11px} .dh{font-size:8.5px;padding:6px 2px 4px} .st{font-size:11px;padding-top:8px;margin-top:8px} .leg{font-size:11px} .leg .li{padding:3px 0} .leg .li span{font-size:11px} .lb{height:160px} .logo{font-size:16px} } /* === FILIERA SATELLITE === */ /* === SCHEMA STATICO FILIERA (decorativo) === */ /* === PROIEZIONE 7Y === */ /* === INVENTORIA === */ /* === PROIEZIONE 7 ANNI === */ /* === ATTIVITÀ / INVENTORIA === */ /* ============================================================ NETFOLIO TOPBAR — v1.2.0 ============================================================ */ .topbar{ display:flex;align-items:center;gap:24px; padding:0 24px;height:56px; background:var(--bg); border-bottom:1px solid var(--line-06); position:sticky;top:0;z-index:100; max-width:1280px;margin:0 auto;width:100%;box-sizing:border-box; } /* v3.17.0: la F del logo è un'immagine usata come maschera, così prende il colore del tema invece di avere due file diversi per scuro e chiaro */ .tb-logo-f{ display:block;width:19px;height:26px;background-color:var(--text); -webkit-mask:url(data:image/png;base64,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) no-repeat center/contain; mask:url(data:image/png;base64,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) no-repeat center/contain; } .tb-logo:hover .tb-logo-f{background-color:var(--warm)} .tb-logo{ color:var(--text); text-decoration:none; flex-shrink:0; display:flex;align-items:center; transition:color .15s; } .tb-logo:hover{color:var(--warm-light)} .tb-search-wrap{ flex:1;max-width:520px; position:relative; display:flex;align-items:center; } .tb-search-icon{ position:absolute;left:14px; font-size:14px;color:var(--dim); pointer-events:none; } .tb-search{ width:100%; padding:9px 14px 9px 36px; background:var(--line-06); border:1px solid var(--line-12); border-radius:8px; color:var(--text-inv); font-family:var(--sans); font-size:13px; outline:none; transition:all .15s; } .tb-search::placeholder{color:var(--dim)} .tb-search:focus:not(:disabled){ border-color:var(--warm-light); background:var(--line-08); box-shadow:0 0 0 3px var(--warm-12); } .tb-search:disabled{cursor:not-allowed;opacity:.7} .tb-search:-webkit-autofill, .tb-search:-webkit-autofill:hover, .tb-search:-webkit-autofill:focus, .tb-search:-webkit-autofill:active{ -webkit-box-shadow:0 0 0 1000px var(--surface) inset !important; -webkit-text-fill-color:var(--text-inv) !important; caret-color:var(--text-inv) !important; transition:background-color 5000s ease-in-out 0s; padding-left:36px !important; } .tb-nav{display:flex;gap:4px;flex-shrink:0;margin-left:auto} /* v3.16.0: spazio vuoto al centro */ .tb-tab{ padding:8px 14px; background:transparent; border:none;border-bottom:2px solid transparent; color:var(--muted); font-family:var(--cond); font-size:13px;font-weight:600; letter-spacing:.06em;text-transform:uppercase; cursor:pointer; transition:color .15s,border-color .15s; } .tb-tab:hover{color:var(--text)} .tb-tab.active{ color:var(--warm); border-bottom-color:var(--warm); } .tb-gear-wrap{position:relative;flex-shrink:0} .tb-gear{ width:32px;height:32px; background:transparent; border:none; color:var(--muted); font-size:18px; cursor:pointer; display:grid;place-items:center; transition:color .15s; } .tb-gear:hover,.tb-gear.active{color:var(--warm)} .theme-toggle{display:inline-flex;border:1px solid var(--line-12);border-radius:999px;overflow:hidden} .theme-toggle button{ border:0;background:transparent;cursor:pointer; padding:4px 11px;font-size:10.5px;font-family:var(--mono); color:var(--dim);transition:background .15s,color .15s; } .theme-toggle button:hover{color:var(--text)} .theme-toggle button.on{background:var(--warm);color:var(--on-accent)} /* Sezioni multi-active: per la nuova nav grouped, due .sec possono essere active contemporaneamente */ .main{display:block} /* === NETFOLIO v1.2 — Search dropdown + Position Modal + Positions Table === */ .tb-search-wrap{position:relative} .tb-search-wrap.active .tb-search{border-color:var(--warm)} .tb-search-wrap.active .tb-search-icon{color:var(--warm)} /* v3.9.0 · tendina di ricerca come nel mockup */ .tb-search-dropdown{ position:absolute;top:42px;left:0;right:0; background:var(--bg); border:1px solid var(--line-12); border-radius:0; box-shadow:0 12px 32px var(--ink-28); max-height:440px;overflow-y:auto; z-index:99; } .nf-search-scrim{ position:fixed;inset:56px 0 0;background:var(--ink-40); z-index:90;opacity:0;pointer-events:none;transition:opacity .15s; } .nf-search-scrim.on{opacity:1;pointer-events:auto} .tb-search-dropdown[hidden]{display:none} .tb-search-filters{ display:flex;gap:8px;padding:10px 12px; border-bottom:1px solid var(--line-10); position:sticky;top:0;background:var(--bg);z-index:1; } .tb-search-filter{ padding:5px 10px;font-size:11px; background:transparent;border:1px solid var(--line-12); color:var(--muted-inv);font-family:var(--sans); border-radius:14px;cursor:pointer;transition:all .12s; letter-spacing:.3px; } .tb-search-filter:hover{color:var(--text-inv);border-color:var(--line-24)} .tb-search-filter.active{ background:var(--warm-15); border-color:var(--warm-light); color:var(--warm-light); } .tb-search-results{padding:0} .tb-search-item{ display:grid;grid-template-columns:32px 1fr auto; gap:10px;align-items:center; padding:10px 12px;cursor:pointer; border-bottom:1px solid var(--line-06); transition:background .1s; } .tb-search-item:last-child{border-bottom:none} .tb-search-item:hover,.tb-search-item.sel{background:var(--line-06)} /* v3.12.0: i cerchi dei risultati ora usano .nf-logo */ .tb-search-item-l{min-width:0} .tb-search-price{font:500 13px var(--sans);color:var(--text);text-align:right;white-space:nowrap} .tb-search-foot{ padding:10px 12px;font:400 11px var(--sans);letter-spacing:.1em; text-transform:uppercase;color:var(--dim);border-top:1px solid var(--line-06); } .tb-search-name{ font:500 13px var(--sans);color:var(--text); white-space:nowrap;overflow:hidden;text-overflow:ellipsis; } .tb-search-empty{ padding:30px 14px;text-align:center; color:var(--dim);font-size:12px;font-family:var(--sans); } /* === Position Modal === */ .nf-modal-overlay{ position:fixed;inset:0; background:var(--ink-40); backdrop-filter:blur(4px); z-index:200; display:flex;align-items:center;justify-content:center; } .nf-modal-overlay[hidden]{display:none} .nf-modal{ background:var(--bg2); border:1px solid var(--line-16); border-radius:14px; width:440px;max-width:90vw; box-shadow:0 24px 64px var(--ink-20); overflow:hidden; } .nf-modal-head{ padding:18px 22px 14px; border-bottom:1px solid var(--line-12); } .nf-modal-asset{ font-family:var(--cond);font-size:22px;font-weight:600; color:var(--text-inv);line-height:1.2; } .nf-modal-sub{ font-family:var(--mono);font-size:10px; color:var(--dim);letter-spacing:.5px;margin-top:4px; } .nf-modal-body{padding:18px 22px} .nf-field{margin-bottom:14px} .nf-field-label{ display:block;font-size:9px;letter-spacing:.8px; text-transform:uppercase;color:var(--dim); font-family:var(--mono);margin-bottom:5px; } .nf-field-input,.nf-field-select{ width:100%;padding:9px 11px; background:var(--line-06); border:1px solid var(--line-12); border-radius:7px; color:var(--text-inv); font-family:var(--mono);font-size:13px; outline:none;transition:all .12s; } .nf-field-input:focus,.nf-field-select:focus{ border-color:var(--warm-light); background:var(--line-08); } .nf-field-select option{background:var(--bg);color:var(--text)} .nf-field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px} .nf-modal-foot{ display:flex;gap:10px;justify-content:flex-end; padding:14px 22px 18px; border-top:1px solid var(--line-12); } .nf-btn{ padding:8px 18px;border-radius:7px;border:none; font-family:var(--sans);font-size:12.5px;font-weight:500; cursor:pointer;transition:all .12s;letter-spacing:.2px; } .nf-btn-cancel{ background:transparent;color:var(--muted-inv); border:1px solid var(--line-16); } .nf-btn-cancel:hover{border-color:var(--line-24);color:var(--text-inv)} .nf-btn-save{ background:var(--warm);color:var(--bg); } .nf-btn-save:hover{background:var(--warm-light)} /* v3.48.0 import Trade Republic */ .nf-list-modal{width:620px;display:flex;flex-direction:column;max-height:82vh} .nf-list-head{display:flex;align-items:center;justify-content:space-between} .nf-list-x{background:none;border:0;color:var(--dim);font-size:22px;line-height:1;cursor:pointer;padding:0 2px} .nf-list-x:hover{color:var(--text-inv)} .nf-list-search{padding:14px 22px 6px} .nf-list-body{padding:0 22px 16px;overflow-y:auto;flex:1;min-height:120px} .nf-list-month{position:sticky;top:0;z-index:1;background:var(--bg2);font-family:var(--mono);font-size:10px;letter-spacing:.8px;text-transform:uppercase;color:var(--dim);padding:14px 0 6px} .nf-list-body .nf-trade-row,.nf-list-body .nf-budget-tx-row{border-bottom-color:transparent} .nf-budget-tx-meta{font-family:var(--sans);text-transform:none;letter-spacing:0;font-size:11px;margin-left:8px} /* v3.50.0: la fascia PAC / obiettivi non serve più (gli obiettivi stanno in Futuro). La nascondo e basta: i campi restano, così i dati salvati non si toccano */ #sec-liquidity .nf-budget-kpis{display:none} /* obiettivi di spesa: se ne vedono 5, gli altri scorrendo dentro il riquadro */ #nf-budget-goals-list{max-height:var(--nf-goals-h, 300px);overflow-y:auto;overscroll-behavior:contain;padding-right:4px} .tr-modal{width:560px} .tr-modal .nf-modal-body{max-height:62vh;overflow:auto} .tr-p{font-size:13px;line-height:1.55;color:var(--text-inv);margin:0 0 12px} .tr-dim{color:var(--dim);font-size:12px} .tr-k{font-family:var(--mono);font-size:9px;letter-spacing:.8px;text-transform:uppercase;color:var(--dim);margin:16px 0 4px} .tr-row{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:8px 0;font-size:13px;color:var(--text-inv)} .tr-row span,.tr-row b{display:flex;flex-direction:column;gap:2px} .tr-row b{text-align:right;font-weight:600;max-width:55%} .tr-row i{font-style:normal;font-weight:400;font-size:11px;color:var(--dim)} .tr-warn{font-size:12px;line-height:1.5;color:var(--text-inv);background:var(--line-06);border-radius:8px;padding:10px 12px;margin:12px 0} .tr-warn b{display:block;margin-bottom:2px} /* === Positions Table === */ /* v3.7.0: aspetto definito più sopra (pannello piatto) */ .nf-positions-card{margin-bottom:18px} .nf-positions-head{ display:flex;align-items:baseline;justify-content:space-between; margin-bottom:14px; } .nf-positions-meta{ font-family:var(--mono);font-size:10px; color:var(--dim);letter-spacing:.4px; } .nf-pos-name{font-weight:500} .nf-pos-sub{display:none} .nf-pos-menu-btn{ background:transparent;border:none;color:var(--dim); font-size:16px;cursor:pointer;padding:2px 6px;border-radius:4px; line-height:1; } .nf-pos-menu-btn:hover{background:var(--line-08);color:var(--text-inv)} .nf-empty{ text-align:center;padding:40px 20px; color:var(--dim);font-size:12.5px;font-family:var(--sans); } .nf-empty-hint{margin-top:8px;font-size:11px;color:var(--muted-inv)} /* === NETFOLIO v1.3: 2-col grid, broker chips, allocation card, row menu === */ .nf-broker-chips{ display:flex;flex-wrap:wrap;gap:6px;align-items:center; margin-bottom:14px; } .nf-chip{ padding:5px 12px;font-size:11px;letter-spacing:.2px; background:transparent;border:1px solid var(--line-16); color:var(--muted-inv);border-radius:14px;cursor:pointer; font-family:var(--sans);transition:all .12s; } .nf-chip:hover{border-color:var(--line-24);color:var(--text-inv)} .nf-chip.active{ background:var(--warm-15);border-color:var(--warm-light); color:var(--warm-light);font-weight:600; } .nf-chip-add{ padding:5px 12px;font-size:11px;letter-spacing:.2px; background:transparent;border:1px dashed var(--warm-50); color:var(--warm-light);border-radius:14px;cursor:pointer; font-family:var(--sans);margin-left:auto;transition:all .12s; } .nf-chip-add:hover{background:var(--warm-12);border-style:solid;border-color:var(--warm-light)} .nf-pos-menu-wrap{position:relative;display:inline-block} .nf-pos-menu{ position:absolute;right:0;top:24px; background:var(--bg2);border:1px solid var(--line-16); border-radius:7px;box-shadow:0 8px 20px var(--ink-14); z-index:50;min-width:110px;overflow:hidden; } .nf-pos-menu[hidden]{display:none} .nf-pos-menu button{ display:block;width:100%;padding:8px 14px; font-size:12px;background:transparent;border:none; color:var(--text-inv);text-align:left;cursor:pointer; font-family:var(--sans); } .nf-pos-menu button:hover{background:var(--line-08)} .nf-pos-menu button:not(:last-child){border-bottom:1px solid var(--line-08)} .nf-budget-emer{border-left:3px solid var(--warm)} .nf-budget-savings{ font-family:var(--cond);font-size:28px;font-weight:600; letter-spacing:-.3px;margin:4px 0 14px;line-height:1.1; } .nf-budget-savings.pos{color:var(--positive)} .nf-budget-savings.neg{color:var(--danger)} .nf-budget-flowlegend{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;width:100%} .nf-budget-month{font-size:10px;color:var(--dim);font-family:var(--mono);font-weight:400} .nf-budget-tx-row{ display:flex;align-items:center;justify-content:space-between; padding:10px 0;border-bottom:1px solid var(--line-08);gap:10px; } .nf-budget-tx-row:last-child{border-bottom:none} .nf-budget-tx-left{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0} .nf-budget-tx-cat{font-size:12.5px;color:var(--text-inv);font-family:var(--sans);font-weight:500;text-transform:capitalize} .nf-budget-tx-date{font-size:10px;color:var(--dim);font-family:var(--mono)} .nf-budget-tx-amount{font-family:var(--mono);font-size:13px;font-weight:500;white-space:nowrap} .nf-budget-tx-amount.pos{color:var(--positive)} .nf-budget-tx-amount.neg{color:var(--danger)} .nf-budget-tx-del{ background:transparent;border:none;color:var(--dim); font-size:14px;cursor:pointer;padding:2px 6px;border-radius:4px; } .nf-budget-tx-del:hover{background:var(--line-08);color:var(--text-inv)} .nf-budget-goal-row{padding:10px 0;border-bottom:1px solid var(--line-08)} .nf-budget-goal-row:last-child{border-bottom:none} .nf-budget-goal-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:6px;gap:10px} .nf-budget-goal-cat{font-size:12px;color:var(--text-inv);font-family:var(--sans);font-weight:500;text-transform:capitalize;cursor:pointer;transition:color .12s} .nf-budget-goal-cat:hover{color:var(--warm-light)} .nf-budget-goal-prog{font-size:10.5px;color:var(--muted-inv);font-family:var(--mono)} .nf-budget-goal-prog.over{color:var(--danger)} .nf-budget-goal-bar{height:5px;background:var(--line-06);border-radius:3px;overflow:hidden;position:relative} .nf-budget-goal-bar-fill{height:100%;background:var(--warm);transition:width .3s;border-radius:3px} .nf-budget-goal-bar-fill.over{background:var(--danger)} .nf-budget-empty{padding:20px;text-align:center;color:var(--dim);font-size:11.5px;font-family:var(--sans)} .nf-radio-grp{display:flex;gap:6px} .nf-radio-btn{ flex:1;padding:8px 14px;font-size:12px; background:transparent;border:1px solid var(--line-16); color:var(--muted-inv);font-family:var(--sans); border-radius:7px;cursor:pointer;transition:all .12s; } .nf-radio-btn:hover{border-color:var(--line-24);color:var(--text-inv)} .nf-radio-btn.active{ background:var(--warm-15);border-color:var(--warm-light); color:var(--warm-light);font-weight:600; } /* === NETFOLIO v2.4: Card cliccabili + liste modali gestione liquidità === */ .nf-liq-list{display:flex;flex-direction:column;gap:6px;margin-bottom:16px} .nf-liq-list:empty{display:none} .nf-liq-row{ display:flex;align-items:center;justify-content:space-between; padding:9px 12px;background:var(--line-04); border-radius:7px;gap:10px; } .nf-liq-row-name{ font-size:12.5px;color:var(--text-inv);font-family:var(--sans); flex:1;min-width:0;text-transform:capitalize; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; } .nf-liq-row-val{ font-family:var(--mono);font-size:12.5px;color:var(--text-inv); font-weight:500;white-space:nowrap; } .nf-liq-row-del{ background:transparent;border:none;color:var(--dim); font-size:14px;cursor:pointer;padding:2px 6px;border-radius:4px;transition:all .12s; } .nf-liq-row-del:hover{background:var(--line-08);color:var(--text-inv)} /* === NETFOLIO v2.0: menu 3 puntini per categorie === */ .nf-cat-menu-wrap{position:relative;display:inline-block;margin-left:8px} .nf-cat-menu-btn{ background:transparent;border:none;color:var(--dim); font-size:16px;cursor:pointer;padding:0 4px;line-height:1; border-radius:4px;transition:all .12s; } .nf-cat-menu-btn:hover{color:var(--text-inv);background:var(--line-08)} .nf-cat-menu{ position:absolute;right:0;top:calc(100% + 4px); background:var(--bg2);border:1px solid var(--line-16); border-radius:8px;padding:4px;z-index:100; box-shadow:0 4px 16px var(--ink-14); display:flex;flex-direction:column;min-width:140px; } .nf-cat-menu[hidden]{display:none} .nf-cat-menu button{ background:transparent;border:none; color:var(--text-inv);font-family:var(--sans);font-size:12px; padding:8px 12px;text-align:left;cursor:pointer;border-radius:5px; transition:background .12s;white-space:nowrap; } .nf-cat-menu button:hover{background:var(--line-08)} /* === NETFOLIO v2.0: card KPI spostate nello slot destro === */ .nf-kpi-card{ background:transparent;border:none;border-radius:0;padding:14px 18px; } .nf-kpi-card .nf-kpi-value{ font-family:var(--cond);font-size:28px;font-weight:600; color:var(--text);letter-spacing:0;line-height:1.1;margin:6px 0 8px; } .nf-kpi-card .nf-kpi-sub{ font-size:10.5px;color:var(--muted-inv); font-family:var(--mono);margin-top:6px;letter-spacing:.3px; } .nf-kpi-card .pb{margin-top:4px} /* === NETFOLIO v1.6.1: 2 colonne fluide stile getquin === */ .nf-cols{ display:flex;gap:18px;align-items:stretch; } .nf-col-l{flex:0 0 60%;display:flex;flex-direction:column;gap:18px;min-width:0} .nf-col-r{flex:1;display:flex;flex-direction:column;gap:18px;min-width:0} /* v3.0: card destre distribuiscono lo spazio verticale uniformemente per matchare altezza colonna sinistra */ .nf-col-r > *{flex:1 1 auto} @media (max-width:1100px){ .nf-cols{flex-direction:column;align-items:stretch} .nf-col-l,.nf-col-r{flex:1 1 auto;width:100%} .nf-col-r > *{flex:0 1 auto} } /* v3.21.0 · operazioni recenti in Panoramica */ .nf-recent-trades{padding:6px 22px 14px;margin-top:4px} .nf-recent-trades .head-row{margin-bottom:2px;align-items:center} .nf-recent-right{display:flex;align-items:center;gap:14px} .nf-recent-right .chip{cursor:pointer;background:transparent} .nf-recent-right .chip:hover{border-color:var(--warm);color:var(--warm)} .nf-recent-toggle{cursor:pointer;color:var(--warm)} .nf-recent-toggle:hover{text-decoration:underline} .nf-trade-row-wide{cursor:pointer;transition:background .12s} .nf-trade-row-wide:hover{background:var(--line-04)} /* v3.20.0 · storico operazioni */ .nf-trade-row{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line-06)} .nf-trade-row:last-child{border-bottom:none} .nf-trade-tag{ font:600 9px var(--cond);letter-spacing:.08em;text-transform:uppercase; padding:3px 7px;border-radius:20px;flex:none; } .nf-trade-tag.buy{background:var(--warm-12);color:var(--warm)} .nf-trade-tag.sell{background:var(--pos-12);color:var(--positive)} .nf-trade-main{flex:1;min-width:0} .nf-trade-main b{display:block;font:500 13px var(--sans);color:var(--text)} .nf-trade-main i{display:block;font:400 11px var(--sans);color:var(--dim);font-style:normal;margin-top:2px} .nf-trade-tot{font:600 13px var(--sans);color:var(--muted);white-space:nowrap} .nf-trade-tot.pos{color:var(--positive)} /* v3.15.0 · dettaglio posizione */ .nf-det-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:24px;align-items:start;margin-top:10px} .nf-det-main{padding:18px 20px 12px} .nf-det-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap} .nf-det-id{display:flex;align-items:center;gap:14px;min-width:0} .nf-det-id .nf-logo{width:46px;height:46px} .nf-det-name{font:600 26px/1.1 var(--cond);color:var(--text)} .nf-det-price{text-align:right;flex:none} .nf-det-px{font:600 34px/1 var(--cond);color:var(--text)} .nf-det-delta{font:600 13px var(--sans);margin-top:6px;color:var(--dim)} .nf-det-delta.pos{color:var(--positive)} .nf-det-delta.neg{color:var(--danger)} .nf-det-ranges{display:flex;gap:4px;justify-content:flex-end;margin-top:14px} .nf-det-chartwrap{height:clamp(260px, 38vh, 460px);position:relative;margin-top:12px} .nf-det-chartwrap canvas{width:100% !important;height:100% !important} .nf-det-pos{padding:16px 18px} .nf-det-tot{font:600 36px/1 var(--cond);color:var(--text);margin-top:4px} .nf-det-perf{font:600 16px var(--sans);margin-top:4px;color:var(--dim)} .nf-det-perf.pos{color:var(--positive)} .nf-det-perf.neg{color:var(--danger)} .nf-det-data{padding:16px 18px 8px} .nf-det-data .chip{cursor:pointer;background:transparent} .nf-det-data .chip:hover{border-color:var(--warm);color:var(--warm)} .nf-kv{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-06)} .nf-kv:last-child{border-bottom:none} .nf-kv .kl{font:400 12px var(--sans);color:var(--muted)} .nf-kv .kvv{font:500 13px var(--sans);color:var(--text);text-align:right} @media (max-width:1100px){ .nf-det-grid{grid-template-columns:1fr} } /* v3.12.0 · loghi asset */ .nf-logo{ border-radius:50%;background:var(--line-08);flex:none; display:inline-flex;align-items:center;justify-content:center;overflow:hidden; } .nf-logo img{width:64%;height:64%;object-fit:contain;display:block} .nf-logo-fb{ width:100%;height:100%;display:flex;align-items:center;justify-content:center; font:600 10px var(--cond);letter-spacing:.04em;color:var(--warm); } /* v3.11.0 · Profilo */ .nf-prof-name{font:600 24px/1 var(--cond);color:var(--text)} .nf-prof-stats{display:flex;gap:32px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line-06);flex-wrap:wrap} .nf-prof-stat{font:600 15px var(--sans);color:var(--text);margin-top:5px} .nf-list-row{ display:flex;align-items:center;gap:12px;padding:12px 0;cursor:pointer; border-bottom:1px solid var(--line-06); } .nf-list-row:last-child{border-bottom:none} .nf-list-row:hover{color:var(--text)} .nf-list-t{flex:1;min-width:0} .nf-list-t b{display:block;font:500 13px var(--sans);color:var(--text)} .nf-list-t i{display:block;font:400 11px var(--sans);color:var(--dim);font-style:normal;margin-top:2px} .nf-list-go{color:var(--muted);font-size:14px} .nf-prof-version{font:400 11px var(--mono);color:var(--dim);letter-spacing:.3px;padding:4px 2px} .nf-prof-brk{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--line-06)} .nf-prof-brk:last-child{border-bottom:none} .nf-prof-brk .tk{ width:26px;height:26px;border-radius:50%;background:var(--line-08); display:grid;place-items:center;font:600 11px var(--cond);color:var(--warm);flex:none; } .nf-prof-brk .nm{flex:1;min-width:0} .nf-prof-brk .nm b{display:block;font:600 14px var(--sans);color:var(--text)} .nf-prof-brk .nm i{font:400 11px var(--sans);color:var(--dim);font-style:normal} .nf-prof-brk .vl{font:600 13px var(--sans);color:var(--text);white-space:nowrap} /* v3.10.0 · Analisi */ .nf-analisi-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:24px;align-items:start} .nf-back{cursor:pointer;margin-bottom:6px;display:inline-block} .nf-back:hover{color:var(--text)} .nf-subtabs{display:flex;gap:24px;margin-bottom:22px;border-bottom:1px solid var(--line-10)} .nf-subtab{ padding:0 0 10px;background:transparent;border:none;border-bottom:2px solid transparent; font:600 14px var(--sans);color:var(--dim);cursor:pointer;transition:color .15s,border-color .15s; } .nf-subtab:hover{color:var(--text)} .nf-subtab.active{color:var(--text);border-bottom-color:var(--warm)} .nf-donut-wrap{display:flex;justify-content:center;padding:20px 0} .nf-donut-lg{position:relative;width:340px;height:340px;flex:none} .nf-donut-c{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none} .nf-donut-c .lbl{margin-bottom:6px} .nf-donut-c .val{font:600 36px/1 var(--cond);color:var(--text)} .nf-donut-pill{ position:absolute;background:var(--bg);border:1px solid var(--line-12); border-radius:20px;padding:6px 12px;font:600 12px var(--sans);color:var(--text); box-shadow:0 4px 14px var(--ink-14);display:flex;align-items:center;gap:6px; transform:translate(-50%,-50%);white-space:nowrap;pointer-events:none; } .nf-donut-pill .dot{width:8px;height:8px;border-radius:50%;flex:none} .nf-donut-pill .nf-logo{width:20px;height:20px} .nf-pill-glyph{ width:20px;height:20px;border-radius:50%;flex:none; display:inline-flex;align-items:center;justify-content:center; font-size:10px;color:var(--on-accent); } .nf-perf{font:400 14px/1.7 var(--sans);color:var(--text)} .nf-perf b{font-weight:600} .nf-perf .pos{color:var(--positive)} .nf-perf .neg{color:var(--danger)} .nf-class-row{ display:flex;align-items:center;justify-content:space-between;gap:12px; padding:14px 0;border-bottom:1px solid var(--line-06);cursor:pointer; } .nf-class-row:last-of-type{border-bottom:none} /* v3.45.0: niente righe fra le voci, in Panoramica e in Analisi */ .nf-pos-row,.nf-class-row{border-bottom-color:transparent!important} .nf-class-name{font:500 13px var(--sans);color:var(--text)} .nf-class-r{display:flex;align-items:center;gap:14px} .nf-class-v{text-align:right} .nf-class-v b{display:block;font:600 13px var(--sans);color:var(--text)} .nf-class-v i{font:400 11px var(--sans);color:var(--dim);font-style:normal} .nf-class-caret{color:var(--dim);font-size:11px;transition:transform .15s} .nf-class-row.open .nf-class-caret{transform:rotate(180deg)} .nf-class-sub{padding:0 0 12px 0} .nf-class-sub .r{display:flex;justify-content:space-between;gap:12px;padding:6px 0;font:400 12px var(--sans);color:var(--muted)} .nf-class-sub .r b{color:var(--text);font-weight:500} @media (max-width:1100px){ .nf-analisi-grid{grid-template-columns:1fr} } /* v3.8.0 · Budgeting a fasce */ .nf-budget-stack{display:flex;flex-direction:column;gap:24px} .nf-stepper{ width:22px;height:22px;border:1px solid var(--line-12);background:transparent; display:inline-grid;place-items:center;color:var(--muted);cursor:pointer; font-size:13px;line-height:1;border-radius:0; } .nf-stepper:hover{color:var(--warm);border-color:var(--warm)} .nf-budget-savings{font:600 40px/1 var(--cond);color:var(--text)} .nf-budget-savings.pos{color:var(--positive)} .nf-budget-savings.neg{color:var(--danger)} .nf-budget-flowlegend{margin-top:14px;display:flex;flex-direction:column;gap:7px;font:400 12px var(--sans)} .nf-budget-flowlegend .row{display:flex;align-items:center;gap:9px;min-width:210px} .nf-budget-flowlegend .sw{width:9px;height:9px;border-radius:50%;flex:none} .nf-budget-flowlegend .nm{flex:1;color:var(--muted)} .nf-budget-flowlegend .vl{font-weight:600;color:var(--text)} .nf-budget-donutwrap{position:relative;width:150px;height:150px;flex:none} .nf-budget-rate{font:600 24px/1 var(--cond);color:var(--text);margin-top:6px} .nf-budget-rate.neg{color:var(--dim)} .nf-budget-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:16px} .nf-budget-kpis .k{ display:flex;align-items:center;gap:6px;flex-wrap:nowrap;white-space:nowrap; height:18px; /* v3.13.0: stessa altezza con o senza campo dentro, così le tre card si allineano */ } .nf-budget-kpis .k .kl-edit{line-height:1.1} .nf-budget-kpis .kl-edit{width:52px;flex:none;font-size:12px;padding:1px 6px} .nf-budget-kpis .kpi-edit{width:120px} @media (max-width:1100px){ .nf-budget-kpis {grid-template-columns:1fr} } /* v3.7.0 · Panoramica come da mockup: pannelli piatti, valore grande, lista posizioni */ .nf-bench-card,.nf-positions-card{ background:transparent;border:none;border-radius:0;box-shadow:none; padding:20px 22px 14px; } /* v3.13.0: grafico più alto, vicino al quadrato come nel mockup v3.18.0: cresce con l'altezza della finestra invece di restare fisso */ .nf-bench-body{height:clamp(380px, 52vh, 620px);position:relative} .nf-bench-body canvas{width:100% !important;height:100% !important} .nf-bench-head{margin-bottom:10px} .nf-bench-title{font:600 15px var(--sans);color:var(--muted)} .nf-hero-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px} .nf-bench-value{ font:600 40px/1 var(--cond); color:var(--text);letter-spacing:0; } .nf-hero-delta{font:600 14px var(--sans);margin-top:8px;color:var(--dim)} .nf-hero-delta.pos{color:var(--positive)} .nf-hero-delta.neg{color:var(--danger)} .nf-circle-btn{ width:34px;height:34px;border-radius:50%; border:1px solid var(--line-12);background:transparent; display:grid;place-items:center;color:var(--muted);font-size:15px; flex:none;cursor:pointer;transition:color .15s,border-color .15s; } .nf-circle-btn:hover{color:var(--warm);border-color:var(--warm)} .nf-bench-valuerow{margin:18px 0 6px} /* selettore periodi in stile mockup */ .nf-bench-ranges{display:flex;gap:4px} .nf-bench-range{ padding:6px 12px;border:none;background:transparent;border-radius:20px; font:600 12px var(--sans);color:var(--dim);cursor:pointer;transition:background .15s,color .15s; } .nf-bench-range:hover{color:var(--text)} .nf-bench-range.active{background:var(--line-08);color:var(--text)} /* lista investimenti */ .nf-positions-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:6px} .nf-positions-meta{font:400 11px var(--sans);color:var(--dim)} .nf-pos-row{ display:flex;align-items:center;gap:12px;padding:14px 0; border-bottom:1px solid var(--line-06);cursor:pointer; transition:background .12s; } .nf-pos-row:hover{background:var(--line-04)} .nf-pos-row:last-child{border-bottom:none} /* v3.12.0: il cerchio della posizione ora usa .nf-logo */ .nf-pos-main{flex:1;min-width:0} .nf-pos-name{font:600 14px var(--sans);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .nf-pos-sub{font:400 11px var(--sans);color:var(--dim);margin-top:3px} .nf-pos-val{font:500 13px var(--sans);color:var(--muted);margin-top:3px} .nf-pos-pl{font:600 13px var(--sans);white-space:nowrap;text-align:right} .nf-pos-pl.pos{color:var(--positive)} .nf-pos-pl.neg{color:var(--danger)} .nf-pos-pl small{display:block;font:400 11px var(--sans);color:var(--dim);margin-top:2px} /* === NETFOLIO v1.6: Panorama grid 2x2 === */ /* === NETFOLIO v1.5: Benchmark card === */ /* v3.7.0: aspetto definito più sopra (pannello piatto) */ .nf-bench-head{ display:flex;align-items:center;justify-content:space-between; margin-bottom:14px;flex-wrap:wrap;gap:10px; } .nf-bench-title{ font-family:var(--cond);font-size:18px;font-weight:600; color:var(--text-inv); } .nf-bench-ranges{display:flex;gap:3px} .nf-bench-range{ padding:5px 12px;font-size:11px;letter-spacing:.4px; background:transparent;border:1px solid var(--line-12); color:var(--muted-inv);font-family:var(--mono); border-radius:6px;cursor:pointer;transition:all .12s;font-weight:500; } .nf-bench-range:hover{color:var(--text-inv);border-color:var(--line-24)} .nf-bench-range.active{ background:var(--warm-15);border-color:var(--warm-light); color:var(--warm-light); } /* v3.13.0: altezza definita sopra */.nf-bench-body{position:relative} .nf-bench-body canvas{max-width:100%} /* v3.56.0: tolti gli stili del Futuro vecchio (il nuovo ha gli stili dentro la pagina) */ /* === NETFOLIO MOBILE v3.1 CSS (rigenerato) === */ #m-app{ /* v3.23.0: --bg, --surface, --text, --muted e --dim si chiamano come quelle globali, quindi non vanno ridefinite qui: "--bg:var(--bg)" è un riferimento circolare e il browser lo scarta, lasciando il colore trasparente. Le ereditiamo da :root e qui restano solo gli alias con nome diverso. */ --line:var(--line-12);--line2:var(--line-16); --gold:var(--warm);--gold-deep:var(--warm-dk);--pos:var(--positive);--neg:var(--danger); --teal:var(--accent);--blue:var(--warm-dk);--teal-deep:var(--accent);--sand:var(--gray); /* v3.23.0: stessi font del desktop */ --serif:var(--cond);--sans:var(--cond);--mono:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,ui-monospace,monospace; --r:12px;--R:14px; }#m-app *{box-sizing:border-box;margin:0;padding:0}#m-app{background:var(--bg);color:var(--text);font-family:var(--sans);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}#m-app a{color:var(--gold);text-decoration:none}#m-app a:hover{color:var(--gold-deep)}#m-app button{font-family:inherit;cursor:pointer}#m-app button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}#m-app .app{display:flex;flex-direction:column;height:100vh;height:100dvh;max-width:520px;margin:0 auto;overflow:hidden}#m-app .hdr{flex:none;display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top,0px)) 14px 10px} /* v3.24.0 · barra di ricerca in cima */ #m-app .brand{font-family:var(--serif);font-weight:700;font-size:21px;letter-spacing:-.2px}#m-app .brand em{color:var(--gold);font-style:italic}#m-app .body{flex:1;min-height:0;position:relative;overflow:hidden}#m-app .screen{position:absolute;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;display:none;flex-direction:column}#m-app .screen.on{display:flex;animation:fi .22s ease}@keyframes fi{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}#m-app .pad{padding:0 14px 20px}#m-app .hero{position:relative;height:262px;flex:none;overflow:hidden}#m-app .hero svg{position:absolute;left:0;bottom:30px;width:470px;height:186px}#m-app .kicker{font:500 9px var(--mono);letter-spacing:1.4px;text-transform:uppercase;color:var(--dim)}#m-app .big{font-family:var(--serif);font-weight:700;font-size:50px;line-height:1.05;margin-top:3px}/* v3.24.0 · variazione sotto il totale, senza pillola */ #m-app .m-delta{font:600 13px var(--sans);color:var(--dim);background:none;border:none;padding:0} #m-app .m-delta.up{color:var(--pos)} #m-app .m-delta.down{color:var(--neg)}#m-app #d-svg.d-loading path{animation:d-pulse 1.1s ease-in-out infinite;stroke:var(--warm-35)}#m-app #d-svg.d-loading #d-area{fill:var(--warm-08)}@keyframes d-pulse{0%,100%{opacity:.35}50%{opacity:.75}}#m-app .ranges{position:absolute;left:16px;right:16px;bottom:6px;display:flex;gap:5px}#m-app .range{flex:1;text-align:center;font:600 10.5px var(--mono);padding:6px 0;border-radius:8px;color:var(--muted);background:var(--line-06);border:1px solid var(--line2)}#m-app .range.on{color:var(--gold);background:var(--warm-15);border-color:var(--gold-deep)}#m-app .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--R);padding:14px 16px}#m-app .card+.card{margin-top:10px}#m-app .rule{padding-bottom:11px;border-bottom:1px solid var(--line-12)}#m-app .seg{display:flex;gap:3px;background:var(--line-06);border:1px solid var(--line2);border-radius:9px;padding:2px;margin-top:10px}#m-app .seg button{flex:1;border:none;background:transparent;color:var(--muted);padding:6px 0;border-radius:7px;font:600 10px var(--mono);letter-spacing:.6px}#m-app .seg button.on{background:var(--gold);color:var(--bg)}#m-app .alloc{display:flex;align-items:center;gap:16px;margin-top:14px}#m-app .donut{position:relative;flex:none;width:112px;height:112px}#m-app .donut-ring{width:112px;height:112px;border-radius:50%}#m-app .donut-hole{position:absolute;left:22px;top:22px;width:68px;height:68px;border-radius:50%;background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center}#m-app .donut-lbl{font:400 7.5px var(--mono);color:var(--dim);letter-spacing:.5px;text-align:center;max-width:56px;line-height:1.2}#m-app .legend{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}#m-app .pos-list{display:flex;flex-direction:column;gap:6px}#m-app .pos{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 0;background:transparent;border:none;border-bottom:1px solid var(--line-06);border-radius:0;color:var(--text)} #m-app .pos:last-child{border-bottom:none} #m-app .pos .nf-logo{width:36px;height:36px} #m-app .pos-val{font:400 12px var(--sans);color:var(--muted);margin-top:2px} #m-app .pl-pct{font:400 11px var(--sans);color:var(--dim)}#m-app .pos:active{background:var(--page)}#m-app .badge{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:700 11px var(--sans);color:var(--bg);letter-spacing:-.2px;flex:none}#m-app .pos-mid{min-width:0;display:flex;flex-direction:column;gap:2px}#m-app .pos-name{font:600 14px var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#m-app .pos-sub{font:400 11px var(--sans);color:var(--dim);letter-spacing:0}#m-app .pos-right{display:flex;flex-direction:column;align-items:flex-end;gap:3px}#m-app .pos-val{font:500 13px var(--mono)}#m-app .pl{font:600 13px var(--sans)}#m-app .pl.up{color:var(--pos)}#m-app .pl.down{color:var(--neg)}#m-app .back{display:flex;align-items:center;gap:7px;background:none;border:none;color:var(--muted);font:500 12px var(--sans);padding:4px 2px 12px}#m-app .d-head{display:flex;align-items:center;gap:12px}#m-app .d-name{font-family:var(--serif);font-weight:700;font-size:22px;line-height:1.1}#m-app .d-sub{font:400 10.5px var(--mono);color:var(--dim);letter-spacing:.6px}#m-app .d-val{font:600 30px var(--mono)}#m-app .grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px 10px;padding-top:12px}#m-app .bar{height:6px;border-radius:3px;background:var(--line-08);margin-top:10px;overflow:hidden}#m-app .bar span{display:block;height:100%;border-radius:3px;background:var(--gold)}#m-app .note{font:400 10px var(--mono);color:var(--dim);margin-top:8px}#m-app .tri{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}#m-app .tri .card{padding:11px 10px}#m-app .tx{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px solid var(--line-08)}#m-app .tx:last-child{border-bottom:none}#m-app .tx-l{font:500 12.5px var(--sans)}#m-app .tx-m{font:400 9.5px var(--mono);color:var(--dim);letter-spacing:.4px}#m-app .tx-a{font:500 12.5px var(--mono);flex:none}#m-app .link{background:none;border:none;color:var(--gold);font:500 10px var(--mono)}#m-app .step{display:flex;align-items:center;justify-content:space-between;margin-top:6px}#m-app .step button{width:26px;height:26px;border-radius:8px;border:1px solid var(--line2);background:var(--line-06);color:var(--text);font-size:15px;line-height:1}#m-app .step span{font:600 14px var(--mono)}#m-app .sw{width:14px;height:2px;background:var(--gold)}#m-app .sw.dash{height:0;border-top:2px dashed var(--gray);background:none}#m-app .sum{display:flex;flex-direction:column;gap:9px;padding-top:11px;font:400 11.5px var(--mono)}#m-app .sum div{display:flex;justify-content:space-between}#m-app .sum .k{color:var(--dim)}#m-app .sum .last{padding-top:9px;border-top:1px solid var(--line-12)}#m-app .list{background:var(--surface);border:1px solid var(--line);border-radius:var(--R);overflow:hidden;margin-top:10px}#m-app .list-row{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line-08);font:500 13px var(--sans)}#m-app .list-row:last-child{border-bottom:none}#m-app .list-row i{font:400 10px var(--mono);color:var(--dim);font-style:normal}#m-app .toggle{width:40px;height:22px;border-radius:11px;background:var(--line-10);display:flex;align-items:center;padding:2px}#m-app .toggle span{width:18px;height:18px;border-radius:50%;background:var(--dim)}#m-app .month{display:flex;align-items:center;justify-content:space-between;margin-top:9px}#m-app .month button{width:30px;height:30px;border-radius:9px;border:1px solid var(--line2);background:var(--line-06);color:var(--text);font-size:15px}#m-app .month span{font:500 14px var(--mono)}#m-app .scrim{position:absolute;inset:0;background:var(--ink-40);display:none;z-index:5}#m-app .scrim.on{display:block}#m-app .sheet{position:absolute;left:0;right:0;bottom:0;z-index:20;background:var(--surface);border-top:1px solid var(--line2);border-radius:20px 20px 0 0;padding:12px 16px calc(80px + env(safe-area-inset-bottom,0px));display:none;touch-action:pan-y}#m-app .sheet.on{display:block;animation:up .24s ease}@keyframes up{from{transform:translateY(24px);opacity:.4}to{transform:none;opacity:1}}#m-app .grab{width:38px;height:4px;border-radius:2px;background:var(--line-16);margin:0 auto 14px}#m-app .sheet-t{font-family:var(--serif);font-weight:700;font-size:17px;margin-bottom:12px}#m-app .opt{display:block;width:100%;text-align:left;padding:14px;border:1px solid var(--line2);border-radius:var(--r);background:var(--bg);color:var(--text);font:600 13px var(--sans)}#m-app .opt+.opt{margin-top:8px}#m-app .search{display:flex;align-items:center;gap:9px;background:var(--bg);border:1px solid var(--line2);border-radius:var(--r);padding:10px 12px}#m-app .search input{flex:1;background:none;border:none;outline:none;color:var(--text);font:400 13px var(--sans)}#m-app .chips{display:flex;gap:6px;margin-top:12px}#m-app .chips span{font:500 10.5px var(--mono);color:var(--muted);background:var(--line-06);border:1px solid var(--line2);padding:5px 12px;border-radius:20px}#m-app .chips span.on{color:var(--bg);background:var(--gold);border-color:var(--gold)}#m-app .res{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 2px;border-bottom:1px solid var(--line-08)}#m-app #res-list{max-height:45vh;overflow-y:auto;-webkit-overflow-scrolling:touch;margin-top:12px}#m-app .res b{font:500 13px var(--sans);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#m-app .res i{font:400 9.5px var(--mono);color:var(--dim);letter-spacing:.4px;font-style:normal}#m-app .res em{font:500 12px var(--mono);color:var(--muted);font-style:normal;flex:none}#m-app .cta{width:100%;margin-top:14px;padding:13px;border:none;border-radius:var(--r);background:var(--gold);color:var(--bg);font:600 13px var(--sans)}#m-app .nav{flex:none;display:flex;align-items:center;background:var(--glass);border-top:1px solid var(--line-12);padding:7px 0 calc(10px + env(safe-area-inset-bottom,0px))}#m-app .nav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;color:var(--muted);padding:4px 0;font:500 9.5px var(--sans)}#m-app .nav button.on{color:var(--gold)}#m-app .nav svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}/* v3.23.0: al centro della barra c'è la F del logo, non un "+" */ /* v3.27.0 · ricerca mobile */ #m-app .m-res .nf-logo{width:36px;height:36px} #m-app .m-res-px{font:500 13px var(--sans);color:var(--text);white-space:nowrap} /* v3.26.0 · profilo mobile */ #m-app .m-prof-name{font:600 19px/1.2 var(--cond);color:var(--text)} #m-app .m-name-edit{cursor:pointer} #m-app .m-row.m-row-brk{grid-template-columns:40px minmax(0,1fr) auto 32px} #m-app .m-brk-del{all:unset;cursor:pointer;color:var(--dim);width:32px;height:32px;display:grid;place-items:center} #m-app .m-brk-del svg{width:17px;height:17px} #m-app .m-brk-del:active{color:var(--neg)} #m-app .m-add-link{all:unset;cursor:pointer;display:block;margin-top:18px;font:600 14px var(--sans);color:var(--warm)} /* v3.25.0 · budget mobile */ #m-app .m-rate-wrap{display:flex;justify-content:center;padding:18px 0 4px} #m-app .m-rate-wrap .donut{width:132px;height:132px} #m-app .m-rate-wrap .donut-ring{width:132px;height:132px} #m-app .m-rate-wrap .donut-hole{left:26px;top:26px;width:80px;height:80px;background:var(--bg)} #m-app .m-rate{font:600 20px/1 var(--cond);color:var(--text);margin-top:3px} /* v3.25.0 · dettaglio mobile */ #m-app .m-datalist{margin-top:6px} #m-app .m-datarow{ display:flex;align-items:baseline;justify-content:space-between;gap:12px; padding:12px 0;border-bottom:1px solid var(--line-06); } #m-app .m-datarow:last-child{border-bottom:none} #m-app .m-datarow span{font:400 12.5px var(--sans);color:var(--muted)} #m-app .m-datarow b{font:500 13.5px var(--sans);color:var(--text);text-align:right} #m-app .d-head .nf-logo{width:44px;height:44px} /* v3.23.0 · analisi mobile */ #m-app .scr-title{font:600 26px/1 var(--cond);color:var(--text);margin:6px 0 16px} #m-app .m-subtabs{display:flex;gap:18px;border-bottom:1px solid var(--line-10);margin-bottom:18px} #m-app .m-subtabs button{ background:none;border:none;border-bottom:2px solid transparent; padding:0 0 9px;font:600 13px var(--sans);color:var(--dim); } #m-app .m-subtabs button.on{color:var(--text);border-bottom-color:var(--gold)} #m-app .m-donut-wrap{display:flex;justify-content:center;padding:6px 0 22px} #m-app .m-donut-wrap .donut{width:190px;height:190px} #m-app .m-donut-wrap .donut-ring{width:190px;height:190px} #m-app .m-donut-wrap .donut-hole{left:38px;top:38px;width:114px;height:114px;background:var(--bg)} #m-app .m-donut-wrap .donut-lbl{font-size:8.5px;max-width:90px;margin-bottom:3px} #m-app .m-an-tot{font:600 19px/1.2 var(--cond);color:var(--text);margin-top:3px} #m-app .m-an-row{ display:flex;align-items:center;gap:10px;padding:13px 0; border-bottom:1px solid var(--line-06); } #m-app .m-an-row:last-child{border-bottom:none} #m-app .m-an-dot{width:9px;height:9px;border-radius:50%;flex:none} #m-app .m-an-n{flex:1;font:500 13px var(--sans);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #m-app .m-an-p{font:400 12px var(--sans);color:var(--dim);white-space:nowrap} #m-app .m-an-v{font:600 13px var(--sans);color:var(--text);white-space:nowrap;min-width:78px;text-align:right} #m-app .m-empty{padding:26px 0;text-align:center;color:var(--dim);font-size:13px} /* v3.2.0: overlay auth (login/signup) */ .nf-auth-overlay{position:fixed;inset:0;background:var(--bg);z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,sans-serif;color:var(--text)} .nf-auth-card{width:100%;max-width:380px;background:var(--surface);border:1px solid var(--line-16);border-radius:20px;padding:32px 28px;color:var(--text)} .nf-auth-brand{font-family:var(--serif);font-weight:700;font-size:32px;text-align:center;margin-bottom:6px} .nf-auth-brand em{color:var(--gold);font-style:italic} .nf-auth-tag{text-align:center;font:400 12px system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,monospace;color:var(--dim);letter-spacing:.4px;margin-bottom:24px} .nf-auth-tabs{display:flex;gap:6px;background:var(--line-06);padding:3px;border-radius:10px;margin-bottom:20px} .nf-auth-tabs button{flex:1;padding:9px 0;background:none;border:none;color:var(--muted);font:600 12px system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,sans-serif;border-radius:8px;cursor:pointer} .nf-auth-tabs button.on{background:var(--gold);color:var(--bg)} .nf-auth-card input{width:100%;padding:12px 14px;background:var(--bg);border:1px solid var(--line-16);border-radius:10px;color:var(--text) !important;font:400 14px system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,sans-serif;margin-bottom:10px;outline:none;-webkit-text-fill-color:var(--text);caret-color:var(--text)}.nf-auth-card input::placeholder{color:var(--dim)}.nf-auth-card input:-webkit-autofill,.nf-auth-card input:-webkit-autofill:hover,.nf-auth-card input:-webkit-autofill:focus,.nf-auth-card input:-webkit-autofill:active{-webkit-text-fill-color:var(--text) !important;-webkit-box-shadow:0 0 0 30px var(--bg) inset !important;caret-color:var(--text)} .nf-auth-card input:focus{border-color:var(--gold)} .nf-auth-submit{width:100%;padding:13px;background:var(--gold);color:var(--bg);border:none;border-radius:10px;font:600 14px var(--sans);cursor:pointer;margin-top:4px} .nf-auth-submit:disabled{opacity:.55;cursor:default} .nf-auth-msg{margin-top:12px;padding:10px 12px;border-radius:8px;font:500 12px var(--sans);display:none} .nf-auth-msg.err{background:var(--neg-12);color:var(--neg);border:1px solid var(--neg-25);display:block} .nf-auth-msg.ok{background:var(--pos-12);color:var(--pos);border:1px solid var(--pos-25);display:block} .nf-auth-msg.info{background:var(--line-06);color:var(--muted);border:1px solid var(--line2);display:block} .nf-auth-hint{margin-top:20px;padding-top:16px;border-top:1px solid var(--line-16);text-align:center;font:400 11px system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,monospace;color:var(--dim);letter-spacing:.4px;line-height:1.6} .nf-auth-offline{background:none;border:1px solid var(--line2);color:var(--muted);padding:8px 14px;border-radius:8px;font:500 11px var(--sans);cursor:pointer;margin-top:10px;display:none} .nf-auth-offline.show{display:inline-block} .nf-auth-loading{text-align:center;padding:40px 0;font:400 12px var(--mono);color:var(--dim);letter-spacing:.4px} /* v3.62.0 · mobile in stile Trade Republic */ #m-app .app{position:relative} #m-app .m-tr-hdr{padding:calc(16px + env(safe-area-inset-top,0px)) 20px 6px;gap:14px} #m-app .m-tabs{flex:1;min-width:0;display:flex;gap:12px;overflow-x:auto;scrollbar-width:none} #m-app .m-tabs::-webkit-scrollbar{display:none} #m-app .m-tabs button{flex:none;background:none;border:none;padding:0;font:700 20px/1.25 var(--mono);letter-spacing:-.4px;color:var(--dim);white-space:nowrap;transition:color .15s} #m-app .m-tabs button.on{color:var(--text)} #m-app .m-av{flex:none;width:40px;height:40px;border-radius:50%;border:none;background:var(--line-16);color:var(--text);font:700 17px var(--mono);transition:background .15s,color .15s} #m-app .m-av.on{background:var(--text);color:var(--bg)} #m-app .screen{padding-bottom:100px} #m-app .screen>*{flex-shrink:0} #m-app .screen{scrollbar-width:none} #m-app .screen::-webkit-scrollbar{display:none} #m-app #s-sub .back{font:600 15px var(--mono);color:var(--dim);padding:22px 0 0} /* v3.62.0 · Futuro su mobile */ #m-app #m-fu-host [style*="minmax(0px, 320px)"],#m-app #m-fu-host [style*="minmax(0px, 420px)"],#m-app #m-fu-host [style*="minmax(0px, 200px)"],#m-app #m-fu-host [style*="minmax(0px, 1fr) minmax(0px, 1.3fr)"]{grid-template-columns:minmax(0,1fr)!important;gap:20px!important} #m-app #m-fu-host [style*="padding-top: 48px"]{padding-top:14px!important} #m-app #m-fu-host [style*="min-width: 420px"]{min-width:0!important} #m-app #m-fu-host [style*="min-width: 420px"]>span{font-size:13px!important;white-space:nowrap} #m-app #m-fu-host [style*="min-width: 420px"]>span:nth-child(n){padding-left:10px!important} #m-app #m-fu-host [style*="min-width: 420px"]>span[style*="text-align: left"]{padding-left:0!important} #m-app #m-fu-host h1{font-size:28px!important} #m-app #m-fu-host [style*="margin-top: 44px"]{margin-top:28px!important} /* ipotesi: elenco, poi una pagina per voce */ #m-app #m-fu-host [style*="grid-template-columns: 220px minmax(0px, 1fr)"]{display:block!important} #m-app #m-fu-host [style*="grid-template-columns: 220px minmax(0px, 1fr)"]>div:first-child{position:static!important} #m-app #m-fu-host [style*="grid-template-columns: 220px minmax(0px, 1fr)"]:has(> div[style*="sticky"])>div:last-child{display:none} #m-app #s-futuro.ipo-open #m-fu-host [style*="grid-template-columns: 220px minmax(0px, 1fr)"]:has(> div[style*="sticky"])>div:first-child{display:none!important} #m-app #s-futuro.ipo-open #m-fu-host [style*="grid-template-columns: 220px minmax(0px, 1fr)"]:has(> div[style*="sticky"])>div:last-child{display:block} #m-app #s-futuro.ipo-open #m-fu-host [style*="margin-bottom: 36px"]{display:none!important} #m-app .m-fu-back{display:none;margin:14px 14px 0} #m-app #s-futuro.ipo-open .m-fu-back{display:flex} /* piano anno per anno: voci strette, 4 anni visibili */ #m-app #m-fu-host [style*="width: 220px; flex: 0 0 auto"]{width:112px!important;padding-left:0!important;font-size:11.5px!important;line-height:1.3;padding-right:6px!important} #m-app #m-fu-host [style*="width: 76px; flex: 0 0 auto"]{width:62px!important;padding-left:4px!important;padding-right:4px!important;font-size:11.5px!important} #m-app #m-fu-host [style*="width: 76px; flex: 0 0 auto"] *{font-size:11px!important} /* spese mensili: cubetti più piccoli, importo a destra */ #m-app #m-fu-host [style*="minmax(0px, 1.2fr) minmax(0px, 1fr) 170px"]{grid-template-columns:minmax(0,1fr) auto!important;gap:8px 12px!important;padding:10px 0!important} #m-app #m-fu-host [style*="minmax(0px, 1.2fr) minmax(0px, 1fr) 170px"]>span:nth-child(2){grid-column:1/-1;grid-row:2;height:12px!important;gap:2px!important} #m-app #m-fu-host [style*="minmax(0px, 1.2fr) minmax(0px, 1fr) 170px"]>span:nth-child(3){grid-column:2;grid-row:1} #m-app #m-fu-host [style*="minmax(0px, 1.2fr) minmax(0px, 1fr) 170px"]>span:first-child>span{gap:4px!important} #m-app #m-fu-host [style*="minmax(0px, 1.2fr) minmax(0px, 1fr) 170px"]>span:first-child input{width:auto!important;min-width:0;field-sizing:content;text-align:left!important;padding:2px 6px!important} #m-app #m-fu-host [style*="minmax(0px, 1.2fr) minmax(0px, 1fr) 170px"]>*:last-child{min-width:0!important} #m-app #m-fu-host [style*="minmax(0px, 1.2fr) minmax(0px, 1fr) 170px"] [style*="min-width: 150px"]{min-width:0!important;padding:7px 10px!important} #m-app #m-fu-host [style*="minmax(0px, 1.2fr) minmax(0px, 1fr) 170px"] input{width:62px!important} /* FIRE stress: importi accanto alla scritta */ #m-app #m-fu-host [style*="10px minmax(0px, 1fr) 130px 130px"]{grid-template-columns:8px minmax(0,1fr) auto auto!important;gap:10px!important} #m-app #m-fu-host [style*="10px minmax(0px, 1fr) 130px 130px"] b{font-size:13.5px!important} #m-app #m-fu-host [style*="10px minmax(0px, 1fr) 130px 130px"] i,#m-app #m-fu-host [style*="10px minmax(0px, 1fr) 130px 130px"] small{font-size:11px!important} #m-app #m-fu-host [style*="gap: 64px"],#m-app #m-fu-host [style*="gap: 72px"]{gap:20px!important} #m-app #m-fu-host [style*="gap: 40px"]{gap:16px!important} /* ipotesi: campi più compatti */ #m-app #m-fu-host [style*="min-width: 150px; justify-content: flex-end"]{min-width:0!important} #m-app .pad{padding:0 20px 8px} #m-app .m-k{font:600 15px var(--mono);color:var(--dim);margin-top:26px} #m-app .m-big{font:700 36px/1.15 var(--mono);letter-spacing:-.8px;color:var(--text);margin-top:4px;overflow-wrap:anywhere} #m-app .m-ranges{display:flex;justify-content:space-between;padding:26px 20px 10px} #m-app .m-ranges .range{flex:none;background:none;border:none;border-radius:0;padding:6px 4px;font:700 15px var(--mono);color:var(--dim)} #m-app .m-ranges .range.on{color:var(--text);background:none} #m-app .m-chart svg{display:block;width:100%;height:230px} #m-app .m-h2{font:700 19px var(--mono);color:var(--text)} #m-app .m-h2-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:30px 0 4px} #m-app .m-h2-meta{font:500 13px var(--mono);color:var(--dim)} #m-app .m-h2-link{display:flex;align-items:center;gap:10px;background:none;border:none;padding:0;margin:34px 0 4px;font:700 19px var(--mono);color:var(--text)} #m-app .m-h2-link span{color:var(--dim);font-size:22px;line-height:1} #m-app .pos{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:14px;width:100%;padding:13px 0;background:none;border:none;text-align:left;color:var(--text)} #m-app .pos .nf-logo{width:40px;height:40px} #m-app .pos-name{font:600 15px var(--mono)} #m-app .pos-sub,#m-app .pos-val{font:400 13px var(--mono);color:var(--dim)} #m-app .pl{font:600 15px var(--mono)} #m-app .pl-pct{font:400 13px var(--mono);color:var(--dim)} #m-app .m-tiles{display:flex;gap:12px;overflow-x:auto;padding:28px 20px 4px;scroll-padding:0 20px;scroll-snap-type:x mandatory;scrollbar-width:none} #m-app .m-tiles::-webkit-scrollbar{display:none} #m-app .m-tile{flex:0 0 42%;min-height:122px;scroll-snap-align:start;background:var(--line-08);border:none;border-radius:18px;padding:16px;display:flex;flex-direction:column;align-items:flex-start;gap:12px;text-align:left;color:var(--text)} #m-app button.m-tile:active{background:var(--line-12)} #m-app .m-tile-l{font:600 15px var(--mono);color:var(--dim)} #m-app .m-tile-v{font:700 17px var(--mono);color:var(--text)} #m-app .m-tile-sm{font-size:13px;font-weight:600;overflow-wrap:anywhere} #m-app .m-tile-s{font:500 12px var(--mono);color:var(--dim);margin-top:auto} #m-app .m-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:14px;width:100%;padding:13px 0;background:none;border:none;text-align:left;color:var(--text)} #m-app .m-row .nf-logo{width:40px;height:40px} #m-app .m-row-ic{width:40px;height:40px;border-radius:50%;background:var(--line-08);display:grid;place-items:center;font:700 15px var(--mono);color:var(--text)} #m-app .m-row-t{min-width:0;display:flex;flex-direction:column;gap:3px} #m-app .m-row-t b{font:600 15px var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #m-app .m-row-t i{font:400 13px var(--mono);font-style:normal;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #m-app .m-row-a{font:600 15px var(--mono);white-space:nowrap;text-align:right} #m-app .m-row-a.up{color:var(--pos)} #m-app .m-month{font:700 15px var(--mono);color:var(--dim);margin:26px 0 2px} #m-app .m-cat{padding:13px 0} #m-app .m-cat-hd{display:flex;align-items:baseline;justify-content:space-between;gap:12px} #m-app .m-cat-hd b{font:600 15px var(--mono)} #m-app .m-cat-hd span{font:600 15px var(--mono);white-space:nowrap} #m-app .m-cat-sub{font:400 13px var(--mono);color:var(--dim);margin-top:3px} #m-app .m-cat-bar{height:4px;border-radius:2px;background:var(--line-08);margin-top:9px;overflow:hidden} #m-app .m-cat-bar span{display:block;height:100%;border-radius:2px;background:var(--text)} #m-app .m-cat-bar span.over{background:var(--neg)} #m-app .m-kv{display:flex;justify-content:space-between;gap:12px;padding:14px 0;font:500 15px var(--mono);color:var(--dim)} #m-app .m-kv b{color:var(--text);font-weight:600} #m-app .m-rate-wrap{padding:28px 0 12px} #m-app .m-rate-wrap .donut,#m-app .m-rate-wrap .donut-ring{width:170px;height:170px} #m-app .m-rate-wrap .donut-hole{left:22px;top:22px;width:126px;height:126px;background:var(--bg)} #m-app .m-svc{display:flex;flex-direction:column} #m-app .m-svc-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:18px;width:100%;padding:14px 0;background:none;border:none;text-align:left;color:var(--text)} #m-app .m-svc-ic{width:34px;height:34px;border-radius:50%;background:var(--text);color:var(--bg);display:grid;place-items:center} #m-app .m-svc-ic svg{width:18px;height:18px} #m-app .m-svc-t{min-width:0;display:flex;flex-direction:column;gap:3px} #m-app .m-svc-t b{font:600 16px var(--mono)} #m-app .m-svc-t i{font:400 13.5px var(--mono);font-style:normal;color:var(--dim)} #m-app .m-danger .m-svc-ic{background:var(--neg)} #m-app .m-danger b{color:var(--neg)} #m-app .m-dock{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:flex-end;padding:12px 20px calc(18px + env(safe-area-inset-bottom,0px));pointer-events:none;z-index:5} #m-app .m-pill{pointer-events:auto;display:flex;align-items:center;gap:12px;background:var(--text);color:var(--bg);border:none;border-radius:20px;padding:16px 22px;font:700 16px var(--mono);box-shadow:0 6px 24px rgba(0,0,0,.35)} #m-app .m-pill svg{width:18px;height:18px} #m-app .m-pill:active{opacity:.85} #m-app .m-fu{padding:6px 14px 0} #m-app .m-hero-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:4px} #m-app .m-hero-row .m-big{margin-top:0} #m-app .m-hero-row .m-delta{font:600 15px var(--mono);cursor:pointer;white-space:nowrap} #m-app .m-an-btn{margin-left:auto;width:36px;height:36px;border-radius:50%;border:none;background:var(--line-08);color:var(--text);font-size:17px;line-height:1;display:grid;place-items:center} #m-app .m-an-btn:active{background:var(--line-16)} #m-app .m-month-sw{margin-left:auto;display:flex;align-items:center;gap:2px;font:600 13px var(--mono);color:var(--dim);white-space:nowrap} #m-app .m-month-sw button{width:28px;height:28px;border:none;background:none;color:var(--dim);font-size:18px;line-height:1;border-radius:50%} #m-app .m-month-sw button:active{background:var(--line-08);color:var(--text)} #m-app .m-tile-v.pos{color:var(--pos)} #m-app .m-tile-v.neg{color:var(--neg)} #m-app .m-row.m-row-del{grid-template-columns:40px minmax(0,1fr) auto 32px} #m-app .m-row.m-row-del.m-row-noic{grid-template-columns:minmax(0,1fr) auto 32px} #m-app .m-del{width:32px;height:32px;border-radius:50%;border:none;background:none;color:var(--dim);display:grid;place-items:center} #m-app .m-del:active{background:var(--line-08);color:var(--neg)} #m-app .m-del svg{width:17px;height:17px} #m-app .m-check{color:var(--text);font:700 16px var(--mono)} #m-app .m-search{display:flex;align-items:center;gap:10px;margin-top:20px;background:var(--line-08);border-radius:16px;padding:0 16px;color:var(--dim)} #m-app .m-search svg{width:19px;height:19px;flex:none} #m-app .m-search input{flex:1;min-width:0;background:none;border:none;outline:none;color:var(--text);font:500 16px var(--mono);padding:15px 0} #m-app .m-search input::placeholder{color:var(--dim)} #m-app .m-chips{display:flex;gap:8px;margin:14px 0 8px;overflow-x:auto;scrollbar-width:none} #m-app .m-chips span{flex:none;padding:8px 14px;border-radius:16px;background:var(--line-08);color:var(--dim);font:600 13px var(--mono);cursor:pointer} #m-app .m-chips span.on{background:var(--text);color:var(--bg)} #m-app #res-list{max-height:none!important;height:auto!important;overflow:visible!important} #m-app #res-list .pos{padding:9px 0!important} #m-app #res-list .pos{grid-template-columns:40px minmax(0,1fr) auto} #m-app .m-cat-hd .m-dots{width:30px;height:24px;border:none;background:none;color:var(--dim);font:700 16px/1 var(--mono);border-radius:8px;margin-left:4px} #m-app .m-cat-hd .m-dots:active{background:var(--line-08);color:var(--text)} #m-app .m-cat-hd .m-cat-r{display:flex;align-items:center} #m-app .m-sec{font:700 15px var(--mono);color:var(--dim);margin:28px 0 2px;display:flex;justify-content:space-between;align-items:center} #m-app .m-sec button{background:none;border:none;color:var(--text);font:600 14px var(--mono);padding:4px 0} #m-app #m-sub-k:empty{display:none} #m-app .m-soon{padding:40px 0;color:var(--dim);font:500 15px/1.5 var(--mono)} #m-app #m-fu-host #sec-futuro{display:block!important;font-family:var(--mono)} #m-app #m-fu-host #sec-futuro *{box-sizing:border-box} /* v3.62.0 · finestre per aggiungere: stesso stile del resto (nero, niente righe grigie, pulsanti a pillola) */ .nf-modal-overlay{background:rgba(0,0,0,.62);backdrop-filter:blur(2px)} .nf-modal{background:var(--surface);border:0!important;border-radius:20px;box-shadow:0 24px 64px rgba(0,0,0,.55)} .nf-modal-head{border-bottom:0!important;padding:22px 24px 4px} .nf-modal-asset{font:700 22px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--text);letter-spacing:-.2px} .nf-modal-sub{font:400 12.5px system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;letter-spacing:0;color:var(--dim);margin-top:4px} .nf-modal-body{padding:16px 24px 8px} .nf-field{margin-bottom:16px} .nf-field-label{font:500 12.5px system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;letter-spacing:0;text-transform:none;color:var(--dim);margin-bottom:7px} .nf-field-input,.nf-field-select,.nf-modal input[type="text"],.nf-modal input[type="number"],.nf-modal input[type="date"],.nf-modal select,.nf-modal textarea{ width:100%;background:var(--bg)!important;border:0!important;border-radius:12px!important;box-shadow:none; padding:12px 14px!important;color:var(--text)!important;font:500 15px system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif!important; text-align:left!important;outline:none;transition:box-shadow .12s} .nf-field-input::placeholder,.nf-modal input::placeholder{color:var(--dim);opacity:1} .nf-field-input:focus,.nf-field-select:focus,.nf-modal input:focus,.nf-modal select:focus,.nf-modal textarea:focus{box-shadow:inset 0 0 0 1px var(--line-24)!important;background:var(--bg)!important} .nf-modal input[type="number"]{-moz-appearance:textfield;appearance:textfield} .nf-modal input[type="number"]::-webkit-inner-spin-button,.nf-modal input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0} .nf-modal input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(.6);cursor:pointer} html.theme-light .nf-modal input[type="date"]::-webkit-calendar-picker-indicator{filter:none} .nf-modal select,.nf-field-select{-webkit-appearance:none;appearance:none;cursor:pointer;padding-right:38px!important; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")!important; background-repeat:no-repeat!important;background-position:right 12px center!important;background-size:16px!important} .nf-field-row{gap:12px} .nf-modal-foot{border-top:0!important;padding:12px 24px 22px;gap:10px} .nf-btn{border-radius:999px!important;padding:11px 20px!important;font:600 14px system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif!important;letter-spacing:0!important} .nf-btn-cancel{background:transparent!important;border:0!important;color:var(--muted)!important} .nf-btn-cancel:hover{color:var(--text)!important;background:var(--line-06)!important} .nf-btn-save{background:var(--text)!important;color:var(--bg)!important;border:0!important} .nf-btn-save:hover{opacity:.88} .nf-modal .nf-liq-row,.nf-modal [class*="-row"]{border-bottom:0!important;border-top:0!important} .nf-modal hr{display:none} .nf-modal .nf-radio-grp{display:flex;gap:4px;background:var(--bg);border-radius:999px;padding:4px} .nf-modal .nf-radio-btn{flex:1;border:0!important;border-radius:999px!important;background:transparent!important;color:var(--muted)!important;padding:9px 0!important;font:600 13.5px system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif!important;cursor:pointer} .nf-modal .nf-radio-btn.active{background:var(--text)!important;color:var(--bg)!important} .nf-modal .nf-budget-empty{color:var(--dim)} @media (max-width:767px){ .nf-modal-overlay{align-items:flex-end!important;padding:0!important} .nf-modal{width:100%!important;max-width:100%!important;border-radius:22px 22px 0 0;max-height:92vh;overflow-y:auto;padding-bottom:env(safe-area-inset-bottom,0px)} .nf-modal-foot{justify-content:stretch} .nf-modal-foot .nf-btn{flex:1} .nf-field-input,.nf-modal input,.nf-modal select{font-size:16px!important} } /* === MEDIA QUERY SWITCH === */ @media (min-width: 768px) { #m-app { display: none !important; } } @media (max-width: 767px) { .topbar, main.main { display: none !important; } #m-app { display: block; } } /* v3.62 · Budgeting: pagina aperta, niente riquadri */ #sec-liquidity .nf-budget-stack{gap:0;padding-top:8px} .nfb-top{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:40px} .nfb-month{display:flex;align-items:center;gap:14px;margin-top:8px} .nfb-month #nf-budget-month-label{font:600 34px/1 var(--cond);color:var(--text);white-space:nowrap;min-width:150px;text-align:center} .nfb-month .nf-stepper{width:30px;height:30px;border:none;border-radius:50%;font-size:18px;color:var(--muted);background:var(--line-06)} .nfb-month .nf-stepper:hover{background:var(--line-12);color:var(--text)} .nfb-link:focus-visible {outline:2px solid var(--warm);outline-offset:2px} .nfb-sum{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:18px} #sec-liquidity .nf-budget-savings{font:600 64px/1 var(--cond);margin:10px 0 0;letter-spacing:-.02em} .nfb-sum-r{text-align:right} #sec-liquidity .nf-budget-rate{font:600 28px/1 var(--cond);margin-top:10px;color:var(--text)} #sec-liquidity .nf-budget-donutwrap{display:none!important} #sec-liquidity .nf-budget-flowlegend{display:block;margin:0 0 56px} #sec-liquidity .fl-bar{height:10px;border-radius:999px;background:var(--pos-25);position:relative;overflow:hidden} #sec-liquidity .fl-bar i{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--warm);transition:width .4s} #sec-liquidity .fl-bar i.over{background:var(--danger)} #sec-liquidity .fl-keys{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:12px;font:400 12px var(--sans);color:var(--muted)} #sec-liquidity .fl-keys b{color:var(--text);font-weight:600;margin-left:6px} #sec-liquidity .fl-keys .d{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:8px;background:var(--warm)} #sec-liquidity .fl-keys .d.in{background:var(--positive)} #sec-liquidity .fl-keys .d.over{background:var(--danger)} #sec-liquidity .fl-mid{color:var(--dim)} .nfb-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:72px;align-items:start} .nfb-col{min-width:0} .nfb-h-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px} .nfb-h-row.nfb-gap{margin-top:48px} .nfb-h{font:600 22px/1.2 var(--cond);color:var(--text);margin:0} .nfb-link{all:unset;cursor:pointer;font:600 12px var(--sans);color:var(--warm)} .nfb-link:hover{color:var(--text)} #sec-liquidity .nf-recent-toggle{font:600 12px var(--sans);color:var(--warm);cursor:pointer} #nf-budget-goals-list{max-height:none!important;overflow:visible;padding:0} #sec-liquidity .nf-budget-goal-row{padding:16px 0;border:none} #sec-liquidity .nf-budget-goal-head{align-items:center;margin-bottom:10px} #sec-liquidity .nf-budget-goal-cat{flex:1;min-width:0;font:600 14px var(--sans);color:var(--text)} #sec-liquidity .nf-budget-goal-prog{font:400 12px var(--sans);color:var(--dim)} #sec-liquidity .nf-budget-goal-prog b{font-weight:600;color:var(--text)} #sec-liquidity .nf-budget-goal-prog.over b{color:var(--danger)} #sec-liquidity .nf-budget-goal-bar{height:6px;border-radius:999px;background:var(--line-10)} #sec-liquidity .nf-budget-goal-bar-fill{border-radius:999px;background:var(--warm)} #sec-liquidity .nf-budget-goal-bar-fill.warn{background:var(--amber)} #sec-liquidity .nf-budget-goal-bar-fill.over{background:var(--danger)} #sec-liquidity .nf-budget-goal-row.nogoal{padding:10px 0} #sec-liquidity .nf-budget-goal-row.nogoal .nf-budget-goal-head{margin-bottom:0} #sec-liquidity .nf-budget-goal-row.nogoal .nf-budget-goal-cat{font-weight:500;color:var(--muted)} .nfb-goal-foot{margin-top:8px;font:400 11.5px var(--sans);color:var(--dim)} .nfb-goal-foot.over{color:var(--danger)} #sec-liquidity .nf-budget-tx-row{display:flex;align-items:center;gap:14px;padding:11px 0;border:none} #sec-liquidity .nf-budget-tx-cat{font:600 14px var(--sans);color:var(--text)} #sec-liquidity .nf-budget-tx-date{font:400 11.5px var(--sans);color:var(--dim)} #sec-liquidity .nf-budget-tx-amount{font:600 14px var(--sans);color:var(--text)} #sec-liquidity .nf-budget-tx-amount.pos{color:var(--positive)} #sec-liquidity .nf-budget-tx-del{opacity:0;transition:opacity .15s} #sec-liquidity .nf-budget-tx-row:hover .nf-budget-tx-del{opacity:1} #sec-liquidity .nf-budget-empty{padding:12px 0;text-align:left;font-size:13px} .nfb-liq-tot b{font:600 22px/1 var(--cond);color:var(--text)} .nfb-liq-row{display:flex;align-items:center;gap:14px;padding:12px 0;cursor:pointer} .nfb-liq-t{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0} .nfb-liq-t b{font:600 14px var(--sans);color:var(--text);transition:color .15s} .nfb-liq-t i{font:400 11.5px var(--sans);color:var(--dim);font-style:normal} .nfb-liq-v{font:600 14px var(--sans);color:var(--text)} .nfb-go{font-size:18px;color:var(--muted);transition:transform .15s,color .15s} .nfb-liq-row:hover .nfb-liq-t b{color:var(--warm)} .nfb-liq-row:hover .nfb-go{color:var(--text);transform:translateX(2px)} @media (max-width:980px){ .nfb-grid{grid-template-columns:1fr;gap:48px} #sec-liquidity .nf-budget-savings{font-size:48px} } @media (max-width:600px){ .nfb-top{flex-direction:column;align-items:flex-start} .nfb-sum{flex-direction:column;align-items:flex-start} .nfb-sum-r{text-align:left} #sec-liquidity .fl-mid{display:none} } /* v3.61 · Profilo: menu laterale + elenco */ .nfp{display:grid;grid-template-columns:240px minmax(0,1fr);gap:72px;padding-top:24px;align-items:start} .nfp-side{display:flex;flex-direction:column;gap:2px;position:sticky;top:82px} .nfp-side button{all:unset;display:block;text-align:left;cursor:pointer;padding:11px 16px;font:600 14px var(--sans);color:var(--muted);transition:background .15s,color .15s} .nfp-side button:hover{color:var(--text);background:var(--line-06)} .nfp-side button.on{color:var(--text);background:var(--line-12)} .nfp-side button:focus-visible{outline:2px solid var(--warm);outline-offset:2px} .nfp-main{max-width:640px;min-width:0} .nfp-pane{display:none} .nfp-pane.on{display:block;animation:fi .25s ease} .nfp-h{font:600 32px/1.1 var(--cond);color:var(--text);margin:0 0 28px} .nfp-h2{font:600 20px/1.2 var(--cond);color:var(--text);margin:0 0 8px} .nfp-hrow{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:28px} .nfp-hrow .nfp-h{margin:0} .nfp-hrow .chip{cursor:pointer;background:transparent;border-radius:0} .nfp-hrow .chip:hover{border-color:var(--warm);color:var(--warm)} .nfp-rule{height:1px;background:var(--line-10);margin:24px 0 32px} #sec-profilo .nf-list-row{display:flex;align-items:center;gap:16px;padding:14px 0;border:none;background:transparent;cursor:pointer} #sec-profilo .nf-list-row[hidden]{display:none} #sec-profilo .nf-list-row:hover .nf-list-t b{color:var(--warm)} #sec-profilo .nf-list-row:hover .nf-list-go{color:var(--text);transform:translateX(2px)} #sec-profilo .nf-list-t{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0} #sec-profilo .nf-list-t b{font:600 14px var(--sans);color:var(--text);transition:color .15s} #sec-profilo .nf-list-t i{font:400 12px/1.5 var(--sans);color:var(--dim);font-style:normal} #sec-profilo .nf-list-go{font-size:18px;color:var(--muted);transition:transform .15s,color .15s} #sec-profilo .nfp-danger .nf-list-t b{color:var(--danger)} #sec-profilo .nfp-danger:hover .nf-list-t b{color:var(--danger)} #sec-profilo .nf-prof-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;border:none;padding:0;margin:0} #sec-profilo .nf-prof-version{margin-top:48px;color:var(--dim);font:400 11px var(--mono)} @media (max-width:820px){ .nfp{grid-template-columns:1fr;gap:24px} .nfp-side{position:static;flex-direction:row;overflow-x:auto;gap:4px} .nfp-side button{white-space:nowrap;padding:9px 14px} } /* v3.60.5: + Registra e + Aggiungi come i link di Budgeting */ .nf-recent-right .chip,.nfp-hrow .chip{all:unset;cursor:pointer;font:600 12px var(--sans);color:var(--warm)} .nf-recent-right .chip:hover,.nfp-hrow .chip:hover{color:var(--text)} .nf-chip-add{all:unset;cursor:pointer;font:600 12px var(--sans);color:var(--warm);display:inline-flex;align-items:center;align-self:center;padding:0 4px;margin-left:auto} .nf-chip-add:hover{color:var(--text)} .nf-chip-add:focus,.nf-chip-add:focus-visible{outline:none;box-shadow:none} /* v3.60.10: spazio tra contenuto e barra; barre delle finestre "vedi tutti" come le altre */ #nf-budget-goals-list{padding-right:16px !important} #nf-budget-tx-list{padding-right:16px !important} .nf-list-body,.nf-modal-body{scrollbar-width:auto;scrollbar-color:auto} .nf-list-body::-webkit-scrollbar,.nf-modal-body::-webkit-scrollbar{width:6px;background:transparent} .nf-list-body::-webkit-scrollbar-track,.nf-modal-body::-webkit-scrollbar-track{background:transparent} .nf-list-body::-webkit-scrollbar-thumb,.nf-modal-body::-webkit-scrollbar-thumb{background:var(--line-24);border-radius:3px} .nf-list-body::-webkit-scrollbar-thumb:hover,.nf-modal-body::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.4)} .nf-list-body{padding-right:10px} /* v3.60.9: ricerca senza righe; barre di scorrimento sempre visibili, senza fondo grigio */ .tb-search-dropdown{border-color:transparent} .tb-search-filters{border-bottom:0} .tb-search-foot{border-top:0} .tb-search-item{border-bottom:0 !important;border-top:0 !important} .tb-search-filter,.tb-search-filter:hover,.tb-search-filter.active{border-color:transparent} .tb-search-dropdown,#nf-budget-goals-list,#nf-budget-tx-list{scrollbar-width:auto;scrollbar-color:auto} .tb-search-dropdown::-webkit-scrollbar,#nf-budget-goals-list::-webkit-scrollbar,#nf-budget-tx-list::-webkit-scrollbar{width:6px;background:transparent} .tb-search-dropdown::-webkit-scrollbar-track,#nf-budget-goals-list::-webkit-scrollbar-track,#nf-budget-tx-list::-webkit-scrollbar-track{background:transparent} .tb-search-dropdown::-webkit-scrollbar-thumb,#nf-budget-goals-list::-webkit-scrollbar-thumb,#nf-budget-tx-list::-webkit-scrollbar-thumb{background:var(--line-24);border-radius:3px} .tb-search-dropdown::-webkit-scrollbar-thumb:hover,#nf-budget-goals-list::-webkit-scrollbar-thumb:hover,#nf-budget-tx-list::-webkit-scrollbar-thumb:hover{background:var(--line-40, rgba(255,255,255,.4))} /* v3.62.0: tendina di ricerca, 9 risultati visibili; scorre solo la lista */ .tb-search-dropdown{max-height:none;overflow:hidden;display:flex;flex-direction:column} .tb-search-dropdown[hidden]{display:none} .tb-search-results{max-height:468px;overflow-y:auto;padding-right:10px;scrollbar-width:auto;scrollbar-color:auto} .tb-search-results::-webkit-scrollbar{width:6px;background:transparent} .tb-search-results::-webkit-scrollbar-track{background:transparent} .tb-search-results::-webkit-scrollbar-thumb{background:var(--line-24);border-radius:3px} .tb-search-results::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.4)} .tb-search-item{min-height:52px} /* v3.60.8: riquadro posizione senza alone */ .panel--gold.nf-det-pos,.nf-det-pos{background:transparent;box-shadow:none;border-color:transparent} /* v3.60.7 */ .nf-chip-add:hover{background:transparent;border:0;color:var(--text)} .nf-pos-menu button:not(:last-child){border-bottom:0} .nf-kv{border-bottom:0} #nf-det-edit{display:none} /* v3.60.6: senza contorni chip broker, intervalli, analisi e sottoschede */ .nf-chip,.nf-chip:hover,.nf-chip.active{border-color:transparent} .nf-bench-range,.nf-bench-range:hover,.nf-bench-range.active{border-color:transparent} .nf-circle-btn{border-color:transparent;background:var(--line-06)} .nf-circle-btn:hover{border-color:transparent;color:var(--warm)} .nf-subtabs{border-bottom:0} /* finestra per nome categoria e conferme */ .nf-ask-msg{font-size:13px;line-height:1.55;color:var(--muted);white-space:pre-line} /* v3.60.4: "vedi tutti" senza sottolineatura, al passaggio diventa bianco */ .nf-recent-toggle:hover,#sec-liquidity .nf-recent-toggle:hover{text-decoration:none;color:var(--text)} /* v3.60.2: budgeting e operazioni recenti */ .nf-recent-trades .nf-trade-row{border-bottom:0} #nf-budget-tx-list{padding-right:4px} /* v3.60.1: profilo senza righe grigie */ #sec-profilo .nfp-rule{background:transparent} #sec-profilo .nf-prof-brk{border-bottom:0} .topbar{border-bottom-color:transparent !important} .tb-nav{border-bottom-color:transparent !important} /* v3.61.0 · profilo */ .nfp-name-row{display:flex;align-items:baseline;gap:14px;min-width:0} .nfp-name-in{font:600 24px/1 var(--cond);color:var(--text);background:transparent;border:0;border-bottom:1px solid var(--line-24);padding:2px 0;outline:none;min-width:0;width:320px;max-width:100%} .nfp-name-in:focus{border-bottom-color:var(--warm)} .nfp-soon{font:400 13px/1.6 var(--sans);color:var(--dim)} .nfp-choice{display:flex;flex-direction:column;max-width:420px} .nfp-choice button{all:unset;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:14px 0;font:600 14px var(--sans);color:var(--text)} .nfp-choice button:hover span{color:var(--warm)} .nfp-choice button i{font-style:normal;color:var(--warm);visibility:hidden} .nfp-choice button.on i{visibility:visible} .nf-prof-brk .del{all:unset;cursor:pointer;color:var(--muted);font:400 12px var(--sans);margin-left:6px;padding:2px 4px} .nf-prof-brk .del:hover{color:var(--danger)}