.image-gallery-page {
    padding: 28px 30px 40px;
    color: var(--admin-ink, #17233b);
    background: var(--admin-canvas, #f4f7fb);
    border-radius: 20px;
}
.image-gallery-page .image-gallery-header { position:static; display:flex; align-items:center; gap:20px; width:auto; height:auto; min-height:0; padding:0; margin:0 0 28px; margin-left:0 !important; }
.image-gallery-header__icon { display:grid; place-items:center; flex:0 0 62px; height:62px; border-radius:18px; color:var(--admin-teal, #0f9f90); background:var(--admin-teal-soft, #e8faf7); font-size:27px; }
.image-gallery-page .image-gallery-header h1 { margin:0 0 8px; font-size:30px; line-height:1.2; font-weight:800; color:var(--admin-ink, #17233b); }
.image-gallery-header p { margin:0; color:var(--admin-muted, #64748b); font-size:14px; line-height:1.6; }
.image-gallery-badge { display:inline-flex; align-items:center; gap:8px; margin-left:auto; padding:9px 13px; border:1px solid #c9eae4; border-radius:999px; color:#087f72; background:#e8faf7; font-size:12px; font-weight:700; white-space:nowrap; }
.image-gallery-panel { margin-bottom:20px; padding:24px; border:1px solid var(--admin-line, #e2e8f0); border-radius:var(--admin-radius, 18px); background:var(--admin-card, #fff); box-shadow:0 5px 20px rgba(23,35,59,.035); }
.image-gallery-panel__heading { margin-bottom:20px; }
.image-gallery-page .image-gallery-panel__heading h2 { margin:0 0 6px; font-size:18px; font-weight:800; color:var(--admin-ink, #17233b); }
.image-gallery-panel__heading p { margin:0; color:var(--admin-muted, #64748b); font-size:13px; line-height:1.6; }
.image-gallery-form { display:grid; grid-template-columns:minmax(180px, 1fr) minmax(240px, 1.5fr) auto; align-items:end; gap:18px; }
.image-gallery-form label { display:grid; gap:8px; margin:0; color:#475569; font-size:12px; font-weight:700; }
.image-gallery-page .btn, .question-image-dialog .btn { padding:10px 14px; border-radius:9px; font-size:12px; font-weight:700; }
.image-gallery-page .form-control, .image-gallery-page .form-select,
.question-image-dialog .form-control, .question-image-dialog .form-select { min-height:42px; border:1px solid #dbe3ed; border-radius:9px; color:#17233b; background-color:#fff; font-size:13px; }
.image-gallery-page .form-control:focus, .image-gallery-page .form-select:focus,
.question-image-dialog .form-control:focus, .question-image-dialog .form-select:focus { border-color:#0f9f90; box-shadow:0 0 0 3px rgba(15,159,144,.12); }
.image-gallery-footnote { display:flex; align-items:baseline; gap:9px; margin:6px 2px 0; color:var(--admin-muted, #64748b); font-size:12px; line-height:1.7; }
.image-gallery-footnote i { color:var(--admin-teal, #0f9f90); }
.question-image-dialog { width:min(980px, 94vw); max-height:90vh; overflow:auto; padding:24px; border:1px solid #e2e8f0; border-radius:18px; background:#fff; color:#17233b; box-shadow:0 24px 80px #17233b33; }
.question-image-dialog::backdrop { background:#17233b88; }
.question-image-dialog h2 { margin:20px 0; font-size:22px; }
.question-image-toolbar { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-bottom:18px; }
.question-image-toolbar select { flex:0 1 230px; width:auto; }
.question-image-toolbar input[type="search"] { flex:1 1 220px; width:auto; }
.question-image-toolbar .btn { margin-left:auto; white-space:nowrap; }
.question-image-upload { display:flex; align-items:center; flex-wrap:wrap; gap:16px; padding:20px; margin-bottom:20px; border:1px dashed #b3d8d2; border-radius:12px; background:#f4fbf9; }
.question-image-upload__intro { flex:1 1 260px; }
.question-image-upload__intro strong { display:block; margin-bottom:5px; color:#17233b; font-size:13px; }
.question-image-upload__intro span { display:block; color:#64748b; font-size:12px; line-height:1.6; }
.question-image-upload input[type="file"] { flex:0 1 300px; max-width:100%; font-size:12px; color:#475569; }
.question-image-upload input[type="file"]::file-selector-button { margin-right:10px; padding:9px 12px; border:1px solid #d4e5e0; border-radius:8px; color:#087f72; background:#fff; cursor:pointer; font-weight:700; }
.question-image-status:empty { display:none; }
.question-image-status { padding:12px 15px; margin:0 0 18px; border-radius:9px; background:#f1f5f9; color:#475569; font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.question-image-status[data-state="error"] { color:#a32232; background:#fff0f2; }
.question-image-status[data-state="success"] { color:#087f72; background:#e8faf7; }
.question-image-status[data-state="busy"] { display:flex; align-items:center; gap:12px; color:#087f72; background:#e8faf7; border:1px solid #b3d8d2; font-weight:600; }
.question-image-status[data-state="busy"]::before { content:""; flex:0 0 20px; width:20px; height:20px; border:3px solid #b3d8d2; border-top-color:#087f72; border-radius:50%; animation:question-image-spin .9s linear infinite; }
.question-image-upload :disabled { opacity:.55; cursor:not-allowed; }
@keyframes question-image-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .question-image-status[data-state="busy"]::before { animation:none; } }
.question-image-results { margin:0 0 14px; color:#64748b; font-size:12px; font-weight:600; }
.question-image-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(205px, 1fr)); gap:18px; margin:0; }
.question-image-card { display:flex; flex-direction:column; gap:12px; min-width:0; padding:14px; overflow:hidden; border:1px solid #e2e8f0; border-radius:13px; background:#fff; transition:border-color .15s ease, box-shadow .15s ease; }
.question-image-card:hover { border-color:#b5d9d2; box-shadow:0 6px 20px #17233b0a; }
.question-image-card img { width:100%; height:145px; padding:18px; object-fit:contain; border-radius:9px; background:linear-gradient(135deg, #f8fafc, #eef3f7); }
.question-image-card input { width:100%; }
.question-image-card button { max-width:100%; white-space:normal; }
.question-image-card span { display:block; overflow-wrap:anywhere; }
.question-image-card .question-image-usage { margin:0; color:#64748b; font-size:11px; line-height:1.6; }
.question-image-card__actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; }
.question-image-card__actions .btn { flex:1; padding:8px 10px; font-size:11px; }
.question-image-choice { display:block; width:100%; padding:0; border:0; border-radius:9px; color:#17233b; background:transparent; text-align:left; cursor:pointer; }
.question-image-choice span { margin-top:12px; font-size:13px; font-weight:700; }
.question-image-choice:focus-visible { outline:3px solid #0f9f90; outline-offset:5px; }
.question-image-empty { grid-column:1 / -1; padding:50px 20px; border:1px dashed #dbe3ed; border-radius:12px; background:#f8fafc; text-align:center; }
.question-image-empty strong { display:block; color:#475569; font-size:15px; }
.question-image-empty p { margin:8px 0 0; color:#64748b; font-size:13px; }
[data-question-image] img { display:block; max-width:160px; max-height:100px; object-fit:contain; margin:8px 0; }
[data-question-image][hidden], [data-question-image] img[hidden], .question-image-upload[hidden], .question-image-toolbar [hidden] { display:none; }
@media (max-width:1100px) {
    .image-gallery-badge { display:none; }
    .image-gallery-form { grid-template-columns:1fr 1fr; }
    .image-gallery-form > .btn { justify-self:start; }
}
@media (max-width:640px) {
    .image-gallery-page { padding:20px 12px 28px; border-radius:12px; }
    .image-gallery-header { align-items:flex-start; gap:12px; }
    .image-gallery-header__icon { flex-basis:44px; height:44px; border-radius:12px; font-size:20px; }
    .image-gallery-page .image-gallery-header h1 { font-size:24px; }
    .image-gallery-panel { padding:18px 14px; }
    .image-gallery-form { grid-template-columns:1fr; gap:14px; }
    .question-image-toolbar > select, .question-image-toolbar > input[type="search"] { flex:1 1 100%; width:100%; }
    .question-image-toolbar .btn { margin-left:0; }
    .question-image-upload { padding:16px; gap:12px; }
    .question-image-grid { grid-template-columns:repeat(auto-fill, minmax(165px, 1fr)); gap:12px; }
    .question-image-dialog { padding:18px; }
}