.adjective-drag[data-v-adjective-drag] { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; width: 100%; height: 100%; min-height: 0;
}
.adjective-drag__speech[data-v-adjective-drag] { position: absolute; top: 16px; right: 16px; display: grid; place-items: center; border: 0; border-radius: 50%; width: 40px; height: 40px; color: inherit; background: transparent; cursor: pointer;
}
.adjective-drag__speech[data-v-adjective-drag]:hover { background: #0000000d;
}
.adjective-drag__prompt[data-v-adjective-drag] { margin: 0; padding: 0 48px; font-size: clamp(16px, 1.7vw, 21px); font-weight: 700; text-align: center;
}
.adjective-drag__sentence[data-v-adjective-drag] { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; font-size: clamp(19px, 2.5vw, 31px); font-weight: 700;
}
.adjective-drag__space[data-v-adjective-drag] { min-width: 130px; min-height: 58px; padding: 8px 18px; border: 3px dashed #5b6cbb; border-radius: 14px; background: #f1f4ff; color: #3b4892; font: inherit; cursor: pointer; transition: background .15s, border-color .15s;
}
.adjective-drag__space[data-v-adjective-drag]:not(.adjective-drag__space--filled) { font-size: .65em;
}
.adjective-drag__space--filled[data-v-adjective-drag] { border-style: solid;
}
.adjective-drag__space--over[data-v-adjective-drag] { border-color: #197a47; background: #def5e8;
}
.adjective-drag__choices[data-v-adjective-drag] { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px;
}
.adjective-drag__word[data-v-adjective-drag] { position: relative; min-height: 48px; padding: 8px 22px; border: 2px solid #5264ac; border-radius: 13px; color: #33468f; background: white; font: inherit; font-size: clamp(18px, 1.8vw, 25px); font-weight: 700; cursor: grab; touch-action: none; user-select: none;
}
.adjective-drag__word--selected[data-v-adjective-drag] { background: #e6ebff; outline: 3px solid #5264ac; outline-offset: 3px;
}
.adjective-drag__word--moving[data-v-adjective-drag] { z-index: 20; cursor: grabbing; pointer-events: none; box-shadow: 0 5px 18px #0003;
}
.adjective-drag button[data-v-adjective-drag]:focus-visible { outline: 3px solid #e69500; outline-offset: 4px;
}
.adjective-drag button[data-v-adjective-drag]:disabled { cursor: default; opacity: .75;
}
.adjective-drag__help[data-v-adjective-drag] { margin: 0; font-size: 13px; text-align: center;
}
.adjective-drag__hint[data-v-adjective-drag] { margin: 0; color: #b34c00; font-weight: 700;
}