.rating-page { min-height:100vh; background:radial-gradient(ellipse at 12% 18%,#e7dcff 0,transparent 32%),radial-gradient(ellipse at 90% 72%,#ffe4dc 0,transparent 30%),#f8f5fb; color:#332b43; }
.rating-header { position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 6vw; border-bottom:1px solid #715c8820; }
.rating-header .brand { color:#372b4f; }
.rating-header .brand span { color:#81758b; }
.rating-back { color:#756b7b; font-size:9px; font-weight:700; letter-spacing:.13em; }
.rating-back:hover,.rating-home-link:hover { color:#9669a8; }
.rating-main { width:min(1120px,90vw); margin:0 auto; padding:72px 0 80px; }
.rating-intro { max-width:680px; margin:0 auto 42px; text-align:center; }
.rating-kicker { color:#9b6ea8; font-size:9px; font-weight:700; letter-spacing:.22em; }
.rating-intro h1 { margin:14px 0 15px; color:#352a49; font:900 clamp(42px,7vw,78px)/.98 var(--display); letter-spacing:-.04em; }
.rating-intro h1 em { color:#a777a8; font-style:normal; }
.rating-intro > p:last-child { max-width:520px; margin:0 auto; color:#72697b; font-size:12px; line-height:1.9; }
.rating-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.82fr); overflow:hidden; border:1px solid #ddd2e5; border-radius:8px; background:#fffdfa; box-shadow:0 24px 70px #45305014; }
.rating-form { padding:clamp(25px,5vw,55px); }
.rating-step { margin:0 0 20px; color:#a277aa; font-size:9px; font-weight:800; letter-spacing:.18em; }
.rating-step span { margin-left:8px; color:#887c8d; }
.star-fieldset { margin:0; padding:0; border:0; }
.star-fieldset legend { margin-bottom:15px; color:#382f49; font:700 19px var(--display); }
.star-picker { display:flex; gap:7px; }
.star-choice { position:relative; display:grid; width:47px; height:47px; place-items:center; border:1px solid #e4d9e8; border-radius:50%; background:#faf7fb; color:#c9bece; cursor:pointer; transition:transform .18s,border-color .18s,background .18s,color .18s; }
.star-choice:hover { transform:translateY(-3px); border-color:#e6b85c; }
.star-choice span[aria-hidden="true"] { font-size:27px; line-height:1; }
.star-choice input { position:absolute; width:1px; height:1px; opacity:0; }
.star-choice.is-active { border-color:#e2b250; background:#fff5db; color:#e1a832; }
.star-choice:focus-within { outline:3px solid #b99bd0; outline-offset:3px; }
.rating-hint { min-height:21px; margin:12px 0 30px; color:#8a7e91; font-size:11px; }
.review-field { display:grid; gap:10px; }
.review-field label { color:#8d7195; font-size:9px; font-weight:800; letter-spacing:.14em; }
.review-field textarea { width:100%; min-height:132px; resize:vertical; padding:15px; border:1px solid #ded4e3; border-radius:4px; outline:0; background:#fdfbfe; color:#3f354d; font:500 12px/1.8 var(--body); }
.review-field textarea:focus { border-color:#aa86ba; box-shadow:0 0 0 3px #aa86ba20; }
.review-field textarea::placeholder { color:#aaa0af; }
.review-foot { display:flex; justify-content:space-between; gap:12px; color:#9c92a0; font-size:9px; }
.rating-submit { display:flex; width:100%; min-height:49px; align-items:center; justify-content:space-between; margin-top:24px; padding:0 18px; border:0; border-radius:3px; background:linear-gradient(100deg,#5c4779,#8f659e); color:#fffaf3; font-size:9px; font-weight:800; letter-spacing:.12em; cursor:pointer; box-shadow:0 8px 20px #715c8828; transition:transform .2s,box-shadow .2s; }
.rating-submit:hover { transform:translateY(-2px); box-shadow:0 12px 25px #715c8838; }
.rating-submit span { color:#ffe7a7; font-size:18px; }
.rating-privacy { margin:12px 0 0; color:#988e9c; font-size:9px; line-height:1.7; }
.rating-page #rating-instagram-link[hidden] { display:none; }
.rating-page #rating-instagram-link { margin-top:12px; }
.rating-message-copy { width:100%; min-height:100px; margin-top:12px; padding:12px; border:1px solid #ded4e3; border-radius:4px; background:#fdfbfe; color:#3f354d; font:500 11px/1.7 var(--body); }
.rating-message-copy[hidden] { display:none; }
.reaction-panel { position:relative; display:grid; min-height:550px; place-items:center; overflow:hidden; padding:35px; background:radial-gradient(ellipse at 50% 48%,#fff 0 28%,transparent 62%),linear-gradient(145deg,#eee6f8,#f9e9eb 55%,#f8efd9); }
.reaction-panel::before,.reaction-panel::after { position:absolute; width:75%; height:75%; border:1px solid #aa8ab52b; border-radius:50%; content:''; }
.reaction-panel::after { width:60%; height:83%; transform:rotate(35deg); border-color:#d7af7138; }
.reaction-figure { position:relative; z-index:1; display:flex; width:100%; height:100%; min-height:440px; flex-direction:column; align-items:center; justify-content:center; margin:0; }
.reaction-figure img { width:min(100%,350px); height:335px; object-fit:contain; filter:drop-shadow(0 16px 24px #49385024); transition:opacity .18s,transform .25s; }
.reaction-figure img.is-changing { transform:scale(.96); opacity:.25; }
.reaction-figure figcaption { max-width:310px; margin-top:13px; padding:12px 18px; border:1px solid #d9c8df; border-radius:20px 20px 20px 5px; background:#fffdf4ed; color:#59486a; font:700 14px/1.45 var(--display); text-align:center; box-shadow:0 8px 24px #49385012; }
.reaction-note { position:absolute; z-index:1; right:12px; bottom:13px; left:12px; margin:0; color:#9989a1; font-size:7px; font-weight:700; letter-spacing:.16em; text-align:center; }
.reaction-spark { position:absolute; z-index:1; color:#b288be80; font-size:27px; animation:spark-float 3s ease-in-out infinite alternate; }
.reaction-spark--one { top:12%; left:15%; }
.reaction-spark--two { right:13%; bottom:18%; color:#cfaa697e; animation-delay:.8s; }
.rating-home-link { display:flex; width:fit-content; align-items:center; gap:18px; margin:30px auto 0; color:#756b7b; font-size:9px; font-weight:700; letter-spacing:.15em; }
.rating-home-link span { color:#a777a8; font-size:16px; }
.rating-footer { display:flex; justify-content:space-between; gap:20px; padding:22px 6vw; border-top:1px solid #715c881a; color:#988e9c; font-size:8px; letter-spacing:.13em; }
.rating-teaser { position:fixed; z-index:1000; right:20px; bottom:88px; display:grid; width:min(286px,calc(100vw - 32px)); grid-template-columns:minmax(0,1fr) 76px; align-items:center; gap:8px; padding:11px 12px 10px 15px; border:1px solid #d2c2df; border-radius:18px 18px 5px 18px; background:linear-gradient(120deg,#fffdf8,#eee7fa); box-shadow:0 16px 44px #3f315a30; opacity:0; transform:translateX(calc(100% + 35px)); transition:opacity .35s,transform .45s cubic-bezier(.2,.8,.2,1); }
.rating-teaser[hidden] { display:none; }
.rating-teaser.is-visible { opacity:1; transform:translateX(0); }
.rating-teaser-link { display:contents; color:#423653; }
.rating-teaser-bubble { position:relative; display:block; padding:13px 12px; border:1px solid #dac9e4; border-radius:15px 15px 15px 4px; background:#fff; color:#4d3d61; font:700 13px/1.25 var(--display); box-shadow:0 6px 16px #37264d12; }
.rating-teaser-bubble::after { position:absolute; right:-6px; bottom:12px; width:10px; height:10px; transform:rotate(45deg); border-top:1px solid #dac9e4; border-right:1px solid #dac9e4; background:#fff; content:''; }
.rating-teaser-bubble small { display:block; margin-top:4px; color:#9989a1; font:600 8px/1.4 var(--body); }
.rating-teaser img { width:76px; height:68px; object-fit:contain; }
.rating-teaser-close { position:absolute; top:-9px; right:-9px; display:grid; width:24px; height:24px; place-items:center; border:1px solid #d2c2df; border-radius:50%; background:#fff; color:#665570; font-size:15px; cursor:pointer; }
@keyframes spark-float { to { transform:translateY(-8px) rotate(12deg); } }
@media(max-width:760px) {
  .rating-header { align-items:flex-start; flex-direction:column; }
  .rating-main { width:min(92vw,620px); padding:50px 0 60px; }
  .rating-intro { margin-bottom:28px; }
  .rating-card { grid-template-columns:1fr; }
  .rating-form { padding:26px 22px; }
  .reaction-panel { min-height:410px; }
  .reaction-figure { min-height:340px; }
  .reaction-figure img { height:270px; }
  .rating-footer { flex-direction:column; }
  .rating-teaser { right:12px; bottom:76px; width:min(270px,calc(100vw - 24px)); }
}
@media(prefers-reduced-motion:reduce) { .reaction-spark { animation:none; } .rating-teaser { transition:none; } }

/* Screen-reader labels and robust teaser link layout */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.rating-teaser { display:flex; }
.rating-teaser-link { display:flex; min-width:0; flex:1; align-items:center; justify-content:space-between; gap:8px; }
.rating-teaser-bubble { flex:1; }
.rating-teaser-link:focus-visible,.rating-teaser-close:focus-visible { outline:3px solid #a777a8; outline-offset:3px; }