/* Gallery layout uses the shared MathFlu typography, controls and colors. */
.gallery-shell { max-width: 1200px; margin: auto; padding: clamp(16px, 3vw, 40px); }
.gallery-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.gallery-heading h1 { font-size: 1.75rem; margin: .2em 0; }
.gallery-eyebrow { letter-spacing: .09em; color: var(--mk-muted); font-size: .75rem; }
.gallery-page button, .gallery-upload { min-height: 44px; }
.gallery-page button:disabled { cursor: not-allowed; }
.gallery-page input, .gallery-page select, .gallery-page textarea { font: inherit; font-size: 16px; max-width: 100%; padding: 9px; border: 1px solid #bac9dd; border-radius: 8px; }
.gallery-page label { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.gallery-page textarea { width: 100%; }
.gallery-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin: 22px 0; }
.gallery-tabs button[aria-pressed=true], .gallery-tabs button[aria-pressed=true]:hover { background: var(--mk-blue); border-color: var(--mk-blue); color: white; }
.gallery-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(235px, 100%), 1fr)); gap: 20px; }
.gallery-card { background: white; border: 1px solid var(--mk-line); border-radius: var(--mk-radius); overflow: hidden; padding: 12px; }
.gallery-card-title { cursor: grab; touch-action: none; }
.gallery-dragging { opacity: .55; outline: 2px solid var(--mk-blue); }
.gallery-list-card { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.gallery-card.gallery-list-card h3 { flex: 1; min-width: min(180px, 100%); margin: 0; }
.gallery-list-card p { flex-basis: 100%; margin: 0; }
.gallery-list-card .gallery-toolbar { margin: 0; }
.gallery-request-side { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; margin-left: auto; }
.gallery-card .gallery-request-side .gallery-toolbar { margin: 0; flex-wrap: nowrap; }
.gallery-request-delete { min-width: 44px; padding-inline: 0; }
#studio-ready-grid { margin-top: 16px; }
.gallery-card .gallery-thumb { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; border-radius: 12px; background: var(--mk-paper); }
.gallery-card .gallery-open { width: 100%; padding: 0; border: 0; }
.gallery-card h3 { margin: 12px 0 6px; font-size: 1.125rem; overflow-wrap: anywhere; }
.gallery-card p { font-size: .875rem; color: var(--mk-muted); overflow-wrap: anywhere; }
.gallery-card .gallery-toolbar { margin: 10px 0 0; gap: 6px; }
.gallery-card select { width: 100%; }
.gallery-status-tag { font-size: .75rem; border-radius: 20px; padding: 5px 9px; background: #e9f5eb; color: #326348; display: inline-block; }
.gallery-status-tag.waiting { background: #fff1d8; color: #795324; }
.gallery-studio-box { background: white; border: 1px solid var(--mk-line); border-radius: var(--mk-radius); padding: 18px; margin: 18px 0; }
.gallery-studio-box summary { font-size: 1.125rem; font-weight: 600; cursor: pointer; }
.gallery-studio-box label { margin: 12px 0; }
.gallery-request-list { display: grid; gap: 8px; }
.gallery-request-list label { background: white; padding: 12px; border-radius: 10px; }
.gallery-table-wrap { overflow: auto; }
.gallery-page table { border-collapse: collapse; width: 100%; text-align: left; }
.gallery-page th, .gallery-page td { padding: 10px; border-bottom: 1px solid var(--mk-line); }
.gallery-page caption { text-align: left; font-size: .8125rem; padding: 12px 0; color: var(--mk-muted); }
.gallery-upload { min-width: 0; max-width: 100%; flex-direction: column; align-items: flex-start !important; font-weight: 600; font-size: .875rem; }
.gallery-page input[type=file] { padding: 0; border: 0; border-radius: 0; width: min(290px, 100%); background: transparent; }
.gallery-page input[type=file]::file-selector-button { min-height: 44px; margin-right: 8px; padding: 9px 14px; border: 1px solid var(--mk-line); border-radius: 9px; background: white; color: var(--mk-ink); font-family: inherit; font-size: .875rem; font-weight: 600; line-height: 1.35; cursor: pointer; }
.gallery-page input[type=file]::file-selector-button:hover { background: #edf3ff; border-color: #a7bde8; }
@media (pointer: coarse) { .gallery-page input[type=file]::file-selector-button { font-size: 16px; } }
.gallery-page pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.gallery-page dialog { color: var(--mk-ink); background: white; border: 1px solid var(--mk-line); border-radius: var(--mk-radius); max-width: min(700px, calc(100vw - 16px)); max-height: calc(100svh - 16px); padding: 22px; box-shadow: var(--mk-shadow); }
.gallery-page dialog::backdrop { background: #182c4966; }
.gallery-page dialog label { margin: 14px 0; }
.gallery-page dialog input:not([type=checkbox]), .gallery-page dialog select { flex: 1; min-width: 0; }
.gallery-page #send-dialog { width: min(480px, calc(100vw - 16px)); }
#send-form label { flex-direction: column; align-items: stretch; }
#send-form input, #send-form select { width: 100%; }
.gallery-page #request-dialog { position: fixed; inset: auto; margin: 0; width: min(440px, calc(100vw - 16px)); padding: 0; z-index: 100; overflow: auto; box-shadow: 0 8px 28px #233d6540; }
#request-drag-handle { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 16px; background: var(--mk-paper); border-bottom: 1px solid var(--mk-line); cursor: move; touch-action: none; user-select: none; font-size: .875rem; font-weight: 600; }
#request-form { padding: 0 20px 8px; }
#request-form h2 { font-size: 1.25rem; }
.gallery-page #art-view img, .gallery-page #art-view video { max-width: 100%; max-height: 65svh; }
#gallery-status[data-error=true], #studio-code-error:not(:empty), #send-error:not(:empty) { background: #fff0ec; color: #8c3028; padding: 12px; border-radius: 10px; }
.gallery-capacity { background: #fff7e0; color: #6b4b12; padding: 12px; border-radius: 10px; }
.gallery-capacity a { color: inherit; font-weight: 600; }
