/* CassaChiara · stile 2026: quasi nero, accento ambra, vetro smerigliato, testo bianco nitido.
   Caricato per ultimo su ogni pagina (dopo gli stili propri), senza toccare struttura, testi o script. */
:root,:root[data-theme]{
  --bg:#07090a; --surface:rgba(20,23,26,.78); --ink:#f4f3ef; --muted:#a6aaac; --line:rgba(255,255,255,.1);
  --accent:#ffb547; --accent-soft:rgba(255,181,71,.12); --bad:#ff8a7a; --bad-bg:rgba(255,120,100,.12); --warn:#ffcf7a; --warn-bg:rgba(255,181,71,.10);
  --f-display:"Bricolage Grotesque","IBM Plex Sans",system-ui,sans-serif;
  --f-body:-apple-system,BlinkMacSystemFont,"SF Pro Text","IBM Plex Sans","Segoe UI",system-ui,sans-serif;
  color-scheme:dark;
}
html{background:#07090a}
body{background:transparent;color:var(--ink);font-family:var(--f-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
html,body{overflow-x:clip}
::selection{background:rgba(255,181,71,.35);color:#fff}

/* sfondo leggero e statico: città isometrica scura con il percorso d'ambra, bagliore in alto */
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:radial-gradient(ellipse 70% 42% at 50% -6%,rgba(255,181,71,.13),rgba(255,181,71,.03) 55%,transparent 75%),
             url(/media/bg-city.svg) 72% 100%/cover no-repeat,#07090a;
  opacity:1}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,9,10,.94) 0%,rgba(7,9,10,.86) 40%,rgba(7,9,10,.72) 100%),
             radial-gradient(ellipse 120% 90% at 50% 50%,transparent 55%,rgba(3,4,5,.7) 100%)}
html.embed body::before{background:#07090a}
html.embed body::after{display:none}

/* tipografia */
h1,h2,.logo,.brand h1{font-family:var(--f-display);letter-spacing:-.018em}
h1{font-weight:650}
h2{font-weight:620}
.logo span,.brand h1 span{color:var(--accent)}
a{color:var(--accent)}
.lead{color:#c3c6c8}
h1 em{font-style:normal;color:var(--accent)}

/* pulsanti: pillola di vetro, primario d'ambra che si illumina */
.btn{border-radius:999px;transition:border-color .25s,box-shadow .25s,transform .25s,background .25s}
.btn:not(.primary){background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.16);color:var(--ink)}
.btn:not(.primary):hover{border-color:rgba(255,181,71,.6);box-shadow:0 0 0 1px rgba(255,181,71,.2),0 8px 30px -10px rgba(255,181,71,.5)}
.btn.primary{background:linear-gradient(180deg,#ffc76a,#ffb547 55%,#f39f2a);border-color:transparent;color:#1a1206;
  box-shadow:0 0 0 1px rgba(255,210,140,.35) inset,0 10px 30px -10px rgba(255,170,60,.7),0 0 50px -18px rgba(255,181,71,.8)}
.btn.primary:hover{box-shadow:0 0 0 1px rgba(255,230,180,.5) inset,0 14px 40px -10px rgba(255,170,60,.9),0 0 70px -16px rgba(255,181,71,.9)}
.btn:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* riquadri in vetro smerigliato */
.box,.cta,.tpl,.price,.ledger,.emb,.tools>a,.tools>div,.card:not(section),.tile{
  background:linear-gradient(180deg,rgba(38,40,44,.58),rgba(16,18,20,.66));
  -webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);
  border:1px solid rgba(255,255,255,.09);border-radius:18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 24px 60px -30px rgba(0,0,0,.85)}
.cta{background:linear-gradient(135deg,rgba(255,181,71,.16),rgba(255,181,71,.04) 60%),linear-gradient(180deg,rgba(30,28,24,.6),rgba(16,15,13,.66));border-color:rgba(255,181,71,.3)}
.price.hl{border-color:rgba(255,181,71,.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 0 1px rgba(255,181,71,.3),0 0 60px -20px rgba(255,181,71,.6)}
table{background:rgba(18,21,24,.55);border-radius:12px}
th{color:var(--muted)}
th,td{border-color:var(--line)}
hr{border:0;border-top:1px solid var(--line)}
details{border-color:var(--line)}
summary{cursor:pointer}

/* campi */
input,select,textarea{color-scheme:dark;accent-color:var(--accent)}
input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{background:rgba(10,12,14,.72);border-color:rgba(255,255,255,.14);color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:rgba(255,181,71,.6)}

/* risultati dei calcolatori: numeri d'ambra con un filo di bagliore */
body .res>div{background:rgba(10,12,14,.6);border-color:rgba(255,255,255,.1)}
body .res b{font-family:var(--f-display);color:var(--accent);text-shadow:0 0 22px rgba(255,181,71,.35)}

/* app: stessi colori e vetro leggero, nessun effetto pesante */
html.app body::before{background:radial-gradient(ellipse 70% 40% at 50% -8%,rgba(255,181,71,.10),transparent 70%),#07090a}
html.app body::after{display:none}
html.app section.card,html.app .kpi{background:linear-gradient(180deg,rgba(30,33,37,.85),rgba(17,19,22,.9));border-color:rgba(255,255,255,.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 50px -30px rgba(0,0,0,.9)}
html.app button:not(.primary):not([aria-pressed="true"]),html.app .btn:not(.primary){background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14)}
html.app button.primary,html.app .btn.primary{background:linear-gradient(180deg,#ffc76a,#ffb547 55%,#f39f2a);border-color:transparent;color:#1a1206}
html.app .notice{background:rgba(255,181,71,.10);border:1px solid rgba(255,181,71,.22)}

/* widget condivisi (assistenza, installazione, barra di prova) in ambra */
#ccs-b,#ccs-f button,#cc-inst button{background:var(--accent)!important;color:#1a1206!important}
#ccs-b{box-shadow:0 8px 30px -8px rgba(255,170,60,.7),0 0 0 1px rgba(255,220,160,.4) inset!important}
.ccs-bot a{color:var(--accent)!important}

nav .in>span{display:flex;align-items:center}
@media (prefers-reduced-motion:reduce){.btn{transition:none}}

/* app = gestionale da aprire ogni mattina: calmo e denso, niente vetro, bagliori né sfumature */
html.app body::before{background:#0b0b0c}
html.app .box,html.app .cta,html.app .tpl,html.app .price,html.app .ledger,html.app .card,html.app .tile,html.app section.card,html.app .kpi{
  background:#141210;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border-color:#2e2a22;border-radius:12px}
html.app .btn,html.app .btn.primary,html.app .btn:hover,html.app .btn.primary:hover{box-shadow:none;transform:none}
html.app body .res b{text-shadow:none}

/* home calma (html.calm): sfondo pieno, niente città, vetro né bagliori */
html.calm body::before{background:#0b0b0c}
html.calm body::after{display:none}
html.calm .glass,html.calm .card,html.calm .price,html.calm .box{-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}

/* barra di prova di fx.js: spenta dove l'offerta è un'altra (data-cta="off" sul body) */
body[data-cta="off"] .fx-cta{display:none!important}
