html:has(.reputon-playground),
body:has(.reputon-playground){
  overflow-x:clip;
}

.reputon-playground{
  --pg-ink:#211c19;
  --pg-muted:#7f756f;
  --pg-line:rgba(93,72,61,.12);
  --pg-orange:#f04a17;
  --pg-green:#3f9565;
  width:min(1380px,calc(100% - 56px));
  margin:96px auto;
  padding:74px 58px 34px;
  overflow:visible;
  border:1px solid rgba(97,74,63,.09);
  border-radius:30px;
  background:
    radial-gradient(circle at 62% 12%,rgba(201,184,226,.21),transparent 29%),
    radial-gradient(circle at 13% 78%,rgba(245,207,190,.19),transparent 30%),
    linear-gradient(145deg,#f9f6f1,#f3eee8);
  box-shadow:0 34px 80px rgba(67,48,38,.09),inset 0 1px 0 rgba(255,255,255,.9);
}

.reputon-playground__head{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.72fr);
  align-items:end;
  gap:70px;
  margin-bottom:48px;
}

.reputon-playground__head h2{
  max-width:780px;
  margin:14px 0 0;
  color:var(--pg-ink);
  font-family:'Dela Gothic One',sans-serif;
  font-size:clamp(38px,4vw,62px);
  line-height:1.06;
  letter-spacing:0;
}

.reputon-playground__intro p{
  margin:0;
  color:var(--pg-muted);
  font-size:16px;
  line-height:1.65;
}

.reputon-playground__intro > span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:17px;
  padding:7px 10px;
  border:1px solid rgba(82,65,54,.1);
  border-radius:999px;
  background:rgba(255,255,255,.64);
  color:#6e625b;
  font-size:10px;
  font-weight:600;
  text-transform:uppercase;
}

.reputon-playground__intro i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--pg-orange);
  box-shadow:0 0 0 4px rgba(240,74,23,.09);
}

.reputon-playground__shell{
  display:grid;
  grid-template-columns:minmax(0,46fr) minmax(72px,8fr) minmax(0,46fr);
  min-height:760px;
  overflow:visible;
  border:1px solid rgba(96,74,62,.11);
  border-radius:25px;
  background:rgba(255,255,255,.5);
  box-shadow:0 26px 65px rgba(73,52,41,.1),inset 0 1px 0 rgba(255,255,255,.92);
}

.reputon-playground__input,
.reputon-playground__output{
  min-width:0;
  padding:26px;
}

.reputon-playground__input{
  border-radius:24px 0 0 24px;
  border-right:1px solid rgba(99,78,65,.08);
  background:rgba(255,253,250,.68);
}

.reputon-playground__output{
  position:relative;
  align-self:stretch;
  border-radius:0 24px 24px 0;
  border-left:1px solid rgba(99,78,65,.08);
  background:
    radial-gradient(circle at 72% 17%,rgba(198,177,222,.14),transparent 32%),
    rgba(250,247,252,.66);
}

.playground-output-workspace{
  position:sticky;
  top:88px;
}

.playground-panel-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  margin-bottom:20px;
  color:#7a6f69;
  font:600 9px/1.2 "SFMono-Regular",Consolas,monospace;
  letter-spacing:.06em;
}

.playground-panel-head small{
  color:#aaa09a;
  font:inherit;
}

.playground-source{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
  margin-bottom:15px;
}

.playground-source > button{
  min-width:0;
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:5px 7px;
  border:1px solid var(--pg-line);
  border-radius:11px;
  background:rgba(255,255,255,.68);
  color:#766b65;
  font:600 10px/1 'Geologica',sans-serif;
  cursor:pointer;
  transition:transform .2s ease,border-color .2s ease,background .2s ease,color .2s ease,box-shadow .2s ease;
}

.playground-source > button:hover{transform:translateY(-1px);background:#fff}
.playground-source > button.is-active{
  border-color:rgba(240,74,23,.36);
  background:linear-gradient(145deg,#fff,#fff3ed);
  color:#28211d;
  box-shadow:0 8px 20px rgba(101,65,47,.08);
}

.playground-source .source-brand-icon{
  width:26px;
  height:26px;
  flex-basis:26px;
  border-radius:7px;
}

.playground-source .source-brand-icon img{width:17px;height:17px}
.playground-source .source-brand-icon--gis img{width:18px;height:18px}
.playground-source .source-brand-icon--avito img{width:18px;height:17px}

.playground-source__manual{
  width:26px;
  height:26px;
  flex:0 0 26px;
  display:grid;
  place-items:center;
  border:1px solid rgba(113,93,124,.12);
  border-radius:7px;
  background:#fff;
}

.playground-source__manual svg{
  width:15px;
  height:15px;
  fill:none;
  stroke:#746a76;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.playground-review{
  padding:17px;
  border:1px solid var(--pg-line);
  border-radius:17px;
  background:rgba(255,255,255,.83);
  box-shadow:0 12px 30px rgba(76,53,42,.055),inset 0 1px 0 #fff;
}

.playground-field-label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:9px;
}

.playground-field-label label{
  color:#433a35;
  font-size:12px;
  font-weight:600;
}

.playground-field-label span{
  color:#9a8f89;
  font:500 9px/1 "SFMono-Regular",Consolas,monospace;
}

.playground-review textarea{
  width:100%;
  min-height:112px;
  display:block;
  resize:vertical;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#29221e;
  font:400 14px/1.6 'Geologica',sans-serif;
}

.playground-review:focus-within{
  border-color:rgba(240,74,23,.32);
  box-shadow:0 0 0 3px rgba(240,74,23,.055),0 12px 30px rgba(76,53,42,.055);
}

.playground-review__actions{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding-top:11px;
  border-top:1px solid rgba(94,73,61,.08);
}

.playground-review__actions button{
  min-height:32px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0;
  border:0;
  background:none;
  color:#847871;
  font:500 10px/1 'Geologica',sans-serif;
  cursor:pointer;
}

.playground-review__actions button:last-child{color:#4b403a;font-weight:600}
.playground-review__actions svg{
  width:13px;
  height:13px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.playground-review__actions span{color:var(--pg-orange)}

.playground-examples,
.playground-presets,
.playground-policy-list,
.playground-result__quick{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.playground-examples{margin:12px 0 22px}

.playground-examples button,
.playground-presets button,
.playground-result__quick button{
  min-height:34px;
  padding:0 12px;
  border:1px solid rgba(95,73,61,.1);
  border-radius:999px;
  background:rgba(255,255,255,.61);
  color:#746963;
  font:500 10px/1 'Geologica',sans-serif;
  cursor:pointer;
  transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease;
}

.playground-examples button:hover,
.playground-presets button:hover,
.playground-result__quick button:hover{transform:translateY(-1px);background:#fff}

.playground-examples button.is-active,
.playground-presets button.is-active{
  border-color:rgba(240,74,23,.31);
  background:#fff4ef;
  color:#d94314;
}

.playground-tone,
.playground-policies{
  padding:18px;
  border:1px solid rgba(95,73,61,.09);
  border-radius:18px;
  background:rgba(255,255,255,.5);
}

.playground-policies{margin-top:13px}

.playground-subhead{
  display:flex;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}

.playground-subhead > div{display:flex;flex-direction:column;gap:5px}
.playground-subhead span{
  color:#9b8f88;
  font:600 8px/1 "SFMono-Regular",Consolas,monospace;
}
.playground-subhead strong{color:#352d28;font-size:12px}
.playground-subhead small{color:#a0958f;font-size:9px}

.playground-tone-pad{
  --tone-x:72%;
  --tone-y:35%;
  position:relative;
  height:126px;
  margin:0 3px 14px;
  border:1px solid rgba(102,81,91,.11);
  border-radius:16px;
  background:
    radial-gradient(circle at 100% 50%,rgba(246,193,167,.3),transparent 55%),
    radial-gradient(circle at 50% 100%,rgba(194,173,220,.27),transparent 58%),
    linear-gradient(145deg,#fbfaf7,#f5f0f7);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
  cursor:crosshair;
  touch-action:none;
}

.playground-tone-pad::before,
.playground-tone-pad::after{
  content:"";
  position:absolute;
  pointer-events:none;
  background:rgba(91,73,82,.08);
}
.playground-tone-pad::before{left:50%;top:10px;bottom:10px;width:1px}
.playground-tone-pad::after{top:50%;left:10px;right:10px;height:1px}

.playground-tone-pad__label{
  position:absolute;
  z-index:1;
  color:#8e838a;
  font-size:8px;
  pointer-events:none;
}
.playground-tone-pad__label.is-left{left:11px;top:50%;transform:translateY(-50%)}
.playground-tone-pad__label.is-right{right:11px;top:50%;transform:translateY(-50%)}
.playground-tone-pad__label.is-top{top:8px;left:50%;transform:translateX(-50%)}
.playground-tone-pad__label.is-bottom{bottom:8px;left:50%;transform:translateX(-50%)}

.playground-tone-pad__marker{
  position:absolute;
  z-index:2;
  left:var(--tone-x);
  top:var(--tone-y);
  width:28px;
  height:28px;
  padding:0;
  border:5px solid #fff;
  border-radius:50%;
  background:var(--pg-orange);
  box-shadow:0 7px 18px rgba(122,68,45,.22),0 0 0 1px rgba(240,74,23,.18);
  transform:translate(-50%,-50%);
  cursor:grab;
  transition:left .32s cubic-bezier(.22,.75,.25,1),top .32s cubic-bezier(.22,.75,.25,1),transform .2s ease;
}
.playground-tone-pad__marker:active{cursor:grabbing;transform:translate(-50%,-50%) scale(1.08)}
.playground-tone-pad__marker:focus-visible{outline:3px solid rgba(240,74,23,.28);outline-offset:3px}
.playground-tone-pad.is-dragging .playground-tone-pad__marker{transition:none}
.playground-tone-pad__marker:hover{
  box-shadow:0 9px 22px rgba(122,68,45,.28),0 0 0 5px rgba(240,74,23,.08);
  transform:translate(-50%,-50%) scale(1.06);
}
.playground-tone-pad.is-dragging{cursor:grabbing}
.playground-tone-pad.is-dragging .playground-tone-pad__marker{cursor:grabbing}
.playground-tone-pad.is-untried .playground-tone-pad__marker::after{
  content:"";
  position:absolute;
  inset:-9px;
  border:1px solid rgba(240,74,23,.28);
  border-radius:50%;
  animation:playgroundToneRipple 1.7s ease-out 2;
}
.playground-tone-pad.is-untried:hover .playground-tone-pad__marker{animation:playgroundToneNudge .5s ease 1}

.playground-tone-hint{
  margin:-3px 3px 13px;
  color:#8d8188;
  font-size:9px;
  line-height:1.45;
  transition:opacity .3s ease,color .3s ease;
}
.playground-tone-hint.is-used{opacity:.45}

.playground-policy-list button{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 11px;
  border:1px solid rgba(95,73,61,.1);
  border-radius:11px;
  background:rgba(255,255,255,.58);
  color:#746963;
  font:500 9px/1.2 'Geologica',sans-serif;
  cursor:pointer;
}

.playground-policy-list button i{
  width:8px;
  height:8px;
  border:1px solid #b8ada7;
  border-radius:50%;
}

.playground-policy-list button.is-active{
  border-color:rgba(63,149,101,.24);
  background:#f2faf5;
  color:#3b6f50;
}
.playground-policy-list button.is-active i{border-color:#54a576;background:#54a576;box-shadow:inset 0 0 0 2px #f2faf5}

.playground-policy-list button.is-handoff{
  border-color:rgba(145,115,174,.15);
  color:#6d587d;
}
.playground-policy-list button.is-handoff.is-active{background:#f4eff9;border-color:rgba(145,115,174,.32)}
.playground-policy-list svg{
  width:14px;
  height:14px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.playground-advanced{margin-top:12px;border-top:1px solid rgba(95,73,61,.08)}
.playground-advanced summary{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#685d57;
  font-size:10px;
  font-weight:600;
  cursor:pointer;
  list-style:none;
}
.playground-advanced summary::-webkit-details-marker{display:none}
.playground-advanced summary span{color:var(--pg-orange);font-size:17px;transition:transform .2s ease}
.playground-advanced[open] summary span{transform:rotate(45deg)}

.playground-advanced__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  padding:4px 0 8px;
}
.playground-advanced label{display:flex;flex-direction:column;gap:6px;color:#81756f;font-size:9px}
.playground-advanced input,
.playground-advanced select{
  width:100%;
  height:38px;
  padding:0 10px;
  border:1px solid rgba(94,72,61,.12);
  border-radius:9px;
  outline:0;
  background:#fff;
  color:#332a26;
  font:400 10px/1 'Geologica',sans-serif;
}
.playground-advanced input:focus,
.playground-advanced select:focus{border-color:rgba(240,74,23,.36);box-shadow:0 0 0 3px rgba(240,74,23,.06)}

.playground-generate{
  width:100%;
  min-height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:16px;
  padding:0 20px;
  border:0;
  border-radius:13px;
  background:#191613;
  color:#fff;
  box-shadow:0 15px 30px rgba(25,20,16,.17);
  font:600 12px/1 'Geologica',sans-serif;
  cursor:pointer;
  transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease;
}
.playground-generate:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 18px 35px rgba(25,20,16,.22)}
.playground-generate:disabled{cursor:not-allowed;opacity:.62}
.playground-generate svg{width:18px;height:18px;fill:none;stroke:var(--pg-orange);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.playground-generate:focus-visible{outline:3px solid rgba(240,74,23,.3);outline-offset:3px}

.playground-progress{
  height:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  overflow:hidden;
  opacity:0;
  color:#a0958e;
  font:600 8px/1 "SFMono-Regular",Consolas,monospace;
  transition:height .25s ease,opacity .25s ease,margin .25s ease;
}
.reputon-playground.is-processing .playground-progress{height:20px;margin-top:10px;opacity:1}
.playground-progress i{width:22px;height:1px;background:#d9cfca}
.playground-progress span.is-active{color:var(--pg-orange)}
.playground-progress span.is-done{color:var(--pg-green)}

.reputon-playground__bridge{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,rgba(247,241,249,.68),rgba(249,244,239,.7));
}
.reputon-playground__bridge > svg{position:absolute;inset:70px 24% 70px;width:52%;height:calc(100% - 140px);overflow:visible}
.playground-bridge__path{fill:none;stroke:rgba(144,120,158,.22);stroke-width:1.2;stroke-dasharray:3 5}
.playground-bridge__signal{
  fill:var(--pg-orange);
  opacity:0;
  filter:drop-shadow(0 0 5px rgba(240,74,23,.38));
}
.reputon-playground.is-processing .playground-bridge__signal{opacity:1;animation:playgroundSignal 1.45s ease-in-out infinite}

.playground-bridge__mark{
  position:relative;
  z-index:2;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border:1px solid rgba(132,103,150,.18);
  border-radius:16px;
  background:linear-gradient(145deg,#fff,#f1e9f5);
  box-shadow:0 15px 34px rgba(91,65,103,.13),inset 0 1px 0 #fff;
}
.playground-bridge__mark img{width:25px;height:25px}
.reputon-playground.is-processing .playground-bridge__mark::after{
  content:"";
  position:absolute;
  inset:-8px;
  border:1px solid rgba(240,74,23,.2);
  border-radius:20px;
  animation:playgroundRipple 1.3s ease-out infinite;
}

.playground-bridge__steps{
  position:absolute;
  top:50%;
  left:50%;
  display:flex;
  flex-direction:column;
  gap:70px;
  transform:translate(-50%,-50%);
  color:#aaa0aa;
  font:600 7px/1 "SFMono-Regular",Consolas,monospace;
  pointer-events:none;
}
.playground-bridge__steps span{transition:color .22s ease,transform .22s ease,opacity .22s ease}
.playground-bridge__steps span.is-active{color:var(--pg-orange);opacity:1;transform:scale(1.08)}
.playground-bridge__steps span.is-done{color:var(--pg-green)}

.playground-empty{
  min-height:650px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:45px;
  text-align:center;
}
.playground-empty[hidden]{display:none}
.playground-empty__icon{
  position:relative;
  width:78px;
  height:78px;
  display:grid;
  place-items:center;
  margin-bottom:24px;
  border:1px solid rgba(132,104,149,.13);
  border-radius:25px;
  background:linear-gradient(145deg,#fff,#f0e8f4);
  box-shadow:0 20px 45px rgba(88,65,98,.11),inset 0 1px 0 #fff;
}
.playground-empty__icon img{width:34px;height:34px}
.playground-empty__icon i{position:absolute;right:8px;bottom:8px;width:9px;height:9px;border:2px solid #fff;border-radius:50%;background:var(--pg-orange)}
.playground-empty h3{margin:0;color:#30282e;font-size:19px;letter-spacing:0}
.playground-empty p{max-width:290px;margin:11px 0 0;color:#8d828b;font-size:12px;line-height:1.55}
.playground-error-retry{
  min-height:40px;
  margin-top:18px;
  padding:0 16px;
  border:1px solid rgba(240,74,23,.23);
  border-radius:10px;
  background:#fff5ef;
  color:#c53f16;
  font:600 10px/1 'Geologica',sans-serif;
  cursor:pointer;
}
.playground-error-retry[hidden]{display:none}

.playground-result[hidden]{display:none}
.playground-result{padding:15px 4px 4px;transition:opacity .25s ease,transform .25s ease}
.playground-result.is-updating{opacity:.7;transform:translateY(2px)}
.playground-result__head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 18px 20px}
.playground-result__head > div{display:flex;flex-direction:column;gap:5px}
.playground-result__head span{color:#cf481d;font:700 9px/1 "SFMono-Regular",Consolas,monospace}
.playground-result__head small{color:#9a8f98;font:500 7px/1 "SFMono-Regular",Consolas,monospace}
.playground-result__head > b{padding:7px 10px;border-radius:999px;background:#eaf5ee;color:#367650;font-size:9px}
.reputon-playground.is-handoff-result .playground-result__head > b{background:#f1ebf6;color:#745b88}

.playground-result__notice{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin:0 18px 14px;
  padding:13px;
  border:1px solid rgba(129,100,151,.15);
  border-radius:12px;
  background:#f5f0f8;
  color:#6f5d79;
  font-size:10px;
  line-height:1.45;
}
.playground-result__notice[hidden]{display:none}
.playground-result__notice svg{width:17px;height:17px;flex:0 0 17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

.playground-result__text{
  min-height:176px;
  margin:0 18px;
  padding:24px;
  border:1px solid rgba(96,74,99,.1);
  border-radius:18px;
  background:rgba(255,255,255,.8);
  color:#30282d;
  font-size:15px;
  line-height:1.72;
  box-shadow:0 15px 35px rgba(72,52,79,.07),inset 0 1px 0 #fff;
}
.playground-result__text span{display:inline;opacity:0;animation:playgroundFragment .36s ease forwards}
.playground-result__text span:nth-child(2){animation-delay:.09s}
.playground-result__text span:nth-child(3){animation-delay:.18s}

.playground-result__meta{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  margin:14px 18px;
  overflow:hidden;
  border:1px solid rgba(96,74,99,.09);
  border-radius:12px;
  background:rgba(96,74,99,.08);
}
.playground-result__meta span{display:flex;flex-direction:column;gap:5px;padding:12px;background:rgba(255,255,255,.8);color:#948992;font-size:8px}
.playground-result__meta b{color:#51464e;font-size:9px}

.playground-result__quick{margin:0 18px}
.playground-result__quick button{min-height:38px;background:rgba(255,255,255,.75)}
.playground-result__quick button.is-feedback{
  border-color:rgba(240,74,23,.28);
  background:#fff3ed;
  color:#cf481d;
  transform:translateY(-1px);
}
.playground-result__quick-status{
  min-height:14px;
  display:block;
  margin:7px 18px 0;
  color:#8d8189;
  font-size:9px;
}

.playground-considered{
  margin:12px 18px 0;
  padding:15px;
  border:1px solid rgba(104,80,111,.1);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(244,238,248,.62));
}
.playground-considered__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:11px;
}
.playground-considered__head span{color:#3d343a;font-size:11px;font-weight:650}
.playground-considered__head small{color:#a095a1;font:600 7px/1 "SFMono-Regular",Consolas,monospace}
.playground-considered__list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}
.playground-considered__item{
  min-width:0;
  display:flex;
  align-items:flex-start;
  gap:7px;
  padding:9px;
  border:1px solid rgba(101,79,107,.08);
  border-radius:10px;
  background:rgba(255,255,255,.66);
  color:#70656e;
  font-size:9px;
  line-height:1.35;
}
.playground-considered__item svg{
  width:13px;
  height:13px;
  flex:0 0 13px;
  fill:none;
  stroke:#8b70a0;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.playground-copy-row{
  min-height:46px;
  display:flex;
  align-items:center;
  gap:12px;
  margin:12px 18px 4px;
}
.playground-copy-row button{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0 13px;
  border:1px solid rgba(92,70,96,.12);
  border-radius:10px;
  background:#fff;
  color:#4c4149;
  font:600 10px/1 'Geologica',sans-serif;
  cursor:pointer;
}
.playground-copy-row svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.playground-copy-row small{color:var(--pg-green);font-size:9px}
.playground-copy-row button .is-check{display:none;stroke:#3f9565;stroke-width:2}
.playground-copy-row button.is-copied{border-color:rgba(63,149,101,.24);background:#f1f8f3;color:#397b55}
.playground-copy-row button.is-copied .is-copy{display:none}
.playground-copy-row button.is-copied .is-check{display:block}

.playground-result__cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-top:18px;
  padding:20px;
  border:1px solid rgba(94,72,61,.09);
  border-radius:17px;
  background:linear-gradient(145deg,#fffaf5,#f5eef9);
  opacity:0;
  transform:translateY(8px);
  animation:playgroundCtaIn .42s .18s ease forwards;
}
.playground-result__cta > div{display:flex;flex-direction:column;gap:5px}
.playground-result__cta strong{color:#332b27;font-size:12px}
.playground-result__cta span{color:#8b8088;font-size:9px}
.playground-result__cta a:first-child{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 13px;border-radius:9px;background:#1b1714;color:#fff;font-size:9px;text-decoration:none}
.playground-result__cta a:last-child{color:#574b53;font-size:9px;text-decoration:underline;text-underline-offset:3px}

.reputon-playground__note{
  max-width:850px;
  margin:22px 4px 0;
  color:#90847e;
  font-size:10px;
  line-height:1.55;
}

@keyframes playgroundSignal{
  0%{transform:translateY(0);opacity:0}
  12%{opacity:1}
  88%{opacity:1}
  100%{transform:translateY(292px);opacity:0}
}
@keyframes playgroundRipple{
  from{transform:scale(.8);opacity:.7}
  to{transform:scale(1.45);opacity:0}
}
@keyframes playgroundFragment{
  from{opacity:0;transform:translateY(5px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes playgroundToneRipple{
  0%{opacity:.65;transform:scale(.65)}
  100%{opacity:0;transform:scale(1.25)}
}
@keyframes playgroundToneNudge{
  0%,100%{transform:translate(-50%,-50%)}
  45%{transform:translate(calc(-50% + 3px),calc(-50% - 2px))}
}
@keyframes playgroundCtaIn{
  to{opacity:1;transform:translateY(0)}
}

.reputon-playground button:focus-visible,
.reputon-playground summary:focus-visible{
  outline:2px solid rgba(240,74,23,.48);
  outline-offset:3px;
}

@media (max-width:1100px){
  .reputon-playground{width:calc(100% - 36px);padding:64px 34px 30px}
  .reputon-playground__head{gap:40px}
  .reputon-playground__shell{grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr)}
  .reputon-playground__input,.reputon-playground__output{padding:20px}
  .playground-source > button span:last-child{display:none}
  .playground-source > button{padding-inline:5px}
  .playground-result__cta{align-items:flex-start;flex-direction:column}
}

@media (max-width:820px){
  .reputon-playground{padding:58px 26px 28px}
  .reputon-playground__head{grid-template-columns:1fr;align-items:start;gap:22px}
  .reputon-playground__head h2{font-size:42px}
  .reputon-playground__intro{max-width:620px}
  .reputon-playground__shell{grid-template-columns:1fr}
  .reputon-playground__input{border:0;border-radius:19px 19px 0 0}
  .reputon-playground__output{border:0;border-radius:0 0 19px 19px}
  .playground-output-workspace{position:static;max-height:none;overflow:visible}
  .reputon-playground__bridge{height:112px;border-top:1px solid rgba(99,78,65,.08);border-bottom:1px solid rgba(99,78,65,.08)}
  .reputon-playground__bridge > svg{inset:10px auto;width:100%;height:92px;transform:rotate(0)}
  .reputon-playground.is-processing .playground-bridge__signal{animation-name:playgroundSignalMobile}
  .playground-bridge__steps{height:84px;justify-content:space-between;gap:0}
  .playground-bridge__mark{width:44px;height:44px}
  .playground-empty{min-height:430px}
}

@keyframes playgroundSignalMobile{
  0%{transform:translateY(0);opacity:0}
  15%{opacity:1}
  85%{opacity:1}
  100%{transform:translateY(78px);opacity:0}
}

@media (max-width:520px){
  .reputon-playground{
    width:calc(100% - 20px);
    margin:68px auto;
    padding:46px 10px 22px;
    border-radius:24px;
  }
  .reputon-playground__head{padding:0 8px;margin-bottom:30px}
  .reputon-playground__head h2{font-size:31px}
  .reputon-playground__intro p{font-size:14px}
  .reputon-playground__shell{border-radius:20px}
  .reputon-playground__input,.reputon-playground__output{padding:17px 12px}
  .playground-panel-head{font-size:8px}
  .playground-source{gap:5px}
  .playground-source > button{min-height:46px}
  .playground-source .source-brand-icon,.playground-source__manual{width:28px;height:28px;flex-basis:28px}
  .playground-review{padding:15px}
  .playground-review textarea{min-height:130px;font-size:14px}
  .playground-examples button,.playground-presets button,.playground-result__quick button{min-height:44px;padding:0 13px}
  .playground-tone,.playground-policies{padding:15px}
  .playground-tone-pad{height:142px}
  .playground-tone-pad__marker{width:32px;height:32px}
  .playground-policy-list button{min-height:44px;padding:0 12px}
  .playground-advanced__grid{grid-template-columns:1fr}
  .playground-advanced input,.playground-advanced select{height:44px}
  .playground-generate{min-height:54px}
  .playground-result{padding-top:5px}
  .playground-result__head{padding-inline:10px}
  .playground-result__text{min-height:165px;margin-inline:10px;padding:20px;font-size:14px}
  .playground-result__notice,.playground-result__meta,.playground-result__quick,.playground-copy-row{margin-inline:10px}
  .playground-result__quick-status,.playground-considered{margin-inline:10px}
  .playground-considered__list{grid-template-columns:1fr}
  .playground-result__meta{grid-template-columns:1fr}
  .playground-result__meta span{flex-direction:row;justify-content:space-between}
  .playground-result__cta{margin-inline:0;padding:17px}
  .playground-result__cta a:first-child{min-height:44px}
  .playground-empty{min-height:350px;padding:35px 20px}
  .reputon-playground__note{padding:0 8px}
}

@media (prefers-reduced-motion:reduce){
  .reputon-playground *,
  .reputon-playground *::before,
  .reputon-playground *::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}
