:root.sk-feedback-open {
  overflow: hidden;
}

.sk-feedback[hidden] {
  display: none;
}

.sk-feedback {
  position: fixed;
  z-index: 10050;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
}

.sk-feedback-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 10, 30, 0.62);
  backdrop-filter: blur(9px);
  opacity: 0;
  transition: opacity 180ms ease;
}

.sk-feedback-card {
  position: relative;
  isolation: isolate;
  width: min(100%, 586px);
  overflow: hidden;
  padding: 44px 44px 38px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 28px;
  background:
    radial-gradient(circle at 101% -2%, rgba(107, 88, 255, 0.18), transparent 33%),
    linear-gradient(145deg, #ffffff 0%, #fbfbff 100%);
  box-shadow: 0 28px 84px rgba(2, 8, 29, 0.35), 0 3px 15px rgba(24, 19, 92, 0.12);
  color: #131a36;
  opacity: 0;
  transform: translateY(18px) scale(0.98);
  transition: transform 220ms cubic-bezier(.2, .8, .2, 1), opacity 180ms ease;
}

.sk-feedback.is-visible .sk-feedback-backdrop,
.sk-feedback.is-visible .sk-feedback-card {
  opacity: 1;
}

.sk-feedback.is-visible .sk-feedback-card {
  transform: translateY(0) scale(1);
}

.sk-feedback-card:focus {
  outline: none;
}

.sk-feedback-orbit {
  position: absolute;
  z-index: -1;
  border: 1px solid rgba(79, 70, 229, 0.1);
  border-radius: 50%;
  pointer-events: none;
}

.sk-feedback-orbit--one {
  width: 290px;
  height: 290px;
  right: -178px;
  top: -164px;
}

.sk-feedback-orbit--two {
  width: 205px;
  height: 205px;
  right: -105px;
  top: -123px;
}

.sk-feedback-close {
  position: absolute;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  top: 18px;
  right: 18px;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #68718a;
  cursor: pointer;
  transition: color 140ms ease, background 140ms ease;
}

.sk-feedback-close svg {
  width: 20px;
  height: 20px;
}

.sk-feedback-close:hover,
.sk-feedback-close:focus-visible {
  color: #292153;
  background: #f0effb;
  outline: none;
}

.sk-feedback-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 18px;
  color: #5146db;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.095em;
  line-height: 1;
  text-transform: uppercase;
}

.sk-feedback-kicker span {
  font-size: 16px;
}

.sk-feedback-content h2 {
  max-width: 440px;
  margin: 0;
  color: #111936;
  font-size: clamp(27px, 4vw, 35px);
  font-weight: 760;
  letter-spacing: -0.045em;
  line-height: 1.1;
}

.sk-feedback-content > p:not(.sk-feedback-selection):not(.sk-feedback-privacy) {
  max-width: 440px;
  margin: 13px 0 28px;
  color: #657089;
  font-size: 16px;
  line-height: 1.55;
}

.sk-feedback-scale-labels {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
  color: #747e92;
  font-size: 12px;
  font-weight: 650;
}

.sk-feedback-scale {
  display: grid;
  grid-template-columns: repeat(11, minmax(0, 1fr));
  gap: 7px;
}

.sk-feedback-score {
  aspect-ratio: 1;
  min-width: 0;
  padding: 0;
  border: 1px solid #dce0eb;
  border-radius: 10px;
  background: #fff;
  color: #3d4961;
  font: inherit;
  font-size: 14px;
  font-weight: 720;
  cursor: pointer;
  transition: background 150ms ease, border-color 150ms ease, color 150ms ease, transform 150ms ease, box-shadow 150ms ease;
}

.sk-feedback-score:hover,
.sk-feedback-score:focus-visible {
  border-color: #8378f0;
  color: #5146db;
  outline: none;
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(79, 70, 229, 0.14);
}

.sk-feedback-score.is-selected {
  border-color: #4f46e5;
  background: #4f46e5;
  color: #fff;
  box-shadow: 0 7px 17px rgba(79, 70, 229, 0.28);
}

.sk-feedback-selection {
  min-height: 20px;
  margin: 12px 0 22px;
  color: #7a8498;
  font-size: 13px;
  line-height: 20px;
}

.sk-feedback-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

.sk-feedback-primary,
.sk-feedback-secondary {
  min-height: 46px;
  padding: 0 19px;
  border-radius: 12px;
  font: inherit;
  font-size: 14px;
  font-weight: 760;
  cursor: pointer;
  transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease, border-color 150ms ease;
}

.sk-feedback-primary {
  border: 1px solid #4f46e5;
  background: #4f46e5;
  color: #fff;
  box-shadow: 0 8px 18px rgba(79, 70, 229, 0.23);
}

.sk-feedback-primary span {
  display: inline-block;
  margin-left: 5px;
  font-size: 17px;
  transition: transform 150ms ease;
}

.sk-feedback-primary:hover:not(:disabled),
.sk-feedback-primary:focus-visible:not(:disabled) {
  border-color: #4038c7;
  background: #4038c7;
  outline: none;
  transform: translateY(-1px);
  box-shadow: 0 11px 21px rgba(79, 70, 229, 0.3);
}

.sk-feedback-primary:hover span {
  transform: translateX(2px);
}

.sk-feedback-primary:disabled {
  border-color: #deddf2;
  background: #deddf2;
  box-shadow: none;
  color: #9b99be;
  cursor: not-allowed;
}

.sk-feedback-secondary {
  border: 1px solid #e1e4ed;
  background: #fff;
  color: #58647a;
}

.sk-feedback-secondary:hover,
.sk-feedback-secondary:focus-visible {
  border-color: #bcc1d0;
  background: #f8f8fc;
  outline: none;
}

.sk-feedback-comment-label {
  display: block;
  margin: 0 0 8px;
  color: #303b55;
  font-size: 13px;
  font-weight: 760;
}

.sk-feedback-comment {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-height: 126px;
  resize: vertical;
  padding: 13px 14px;
  border: 1px solid #dce0eb;
  border-radius: 13px;
  background: #fff;
  color: #17203d;
  font: inherit;
  font-size: 14px;
  line-height: 1.45;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

.sk-feedback-comment::placeholder {
  color: #9aa2b3;
}

.sk-feedback-comment:focus {
  border-color: #756be8;
  outline: none;
  box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.1);
}

.sk-feedback-privacy {
  margin: 9px 0 22px;
  color: #7d8698;
  font-size: 12px;
  line-height: 1.4;
}

.sk-feedback-privacy.has-error {
  color: #b33e4b;
}

.sk-feedback-thanks {
  min-height: 282px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.sk-feedback-done {
  align-self: flex-start;
  margin-top: 4px;
}

@media (max-width: 560px) {
  .sk-feedback {
    align-items: end;
    padding: 12px;
  }

  .sk-feedback-card {
    width: 100%;
    padding: 34px 20px 22px;
    border-radius: 22px;
  }

  .sk-feedback-content h2 {
    font-size: 28px;
  }

  .sk-feedback-content > p:not(.sk-feedback-selection):not(.sk-feedback-privacy) {
    margin-bottom: 23px;
    font-size: 15px;
  }

  .sk-feedback-scale {
    gap: 5px;
  }

  .sk-feedback-score {
    border-radius: 8px;
    font-size: 12px;
  }

  .sk-feedback-actions {
    justify-content: stretch;
  }

  .sk-feedback-primary,
  .sk-feedback-secondary {
    flex: 1;
    padding: 0 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sk-feedback-backdrop,
  .sk-feedback-card,
  .sk-feedback-score,
  .sk-feedback-primary,
  .sk-feedback-secondary,
  .sk-feedback-primary span {
    transition: none;
  }
}

/* Feedback-1 structure, adapted to Skairova's indigo system. */
.sk-feedback-widget { position:relative; width:min(100%,430px); padding:24px; border:1px solid #e7e8ef; border-radius:18px; background:#fff; color:#121a34; box-shadow:0 24px 70px rgba(5,10,31,.3); opacity:0; transform:translateY(14px) scale(.985); transition:opacity .18s ease,transform .18s ease; }
.sk-feedback.is-visible .sk-feedback-widget { opacity:1; transform:translateY(0) scale(1); }
.sk-feedback-widget:focus { outline:0; }
.sk-feedback-widget-head { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:22px; }
.sk-feedback-widget-head h2,.sk-feedback-sent h2 { margin:0; color:#111936; font-size:20px; font-weight:760; letter-spacing:-.025em; }
.sk-feedback-widget-head p { margin:5px 0 0; color:#6c7589; font-size:13px; line-height:1.45; }
.sk-feedback-widget-head button { display:grid; place-items:center; width:32px; height:32px; padding:0; border:0; border-radius:9px; background:transparent; color:#727a8d; cursor:pointer; }
.sk-feedback-widget-head button:hover,.sk-feedback-widget-head button:focus-visible { background:#f1f0fb; color:#39305f; outline:0; }
.sk-feedback-widget-head svg { width:19px; height:19px; }
.sk-feedback-types { display:flex; gap:7px; padding:4px; border-radius:11px; background:#f5f5fa; }
.sk-feedback-types button { flex:1; min-height:35px; border:0; border-radius:8px; background:transparent; color:#697287; font:inherit; font-size:13px; font-weight:680; cursor:pointer; }
.sk-feedback-types button.is-selected { background:#fff; color:#27204e; box-shadow:0 1px 4px rgba(24,20,63,.12); }
.sk-feedback-types button:focus-visible { outline:2px solid #6f64dd; outline-offset:1px; }
.sk-feedback-rating-row { margin:19px 0 17px; }
.sk-feedback-rating-row > span,.sk-feedback-message-label { display:block; margin-bottom:8px; color:#39445c; font-size:12px; font-weight:730; }
.sk-feedback-rating-row > div { display:grid; grid-template-columns:repeat(11,1fr); gap:4px; }
.sk-feedback-rating-row button { height:30px; padding:0; border:1px solid #e0e2eb; border-radius:7px; background:#fff; color:#59647a; font:inherit; font-size:11px; font-weight:760; cursor:pointer; }
.sk-feedback-rating-row button:hover,.sk-feedback-rating-row button:focus-visible { border-color:#8176e8; color:#5146db; outline:0; }
.sk-feedback-rating-row button.is-selected { border-color:#5146db; background:#5146db; color:#fff; }
.sk-feedback-widget textarea { box-sizing:border-box; display:block; width:100%; min-height:101px; padding:11px 12px; border:1px solid #dfe2eb; border-radius:10px; background:#fff; color:#17203d; font:inherit; font-size:13px; line-height:1.45; resize:vertical; }
.sk-feedback-widget textarea::placeholder { color:#a0a6b5; }
.sk-feedback-widget textarea:focus { border-color:#7166df; outline:0; box-shadow:0 0 0 3px rgba(79,70,229,.1); }
.sk-feedback-attachment { display:flex; align-items:center; gap:7px; min-height:34px; margin-top:9px; color:#59647a; font-size:12px; font-weight:660; }
.sk-feedback-attachment > span:first-child { color:#5146db; font-size:16px; }
.sk-feedback-attachment small { margin-left:auto; color:#9ba2b1; font-size:11px; font-weight:560; }
.sk-feedback-privacy { margin:13px 0 18px; padding:10px 11px; border-radius:9px; background:#f7f7fb; color:#788196; font-size:11px; line-height:1.42; }
.sk-feedback-widget footer { display:flex; justify-content:flex-end; gap:9px; }
.sk-feedback-cancel,.sk-feedback-send { min-height:37px; padding:0 13px; border-radius:9px; font:inherit; font-size:13px; font-weight:720; cursor:pointer; }
.sk-feedback-cancel { border:1px solid #e0e2e9; background:#fff; color:#5f687b; }
.sk-feedback-send { border:1px solid #5146db; background:#5146db; color:#fff; box-shadow:0 4px 10px rgba(79,70,229,.19); }
.sk-feedback-send:disabled { border-color:#dedcf2; background:#dedcf2; box-shadow:none; color:#9d99bf; cursor:not-allowed; }
.sk-feedback-cancel:hover,.sk-feedback-cancel:focus-visible { background:#f7f7fa; outline:0; }
.sk-feedback-send:hover:not(:disabled),.sk-feedback-send:focus-visible:not(:disabled) { border-color:#4036c5; background:#4036c5; outline:0; }
.sk-feedback-sent { padding:28px 6px 10px; text-align:center; }
.sk-feedback-sent > span { display:grid; place-items:center; width:38px; height:38px; margin:0 auto 13px; border-radius:50%; background:#eceaff; color:#4f46d9; font-size:20px; font-weight:800; }
.sk-feedback-sent p { margin:8px 0 20px; color:#6f788c; font-size:13px; }
@media (max-width:560px) { .sk-feedback-widget { padding:20px; border-radius:16px; } .sk-feedback-rating-row > div { gap:3px; } .sk-feedback-rating-row button { height:28px; font-size:10px; } }

/* Final visual pass: tighter widget proportions, clearer score controls, and
   a softer product-level presentation on every viewport. */
.sk-feedback { padding:20px; }
.sk-feedback-backdrop { background:rgba(5, 10, 30, .48); backdrop-filter:blur(6px); }
.sk-feedback-widget { width:min(100%, 452px); max-height:calc(100dvh - 40px); overflow:auto; padding:25px; border-color:rgba(219,222,237,.95); border-radius:20px; box-shadow:0 26px 72px rgba(5,10,31,.32), 0 2px 8px rgba(29,25,89,.08); }
.sk-feedback-widget::before { position:absolute; inset:0 0 auto; height:3px; border-radius:20px 20px 0 0; background:linear-gradient(90deg,#4f46e5,#8075ee 52%,#b4aeff); content:""; }
.sk-feedback-widget-head { margin-bottom:20px; padding-top:2px; }
.sk-feedback-widget-head h2 { font-size:21px; line-height:1.15; }
.sk-feedback-widget-head p { max-width:310px; color:#737d91; }
.sk-feedback-widget-head button { width:34px; height:34px; margin:-3px -5px 0 0; border:1px solid transparent; }
.sk-feedback-widget-head button:hover,.sk-feedback-widget-head button:focus-visible { border-color:#e1dff2; background:#f6f5fc; }
.sk-feedback-types { gap:5px; padding:4px; border:1px solid #ebeaf2; background:#f7f7fb; }
.sk-feedback-types button { min-height:37px; letter-spacing:-.01em; transition:background .15s ease,color .15s ease,box-shadow .15s ease; }
.sk-feedback-types button.is-selected { color:#342a85; box-shadow:0 2px 7px rgba(32,27,91,.12); }
.sk-feedback-rating-row { margin:20px 0 16px; }
.sk-feedback-rating-label { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:9px; }
.sk-feedback-rating-label > span { margin:0; color:#354059; font-size:12px; font-weight:760; }
.sk-feedback-rating-label small { color:#8991a2; font-size:10px; font-weight:600; white-space:nowrap; }
.sk-feedback-rating-row > div { gap:5px; }
.sk-feedback-rating-row button { height:32px; border-color:#e2e4ed; border-radius:8px; color:#5d6880; transition:transform .14s ease,border-color .14s ease,background .14s ease,color .14s ease,box-shadow .14s ease; }
.sk-feedback-rating-row button:hover,.sk-feedback-rating-row button:focus-visible { border-color:#8d84ed; background:#f6f5ff; transform:translateY(-1px); box-shadow:0 4px 9px rgba(79,70,229,.11); }
.sk-feedback-rating-row button.is-selected { border-color:#4f46d9; background:linear-gradient(145deg,#5d53e6,#4037c7); box-shadow:0 5px 11px rgba(79,70,229,.26); transform:translateY(-1px); }
.sk-feedback-rating-row > p { min-height:16px; margin:8px 0 0; color:#818a9d; font-size:11px; line-height:16px; }
.sk-feedback-message-label { margin-bottom:8px; }
.sk-feedback-widget textarea { min-height:108px; padding:12px 13px; border-radius:11px; font-size:13px; }
.sk-feedback-attachment { min-height:39px; margin-top:10px; padding:0 10px; border:1px dashed #d9dbe7; border-radius:9px; background:#fafafd; }
.sk-feedback-attachment > span:first-child { display:grid; place-items:center; width:21px; height:21px; border-radius:6px; background:#eeecff; color:#5046d7; font-size:13px; }
.sk-feedback-privacy { margin:11px 0 17px; padding:9px 10px; border-left:2px solid #c8c3fb; background:#f8f7fd; }
.sk-feedback-widget footer { align-items:center; }
.sk-feedback-cancel,.sk-feedback-send { min-height:39px; padding:0 15px; border-radius:9px; }
.sk-feedback-send { min-width:112px; }
.sk-feedback-sent { padding:30px 7px 13px; }
.sk-feedback-sent > span { width:42px; height:42px; background:linear-gradient(145deg,#eceaff,#dedaff); box-shadow:0 6px 14px rgba(79,70,217,.16); }
@media (max-width:560px) { .sk-feedback { padding:12px; align-items:end; } .sk-feedback-widget { max-height:calc(100dvh - 24px); padding:20px; border-radius:17px; } .sk-feedback-widget::before { border-radius:17px 17px 0 0; } .sk-feedback-widget-head { gap:10px; } .sk-feedback-widget-head p { max-width:270px; } .sk-feedback-rating-label { display:block; } .sk-feedback-rating-label small { display:block; margin-top:3px; } .sk-feedback-rating-row > div { gap:3px; } .sk-feedback-rating-row button { height:29px; border-radius:7px; } .sk-feedback-widget textarea { min-height:92px; } }