/* /embed/state-regulations/ — the embeddable 51-state med-spa rule checker.
   Palette and type scale are deliberately the same as embed-fda-recalls.css so
   a site that embeds both widgets gets one coherent look. Light ground only:
   every brand in this portfolio is light-theme by standing rule. */
:root { --ink:#2A241D; --line:#E7DECF; --muted:#6E6452; --recall:#9A4A4A; --fda:#82642B; --forest:#1E3A30; --wash:#FAF6EE; }
* { box-sizing:border-box; margin:0; }
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; background:transparent; color:var(--ink); }
.w { max-width:440px; margin:0 auto; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#fff; display:flex; flex-direction:column; max-height:100vh; }
.w-h { background:var(--forest); color:#F3EAD6; padding:11px 16px; display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.w-h .dot { width:8px; height:8px; border-radius:50%; background:#E8A9A9; box-shadow:0 0 0 0 rgba(232,169,169,.6); animation:p 2s infinite; }
@keyframes p { 0%{box-shadow:0 0 0 0 rgba(232,169,169,.5)} 70%{box-shadow:0 0 0 6px rgba(232,169,169,0)} 100%{box-shadow:0 0 0 0 rgba(232,169,169,0)} }
.w-h b { font-size:13px; letter-spacing:.02em; }

/* picker */
.w-p { padding:12px 16px 10px; border-bottom:1px solid var(--line); background:var(--wash); flex:0 0 auto; }
.w-p label { display:block; font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-bottom:5px; }
.w-p select { width:100%; font:inherit; font-size:14px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:8px; padding:8px 10px; appearance:none; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236E6452' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 11px center; padding-right:30px; }
.w-p select:focus-visible { outline:2px solid var(--forest); outline-offset:1px; }

/* verdict strip */
.w-v { padding:11px 16px; display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid var(--line); flex:0 0 auto; }
.w-v .sn { font-size:14px; font-weight:700; }
.chip { font-size:9.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:3px 7px; border-radius:4px; white-space:nowrap; }
.chip.strict   { background:rgba(154,74,74,.12); color:var(--recall); }
.chip.moderate { background:rgba(130,100,43,.14); color:var(--fda); }
.chip.lenient  { background:rgba(30,58,48,.10);  color:var(--forest); }

/* answer rows — the scrolling region, so a long state never clips the footer */
.w-r { flex:1 1 auto; overflow-y:auto; -webkit-overflow-scrolling:touch; }
.r { padding:9px 16px; border-bottom:1px solid var(--line); }
.r:last-child { border-bottom:none; }
.r dt { font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); }
.r dd { font-size:12.5px; line-height:1.4; margin-top:3px; }

.w-f { padding:9px 16px; text-align:center; border-top:1px solid var(--line); flex:0 0 auto; background:#fff; }
.w-f a { font-size:11.5px; color:var(--fda); text-decoration:none; font-weight:600; }
.w-f a:hover { text-decoration:underline; }
.w-f .cred { display:block; font-size:10px; color:var(--muted); margin-top:3px; font-weight:400; }
.w-f .cred a { font-size:10px; font-weight:600; }
