/* Shared form surfaces, labels, controls and error feedback, including dialogs. */
:root{--control-border:#d9d8e1;--control-focus:#7955ad;--error-ink:#9a2436;--error-paper:#fff3f4;--control-radius:12px}
html{scrollbar-gutter:stable}body:has(#modal[open]){overflow:hidden}#modal{overscroll-behavior:contain;overflow-wrap:anywhere}
form{min-width:0}
.form-panel{width:100%;min-width:0;border-color:#e4dfe8;border-radius:20px;background:#fffdfd;box-shadow:0 8px 28px #24375406}
#main .field,#modal .field{display:block;font-size:14px;font-weight:500;line-height:1.6;margin-bottom:22px;min-width:0}
#main .field input:not([type=checkbox]):not([type=radio]),#main .field textarea,#main .field select,#modal .field input,#modal .field textarea,#modal .field select{width:100%;min-width:0;min-height:44px;margin-top:8px;padding:9px 12px;border:1px solid var(--control-border);border-radius:var(--control-radius);background:#fff;color:#152e46;font:inherit;font-size:16px;line-height:1.5;box-shadow:none}
#main .field textarea,#modal .field textarea{min-height:120px;line-height:1.75}
#main .field input[type=file],#modal .field input[type=file]{padding:8px;white-space:normal}
input::file-selector-button{margin-right:12px;padding:5px 12px;border:0;border-radius:8px;background:#eee8f5;color:#3c2958;font:inherit;cursor:pointer}
#main .field input:focus-visible,#main .field textarea:focus-visible,#modal input:focus-visible,#modal textarea:focus-visible{border-color:var(--control-focus);outline:3px solid #7955ad26;outline-offset:1px}
#main .searchable-filter.field,#modal .searchable-filter.field{height:auto;min-height:0;padding:0;border:0;background:transparent;box-shadow:none;margin-bottom:22px;border-radius:0}
#main .searchable-filter.field>span,#modal .searchable-filter.field>span{display:block;font-size:14px;font-weight:500;line-height:22px;margin-bottom:8px}
#main .searchable-filter.field .filter-trigger,#modal .searchable-filter.field .filter-trigger{min-height:44px;padding:9px 12px;border:1px solid var(--control-border);border-radius:var(--control-radius);background:#fff;font-size:16px;line-height:24px}
#main .searchable-filter.field .filter-trigger:focus-visible,#modal .searchable-filter.field .filter-trigger:focus-visible{border-color:var(--control-focus);outline:3px solid #7955ad26;outline-offset:1px}
.searchable-filter.field .filter-panel{top:calc(100% + 6px);width:max(100%,240px);max-width:min(440px,calc(100vw - 40px))}
.searchable-filter.field.opens-up .filter-panel{top:auto;bottom:calc(100% + 6px)}
.filter-panel{max-height:calc(100dvh - 24px);overflow-y:auto}.filter-options{max-height:min(224px,35dvh)}
#main:has(.searchable-filter.is-open){z-index:3}
#main [data-work-ai][hidden],#main [data-work-price][hidden]{display:none!important}
.action-confirmation{border-radius:20px;background:#fffdfd;color:#152e46;padding:28px;max-width:520px}
body:has(.action-confirmation[open]){overflow:hidden}
.action-confirmation h2{font-size:1.75rem;line-height:1.3;margin:0 0 16px}.action-confirmation p{line-height:1.75;margin-bottom:24px}.action-confirmation .actions{justify-content:flex-end;flex-wrap:wrap;gap:12px}
#modal .filter-panel{position:relative;top:auto;left:auto;right:auto;width:100%;max-width:100%;margin-top:8px;box-shadow:none}
#modal .filter-option-search input{margin:0;border:0;font-size:16px}
#modal .filter-option{font-size:16px;min-height:44px}
.form-error:not(:empty){padding:16px 18px;border:1px solid #e7b8c2;border-left:4px solid #b33249;border-radius:12px;background:var(--error-paper);color:var(--error-ink);font-size:14px;line-height:1.6;margin-bottom:24px;overflow-wrap:anywhere}
.form-error:empty{display:none}
.form-error>strong{display:block;font-weight:600}
.form-error ul{margin:8px 0 0;padding:0;list-style:none}
.form-error:focus{outline:3px solid #b3324926;outline-offset:3px}
.error-field-link{display:block;width:100%;padding:3px 0;border:0;background:transparent;color:var(--error-ink);text-align:left;text-decoration:underline;text-underline-offset:3px;font:inherit;font-weight:400;text-transform:none;cursor:pointer}
#main .field-error,#modal .field-error{display:block;font-size:14px;line-height:1.5;color:var(--error-ink);font-weight:400;margin:7px 0 0;overflow-wrap:anywhere}
#main .field [aria-invalid=true],#main .filter-trigger[aria-invalid=true],#modal .field [aria-invalid=true],#modal .filter-trigger[aria-invalid=true]{border-color:#b33249!important;background:#fffafb!important}
.check.has-field-error{flex-wrap:wrap}.check.has-field-error>.field-error{flex-basis:100%;margin-left:28px!important}
.two-cols>*{min-width:0}.form-panel .actions{flex-wrap:wrap;align-items:center}
#main .studio-page-title{font-size:2rem;line-height:1.25;margin-bottom:18px}
.list-item>*{min-width:0}.list-item h3,.list-item p,.message p,.username-hint,.receipt{overflow-wrap:anywhere}
.collection-order li{min-width:0}.collection-order li>span{min-width:0;overflow-wrap:anywhere}
.collection-order .collection-work-choice{display:flex;align-items:center;gap:12px;flex:1;min-width:0;margin:0;cursor:pointer}
.collection-work-choice>span{min-width:0;overflow-wrap:anywhere}.collection-work-choice small{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.collection-order input[type=checkbox]{flex:0 0 auto;width:18px;height:18px;margin:0}
.collection-order .icon-button{flex:0 0 44px;width:44px;height:44px}.collection-move-up .ui-icon{transform:rotate(-90deg)}.collection-move-down .ui-icon{transform:rotate(90deg)}
.mini-asset{min-width:0}.mini-asset>div{min-width:0;overflow-wrap:anywhere}
#modal pre{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%}
#modal>div>h2{padding-right:28px}#modal .form-panel{padding:20px;box-shadow:none}
.field-help{display:block;color:#596478;font-size:14px;font-weight:400;line-height:1.6;margin-top:6px}
.request-status{padding:18px;border:1px solid #d9d0e5;border-radius:12px;background:#f7f3fa;color:#26394b}
.recover{padding:16px;border:1px solid #ddd3e8;border-radius:12px;background:#f7f3fa;margin-bottom:22px}.recover p{margin-bottom:8px!important}.recover button{margin:4px 8px 4px 0}
@media(max-width:700px){.form-panel{padding:20px!important;border-radius:16px}.two-cols{grid-template-columns:minmax(0,1fr);gap:0}.list-item{align-items:flex-start;flex-wrap:wrap;padding:18px}.list-item>.actions{width:100%;justify-content:flex-start}.collection-order li{gap:8px}.form-error:not(:empty){padding:14px}.form-error .error-field-link{min-height:32px}#modal{padding:28px 18px 22px;max-height:calc(100dvh - 24px);width:calc(100% - 24px)}#modal .form-panel{padding:16px!important}#main .studio-page-title{font-size:1.75rem}.form-panel .button{max-width:100%;white-space:normal;text-align:center}}
@media(prefers-reduced-motion:reduce){input,textarea,.filter-trigger{transition:none!important}}
@media(max-width:700px){.mini-asset{display:grid;grid-template-columns:60px minmax(0,1fr);gap:10px 12px}.mini-asset>img{width:60px;height:60px;object-fit:cover}.mini-asset>div{grid-column:2}.mini-asset>button{grid-column:2;justify-self:start;max-width:100%;white-space:normal}.mini-asset:not(:has(img)){grid-template-columns:minmax(0,1fr)}.mini-asset:not(:has(img))>div,.mini-asset:not(:has(img))>button{grid-column:1}}
/* Shared signed-in shell and first-save profile photo controls. */
.studio-content{min-width:0}.studio-content>.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
#main .studio-content h1,#main .studio-content h2,#main .studio-content h3{font-weight:400}
.profile-photo-editor{margin:0 0 28px;padding:0 0 24px;border:0;border-bottom:1px solid var(--line)}
.profile-photo-editor legend{font-weight:600;margin-bottom:16px}.profile-photo-row{display:grid;grid-template-columns:112px minmax(0,1fr);gap:24px;align-items:start}
.profile-photo-preview{width:112px;height:112px;object-fit:cover;border-radius:50%;background:#f3eff7;border:3px solid #fff;box-shadow:0 3px 16px #22375612}
.profile-photo-row .field{margin-bottom:8px}.profile-photo-row input[type=file]{width:100%;max-width:100%}
.profile-photo-choices{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}.profile-photo-choice{padding:3px;border:2px solid transparent;border-radius:50%;background:white;min-width:60px;min-height:60px}.profile-photo-choice[aria-pressed=true]{border-color:var(--plum)}.profile-photo-choice img{width:52px;height:52px;object-fit:cover;border-radius:50%}
@media(max-width:700px){.studio-content>.grid{grid-template-columns:1fr}.profile-photo-row{grid-template-columns:1fr;gap:16px}.profile-photo-preview{width:96px;height:96px}}
