/* ===========================================================
   RXSTARS — component styles
   Brand-neutral. Stars scale fluidly so all five always fit.
   =========================================================== */
.rxstars{
  --rxs-star:#F5B301;
  --rxs-star-off:#9AA7B4;
  --rxs-fg:#0E1620;
  --rxs-muted:#6B7A89;
  --rxs-accent:#146BFF;
  --rxs-surface:#FFFFFF;
  --rxs-line:rgba(14,22,32,.14);
  --rxs-size:clamp(2.1rem, 13vw, 3.1rem);

  width:100%;max-width:27rem;margin:0 auto;text-align:center;
  font-family:inherit;color:var(--rxs-fg);
}

.rxs-q{
  font-size:clamp(1.1rem,4.6vw,1.34rem);font-weight:600;line-height:1.35;
  margin-bottom:1.4rem;letter-spacing:-.01em;
}

/* five stars, always on one line, always all visible */
.rxs-stars{
  display:flex;justify-content:center;align-items:center;
  gap:clamp(.15rem,1.4vw,.45rem);
  width:100%;margin-bottom:1rem;
}
.rxs-star{
  flex:0 1 auto;
  background:none;border:0;padding:0;cursor:pointer;
  color:var(--rxs-star-off);line-height:0;
  transition:transform .16s cubic-bezier(.34,1.56,.64,1),color .16s;
  -webkit-tap-highlight-color:transparent;
  min-width:0;
}
.rxs-star svg{
  width:var(--rxs-size);height:var(--rxs-size);
  display:block;max-width:100%;
}
.rxs-star.on{color:var(--rxs-star)}
.rxs-star:hover,.rxs-star:focus-visible{transform:scale(1.14);outline:none}
.rxs-star:focus-visible svg{filter:drop-shadow(0 0 .4rem var(--rxs-accent))}
.rxs-star:active{transform:scale(.92)}
.rxs-star.on svg{filter:drop-shadow(0 0 .55rem rgba(245,179,1,.42))}

.rxs-hint{
  font-size:.92rem;color:var(--rxs-muted);min-height:1.5em;line-height:1.5;
}

.rxs-panel{
  margin-top:1.4rem;padding:1.2rem;text-align:left;
  background:var(--rxs-surface);
  border:1px solid var(--rxs-line);border-radius:.9rem;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
[dir="rtl"] .rxs-panel{text-align:right}
.rxs-tellus{font-size:.95rem;color:var(--rxs-muted);margin:0 0 .8rem;line-height:1.6}
.rxs-tellus:empty{display:none}

.rxs-text{
  width:100%;box-sizing:border-box;padding:.8rem .9rem;
  font:inherit;font-size:1rem;color:var(--rxs-fg);line-height:1.6;
  background:transparent;
  border:1px solid var(--rxs-line);border-radius:.55rem;
  resize:vertical;min-height:6rem;
}
.rxs-text::placeholder{color:var(--rxs-muted);opacity:.85}
.rxs-text:focus{outline:none;border-color:var(--rxs-accent);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--rxs-accent) 22%, transparent)}

.rxs-actions{display:flex;gap:.6rem;margin-top:.9rem;flex-wrap:wrap}
.rxs-actions button{
  font:inherit;font-size:.96rem;font-weight:600;
  min-height:2.9rem;padding:.7rem 1.5rem;border-radius:.55rem;cursor:pointer;
  transition:opacity .18s,transform .18s;
}
.rxs-send{background:var(--rxs-accent);color:#0B1A0A;border:0;flex:1 1 8rem}
.rxs-send:disabled{opacity:.6;cursor:default}
.rxs-skip{background:transparent;color:var(--rxs-muted);border:1px solid var(--rxs-line);flex:0 0 auto}
.rxs-send:hover:not(:disabled),.rxs-skip:hover{opacity:.88;transform:translateY(-1px)}

.rxs-done{
  font-size:clamp(1.05rem,4vw,1.24rem);font-weight:600;
  padding:2.2rem 0;line-height:1.5;
}

@media(prefers-reduced-motion:reduce){
  .rxs-star,.rxs-actions button{transition:none}
  .rxs-star:hover,.rxs-star:active{transform:none}
}