/* Page-specific presentation; forms, navigation, copy and footer reuse utility styles. */
.utility-page[data-utility="yes-or-no-generator"] main{max-width:820px}
.yn-card{max-width:620px;margin:auto}
.yn-question{display:grid;gap:7px;font-size:.9rem;font-weight:700}
.yn-question span{font-size:.78rem;font-weight:400;color:#667085}
.yn-question input{width:100%;min-width:0;border:1px solid #a7b7d0;border-radius:12px;padding:12px;font:inherit;font-weight:400;color:var(--ink);background:white}
.yn-card .utility-stage{position:relative;min-height:170px;margin:18px 0 14px;padding:18px;background:linear-gradient(135deg,#eeeaff,#eaf5ff 55%,#fff3e4);border:1px solid #e3e6f4;overflow:hidden}
.yn-card .utility-stage::before{content:'✦';position:absolute;left:24px;top:18px;font-size:1.5rem;color:#8e80b4;opacity:.4;pointer-events:none}
.yn-card .utility-stage::after{content:'✦';position:absolute;right:24px;bottom:18px;font-size:1.1rem;color:#8e80b4;opacity:.4;pointer-events:none}
#yn-label{display:block;font-size:.78rem;font-weight:700;letter-spacing:.04em;color:#5a6277}
#yn-answer{display:block;font-size:clamp(58px,14vw,84px);line-height:1.1;letter-spacing:.02em;color:#65568d;margin-top:8px}
#yn-stage[data-answer="yes"]{background:linear-gradient(135deg,#e6f8e7,#e1f4f3)}
#yn-stage[data-answer="yes"] #yn-answer{color:#227052}
#yn-stage[data-answer="no"]{background:linear-gradient(135deg,#fff0e5,#fce7ee)}
#yn-stage[data-answer="no"] #yn-answer{color:#a43f5c}
.yn-card .utility-actions{margin:0}
#yn-submit{width:100%;min-height:52px;border-radius:13px;font-size:1.08rem;font-weight:800}
.yn-note{text-align:center;margin:12px 0 0;font-size:.78rem;line-height:1.55;color:#586578}
.yn-history-heading{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-top:18px}
.yn-history-heading h2{margin:0;font-size:.9rem}.yn-history-heading span{font-size:.7rem;color:#667085}
#yn-history{display:flex;flex-wrap:wrap;gap:7px;list-style:none;margin:10px 0 0;padding:0}
#yn-history li{font-size:.75rem;font-weight:800;border-radius:9px;padding:6px 9px;border:1px solid transparent}
#yn-history .yn-history-yes{background:#e5f4eb;color:#24664a;border-color:#c6e4d2}
#yn-history .yn-history-no{background:#fcebf0;color:#943c56;border-color:#f0ceda}
#yn-error:empty{display:none}
.yn-card [hidden]{display:none!important}
.is-revealing #yn-answer{animation:yn-reveal .28s ease-out}
@keyframes yn-reveal{from{opacity:.3;transform:translateY(7px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.is-revealing #yn-answer{animation:none}}
@media(max-width:520px){
 .utility-page[data-utility="yes-or-no-generator"] main{padding:12px 12px 28px}
 .utility-page[data-utility="yes-or-no-generator"] .utility-hero{padding:18px 0 16px}
 .utility-page[data-utility="yes-or-no-generator"] .utility-hero h1{font-size:1.8rem}
 .utility-page[data-utility="yes-or-no-generator"] .utility-hero p{font-size:.9rem}
 .yn-card .utility-stage{min-height:145px;margin:14px 0 12px}
 .yn-card{padding:18px 14px}
}