:root{
    --bg:#000000; --panel:#0a0c0a; --line:#1c2620;
    --text:#d8e0d4; --muted:#5d6b5d; --accent:#3dff7a;
    --user:#7dd3fc; --path:#c4a35a;
    --mono:'JetBrains Mono',monospace;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{background:var(--bg);color:var(--text);font-family:var(--mono);font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased;}
  .wrap{max-width:100%;margin:0 auto;padding:0 48px;}

  .bar{position:sticky;top:0;z-index:10;background:#050605;border-bottom:1px solid var(--line);padding:13px 0;display:flex;gap:8px;align-items:center;color:var(--muted);font-size:12px;letter-spacing:.05em;}
  .bar .dots{display:flex;gap:8px;margin-right:6px;}
  .dot{width:11px;height:11px;border-radius:50%;}
  .dot.r{background:#ff5f57;} .dot.y{background:#febc2e;} .dot.g{background:#28c840;}

  /* prompt line */
  .cmd{padding:6px 0;font-size:14.5px;white-space:pre-wrap;word-break:break-word;}
  .usr{color:var(--user);} .at{color:var(--user);} .pth{color:var(--path);} .tld{color:var(--path);}
  .dollar{color:var(--text);margin-right:8px;}
  .typed{color:#ffffff;}
  .cursor{display:inline-block;width:9px;height:1.05em;background:var(--accent);vertical-align:-2px;margin-left:2px;animation:bl 1.05s steps(1) infinite;}
  @keyframes bl{50%{opacity:0;}}

  /* blocco output: nascosto finché il comando non è "digitato" */
  /* Output VISIBILE di default: se il JS non parte, si vede comunque tutto.
     Il JS aggiunge .anim al body solo quando l'animazione è attiva, e in quel
     caso i blocchi partono nascosti finché non vengono "digitati". */
  .out{opacity:1;transition:opacity .5s ease;}
  body.anim .out{opacity:0;}
  body.anim .out.show{opacity:1;}
  .out-inner{padding:10px 0 40px;border-bottom:1px solid var(--line);}

  header.intro{padding:46px 0 6px;}
  h1{font-size:clamp(28px,7vw,42px);font-weight:800;letter-spacing:-.02em;line-height:1.08;color:#fff;}
  .avatar{width:120px;height:120px;border-radius:50%;object-fit:cover;border:2px solid var(--accent);margin-bottom:20px;display:block;}
.role{color:var(--accent);font-size:14px;margin-top:4px;}
  .bio{margin-top:16px;color:#aeb8aa;max-width:none;font-size:14.5px;}
  .field{margin-top:14px;color:var(--muted);font-size:13.5px;}
  .field b{color:var(--text);font-weight:500;}
  .links{margin-top:18px;display:flex;flex-wrap:wrap;gap:10px;}
  .links a{color:var(--text);text-decoration:none;border:1px solid var(--line);padding:7px 13px;font-size:12.5px;transition:.2s;}
  .links a:hover{border-color:var(--accent);color:var(--accent);}

  /* git log */
  .commit{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:10px 0;}
  .hash{color:var(--path);font-size:13.5px;padding-top:1px;}
  .commit h3{font-size:15.5px;font-weight:700;color:#fff;}
  .commit .co{color:var(--accent);font-size:13.5px;}
  .commit .meta{color:var(--muted);font-size:12.5px;margin:2px 0 4px;}
  .commit p{color:var(--muted);font-size:13.5px;}
  .head{color:var(--accent);} .tagref{color:var(--user);}

  /* tree */
  .tree{font-size:14px;line-height:1.85;}
  .tree .d{color:var(--user);}
  .tree .f{color:var(--text);}
  .tree .branch{color:var(--muted);}
  .tree .lvl{color:var(--accent);font-size:12.5px;}
  .tree .summary{color:var(--muted);font-size:13px;margin-top:10px;}

  /* ls certs */
  .ls .lsrow{display:grid;grid-template-columns:auto auto auto 1fr;gap:14px;padding:5px 0;font-size:13.5px;align-items:baseline;}
  .ls .perm{color:var(--muted);}
  .ls .sz{color:var(--path);}
  .ls .dt{color:var(--muted);}
  .ls a{color:var(--text);text-decoration:none;}
  .ls a:hover{color:var(--accent);}
  .ls .total{color:var(--muted);font-size:13px;margin-bottom:6px;}

  /* form */
  form{display:grid;gap:12px;margin-top:6px;max-width:560px;}
  .fr{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
  .flabel{color:var(--muted);font-size:13px;margin-bottom:-6px;}
  .flabel .p{color:var(--accent);}
  input,textarea{background:var(--panel);border:1px solid var(--line);color:var(--text);font-family:var(--mono);font-size:14px;padding:12px 14px;}
  input:focus,textarea:focus{outline:none;border-color:var(--accent);}
  input::placeholder,textarea::placeholder{color:#46524a;}
  .hp{position:absolute;left:-9999px;}
  button{justify-self:start;background:var(--accent);color:var(--bg);border:none;font-family:var(--mono);font-weight:700;font-size:14px;padding:13px 24px;cursor:pointer;transition:.15s;}
  button:hover{box-shadow:0 0 24px rgba(61,255,122,.4);}
  .ok{color:var(--accent);font-size:13.5px;margin-top:8px;}

  /* projects (ls ~/projects) */
  .proj{padding:16px 0;border-top:1px dashed var(--line);}
  .proj:first-of-type{border-top:none;}
  .proj .pname{color:var(--user);font-size:15.5px;font-weight:700;}
  .proj .pname .star{color:var(--path);font-weight:400;font-size:13px;margin-left:8px;}
  .proj p{color:var(--muted);font-size:13.5px;margin:5px 0 8px;}
  .proj .stack{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;}
  .proj .tag2{font-size:11.5px;color:var(--accent);border:1px solid var(--line);padding:2px 8px;}
  .proj .plinks a{color:var(--text);text-decoration:none;font-size:13px;margin-right:16px;border-bottom:1px solid var(--accent);padding-bottom:1px;}
  .proj .plinks a:hover{color:var(--accent);}

  /* cv (wget) */
  .wget .line{font-size:13.5px;color:var(--muted);}
  .wget .pct{color:var(--accent);}
  .wget .barwrap{font-family:var(--mono);color:var(--accent);font-size:13px;margin:6px 0;letter-spacing:-1px;}
  .wget .saved{color:var(--text);font-size:13.5px;margin-top:8px;}
  .wget a.dl{display:inline-block;margin-top:14px;background:var(--accent);color:var(--bg);text-decoration:none;font-weight:700;font-size:13.5px;padding:11px 20px;transition:.15s;}
  .wget a.dl:hover{box-shadow:0 0 24px rgba(61,255,122,.4);}

  /* setup (cat ~/.config) */
  .conf{font-size:14px;line-height:1.95;}
  .conf .k{color:var(--user);}
  .conf .eq{color:var(--muted);}
  .conf .v{color:var(--text);}
  .conf .cmt{color:var(--muted);}

  /* uptime stats */
  .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:14px;}
  .stat{border:1px solid var(--line);padding:16px;}
  .stat .num{color:var(--accent);font-size:28px;font-weight:800;line-height:1;}
  .stat .lbl{color:var(--muted);font-size:12px;margin-top:6px;}
  .uptimeline{color:var(--muted);font-size:13.5px;margin-bottom:18px;}
  .uptimeline b{color:var(--text);font-weight:500;}

  /* man page */
  .man{font-size:14px;}
  .man .mh{color:var(--muted);font-size:12px;letter-spacing:.1em;display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:8px;margin-bottom:16px;}
  .man h4{color:var(--accent);font-size:13px;letter-spacing:.1em;text-transform:uppercase;margin:16px 0 6px;}
  .man h4:first-child{margin-top:0;}
  .man p{color:var(--text);font-size:13.5px;margin-bottom:4px;}
  .man .ind{padding-left:18px;color:var(--muted);font-size:13.5px;}
  .man .ind b{color:var(--text);font-weight:500;}
  .man em{color:var(--user);font-style:normal;}

  /* blog (ls ~/blog) */
  .post{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:12px 0;border-top:1px dashed var(--line);text-decoration:none;color:var(--text);transition:.2s;}
  .post:first-of-type{border-top:none;}
  .post:hover{padding-left:8px;}
  .post:hover .pt{color:var(--accent);}
  .pt{font-size:14.5px;}
  .pd{color:var(--muted);font-size:12.5px;flex-shrink:0;}

  /* now page */
  .now-box{font-size:14.5px;line-height:1.8;}
  .now-box .nrow{display:grid;grid-template-columns:24px 1fr;gap:10px;padding:6px 0;}
  .now-box .ic{color:var(--accent);}
  .now-box .nrow span.t{color:var(--text);}
  .now-box .upd{color:var(--muted);font-size:12.5px;margin-top:14px;border-top:1px dashed var(--line);padding-top:12px;}

  footer{padding:30px 0 50px;color:var(--muted);font-size:12.5px;}
  footer .p{color:var(--accent);}

  @media(max-width:520px){
    .fr{grid-template-columns:1fr;}
    .commit{grid-template-columns:1fr;gap:2px;}
    .ls .lsrow{grid-template-columns:auto 1fr;}
    .ls .perm,.ls .dt{display:none;}
  }

/* form fields from Django render as inputs already styled above */
