/* Coda: styles for features from v72 on. Imported by style.css. */
/* Suggest a line (v72): the form stacks full width, like the pack maker. */
#submit textarea, #submit input, #submit select { display: block; width: 100%; box-sizing: border-box; margin: 8px 0; font: inherit; padding: 12px 14px; border: 0; border-radius: 12px; background: var(--bg); color: var(--text); box-shadow: inset 0 0 0 1px var(--border); }
.library-list a { color: var(--text); }
.options button.picked { box-shadow: inset 0 0 0 3px var(--accent-deep); }
.library-list li.featured b::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--accent-deep); margin-right: 6px; vertical-align: middle; }
/* Daily quote by email (v86): one row, outlined, under the Daily result. */
.news { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 16px 0 8px; }
.news input { flex: 1 1 200px; min-width: 0; font: inherit; padding: 12px 14px; border: 0; border-radius: 12px; background: var(--bg); color: var(--text); box-shadow: inset 0 0 0 1px var(--border); }
.news button { background: transparent; color: var(--text); box-shadow: inset 0 0 0 2px var(--accent-deep); }
.news p { flex-basis: 100%; margin: 4px 0 0; }
#start-mod, #mod-back { background: transparent; color: var(--text); box-shadow: inset 0 0 0 2px var(--accent-deep); }
/* Reduced motion (v94): if the system asks, nothing moves. Colour still says right and wrong. */
@media (prefers-reduced-motion: reduce) { *, ::before, ::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
  #reveal.sharpen { transition-duration: 7s !important; }   /* the slow unblur is the game, not decoration */ }
/* Quip lives (v95): a small Quip in the round card's corner, reacting. */
#game { position: relative; }
#quip-live { position: absolute; top: 6px; left: 6px; width: 56px; height: 56px; pointer-events: none; }
#quip-live svg { width: 100%; height: 100%; }
#archive-btn, #archive-back { background: transparent; color: var(--text); box-shadow: inset 0 0 0 2px var(--accent-deep); }
/* Access (v98): WCAG 2.2 fixes from the 320 px and target-size pass. */
.setting-row { flex-wrap: wrap; }   /* on a 320 px screen a button drops under its label */
.setting-row > span { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
#settings-btn { min-width: 32px; min-height: 32px; }
input[type="checkbox"] { width: 20px; height: 20px; }
/* Coda 100 (v100): the event and birthday notes at the top of the menu. */
.event { margin: 0 0 16px; padding: 12px 14px; border-radius: 14px; box-shadow: inset 0 0 0 2px var(--accent-deep); }
.event-note { margin: 0 0 8px; font-weight: 600; }