/* pot-001 도장과 드래그 바 */
.judging { margin: 10px 0 18px; }
.stamps { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.stamp {
  border: 4px dashed var(--line); background: var(--paper); border-radius: 50%; aspect-ratio: 1; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 0;
  max-width: 170px; width: 100%; justify-self: center; transition: transform .1s, background .2s, border-color .2s;
  color: var(--ink-2); box-shadow: 0 6px 0 var(--line);
}
.stamp:active { transform: scale(.96); }
.stamp-emoji { font-size: 40px; }
.stamp-label { font-size: 30px; font-family: var(--font); }
.stamp-guilty.on { background: var(--guilty-soft); border: 4px solid var(--guilty); color: var(--guilty); box-shadow: 0 6px 0 #f2b4ad; }
.stamp-innocent.on { background: var(--innocent-soft); border: 4px solid var(--innocent); color: var(--innocent); box-shadow: 0 6px 0 #a9cdf3; }
.stamp.thud { animation: thud .35s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes thud {
  0% { transform: scale(1.35) rotate(-12deg); opacity: .4; }
  60% { transform: scale(.92) rotate(3deg); opacity: 1; }
  100% { transform: scale(1) rotate(0); }
}
.sentence-box {
  max-height: 0; overflow: hidden; opacity: 0; transition: max-height .35s ease, opacity .25s ease, margin .3s;
  background: var(--paper); border: 2px solid var(--line); border-radius: 20px; padding: 0 16px;
}
.sentence-box.open { max-height: 320px; opacity: 1; margin: 18px 0 6px; padding: 16px; }
.sentence-q { font-family: var(--font); font-size: 18px; text-align: center; }
.item-preview { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 10px 0 6px; min-height: 76px; }
.item-emoji { font-size: 60px; line-height: 1; }
.item-emoji.pop { animation: pop .25s ease; }
@keyframes pop { 40% { transform: scale(1.18) rotate(-6deg); } }
.amount-text { font-family: var(--font); font-size: 30px; color: var(--guilty); font-variant-numeric: tabular-nums; }
.item-label { font-family: var(--font); font-size: 17px; color: var(--bean-2); }
.range-ends { display: flex; justify-content: space-between; font-size: 13px; color: var(--ink-2); }
.gavel-slider {
  -webkit-appearance: none; appearance: none; width: 100%; height: 16px; border-radius: 999px; margin: 14px 0 6px;
  background: linear-gradient(90deg, var(--butter) 0 var(--pct, 30%), var(--cream-2) var(--pct, 30%) 100%);
  border: 2px solid var(--line); outline: none;
}
.gavel-slider::-webkit-slider-thumb {
  -webkit-appearance: none; width: 46px; height: 46px; border: 0; background: transparent no-repeat center / contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='22' fill='%23fff8ec' stroke='%236b3f2a' stroke-width='3'/%3E%3Cg transform='rotate(-35 24 24)'%3E%3Crect x='21' y='20' width='6' height='20' rx='3' fill='%238a5a3b'/%3E%3Crect x='12' y='10' width='24' height='12' rx='4' fill='%236b3f2a'/%3E%3Crect x='12' y='14' width='24' height='3' fill='%23f6c85f'/%3E%3C/g%3E%3C/svg%3E");
  cursor: grab;
}
.gavel-slider::-moz-range-thumb {
  width: 46px; height: 46px; border: 0; background: transparent no-repeat center / contain; cursor: grab;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='22' fill='%23fff8ec' stroke='%236b3f2a' stroke-width='3'/%3E%3Cg transform='rotate(-35 24 24)'%3E%3Crect x='21' y='20' width='6' height='20' rx='3' fill='%238a5a3b'/%3E%3Crect x='12' y='10' width='24' height='12' rx='4' fill='%236b3f2a'/%3E%3Crect x='12' y='14' width='24' height='3' fill='%23f6c85f'/%3E%3C/g%3E%3C/svg%3E");
}
.submit-btn { margin-top: 14px; font-size: 22px; padding: 16px; }
