/* MyAgency — brand CreativAgencyGroup: verde #7db52d + navy #050a30 */
:root{
  --green:#7db52d; --green-d:#6aa023; --navy:#050a30; --navy-2:#0a1145;
  --bg:#0b1020; --panel:#121a33; --panel-2:#182247; --text:#eef1f8; --muted:#9aa6c8;
  --line:#243056; --ok:#2ecc71; --off:#5b6788;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:radial-gradient(1200px 600px at 20% -10%,#141d3d 0,var(--bg) 60%);color:var(--text);min-height:100vh}
.muted{color:var(--muted)} .small{font-size:.82rem}
.brand{font-weight:800;letter-spacing:.3px;font-size:1.15rem}
.brand-mark{color:var(--green)}
/* login */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px}
.login-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px;width:100%;max-width:360px;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.login-card .brand{font-size:1.5rem;margin-bottom:2px}
.login-card form{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.login-card label{display:flex;flex-direction:column;gap:6px;font-size:.85rem;color:var(--muted)}
.login-card input{background:#0d1430;border:1px solid var(--line);border-radius:10px;padding:11px 12px;color:var(--text);font-size:1rem}
.login-card input:focus{outline:2px solid var(--green);border-color:var(--green)}
button{background:linear-gradient(180deg,var(--green),var(--green-d));color:#08210a;border:0;border-radius:10px;padding:12px;font-weight:700;font-size:1rem;cursor:pointer}
button:hover{filter:brightness(1.05)}
.err{background:#3a1220;border:1px solid #7a2740;color:#ffb3c1;border-radius:10px;padding:9px 12px;font-size:.88rem}
/* top bar */
.top{display:flex;justify-content:space-between;align-items:center;padding:16px 22px;border-bottom:1px solid var(--line);background:rgba(10,17,45,.6);backdrop-filter:blur(6px);position:sticky;top:0;z-index:5}
.top-right{display:flex;gap:14px;align-items:center}
.link{background:none;color:var(--muted);padding:6px 8px;font-weight:600}
.link:hover{color:var(--text)}
/* layout */
.wrap{max-width:1080px;margin:0 auto;padding:22px;display:grid;gap:22px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px}
.panel-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px}
.panel-h h2{margin:0;font-size:1.05rem}
/* kpi */
.kpirow{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.kpi{background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:14px 10px;text-align:center}
.kpi-n{font-size:1.5rem;font-weight:800}
.kpi-l{font-size:.72rem;color:var(--muted);margin-top:2px;text-transform:uppercase;letter-spacing:.4px}
.moneyrow{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}
.money{background:linear-gradient(180deg,#14224a,#101a3a);border:1px solid var(--line);border-radius:12px;padding:14px;text-align:center}
.money-n{font-size:1.25rem;font-weight:800;color:#dff5c8}
.money-l{font-size:.72rem;color:var(--muted);margin-top:2px}
/* fonti */
.sources{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.src{background:#0e1633;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:.85rem}
.src-off{opacity:.7}
.src-name{font-weight:700}
.src-err{color:var(--muted);font-size:.78rem}
/* tessere */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.tile{display:flex;align-items:center;gap:12px;background:var(--panel-2);border:1px solid var(--line);border-left:4px solid var(--c,#7db52d);border-radius:12px;padding:14px;text-decoration:none;color:var(--text);transition:.15s}
.tile:hover{transform:translateY(-2px);border-color:var(--c)}
.tile-body{flex:1}
.tile-name{font-weight:700}
.tile-desc{font-size:.8rem;color:var(--muted)}
.tile-open{color:var(--green);font-weight:700;font-size:.85rem}
.dot{width:9px;height:9px;border-radius:50%;background:var(--off);flex:none}
.dot.on{background:var(--ok);box-shadow:0 0 0 3px rgba(46,204,113,.18)}
.dot.off{background:#7a3a4a}
@media(max-width:720px){.kpirow{grid-template-columns:repeat(3,1fr)}.moneyrow{grid-template-columns:repeat(2,1fr)}}