/* Shared control styles for calculator pages (inputs, selects, toggle buttons, result grid). */
.calc-block .tip-presets { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1rem; }
.calc-block .preset-btn { font: inherit; font-size: .95rem; padding: .5rem .95rem; border: 1.5px solid var(--line, #d9cfee); background: var(--panel, #fff); color: var(--ink, #241b3a); border-radius: 999px; cursor: pointer; }
.calc-block .preset-btn.active { background: var(--amber-deep, #7c3aed); border-color: var(--amber-deep, #7c3aed); color: #fff; }
.calc-block .field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 1rem; margin-bottom: 1rem; }
.calc-block .field { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.calc-block .field label { font-size: .9rem; font-weight: 600; }
.calc-block .field input, .calc-block .field select { font: inherit; padding: .55rem .65rem; border: 1.5px solid var(--line, #d9cfee); border-radius: 10px; background: var(--panel, #fff); color: var(--ink, #241b3a); width: 100%; }
.calc-block .results-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin-top: .5rem; }
.calc-block .results-grid .result { display: flex; flex-direction: column; gap: .2rem; }
.calc-block .results-grid .result.wide { grid-column: 1 / -1; }
@media (max-width: 560px) { .calc-block .field-grid, .calc-block .results-grid { grid-template-columns: 1fr; } }

/* Action buttons: primary (generate) and secondary (add / shuffle / copy) */
main .tip-presets { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1rem; }
main .preset-btn { font: inherit; font-size: .95rem; padding: .5rem .95rem; border: 1.5px solid var(--line, #d9cfee); background: var(--panel, #fff); color: var(--ink, #241b3a); border-radius: 999px; cursor: pointer; }
main .preset-btn.active { background: var(--amber-deep, #7c3aed); border-color: var(--amber-deep, #7c3aed); color: #fff; }
main .generate-btn { font: inherit; font-weight: 600; padding: .65rem 1.2rem; border: 0; border-radius: 999px; background: var(--amber-deep, #7c3aed); color: #fff; cursor: pointer; }
main .generate-btn:hover { filter: brightness(1.08); }
main .regen-btn, main .copy-btn { font: inherit; font-size: .92rem; padding: .45rem .95rem; border: 1.5px solid var(--line, #d9cfee); background: var(--panel, #fff); color: var(--ink, #241b3a); border-radius: 999px; cursor: pointer; }
main .regen-btn:hover, main .copy-btn:hover, main .preset-btn:hover { border-color: var(--amber-deep, #7c3aed); }
main textarea { font: inherit; width: 100%; min-height: 120px; padding: .65rem .75rem; border: 1.5px solid var(--line, #d9cfee); border-radius: 10px; background: var(--panel, #fff); color: var(--ink, #241b3a); resize: vertical; margin-bottom: .9rem; }