/* cf-hint v1: hidden until cf-hint.js decides (no flash, hidden without JS) */
.cf-hint{display:none}
.cf-hint.is-on{display:flex;align-items:flex-start;gap:10px;margin:0 0 16px;padding:10px 12px 10px 14px;background:var(--warm,#f3f1ec);border:1px solid var(--line,#e8e6e1);border-left:4px solid var(--slate,#2c4a6e);border-radius:8px;color:var(--ink,#1a1a1a);font-size:.92rem;line-height:1.5}
.cf-hint.is-on::before{content:"Tip";flex:none;font-weight:700;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--slate,#2c4a6e);padding-top:.2em}
.cf-hint p{margin:0;flex:1}
.cf-hint-x{flex:none;margin:-4px -4px 0 auto;min-width:32px;min-height:32px;border:0;border-radius:6px;background:transparent;color:var(--muted,#5c5a55);font-size:1.25rem;line-height:1;cursor:pointer}
.cf-hint-x:hover{background:var(--line,#e8e6e1);color:var(--ink,#1a1a1a)}
.cf-hint-x:focus-visible{outline:2px solid var(--slate,#2c4a6e);outline-offset:2px}
.cf-hint-reset{border:0;background:none;padding:0;color:var(--slate,#2c4a6e);font:inherit;font-size:.88rem;text-decoration:underline;cursor:pointer}
@media (prefers-reduced-motion:no-preference){.cf-hint.is-on{animation:cfh-in .18s ease-out}@keyframes cfh-in{from{opacity:0}to{opacity:1}}}
@media print{.cf-hint,.cf-hint-reset{display:none!important}}
