/* EasyBudget — stile Kakebo (indaco, carta washi, arancio). Solo aspetto grafico: nessuna funzione cambia.
   Caricato per ultimo nella <head> delle pagine dell'app. La parola giapponese del timbro accanto
   al titolo arriva dalla variabile --kk-eyebrow impostata in ogni pagina. */
/* ===================================================================
   TEMA KAKEBO — SOLO ASPETTO GRAFICO.
   Nessun HTML o JS modificato: è uno strato di stile sopra la Home.
   Colori e caratteri della landing: indaco, carta washi, arancio.
   =================================================================== */
:root{
  --kk-ai:#101a33; --kk-ai-2:#17244a; --kk-washi:#f4efe5; --kk-washi-2:#ebe4d6;
  --kk-carta:#fffdf8; --kk-riga:#e6dccb; --kk-sumi:#1d1b18; --kk-sumi-soft:#5a544b; --kk-shu:#ff6a1a; --kk-shu-deep:#e5530a;
  --kk-mincho:"Zen Old Mincho","Hiragino Mincho ProN","Yu Mincho",Georgia,serif;
  --bg-page:var(--kk-washi); --bg-card:var(--kk-carta); --bg-subtle:#f8f3ea; --border:var(--kk-riga);
  --sh-xs:0 1px 2px rgba(16,26,51,.05); --sh-sm:0 10px 24px -18px rgba(16,26,51,.35); --sh-md:0 16px 34px -22px rgba(16,26,51,.4);
}
html,body{background:var(--kk-washi)!important}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.28;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .9' numOctaves='2' seed='3'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .5 0 0 0 0 .42 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23f)'/%3E%3C/svg%3E")}

/* Barra laterale: tutta indaco con le onde (seigaiha), come le fasce scure della landing */
.eb-sidebar{background:var(--kk-ai)!important;border-right:none!important;color:#cfd6e6;isolation:isolate}
.eb-sidebar::before{content:"";position:absolute;left:0;right:0;bottom:0;height:46%;z-index:-1;opacity:.6;pointer-events:none;
  background-image:radial-gradient(circle at 100% 150%,var(--kk-ai) 24%,var(--kk-ai-2) 24%,var(--kk-ai-2) 28%,var(--kk-ai) 28%,var(--kk-ai) 36%,var(--kk-ai-2) 36%,var(--kk-ai-2) 40%,transparent 40%),radial-gradient(circle at 0 150%,var(--kk-ai) 24%,var(--kk-ai-2) 24%,var(--kk-ai-2) 28%,var(--kk-ai) 28%,var(--kk-ai) 36%,var(--kk-ai-2) 36%,var(--kk-ai-2) 40%,transparent 40%),radial-gradient(circle at 50% 100%,var(--kk-ai-2) 10%,var(--kk-ai) 10%,var(--kk-ai) 23%,var(--kk-ai-2) 23%,var(--kk-ai-2) 30%,var(--kk-ai) 30%,var(--kk-ai) 43%,var(--kk-ai-2) 43%,var(--kk-ai-2) 50%,var(--kk-ai) 50%,var(--kk-ai) 63%,var(--kk-ai-2) 63%,var(--kk-ai-2) 71%,transparent 71%);background-size:56px 28px;-webkit-mask-image:linear-gradient(0deg,#000,transparent);mask-image:linear-gradient(0deg,#000,transparent)}
.eb-sb-logo{color:#f3efe6!important;font-family:var(--kk-mincho)!important;font-weight:900!important;letter-spacing:.01em;padding-bottom:18px!important;margin-bottom:12px!important;border-bottom:1px solid rgba(205,216,240,.14)}
.eb-sb-logo i{color:var(--kk-shu)!important}
.eb-sb-logo::after{content:none;margin-left:auto;font-size:.78rem;letter-spacing:.14em;color:#d6b46e;font-weight:700}
.eb-nav a{color:#cfd6e6!important;background:transparent!important;box-shadow:none!important;border-radius:10px!important;position:relative}
.eb-nav a i{color:#7f8db0!important}
.eb-nav a:hover{background:rgba(255,255,255,.06)!important;color:#fff!important}
.eb-nav a:hover i{color:#d6b46e!important}
.eb-nav a.active{background:rgba(255,106,26,.16)!important;color:#fff!important;box-shadow:inset 3px 0 0 var(--kk-shu)!important}
.eb-nav a.active i{color:var(--kk-shu)!important}
.eb-sidebar .eb-nav:not(#eb-fav-list) a::after{font-family:var(--kk-mincho);font-weight:700;font-size:.82rem;margin-left:auto;color:rgba(214,180,110,.45);letter-spacing:.04em}
.eb-sidebar .eb-nav:not(#eb-fav-list) a.active::after{color:#d6b46e}
.eb-sidebar .eb-nav:not(#eb-fav-list) a[href*="dashboard"]::after{content:"家"}
.eb-sidebar .eb-nav:not(#eb-fav-list) a[href*="conti-bancari"]::after{content:"口座"}
.eb-sidebar .eb-nav:not(#eb-fav-list) a[href*="elenco-spese"]::after{content:"予定"}
.eb-sidebar .eb-nav:not(#eb-fav-list) a[href*="spese-extra"]::after{content:"出費"}
.eb-sidebar .eb-nav:not(#eb-fav-list) a[href*="riassunto-saldi"]::after{content:"残高"}
.eb-sidebar .eb-nav:not(#eb-fav-list) a[href*="profilo"]::after{content:"設定"}
.eb-sidebar .eb-nav:not(#eb-fav-list) a[href*="pannello-controllo"]::after{content:"管理"}
.eb-sb-group{color:#d6b46e!important;letter-spacing:.16em!important}
.eb-fav-add{background:transparent!important;border-color:rgba(205,216,240,.3)!important;color:#cfd6e6!important}
.eb-fav-add:hover{background:var(--kk-shu)!important;border-color:var(--kk-shu)!important;color:#fff!important}
.eb-fav-empty{color:#8e9bb8!important}
#eb-fav-list a [class*="drag"],#eb-fav-list a .eb-fav-grip{color:#5f6d8f!important}
.eb-sb-help{background:var(--kk-carta)!important;border:none!important;box-shadow:0 12px 24px -14px rgba(0,0,0,.6)}
.eb-sb-foot{border-top-color:rgba(205,216,240,.14)!important}
.eb-sb-foot a,.eb-sb-foot a i{color:#cfd6e6!important}
.eb-sb-foot a:hover{background:rgba(255,255,255,.06)!important}

/* Saluto: titolo con il carattere della landing e piccola dicitura */
.eb-hello{font-family:var(--kk-mincho)!important;font-weight:900!important;letter-spacing:-.005em;color:var(--kk-sumi)!important}
.eb-hello-wrap::before{content:none;display:block;font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--kk-shu-deep);margin-bottom:6px}

/* Etichette di sezione nello stile della landing (senza caratteri giapponesi) */
.eb-panel-label,.eb-sec-label{display:flex!important;align-items:center;gap:10px;color:var(--kk-shu-deep)!important;letter-spacing:.16em!important}
.eb-panel-label::before,.eb-sec-label::before{font-family:var(--kk-mincho);font-size:1.25rem;font-weight:900;letter-spacing:0;color:var(--kk-shu);line-height:1}
.eb-panel-label::after,.eb-sec-label::after{content:"";height:1px;width:46px;background:currentColor;opacity:.45}

/* Carte: carta washi con bordo caldo */
.eb-kpi,.eb-analisi-btn,.v2-section,.eb-salute-side,.eb-spese-col{background:var(--kk-carta)!important;border-color:var(--kk-riga)!important;box-shadow:var(--sh-sm)!important}
.eb-kpi{border-radius:14px!important}
.eb-analisi-btn:hover{border-color:var(--kk-shu)!important}

/* Ultimo stipendio: pagina indaco, come «Il mio stipendio» nella landing */
.eb-stip-card{position:relative;background:var(--kk-ai)!important;border:none!important;overflow:hidden;isolation:isolate;box-shadow:0 18px 34px -20px rgba(16,26,51,.7)!important}
.eb-stip-card::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.45;background-image:radial-gradient(circle at 100% 150%,var(--kk-ai) 24%,var(--kk-ai-2) 24%,var(--kk-ai-2) 28%,var(--kk-ai) 28%,var(--kk-ai) 36%,var(--kk-ai-2) 36%,var(--kk-ai-2) 40%,transparent 40%),radial-gradient(circle at 0 150%,var(--kk-ai) 24%,var(--kk-ai-2) 24%,var(--kk-ai-2) 28%,var(--kk-ai) 28%,var(--kk-ai) 36%,var(--kk-ai-2) 36%,var(--kk-ai-2) 40%,transparent 40%),radial-gradient(circle at 50% 100%,var(--kk-ai-2) 10%,var(--kk-ai) 10%,var(--kk-ai) 23%,var(--kk-ai-2) 23%,var(--kk-ai-2) 30%,var(--kk-ai) 30%,var(--kk-ai) 43%,var(--kk-ai-2) 43%,var(--kk-ai-2) 50%,var(--kk-ai) 50%,var(--kk-ai) 63%,var(--kk-ai-2) 63%,var(--kk-ai-2) 71%,transparent 71%);background-size:64px 32px;-webkit-mask-image:linear-gradient(90deg,transparent,#000);mask-image:linear-gradient(90deg,transparent,#000)}
.eb-stip-lbl,.eb-stip-foot,.eb-stip-foot span{color:#b6c2dc!important}
.eb-stip-date{color:#f3efe6!important}
.eb-stip-amt{color:#fff!important;font-family:var(--kk-mincho);font-weight:900!important}
.eb-stip-ic,.eb-stip-foot i{color:#d6b46e!important}
.eb-stip-foot{border-top-color:rgba(205,216,240,.18)!important}

/* La frase del giorno: pagina di quaderno a righe, scritta a mano */
.eb-quote{background-color:var(--kk-carta)!important;border-color:var(--kk-riga)!important;border-left:4px solid var(--kk-shu)!important;
  background-image:repeating-linear-gradient(180deg,transparent 0 31px,rgba(16,26,51,.07) 31px 32px)!important;background-position:0 14px!important}
.eb-quote-text{font-family:"Klee One",var(--kk-mincho);font-size:1.08rem!important;line-height:32px!important}
.eb-quote-head{color:var(--kk-shu-deep)!important;letter-spacing:.14em}

/* Intestazione e barra in basso (telefono): carta, con dettaglio indaco */
.v2-header{background:rgba(244,239,229,.94)!important;border-bottom:1px solid var(--kk-riga)!important;backdrop-filter:blur(8px)}
.v2-bottom-nav{background:rgba(255,253,248,.96)!important;border-color:var(--kk-riga)!important}
.v2-bnav-item.active{color:var(--kk-shu)!important}
.eb-panel-label::before,.eb-sec-label::before{flex:none;white-space:nowrap}
.eb-panel-label,.eb-sec-label{white-space:nowrap}
@media (max-width:640px){.eb-panel-label::after,.eb-sec-label::after{display:none}.eb-panel-label,.eb-sec-label{letter-spacing:.1em!important}}
@media (max-width:640px){.eb-panel-label,.eb-sec-label{letter-spacing:.05em!important;gap:6px}.eb-panel-label::before,.eb-sec-label::before{font-size:1.05rem}.eb-panel-head{gap:8px}}
#eb-fav-list a:hover .eb-fav-grip{background:rgba(255,255,255,.08)!important;color:#cfd6e6!important}

/* Titoli di sezione tutti FUORI dalle card, come "Spese":
   il riquadro grigio del Pannello e quello di Analisi diventano trasparenti,
   così le etichette stanno sul foglio e sotto ci sono solo le card */
.eb-panel,#analisi.v2-section{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;border-radius:0!important}
#analisi.v2-section::before{display:none!important}
#analisi .eb-analisi-head{margin:2px 4px 12px!important}
.eb-panel-head{margin:2px 4px 12px!important}
/* Frase del giorno: l'etichetta (Regola famosa / Aforisma / ...) esce sopra la card */
.eb-quote{margin-top:38px!important;overflow:visible!important}
.eb-quote-head{position:absolute;left:4px;top:-30px;margin:0!important;font-size:.7rem!important;font-weight:700!important;letter-spacing:.16em!important}
.eb-quote-head::after{content:"";height:1px;width:46px;background:currentColor;opacity:.45}
@media (max-width:640px){.eb-quote-head::after{display:none}}
@media (max-width:560px){.eb-quote-head{font-size:.62rem!important;letter-spacing:.05em!important}}

/* Analisi — passaggio del mouse in stile giapponese, discreto:
   1) una pennellata d'inchiostro si disegna in alto, da sinistra a destra
   2) l'icona si "timbra" come un hanko (piccola pressione e lieve inclinazione)
   3) in basso a destra affiorano appena le onde seigaiha */
@media (hover:hover){
  .eb-analisi-btn{transition:border-color .35s ease,box-shadow .35s ease,transform .35s ease!important}
  .eb-analisi-btn:hover{border-color:color-mix(in srgb,var(--c) 45%,var(--kk-riga))!important;transform:translateY(-2px)!important;box-shadow:0 14px 26px -18px rgba(16,26,51,.45)!important}
  .eb-analisi-btn::before{opacity:1!important;height:4px!important;top:0!important;left:10%!important;right:10%!important;border-radius:0 0 3px 3px;
    background:linear-gradient(90deg,var(--c) 0%,var(--c) 70%,transparent 100%)!important;
    transform:scaleX(0);transform-origin:left center;transition:transform .55s cubic-bezier(.65,0,.35,1)!important}
  .eb-analisi-btn:hover::before{transform:scaleX(1)}
  .eb-analisi-btn::after{content:"";position:absolute;right:-6px;bottom:-6px;width:84px;height:48px;pointer-events:none;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='48' viewBox='0 0 84 48' fill='none' stroke='%23101a33' stroke-width='1.2'%3E%3Cg%3E%3Cpath d='M0 48a21 21 0 0 1 42 0M6 48a15 15 0 0 1 30 0M12 48a9 9 0 0 1 18 0'/%3E%3Cpath d='M42 48a21 21 0 0 1 42 0M48 48a15 15 0 0 1 30 0M54 48a9 9 0 0 1 18 0'/%3E%3Cpath d='M21 30a21 21 0 0 1 42 0M27 30a15 15 0 0 1 30 0M33 30a9 9 0 0 1 18 0'/%3E%3C/g%3E%3C/svg%3E") no-repeat right bottom;
    opacity:0;transform:translate(6px,4px);transition:opacity .6s ease,transform .6s ease}
  .eb-analisi-btn:hover::after{opacity:.09;transform:none}
  .eb-an-ic{transition:background .3s ease,color .3s ease!important}
  .eb-analisi-btn:hover .eb-an-ic{transform:rotate(-5deg)!important;animation:kk-hanko .42s ease-out both}
  .eb-an-t,.eb-an-link{position:relative;z-index:1}
}
@keyframes kk-hanko{0%{transform:scale(1.1) rotate(0)}55%{transform:scale(.95) rotate(-6deg)}100%{transform:scale(1) rotate(-5deg)}}
@media (prefers-reduced-motion:reduce){
  .eb-analisi-btn,.eb-analisi-btn::before,.eb-analisi-btn::after,.eb-an-ic{transition:none!important;animation:none!important}
}

/* Titoli delle pagine: carattere della landing + timbro giapponese (hanko) accanto al titolo */
h1.eb-hello,.eb-se-head h1,.hero-title,section.profilo>h2,.page-hdr-title{font-family:var(--kk-mincho)!important;font-weight:900!important;color:var(--kk-sumi)!important;letter-spacing:-.005em}
h1.eb-hello::before,.eb-se-head h1::before,.hero-title::before,section.profilo>h2::before,.page-hdr-title::before{content:var(--kk-eyebrow,none);display:inline-block;vertical-align:.22em;font-family:var(--kk-mincho),serif;font-size:.6em;font-weight:900;line-height:1;letter-spacing:.06em;color:var(--kk-shu);border:2px solid var(--kk-shu);border-radius:5px;padding:.28em .32em .24em;margin-right:.5em;transform:rotate(-4deg);opacity:.92;box-shadow:inset 0 0 0 1px rgba(255,106,26,.18);background:rgba(255,106,26,.05)}
.page-hero{background:transparent!important;box-shadow:none!important}
.hero-description,.eb-hello-sub,.section-desc,.page-hdr-sub{color:var(--kk-sumi-soft)!important}
.page-hdr-icon{background:var(--kk-ai)!important;color:var(--kk-shu)!important}

/* Titoli di pagina tutti uguali: stessa grandezza, peso, interlinea e spazio sotto */
h1.eb-hello,.eb-se-head h1,.hero-title,section.profilo>h2,.page-hdr-title{font-size:1.6rem!important;font-weight:900!important;line-height:1.2!important;letter-spacing:-.005em!important;margin:0 0 4px!important}
/* Sottotitoli tutti uguali */
.eb-hello-sub,.eb-se-head-text>p,.hero-description,section.profilo>.section-desc,.page-hdr-sub{font-family:"Poppins",sans-serif!important;font-size:.92rem!important;font-weight:400!important;line-height:1.45!important;color:var(--kk-sumi-soft)!important;margin:0!important}

/* Conti bancari: titoli di sezione FUORI dalle card, come nella Home */
.eb-conti-grid .cb-section{overflow:visible!important;margin-top:40px!important}
.eb-conti-grid .cb-and-head,.eb-conti-grid .conti-list>.header-actions{position:absolute!important;top:-36px;left:4px;right:2px;margin:0!important;min-height:30px;display:flex!important;align-items:center;justify-content:space-between;gap:12px}
.eb-conti-grid .cb-and-title,.eb-conti-grid .conti-list>.header-actions h3{font-family:"Poppins",sans-serif!important;font-size:.7rem!important;font-weight:700!important;letter-spacing:.16em!important;text-transform:uppercase;color:var(--kk-shu-deep)!important;margin:0!important;display:flex!important;align-items:center;gap:8px!important;white-space:nowrap}
.eb-conti-grid .cb-and-title i,.eb-conti-grid .conti-list>.header-actions h3 i{color:var(--kk-shu-deep)!important;font-size:.78rem!important}
.eb-conti-grid .cb-and-title::after,.eb-conti-grid .conti-list>.header-actions h3::after{content:"";height:1px;width:46px;background:currentColor;opacity:.45}
@media (max-width:640px){.eb-conti-grid .cb-and-title,.eb-conti-grid .conti-list>.header-actions h3{font-size:.62rem!important;letter-spacing:.05em!important}.eb-conti-grid .cb-and-title::after,.eb-conti-grid .conti-list>.header-actions h3::after{display:none}}

/* Home: la mano che saluta resta sempre attaccata al nome (non va a capo da sola).
   Il testo originale del titolo resta lo stesso: nascondo solo la manina "sciolta"
   e la ridisegno subito dopo il nome con uno spazio che non va a capo */
h1.eb-hello:has(#cruscotto-saluto-nome){font-size:0!important}
h1.eb-hello:has(#cruscotto-saluto-nome)>span{font-size:1.6rem}
h1.eb-hello:has(#cruscotto-saluto-nome)::before{font-size:.96rem!important}
#cruscotto-saluto-top::after{content:" "}
#cruscotto-saluto-nome{white-space:nowrap}
#cruscotto-saluto-nome::after{content:"\00a0👋"}
/* Conti bancari: su telefono anche "I tuoi conti" allineato a sinistra */
.eb-conti-grid .conti-list>.header-actions{flex-direction:row!important;align-items:center!important;justify-content:space-between!important;text-align:left!important}
.eb-conti-grid .conti-list>.header-actions h3{justify-content:flex-start!important;flex:0 0 auto!important;width:auto!important}
/* Andamento entrate: il titolo esce dalla card, il pulsante Analisi resta DENTRO la card (in alto a destra) */
.eb-conti-grid .cb-and-head{position:static!important;min-height:0;justify-content:flex-end!important;margin:0 0 12px!important}
.eb-conti-grid .cb-and-head .cb-and-title{position:absolute!important;top:-36px;left:4px;min-height:30px}
@media (max-width:640px){.eb-conti-grid .cb-section{margin-top:48px!important}}
/* Andamento entrate: Mensile/Annuale e frecce in alto a sinistra, Analisi sulla stessa riga a destra
   (a qualsiasi larghezza della finestra, niente spazio vuoto in alto a sinistra) */
.eb-conti-grid .grafico-stipendi-container{display:flex!important;flex-wrap:wrap;align-items:flex-start;column-gap:12px}
.eb-conti-grid .grafico-stipendi-container>*{order:3;flex:0 0 100%;min-width:0}
.eb-conti-grid .grafico-stipendi-container>.chart-controls{order:1;flex:1 1 0!important;min-width:0;justify-content:flex-start!important}
.eb-conti-grid .grafico-stipendi-container>.cb-and-head{order:2;flex:0 0 auto!important;margin:0 0 1rem!important}
/* Home su telefono: "Buonasera, Alessandro! 👋" su una sola riga — il saluto si riduce appena quanto basta */
h1.eb-hello:has(#cruscotto-saluto-nome)>span{font-size:min(1.6rem,5.4vw)!important}
h1.eb-hello:has(#cruscotto-saluto-nome)::before{font-size:calc(min(1.6rem,5.4vw)*.6)!important}
/* Conti bancari su telefono: titolo alla stessa altezza delle altre pagine (toglie lo spazio in più sopra) */
@media (max-width:1024px){.main-content>.container:has(>.eb-pagehead){padding-top:0!important}}
/* Andamento entrate: Mensile/Annuale allineato a sinistra anche su telefono */
.eb-conti-grid .grafico-stipendi-container>.chart-controls>*:first-child{margin-left:0!important}
/* Home: barra in alto identica alle altre pagine (logo, margini e cerchio del profilo della stessa misura) */
@media (max-width:768px){
  body:has(#cruscotto-saluto-nome) header.v2-header .v2-logo{font-size:1.15rem!important}
  body:has(#cruscotto-saluto-nome) header.v2-header .v2-logo i{font-size:1em!important}
  body:has(#cruscotto-saluto-nome) .v2-hdr-inner{padding:0 14px!important}
}
body:has(#cruscotto-saluto-nome) .v2-hdr-actions .eb-ava{width:36px!important;height:36px!important;font-size:14px!important}

