/* albo.quest, variante "homebrew": il blog come sessione di terminale.
   I profili riprendono quelli di Terminale su macOS, più uno con i colori di olab.quest.
   Unica eccezione al monospace: i titoli in Gloock. */

@font-face { font-family: "Gloock"; font-weight: 400; font-display: swap; src: url("fonts/gloock-400.woff2") format("woff2"); }
@font-face { font-family: "Space Mono"; font-weight: 400; font-display: swap; src: url("fonts/space-mono-400.woff2") format("woff2"); }
@font-face { font-family: "Space Mono"; font-weight: 400; font-style: italic; font-display: swap; src: url("fonts/space-mono-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Space Mono"; font-weight: 700; font-display: swap; src: url("fonts/space-mono-700.woff2") format("woff2"); }

/* Profilo predefinito: Homebrew, con i colori di Terminale e l'arancio al posto del giallo */
:root {
  --bg: #000000;
  --fg: #28fe14;
  --dim: #00a600;
  --title: #e5e5e5;
  --user: #ff8700;
  --path: #00e5e5;
  --cmd: #e5e5e5;
  --link: #00e5e5;
  --head: #ff8700;
  --code: #e500e5;
  --todo: #ff8700;
  --mark: #ff8700;
  --mark2: #af5fff;
  --wash: #0d0d0d;
  --sel: #083905;
  color-scheme: dark;
}
:root[data-profilo="basic"] {
  --bg: #ffffff;
  --fg: #000000;
  --dim: #666666;
  --title: #000000;
  --user: #00a600;
  --path: #0000b2;
  --cmd: #000000;
  --link: #0000b2;
  --head: #b200b2;
  --code: #990000;
  --todo: #990000;
  --mark: #b200b2;
  --mark2: #00801f;
  --wash: #f2f2f2;
  --sel: #b3d7ff;
  color-scheme: light;
}
:root[data-profilo="novel"] {
  --bg: #dfdbc3;
  --fg: #3b2322;
  --dim: #766558;
  --title: #3b2322;
  --user: #7f2a19;
  --path: #0000b2;
  --cmd: #3b2322;
  --link: #0000b2;
  --head: #7f2a19;
  --code: #8a1f8a;
  --todo: #990000;
  --mark: #a3361b;
  --mark2: #6a3d9a;
  --wash: #d2cdb2;
  --sel: #b5ad8a;
  color-scheme: light;
}
:root[data-profilo="olab"] {
  --bg: #08080f;
  --fg: #f2ede4;
  --dim: #9997a6;
  --title: #f2ede4;
  --user: #c89600;
  --path: #7088ff;
  --cmd: #f2ede4;
  --link: #c89600;
  --head: #c89600;
  --code: #7088ff;
  --todo: #c89600;
  --mark: #7088ff;
  --mark2: #4fd1a5;
  --wash: #13131c;
  --sel: #2a2a45;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font: 400 0.9375rem/1.7 "Space Mono", ui-monospace, Menlo, Consolas, monospace;
  -webkit-font-smoothing: antialiased;
  overflow-wrap: break-word;
}

::selection { background: var(--sel); }

a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.25em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 1px solid var(--fg); outline-offset: 3px; }

.page { max-width: calc(76ch + 3rem); margin: 0 auto; padding: 3.5rem 1.5rem 4rem; }

h1 {
  margin: 0 0 2.5rem;
  font-family: "Gloock", Palatino, Georgia, serif;
  font-weight: 400;
  font-size: clamp(2rem, 7vw, 2.75rem);
  line-height: 1.08;
  letter-spacing: -0.015em;
  color: var(--title);
  text-wrap: balance;
}

/* Riga di comando: fa da titolo di sezione */
.prompt { margin: 2.75rem 0 0.9rem; font-size: inherit; font-weight: 400; }
.prompt:first-child, h1 + .prompt { margin-top: 0; }
.prompt .user { color: var(--user); font-weight: 700; text-decoration: none; }
.prompt .path { color: var(--path); }
.prompt .cmd { color: var(--cmd); font-weight: 700; }
.prompt .nota { color: var(--dim); }
.cursore { display: inline-block; width: 1ch; height: 1.15em; vertical-align: text-bottom; background: var(--fg); animation: lampeggia 1.1s steps(1) infinite; }
@keyframes lampeggia { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .cursore { animation: none; } }

/* Registro delle quest */
.posts { list-style: none; margin: 0; padding: 0; }
.posts li { display: grid; grid-template-columns: 12ch 4ch 1fr; margin-bottom: 0.5rem; }
.posts time { color: var(--dim); }
.posts .aperta { color: var(--todo); }
.posts a { grid-column: 3; text-decoration: none; }
.posts a:hover { text-decoration: underline; }
.vuota { color: var(--dim); }

/* Testo: un file Markdown visto nel terminale */
.meta { margin: 0 0 1rem; color: var(--dim); }
p, pre, blockquote, .testo ul { margin: 0 0 1.5rem; }
.testo a, .out a { color: var(--link); }
.testo h2 { margin: 2.75rem 0 1rem; font-size: inherit; font-weight: 700; color: var(--head); }
.testo h2::before { content: "## "; font-weight: 400; color: var(--dim); }
.testo ul { list-style: none; padding: 0; }
.testo li { margin-bottom: 0.35rem; padding-left: 2ch; text-indent: -2ch; }
.testo li::before { content: "- "; color: var(--path); }
.testo blockquote { padding-left: 2ch; text-indent: -2ch; color: var(--dim); }
.testo blockquote::before { content: "> "; }
code, pre { font-family: inherit; font-size: inherit; }
code { color: var(--code); }
/* Le parole che Alberto mette in evidenza cambiano colore, con due colori.
   Nelle note di Obsidian il primo si scrive ==così==, il secondo **così** */
mark { background: none; color: var(--mark); }
.testo strong { font-weight: inherit; color: var(--mark2); }
/* L'anafora va a capo: una riga per ogni ripetizione, con il rientro se la riga si spezza */
.righe .riga { display: block; padding-left: 2ch; text-indent: -2ch; }
pre { padding: 1rem 2ch; background: var(--wash); line-height: 1.6; overflow-x: auto; }
pre code { color: inherit; }

/* Lingua dei contenuti: il sito è in inglese, l'italiano si sceglie dentro la pagina */
.testo[lang="it"], .solo-it { display: none; }
:root[data-lettura="it"] .testo[lang="en"] { display: none; }
:root[data-lettura="it"] .testo[lang="it"] { display: block; }
:root[data-lettura="it"] .solo-it { display: inline; }
.lingue { display: flex; gap: 0.25rem 2.5ch; margin: 0 0 2rem; color: var(--dim); }

/* Piede */
footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 3ch; margin-top: 3.5rem; color: var(--dim); }
footer nav, footer .profili { display: flex; flex-wrap: wrap; gap: 0.25rem 2.5ch; }
footer a { text-decoration: none; }
footer a:hover, footer button:hover, .lingue button:hover { color: var(--fg); }
footer button, .lingue button { padding: 0; border: 0; background: none; font: inherit; color: inherit; cursor: pointer; }
footer button[aria-pressed="true"], .lingue button[aria-pressed="true"] { color: var(--fg); text-decoration: underline; text-underline-offset: 0.3em; }

@media (max-width: 34rem) {
  .page { padding: 2.25rem 1.25rem 3rem; }
  .posts li { grid-template-columns: auto 1fr; gap: 0 1ch; margin-bottom: 1.15rem; }
  .posts a { grid-column: 1 / -1; }
}

@media print {
  footer, .cursore, .lingue { display: none; }
}