/* Falsum (jeux/falsum/CONCEPTION.md 8): loaded on the falsum.* pages only, every class prefixed fa- (DECISIONS
   arbitrage 10). Mobile first: one column, buttons 48 px high, big numbers; notes are cards with a double border. */

.fa-page { --fa-ink: #2a3b3a; --fa-paper: #fbf8f1; --fa-line: #8a7b5c; --fa-truth: #1f6f43; --fa-house: #9a3b12; --fa-player: #3f4f9a;
    --fa-line-dark: #6f6348; --fa-rule: #c9bfa8; }

.fa-title { display: flex; align-items: baseline; gap: 0.4em; }
.fa-sign { font-size: 1.1em; color: var(--fa-line); }
.fa-pitch { max-width: 44em; font-size: 0.95rem; }
.fa-meta { margin: 0 0 0.6em; color: var(--ns-muted); }
.fa-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.8em; margin: 1em 0; }
.fa-card { padding: 0.8em 1em; background: var(--fa-paper); border: 3px double var(--fa-line); border-radius: 4px; }
.fa-card h2, .fa-card h3 { margin: 0 0 0.4em; padding: 0; border: 0; }

.fa-prompt { margin: 0.6em 0 0.8em; font-size: 1.6rem; font-weight: bold; color: var(--fa-ink); overflow-wrap: anywhere; }
.fa-prompt-small { font-size: 1.15rem; }
.fa-figure { display: block; width: 100%; max-width: 360px; height: auto; margin: 0.4em 0 0.8em; background: var(--ns-page); }
.fa-figure line { stroke: var(--fa-ink); stroke-width: 2.5; stroke-linecap: round; }
.fa-cloud { display: block; margin: 0.4em 0; }

.fa-choices { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.5em; margin: 0.6em 0 1em; }
.fa-note {
    min-height: 48px;
    width: 100%;
    padding: 0.3em 0.6em;
    font-size: 1.5rem;
    font-weight: bold;
    color: var(--fa-ink);
    background: var(--fa-paper);
    border: 4px double var(--fa-line);
    border-radius: 4px;
}
.fa-note:hover, .fa-note:focus { color: var(--ns-on-ink); background: var(--fa-ink); }

.fa-stamp {
    display: inline-block;
    padding: 0 0.4em;
    color: var(--fa-truth);
    border: 2px solid var(--fa-truth);
    border-radius: 3px;
    transform: rotate(-3deg);
}
.fa-stamp::before { content: "⊥ "; }

.fa-forge { display: flex; flex-wrap: wrap; gap: 0.5em; align-items: center; margin: 0.6em 0 1em; }
.fa-forge input[type=number] { width: 9em; min-height: 48px; font-size: 1.4rem; }
.fa-forge button { min-height: 48px; }
.fa-bounds { font-size: 1rem; }
.fa-time { font-size: 1rem; }
.fa-ready { min-height: 48px; font-size: 1.2rem; }

.fa-review { width: 100%; border-collapse: collapse; margin: 0.6em 0 1em; }
.fa-review th, .fa-review td { padding: 0.35em 0.5em; text-align: left; vertical-align: top; border-bottom: 1px dotted var(--fa-rule); }
.fa-review th { font-weight: normal; color: var(--ns-title); }
.fa-origin-truth { color: var(--fa-truth); font-weight: bold; }
.fa-origin-house { color: var(--fa-house); }
.fa-origin-player { color: var(--fa-player); }
.fa-ok { color: var(--fa-truth); }
.fa-ko { color: var(--fa-house); }
.fa-list { margin: 0.2em 0; padding-left: 1.2em; }
.fa-reveal li { animation: fa-in 0.4s ease-out both; }
.fa-reveal li:nth-child(2) { animation-delay: 0.4s; }
.fa-reveal li:nth-child(3) { animation-delay: 0.8s; }
.fa-reveal li:nth-child(4) { animation-delay: 1.2s; }
.fa-reveal li:nth-child(5) { animation-delay: 1.6s; }
@keyframes fa-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .fa-reveal li { animation: none; } }

.fa-daily { margin: 1em 0; }
.fa-cta { display: inline-block; min-height: 48px; padding: 0.7em 1.2em; font-size: 1.1rem; color: var(--ns-on-ink); background: var(--fa-ink); border-radius: 4px; }
.fa-cta:hover, .fa-cta:focus { color: var(--ns-on-ink); background: var(--fa-line-dark); text-decoration: none; }
.fa-button { display: inline-block; min-height: 48px; padding: 0.75em 1em; color: var(--fa-ink); background: var(--fa-paper); border: 1px solid var(--fa-line); border-radius: 4px; }
.fa-button:hover, .fa-button:focus { color: var(--ns-on-ink); background: var(--fa-ink); text-decoration: none; }
.fa-actions { display: flex; flex-wrap: wrap; gap: 0.5em; }
.fa-join label { display: block; margin: 0.8em 0 0.3em; }
.fa-join-row { display: flex; flex-wrap: wrap; gap: 0.5em; }
.fa-join input { width: 9em; min-height: 48px; font-size: 1.3rem; letter-spacing: 0.1em; text-transform: uppercase; }
.fa-join button { min-height: 48px; }
/* On a phone the actions take the whole width (CONCEPTION 8: buttons of the full width, 48 px high). */
.fa-cta, .fa-button { display: block; text-align: center; }
.fa-actions > * { flex: 1 1 100%; }
.fa-share { width: 100%; max-width: 40em; font: inherit; }
.fa-spread th { width: 40%; }
.fa-bar-cell { width: 45%; }
.fa-bar { width: 100%; height: 1.1em; }

.fa-code { font-size: 1.6rem; letter-spacing: 0.15em; }
.fa-board { max-width: 28em; }
.fa-picker { display: inline-block; margin-left: 0.6em; padding: 0 0.4em; font-size: 0.9em; border: 1px solid var(--fa-rule); border-radius: 3px; }
.fa-reveal-card { margin: 0.8em 0; }
.fa-round summary { min-height: 48px; padding: 0.7em 0; font-weight: bold; cursor: pointer; }
.fa-abandon { margin: 1.5em 0 0; }
.fa-abandon summary { min-height: 48px; padding: 0.7em 0; cursor: pointer; }
.fa-abandon button { min-height: 48px; }

.fa-unranked { color: var(--ns-muted); }

.fa-form fieldset { margin: 0 0 0.8em; padding: 0.5em 0.8em; border: 1px dotted var(--fa-line); }
.fa-form legend { padding: 0 0.3em; color: var(--fa-ink); }
/* A box or a radio and its label (label.inline of the site: 44 px under a finger, no height nor vertical margin of
   the game's own); the box never narrowed by a long label. */
.fa-form label.fa-inline { display: inline-flex; gap: 0.3em; align-items: center; margin: 0 1em 0 0; }
.fa-inline input { flex: none; }
.fa-start { min-height: 48px; font-size: 1.1rem; }

@media (min-width: 720px) {
    .fa-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fa-cta, .fa-button { display: inline-block; }
    .fa-actions > * { flex: 0 0 auto; }
    .fa-choices { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
